From ca894fbcf53a9596bdf72c28ffe5c3e29d62e6b2 Mon Sep 17 00:00:00 2001 From: Andrey Novoseltsev Date: Mon, 24 Nov 2025 18:57:54 -0700 Subject: [PATCH 1/5] frontend: clarify the meaning of graying out some files --- src/packages/frontend/account/other-settings.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/packages/frontend/account/other-settings.tsx b/src/packages/frontend/account/other-settings.tsx index 49f5d27681..ac94f4cc1d 100644 --- a/src/packages/frontend/account/other-settings.tsx +++ b/src/packages/frontend/account/other-settings.tsx @@ -129,8 +129,7 @@ export function OtherSettings(props: Readonly): React.JSX.Element { > Mask Files: grey out files in the files viewer - that you probably do not want to open`} + defaultMessage={`Dim generated files: gray out files produced by compilers (.aux, .log, .pyc, etc.) so the main files stand out.`} /> ); From 635e9d9ee78117c9a10435b2c794f69b09c8ca42 Mon Sep 17 00:00:00 2001 From: Andrey Novoseltsev Date: Mon, 24 Nov 2025 19:09:59 -0700 Subject: [PATCH 2/5] file explorer: remove show/hide masked files button --- src/packages/frontend/i18n/common.ts | 6 ---- src/packages/frontend/i18n/trans/ar_EG.json | 1 - src/packages/frontend/i18n/trans/de_DE.json | 1 - src/packages/frontend/i18n/trans/es_ES.json | 1 - src/packages/frontend/i18n/trans/es_PV.json | 1 - src/packages/frontend/i18n/trans/fr_FR.json | 1 - src/packages/frontend/i18n/trans/he_IL.json | 1 - src/packages/frontend/i18n/trans/hi_IN.json | 1 - src/packages/frontend/i18n/trans/hu_HU.json | 1 - src/packages/frontend/i18n/trans/it_IT.json | 1 - src/packages/frontend/i18n/trans/ja_JP.json | 1 - src/packages/frontend/i18n/trans/ko_KR.json | 1 - src/packages/frontend/i18n/trans/nl_NL.json | 1 - src/packages/frontend/i18n/trans/pl_PL.json | 1 - src/packages/frontend/i18n/trans/pt_BR.json | 1 - src/packages/frontend/i18n/trans/pt_PT.json | 1 - src/packages/frontend/i18n/trans/ru_RU.json | 1 - src/packages/frontend/i18n/trans/tr_TR.json | 1 - src/packages/frontend/i18n/trans/zh_CN.json | 1 - .../frontend/project/explorer/explorer.tsx | 7 ----- .../project/explorer/misc-side-buttons.tsx | 29 ------------------- .../project/page/flyouts/files-header.tsx | 12 -------- .../frontend/project/page/flyouts/files.tsx | 5 ---- src/packages/frontend/project_store.ts | 17 ----------- 24 files changed, 94 deletions(-) diff --git a/src/packages/frontend/i18n/common.ts b/src/packages/frontend/i18n/common.ts index 4dc578ad59..654ebdd2d5 100644 --- a/src/packages/frontend/i18n/common.ts +++ b/src/packages/frontend/i18n/common.ts @@ -576,12 +576,6 @@ export const labels = defineMessages({ "{hidden, select, true {Hide hidden files} other {Show hidden files}}. Hidden files in Linux start with a '.' in their filename. They are usually not meant to be edited.", description: "show/hide hidden files in a file-explorer in a UI", }, - masked_files: { - id: "labels.masked_files", - defaultMessage: - "{masked, select, true {Hide masked files} other {Show masked files}}. Masked files are autogenerated or temporary files, which are not meant to be edited. They are grayed out.", - description: "show/hide masked files in a file-explorer in a UI.", - }, folder: { id: "labels.folder", defaultMessage: "folder", diff --git a/src/packages/frontend/i18n/trans/ar_EG.json b/src/packages/frontend/i18n/trans/ar_EG.json index 93e14cf9dc..969c3308ec 100644 --- a/src/packages/frontend/i18n/trans/ar_EG.json +++ b/src/packages/frontend/i18n/trans/ar_EG.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "لينكس تيرمنال", "labels.loading": "جار التحميل...", "labels.log": "تسجيل", - "labels.masked_files": "{masked, select, true {إخفاء الملفات المقنعة} other {إظهار الملفات المقنعة}}. الملفات المقنعة هي ملفات تم إنشاؤها تلقائيًا أو ملفات مؤقتة، والتي لا يُقصد تعديلها. يتم تظليلها باللون الرمادي.", "labels.message.plural": "{num, plural, one {رسالة} other {رسائل}}", "labels.messages": "رسائل", "labels.messages.all_messages": "جميع الرسائل", diff --git a/src/packages/frontend/i18n/trans/de_DE.json b/src/packages/frontend/i18n/trans/de_DE.json index 77f98b40ad..0933088f29 100644 --- a/src/packages/frontend/i18n/trans/de_DE.json +++ b/src/packages/frontend/i18n/trans/de_DE.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linux-Terminal", "labels.loading": "Laden...", "labels.log": "Protokoll", - "labels.masked_files": "{masked, select, true {Maskierte Dateien ausblenden} other {Maskierte Dateien anzeigen}}. Maskierte Dateien sind automatisch generierte oder temporäre Dateien, die nicht bearbeitet werden sollen. Sie sind ausgegraut.", "labels.message.plural": "{num, plural, one {Nachricht} other {Nachrichten}}", "labels.messages": "Nachrichten", "labels.messages.all_messages": "Alle Nachrichten", diff --git a/src/packages/frontend/i18n/trans/es_ES.json b/src/packages/frontend/i18n/trans/es_ES.json index c72f16c3b1..ff03e994cd 100644 --- a/src/packages/frontend/i18n/trans/es_ES.json +++ b/src/packages/frontend/i18n/trans/es_ES.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Terminal de Linux", "labels.loading": "Cargando...", "labels.log": "Registro", - "labels.masked_files": "{masked, select, true {Ocultar archivos enmascarados} other {Mostrar archivos enmascarados}}. Los archivos enmascarados son archivos autogenerados o temporales, que no están destinados a ser editados. Están atenuados.", "labels.message.plural": "{num, plural, one {mensaje} other {mensajes}}", "labels.messages": "Mensajes", "labels.messages.all_messages": "Todos los mensajes", diff --git a/src/packages/frontend/i18n/trans/es_PV.json b/src/packages/frontend/i18n/trans/es_PV.json index 0dc05b5b31..dc59eb628b 100644 --- a/src/packages/frontend/i18n/trans/es_PV.json +++ b/src/packages/frontend/i18n/trans/es_PV.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linux Terminala", "labels.loading": "Kargatzen...", "labels.log": "Egunkari", - "labels.masked_files": "{masked, select, true {Ezkutatu maskaratutako fitxategiak} other {Erakutsi maskaratutako fitxategiak}}. Maskaratutako fitxategiak automatikoki sortutako edo behin-behineko fitxategiak dira, eta ez dira editatzeko pentsatuta. Grisez agertzen dira.", "labels.message.plural": "{num, plural, one {Mezua} other {Mezuak}}", "labels.messages": "Mezuak", "labels.messages.all_messages": "Mezu guztiak", diff --git a/src/packages/frontend/i18n/trans/fr_FR.json b/src/packages/frontend/i18n/trans/fr_FR.json index 526a0466ea..29624a48bb 100644 --- a/src/packages/frontend/i18n/trans/fr_FR.json +++ b/src/packages/frontend/i18n/trans/fr_FR.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Terminal Linux", "labels.loading": "Chargement...", "labels.log": "Journal", - "labels.masked_files": "{masked, select, true {Masquer les fichiers masqués} other {Afficher les fichiers masqués}}. Les fichiers masqués sont des fichiers générés automatiquement ou temporaires, qui ne sont pas destinés à être modifiés. Ils sont grisés.", "labels.message.plural": "{num, plural, one {message} other {messages}}", "labels.messages": "Messages", "labels.messages.all_messages": "Tous les messages", diff --git a/src/packages/frontend/i18n/trans/he_IL.json b/src/packages/frontend/i18n/trans/he_IL.json index 45ad253086..fe22315927 100644 --- a/src/packages/frontend/i18n/trans/he_IL.json +++ b/src/packages/frontend/i18n/trans/he_IL.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "לינוקס טרמינל", "labels.loading": "טוען...", "labels.log": "יומן", - "labels.masked_files": "{masked, select, true {הסתר קבצים מוסתרים} other {הצג קבצים מוסתרים}}. קבצים מוסתרים הם קבצים שנוצרים אוטומטית או קבצים זמניים, אשר לא מיועדים לעריכה. הם מוצגים באפור.", "labels.message.plural": "{num, plural, one {הודעה} other {הודעות}}", "labels.messages": "הודעות", "labels.messages.all_messages": "כל ההודעות", diff --git a/src/packages/frontend/i18n/trans/hi_IN.json b/src/packages/frontend/i18n/trans/hi_IN.json index f1b3f03864..545a80e5d4 100644 --- a/src/packages/frontend/i18n/trans/hi_IN.json +++ b/src/packages/frontend/i18n/trans/hi_IN.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "लिनक्स टर्मिनल", "labels.loading": "लोड हो रहा है...", "labels.log": "लॉग", - "labels.masked_files": "{masked, select, true {छिपाएं मास्क किए गए फाइलें} other {दिखाएं मास्क किए गए फाइलें}}। मास्क किए गए फाइलें स्वचालित रूप से उत्पन्न या अस्थायी फाइलें होती हैं, जिन्हें संपादित करने के लिए नहीं बनाया गया है। वे धूसर रंग में होती हैं।", "labels.message.plural": "{num, plural, one {संदेश} other {संदेश}}", "labels.messages": "संदेश", "labels.messages.all_messages": "सभी संदेश", diff --git a/src/packages/frontend/i18n/trans/hu_HU.json b/src/packages/frontend/i18n/trans/hu_HU.json index 6858cfb002..196feacdd4 100644 --- a/src/packages/frontend/i18n/trans/hu_HU.json +++ b/src/packages/frontend/i18n/trans/hu_HU.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linux terminál", "labels.loading": "Betöltés...", "labels.log": "Napló", - "labels.masked_files": "{masked, select, true {Maszkos fájlok elrejtése} other {Maszkos fájlok megjelenítése}}. A maszkos fájlok automatikusan generált vagy ideiglenes fájlok, amelyeket nem szándékoznak szerkeszteni. Ezek szürkével vannak kiemelve.", "labels.message.plural": "{num, plural, one {üzenet} other {üzenetek}}", "labels.messages": "Üzenetek", "labels.messages.all_messages": "Összes üzenet", diff --git a/src/packages/frontend/i18n/trans/it_IT.json b/src/packages/frontend/i18n/trans/it_IT.json index bc2c94d46f..0d20a28b24 100644 --- a/src/packages/frontend/i18n/trans/it_IT.json +++ b/src/packages/frontend/i18n/trans/it_IT.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Terminale Linux", "labels.loading": "Caricamento...", "labels.log": "Log", - "labels.masked_files": "{masked, select, true {Nascondi file mascherati} other {Mostra file mascherati}}. I file mascherati sono file autogenerati o temporanei, che non devono essere modificati. Sono visualizzati in grigio.", "labels.message.plural": "{num, plural, one {messaggio} other {messaggi}}", "labels.messages": "Messaggi", "labels.messages.all_messages": "Tutti i messaggi", diff --git a/src/packages/frontend/i18n/trans/ja_JP.json b/src/packages/frontend/i18n/trans/ja_JP.json index 02a11bb973..97112dca3e 100644 --- a/src/packages/frontend/i18n/trans/ja_JP.json +++ b/src/packages/frontend/i18n/trans/ja_JP.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linuxターミナル", "labels.loading": "読み込み中...", "labels.log": "ログ", - "labels.masked_files": "{masked, select, true {マスクされたファイルを隠す} other {マスクされたファイルを表示}}。マスクされたファイルは自動生成された一時ファイルであり、編集することを意図していません。これらはグレーアウトされています。", "labels.message.plural": "{num, plural, one {メッセージ} other {メッセージ}}", "labels.messages": "メッセージ", "labels.messages.all_messages": "すべてのメッセージ", diff --git a/src/packages/frontend/i18n/trans/ko_KR.json b/src/packages/frontend/i18n/trans/ko_KR.json index bef0d366cb..1234fd4c23 100644 --- a/src/packages/frontend/i18n/trans/ko_KR.json +++ b/src/packages/frontend/i18n/trans/ko_KR.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "리눅스 터미널", "labels.loading": "불러오는 중...", "labels.log": "로그", - "labels.masked_files": "{masked, select, true {마스크된 파일 숨기기} other {마스크된 파일 표시}}. 마스크된 파일은 자동 생성되거나 임시 파일로, 편집을 위한 것이 아닙니다. 이들은 회색으로 표시됩니다.", "labels.message.plural": "{num, plural, one {메시지} other {메시지들}}", "labels.messages": "메시지", "labels.messages.all_messages": "모든 메시지", diff --git a/src/packages/frontend/i18n/trans/nl_NL.json b/src/packages/frontend/i18n/trans/nl_NL.json index 3ce06ce36d..8ddfd4b7b5 100644 --- a/src/packages/frontend/i18n/trans/nl_NL.json +++ b/src/packages/frontend/i18n/trans/nl_NL.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linux Terminal", "labels.loading": "Laden...", "labels.log": "Logboek", - "labels.masked_files": "{masked, select, true {Verborgen bestanden verbergen} other {Verborgen bestanden tonen}}. Verborgen bestanden zijn automatisch gegenereerde of tijdelijke bestanden, die niet bedoeld zijn om te worden bewerkt. Ze worden grijs weergegeven.", "labels.message.plural": "{num, plural, one {bericht} other {berichten}}", "labels.messages": "Berichten", "labels.messages.all_messages": "Alle berichten", diff --git a/src/packages/frontend/i18n/trans/pl_PL.json b/src/packages/frontend/i18n/trans/pl_PL.json index b8a5ea7f99..3ce0be42a5 100644 --- a/src/packages/frontend/i18n/trans/pl_PL.json +++ b/src/packages/frontend/i18n/trans/pl_PL.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Terminal Linux", "labels.loading": "Ładowanie...", "labels.log": "Dziennik", - "labels.masked_files": "{masked, select, true {Ukryj zamaskowane pliki} other {Pokaż zamaskowane pliki}}. Zamaskowane pliki to pliki generowane automatycznie lub tymczasowe, które nie są przeznaczone do edycji. Są wyszarzone.", "labels.message.plural": "{num, plural, one {wiadomość} other {wiadomości}}", "labels.messages": "Wiadomości", "labels.messages.all_messages": "Wszystkie wiadomości", diff --git a/src/packages/frontend/i18n/trans/pt_BR.json b/src/packages/frontend/i18n/trans/pt_BR.json index 40a9580cb5..ae7b547ba0 100644 --- a/src/packages/frontend/i18n/trans/pt_BR.json +++ b/src/packages/frontend/i18n/trans/pt_BR.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Terminal Linux", "labels.loading": "Carregando...", "labels.log": "Registro", - "labels.masked_files": "{masked, select, true {Ocultar arquivos mascarados} other {Mostrar arquivos mascarados}}. Arquivos mascarados são arquivos gerados automaticamente ou temporários, que não devem ser editados. Eles estão esmaecidos.", "labels.message.plural": "{num, plural, one {Mensagem} other {Mensagens}}", "labels.messages": "Mensagens", "labels.messages.all_messages": "Todas as mensagens", diff --git a/src/packages/frontend/i18n/trans/pt_PT.json b/src/packages/frontend/i18n/trans/pt_PT.json index 163f014640..e5c65f6b92 100644 --- a/src/packages/frontend/i18n/trans/pt_PT.json +++ b/src/packages/frontend/i18n/trans/pt_PT.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Terminal Linux", "labels.loading": "A carregar...", "labels.log": "Registo", - "labels.masked_files": "{masked, select, true {Esconder ficheiros mascarados} other {Mostrar ficheiros mascarados}}. Os ficheiros mascarados são ficheiros autogerados ou temporários, que não devem ser editados. Estão esbatidos.", "labels.message.plural": "{num, plural, one {mensagem} other {mensagens}}", "labels.messages": "Mensagens", "labels.messages.all_messages": "Todas as Mensagens", diff --git a/src/packages/frontend/i18n/trans/ru_RU.json b/src/packages/frontend/i18n/trans/ru_RU.json index 74e189710d..74e072a11c 100644 --- a/src/packages/frontend/i18n/trans/ru_RU.json +++ b/src/packages/frontend/i18n/trans/ru_RU.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Терминал Linux", "labels.loading": "Загрузка...", "labels.log": "Журнал", - "labels.masked_files": "{masked, select, true {Скрыть замаскированные файлы} other {Показать замаскированные файлы}}. Замаскированные файлы — это автогенерируемые или временные файлы, которые не предназначены для редактирования. Они отображаются серым цветом.", "labels.message.plural": "{num, plural, one {сообщение} other {сообщения}}", "labels.messages": "Сообщения", "labels.messages.all_messages": "Все сообщения", diff --git a/src/packages/frontend/i18n/trans/tr_TR.json b/src/packages/frontend/i18n/trans/tr_TR.json index 54cc988d1e..60add4cbb4 100644 --- a/src/packages/frontend/i18n/trans/tr_TR.json +++ b/src/packages/frontend/i18n/trans/tr_TR.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linux Terminali", "labels.loading": "Yükleniyor...", "labels.log": "Günlük", - "labels.masked_files": "{masked, select, true {Maskelenmiş dosyaları gizle} other {Maskelenmiş dosyaları göster}}. Maskelenmiş dosyalar, düzenlenmemesi gereken, otomatik oluşturulmuş veya geçici dosyalardır. Bunlar gri renkte gösterilir.", "labels.message.plural": "{num, plural, one {mesaj} other {mesajlar}}", "labels.messages": "Mesajlar", "labels.messages.all_messages": "Tüm Mesajlar", diff --git a/src/packages/frontend/i18n/trans/zh_CN.json b/src/packages/frontend/i18n/trans/zh_CN.json index d61e05b30b..66264c8a02 100644 --- a/src/packages/frontend/i18n/trans/zh_CN.json +++ b/src/packages/frontend/i18n/trans/zh_CN.json @@ -1046,7 +1046,6 @@ "labels.linux_terminal": "Linux 终端", "labels.loading": "加载中...", "labels.log": "日志", - "labels.masked_files": "{masked, select, true {隐藏遮罩文件} other {显示遮罩文件}}。遮罩文件是自动生成或临时文件，不适合编辑。它们显示为灰色。", "labels.message.plural": "{num, plural, one {消息} other {消息}}", "labels.messages": "消息", "labels.messages.all_messages": "所有消息", diff --git a/src/packages/frontend/project/explorer/explorer.tsx b/src/packages/frontend/project/explorer/explorer.tsx index 3782622c9c..0f8ed6d1d9 100644 --- a/src/packages/frontend/project/explorer/explorer.tsx +++ b/src/packages/frontend/project/explorer/explorer.tsx @@ -103,7 +103,6 @@ interface ReduxProps { | "upload"; file_search: string; show_hidden?: boolean; - show_masked?: boolean; error?: string; checked_files: immutable.Set; selected_file_index?: number; @@ -182,7 +181,6 @@ const Explorer0 = rclass( file_action: rtypes.string, file_search: rtypes.string, show_hidden: rtypes.bool, - show_masked: rtypes.bool, error: rtypes.string, checked_files: rtypes.immutable, selected_file_index: rtypes.number, @@ -650,11 +648,6 @@ const Explorer0 = rclass( ? this.props.show_hidden : false } - show_masked={ - this.props.show_masked != undefined - ? this.props.show_masked - : true - } actions={this.props.actions} kucalc={this.props.kucalc} available_features={this.props.available_features} diff --git a/src/packages/frontend/project/explorer/misc-side-buttons.tsx b/src/packages/frontend/project/explorer/misc-side-buttons.tsx index 4311756239..79f2eb8128 100644 --- a/src/packages/frontend/project/explorer/misc-side-buttons.tsx +++ b/src/packages/frontend/project/explorer/misc-side-buttons.tsx @@ -32,7 +32,6 @@ interface Props { kucalc?: string; project_id: string; show_hidden?: boolean; - show_masked?: boolean; } export const MiscSideButtons: React.FC = (props) => { @@ -43,7 +42,6 @@ export const MiscSideButtons: React.FC = (props) => { kucalc, project_id, show_hidden, - show_masked, } = props; const intl = useIntl(); @@ -58,13 +56,6 @@ export const MiscSideButtons: React.FC = (props) => { }); }; - const handle_masked_toggle = (e: React.MouseEvent): void => { - e.preventDefault(); - actions.setState({ - show_masked: !show_masked, - }); - }; - const handle_backup = (e: React.MouseEvent): void => { e.preventDefault(); actions.open_directory(".snapshots"); @@ -87,25 +78,6 @@ export const MiscSideButtons: React.FC = (props) => { ); } - function render_masked_toggle(): React.JSX.Element { - return ( - - ); - } - function render_backup(): React.JSX.Element | undefined { // NOTE -- snapshots aren't available except in "kucalc" version // -- they are complicated nontrivial thing that isn't usually setup... @@ -218,7 +190,6 @@ export const MiscSideButtons: React.FC = (props) => {
{render_hidden_toggle()} - {render_masked_toggle()} {render_backup()} diff --git a/src/packages/frontend/project/page/flyouts/files-header.tsx b/src/packages/frontend/project/page/flyouts/files-header.tsx index 8f62f9c621..0784830113 100644 --- a/src/packages/frontend/project/page/flyouts/files-header.tsx +++ b/src/packages/frontend/project/page/flyouts/files-header.tsx @@ -112,7 +112,6 @@ export function FilesHeader(props: Readonly): React.JSX.Element { const kucalc = useTypedRedux("customize", "kucalc"); const file_search = useTypedRedux({ project_id }, "file_search") ?? ""; const hidden = useTypedRedux({ project_id }, "show_hidden"); - const show_masked = useTypedRedux({ project_id }, "show_masked"); const file_creation_error = useTypedRedux( { project_id }, "file_creation_error", @@ -459,17 +458,6 @@ export function FilesHeader(props: Readonly): React.JSX.Element { > - actions?.setState({ show_masked: !show_masked })} - > - - {kucalc === KUCALC_COCALC_COM ? ( diff --git a/src/packages/frontend/project/page/flyouts/files.tsx b/src/packages/frontend/project/page/flyouts/files.tsx index 77320bf5ec..ee9902bd1c 100644 --- a/src/packages/frontend/project/page/flyouts/files.tsx +++ b/src/packages/frontend/project/page/flyouts/files.tsx @@ -123,7 +123,6 @@ export function FilesFlyout({ "active_file_sort", ); const file_search = useTypedRedux({ project_id }, "file_search") ?? ""; - const show_masked = useTypedRedux({ project_id }, "show_masked"); const hidden = useTypedRedux({ project_id }, "show_hidden"); const checked_files = useTypedRedux({ project_id }, "checked_files"); const openFiles = useTypedRedux({ project_id }, "open_files_order"); @@ -205,9 +204,6 @@ export function FilesFlyout({ ((file.isdir ?? false) && search_match(`${fName}/`, searchWords)) ); }) - .filter( - (file: DirectoryListingEntry) => show_masked || !(file.mask === true), - ) .filter( (file: DirectoryListingEntry) => hidden || !file.name.startsWith("."), ); @@ -297,7 +293,6 @@ export function FilesFlyout({ hidden, file_search, openFiles, - show_masked, current_path, strippedPublicPaths, ]); diff --git a/src/packages/frontend/project_store.ts b/src/packages/frontend/project_store.ts index 20b1890eca..1d536f8598 100644 --- a/src/packages/frontend/project_store.ts +++ b/src/packages/frontend/project_store.ts @@ -103,7 +103,6 @@ export interface ProjectStoreState { file_action?: string; // undefined is meaningfully none here file_search?: string; show_hidden?: boolean; - show_masked?: boolean; error?: string; checked_files: immutable.Set; selected_file_index?: number; // Index on file listing to highlight starting at 0. undefined means none highlighted @@ -301,7 +300,6 @@ export class ProjectStore extends Store { show_upload: false, create_file_alert: false, displayed_listing: undefined, // computed(object), - show_masked: true, configuration: undefined, configuration_loading: false, // for UI feedback show_custom_software_reset: false, @@ -383,7 +381,6 @@ export class ProjectStore extends Store { "file_search", "other_settings", "show_hidden", - "show_masked", "compute_server_id", "starred_files", ] as const, @@ -515,20 +512,6 @@ export class ProjectStore extends Store { })(); } - if (!this.get("show_masked", true)) { - // if we do not gray out files (and hence haven't computed the file mask yet) - // we do it now! - if (!this.get("other_settings").get("mask_files")) { - compute_file_masks(listing); - } - - const filtered: DirectoryListing = []; - for (const f of listing) { - if (!f.mask) filtered.push(f); - } - listing = filtered; - } - const file_map = {}; for (const v of listing) { file_map[v.name] = v; From 8f826f023408324ae16dd1042add7e7d90397cc7 Mon Sep 17 00:00:00 2001 From: Andrey Novoseltsev Date: Mon, 24 Nov 2025 19:58:53 -0700 Subject: [PATCH 3/5] flyout/files: take into account the setting to gray out some files --- src/packages/frontend/project/page/flyouts/files.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/packages/frontend/project/page/flyouts/files.tsx b/src/packages/frontend/project/page/flyouts/files.tsx index ee9902bd1c..ff35b697f7 100644 --- a/src/packages/frontend/project/page/flyouts/files.tsx +++ b/src/packages/frontend/project/page/flyouts/files.tsx @@ -29,13 +29,13 @@ import { file_options } from "@cocalc/frontend/editor-tmp"; import { FileUploadWrapper } from "@cocalc/frontend/file-upload"; import { should_open_in_foreground } from "@cocalc/frontend/lib/should-open-in-foreground"; import { useProjectContext } from "@cocalc/frontend/project/context"; -import { compute_file_masks } from "@cocalc/frontend/project/explorer/compute-file-masks"; import { DirectoryListing, DirectoryListingEntry, FileMap, } from "@cocalc/frontend/project/explorer/types"; import { WATCH_THROTTLE_MS } from "@cocalc/frontend/conat/listings"; +import { compute_file_masks } from "@cocalc/frontend/project/explorer/compute-file-masks"; import { mutate_data_to_compute_public_files } from "@cocalc/frontend/project_store"; import track from "@cocalc/frontend/user-tracking"; import { @@ -126,6 +126,8 @@ export function FilesFlyout({ const hidden = useTypedRedux({ project_id }, "show_hidden"); const checked_files = useTypedRedux({ project_id }, "checked_files"); const openFiles = useTypedRedux({ project_id }, "open_files_order"); + const otherSettings = useTypedRedux("account", "other_settings"); + const maskFiles = otherSettings?.get("mask_files"); // mainly controls what a single click does, plus additional UI elements const [mode, setMode] = useState<"open" | "select">("open"); const [prevSelected, setPrevSelected] = useState(null); @@ -190,7 +192,9 @@ export function FilesFlyout({ const files: DirectoryListing | null = filesStore.toJS?.(); if (files == null) return EMPTY_LISTING; let activeFile: DirectoryListingEntry | null = null; - compute_file_masks(files); + if (maskFiles) { + compute_file_masks(files); + } const searchWords = search_split(file_search.trim().toLowerCase()); const procFiles = files @@ -295,6 +299,7 @@ export function FilesFlyout({ openFiles, current_path, strippedPublicPaths, + maskFiles, ]); const prev_current_path = usePrevious(current_path); From bb2faa3a51e7ffad951966cd2912def68a5a15fe Mon Sep 17 00:00:00 2001 From: Andrey Novoseltsev Date: Mon, 24 Nov 2025 21:45:07 -0700 Subject: [PATCH 4/5] settings/other: add a setting to dim file extensions, false by default --- src/packages/frontend/_colors.sass | 1 + .../frontend/account/other-settings.tsx | 13 ++++++++ .../frontend/components/path-link.tsx | 8 ++++- .../explorer/file-listing/file-listing.tsx | 3 ++ .../explorer/file-listing/file-row.tsx | 12 ++++---- .../frontend/project/history/log-entry.tsx | 7 +++++ .../frontend/project/page/file-tab.tsx | 18 +++++++---- .../project/page/flyouts/active-group.tsx | 5 +++- .../frontend/project/page/flyouts/active.tsx | 6 +++- .../project/page/flyouts/file-list-item.tsx | 30 +++++++++++-------- .../frontend/project/page/flyouts/files.tsx | 2 ++ .../frontend/project/page/flyouts/log.tsx | 3 ++ .../frontend/project/page/flyouts/utils.ts | 4 +-- src/packages/util/db-schema/accounts.ts | 3 +- src/packages/util/theme.ts | 1 + 15 files changed, 86 insertions(+), 30 deletions(-) diff --git a/src/packages/frontend/_colors.sass b/src/packages/frontend/_colors.sass index 064e28b896..1986b3b26b 100644 --- a/src/packages/frontend/_colors.sass +++ b/src/packages/frontend/_colors.sass @@ -69,3 +69,4 @@ $COL_LANDING_TOP_BG: #c7d9f5 $COL_TAB: #333333 $COL_FILE_ICON: rgb(66, 139, 202) $COL_FILE_EXT: #999 +$COL_FILE_DIMMED: #959595 diff --git a/src/packages/frontend/account/other-settings.tsx b/src/packages/frontend/account/other-settings.tsx index ac94f4cc1d..12fed33a97 100644 --- a/src/packages/frontend/account/other-settings.tsx +++ b/src/packages/frontend/account/other-settings.tsx @@ -210,6 +210,18 @@ export function OtherSettings(props: Readonly): React.JSX.Element { ); } + function render_dim_file_extensions(): Rendered { + return ( + on_change("dim_file_extensions", e.target.checked)} + > + Dim file extensions: gray out file extensions so their + names stand out. + + ); + } + function render_antd(): Rendered { return ( <> @@ -443,6 +455,7 @@ export function OtherSettings(props: Readonly): React.JSX.Element { } > + {render_dim_file_extensions()} {render_mask_files()} {render_default_file_sort()} {render_page_size()} diff --git a/src/packages/frontend/components/path-link.tsx b/src/packages/frontend/components/path-link.tsx index 3359bbcfe3..64171f8c2a 100644 --- a/src/packages/frontend/components/path-link.tsx +++ b/src/packages/frontend/components/path-link.tsx @@ -13,6 +13,10 @@ import { COLORS } from "@cocalc/util/theme"; import { handleFileEntryClick } from "../project/history/utils"; import { Tip } from "./tip"; +import React from "react"; + +const DIMMED_STYLE = { color: COLORS.FILE_DIMMED } as const; + interface Props { path: string; project_id: string; @@ -22,6 +26,7 @@ interface Props { style?: React.CSSProperties; link?: boolean; // set to false to make it not be a link onOpen?: () => void; // called if link is clicked on to open it. + dimExtensions?: boolean; } // Component to attempt opening a cocalc path in a project @@ -34,6 +39,7 @@ export const PathLink: React.FC = ({ style = {}, link = true, onOpen, + dimExtensions = false, }: Props) => { function render_link(text): React.JSX.Element { let s; @@ -43,7 +49,7 @@ export const PathLink: React.FC = ({ s = ( <> {name} - .{ext} + .{ext} ); } else { diff --git a/src/packages/frontend/project/explorer/file-listing/file-listing.tsx b/src/packages/frontend/project/explorer/file-listing/file-listing.tsx index cbfef7d07e..406327f6f6 100644 --- a/src/packages/frontend/project/explorer/file-listing/file-listing.tsx +++ b/src/packages/frontend/project/explorer/file-listing/file-listing.tsx @@ -84,6 +84,7 @@ export const FileListing: React.FC = ({ configuration_main, file_search = "", isRunning, + other_settings, }: Props) => { const [starting, setStarting] = useState(false); const { starred, setStarredPath } = useStarredFilesManager(project_id); @@ -120,6 +121,7 @@ export const FileListing: React.FC = ({ }, [current_path, isRunning]); const computeServerId = useTypedRedux({ project_id }, "compute_server_id"); + const dimFileExtensions = !!other_settings?.get?.("dim_file_extensions"); function render_row( name, @@ -170,6 +172,7 @@ export const FileListing: React.FC = ({ isdir && !path.endsWith("/") ? `${path}/` : path; setStarredPath(normalizedPath, starState); }} + dimFileExtensions={dimFileExtensions} /> ); } diff --git a/src/packages/frontend/project/explorer/file-listing/file-row.tsx b/src/packages/frontend/project/explorer/file-listing/file-row.tsx index 186963e4f1..d55916ccc5 100644 --- a/src/packages/frontend/project/explorer/file-listing/file-row.tsx +++ b/src/packages/frontend/project/explorer/file-listing/file-row.tsx @@ -35,6 +35,8 @@ export const VIEWABLE_FILE_EXT: Readonly = [ "jpeg", ] as const; +const DIMMED_STYLE = { color: COLORS.FILE_DIMMED } as const; + interface Props { isdir: boolean; name: string; @@ -57,6 +59,7 @@ interface Props { computeServerId?: number; isStarred?: boolean; onToggleStar?: (path: string, starred: boolean) => void; + dimFileExtensions?: boolean; } export const FileRow: React.FC = React.memo((props) => { @@ -68,7 +71,7 @@ export const FileRow: React.FC = React.memo((props) => { function render_icon() { const style: React.CSSProperties = { - color: props.mask ? "#bbbbbb" : COLORS.FILE_ICON, + color: props.mask ? COLORS.FILE_DIMMED : COLORS.FILE_ICON, verticalAlign: "sub", } as const; let body: React.JSX.Element; @@ -117,12 +120,11 @@ export const FileRow: React.FC = React.memo((props) => { } function render_name_link(styles, name, ext) { + const extStyle = props.dimFileExtensions ? DIMMED_STYLE : undefined; return ( {misc.trunc_middle(name, 50)} - - {ext === "" ? "" : `.${ext}`} - + {ext === "" ? "" : `.${ext}`} {render_link_target()} ); @@ -147,7 +149,7 @@ export const FileRow: React.FC = React.memo((props) => { wordWrap: "break-word", overflowWrap: "break-word", verticalAlign: "middle", - color: props.mask ? "#bbbbbb" : COLORS.TAB, + color: props.mask ? COLORS.FILE_DIMMED : COLORS.TAB, }; if (show_tip) { diff --git a/src/packages/frontend/project/history/log-entry.tsx b/src/packages/frontend/project/history/log-entry.tsx index e1136d7898..710a7ddce5 100644 --- a/src/packages/frontend/project/history/log-entry.tsx +++ b/src/packages/frontend/project/history/log-entry.tsx @@ -146,6 +146,8 @@ export const LogEntry: React.FC = React.memo( "customize", "software", ); + const otherSettings = useTypedRedux("account", "other_settings"); + const dimFileExtensions = !!otherSettings?.get("dim_file_extensions"); function render_open_file(event: OpenFile): React.JSX.Element { return ( @@ -158,6 +160,7 @@ export const LogEntry: React.FC = React.memo( style={cursor ? selected_item : undefined} trunc={TRUNC} project_id={project_id} + dimExtensions={dimFileExtensions} onOpen={() => track("open-file", { how: "project-log", @@ -193,6 +196,7 @@ export const LogEntry: React.FC = React.memo( style={cursor ? selected_item : undefined} trunc={TRUNC} project_id={project_id} + dimExtensions={dimFileExtensions} /> ), event: event.disabled ? "disabled" : "enabled", @@ -350,6 +354,7 @@ export const LogEntry: React.FC = React.memo( trunc={TRUNC} link={link} project_id={project_id != null ? project_id : props.project_id} + dimExtensions={dimFileExtensions} onOpen={() => track("open-file", { how: "project-log", @@ -609,6 +614,7 @@ export const LogEntry: React.FC = React.memo( style={cursor ? selected_item : undefined} trunc={TRUNC} project_id={project_id} + dimExtensions={dimFileExtensions} /> ); @@ -670,6 +676,7 @@ export const LogEntry: React.FC = React.memo( style={cursor ? selected_item : undefined} trunc={TRUNC} project_id={project_id} + dimExtensions={dimFileExtensions} /> ); diff --git a/src/packages/frontend/project/page/file-tab.tsx b/src/packages/frontend/project/page/file-tab.tsx index c4004c218b..492cd0a385 100644 --- a/src/packages/frontend/project/page/file-tab.tsx +++ b/src/packages/frontend/project/page/file-tab.tsx @@ -215,10 +215,10 @@ export function FileTab(props: Readonly) { // alerts only work on non-docker projects (for now) -- #7077 const status_alerts: string[] = !onCoCalcDocker && name === "info" - ? project_status + ? (project_status ?.get("alerts") ?.map((a) => a.get("type")) - .toJS() ?? [] + .toJS() ?? []) : []; const other_settings = useTypedRedux("account", "other_settings"); @@ -303,8 +303,8 @@ export function FileTab(props: Readonly) { flyout === active_flyout ? COLORS.PROJECT.FIXED_LEFT_ACTIVE : active_flyout == null - ? COLORS.GRAY_L - : COLORS.GRAY_L0; + ? COLORS.GRAY_L + : COLORS.GRAY_L0; const bg = flyout === active_flyout ? COLORS.GRAY_L0 : undefined; return ( @@ -368,7 +368,7 @@ export function FileTab(props: Readonly) { const icon = path != null - ? file_options(path)?.icon ?? "code-o" + ? (file_options(path)?.icon ?? "code-o") : FIXED_PROJECT_TABS[name!].icon; const tags = @@ -545,6 +545,8 @@ const FULLPATH_LABEL_STYLE: CSS = { } as const; function DisplayedLabel({ path, label, inline = true, project_id }) { + const otherSettings = useTypedRedux("account", "other_settings"); + const dimFileExtensions = !!otherSettings?.get("dim_file_extensions"); if (path == null) { // a fixed tab (not an actual file) const E = inline ? "span" : "div"; @@ -590,7 +592,11 @@ function DisplayedLabel({ path, label, inline = true, project_id }) { > {label} - {ext} + + {ext} +
); diff --git a/src/packages/frontend/project/page/flyouts/active-group.tsx b/src/packages/frontend/project/page/flyouts/active-group.tsx index e284164888..6aa6d9ed4b 100644 --- a/src/packages/frontend/project/page/flyouts/active-group.tsx +++ b/src/packages/frontend/project/page/flyouts/active-group.tsx @@ -28,6 +28,7 @@ interface GroupProps { setStarredPath: (path: string, next: boolean) => void; showStarred: boolean; isLast?: boolean; // if group is empty, it is also the last one in the group + dimFileExtensions: boolean; } export function Group({ @@ -38,6 +39,7 @@ export function Group({ setStarredPath, showStarred, isLast = false, + dimFileExtensions, }: GroupProps): React.JSX.Element { const { project_id } = useProjectContext(); const actions = useActions({ project_id }); @@ -75,7 +77,7 @@ export function Group({ const fileType = file_options(`foo.${group}`); return { iconName: - group === "" ? UNKNOWN_FILE_TYPE_ICON : fileType?.icon ?? "file", + group === "" ? UNKNOWN_FILE_TYPE_ICON : (fileType?.icon ?? "file"), display: (group === "" ? "No extension" : fileType?.name) || group, }; } @@ -127,6 +129,7 @@ export function Group({ // trailing slash indicates to open a directory handleFileEntryClick(e, `${group}/`, project_id); }} + dimFileExtensions={dimFileExtensions} /> ); diff --git a/src/packages/frontend/project/page/flyouts/active.tsx b/src/packages/frontend/project/page/flyouts/active.tsx index ee486cc979..2d3a1aae90 100644 --- a/src/packages/frontend/project/page/flyouts/active.tsx +++ b/src/packages/frontend/project/page/flyouts/active.tsx @@ -133,6 +133,8 @@ export function ActiveFlyout(props: Readonly): React.JSX.Element { const openFiles = useTypedRedux({ project_id }, "open_files_order"); const justClosed = useTypedRedux({ project_id }, "just_closed_files"); const activeTab = useTypedRedux({ project_id }, "active_project_tab"); + const otherSettings = useTypedRedux("account", "other_settings"); + const dimFileExtensions = !!otherSettings?.get("dim_file_extensions"); const [filterTerm, setFilterTerm] = useState(""); const [showStarred, setShowStarred] = useState( getFlyoutActiveShowStarred(project_id), @@ -195,7 +197,7 @@ export function ActiveFlyout(props: Readonly): React.JSX.Element { filteredFiles.forEach((path) => { const { head, tail } = path_split(path); const group = - mode === "folder" ? head : filename_extension_notilde(tail) ?? ""; + mode === "folder" ? head : (filename_extension_notilde(tail) ?? ""); if (grouped[group] == null) grouped[group] = []; grouped[group].push(path); }); @@ -317,6 +319,7 @@ export function ActiveFlyout(props: Readonly): React.JSX.Element { /> ) : undefined } + dimFileExtensions={dimFileExtensions} /> ); } @@ -473,6 +476,7 @@ export function ActiveFlyout(props: Readonly): React.JSX.Element { setStarredPath={setStarredPath} showStarred={showStarred} isLast={fileNames.length === 0} + dimFileExtensions={dimFileExtensions} />, ); diff --git a/src/packages/frontend/project/page/flyouts/file-list-item.tsx b/src/packages/frontend/project/page/flyouts/file-list-item.tsx index 1c10882b91..c2c98b3cb0 100644 --- a/src/packages/frontend/project/page/flyouts/file-list-item.tsx +++ b/src/packages/frontend/project/page/flyouts/file-list-item.tsx @@ -39,6 +39,8 @@ import { import { COLORS } from "@cocalc/util/theme"; import { FLYOUT_DEFAULT_WIDTH_PX, FLYOUT_PADDING } from "./consts"; +const DIMMED_STYLE = { color: COLORS.FILE_DIMMED } as const; + const FILE_ITEM_SELECTED_STYLE: CSS = { backgroundColor: COLORS.BLUE_LLL, // bit darker than .cc-project-flyout-file-item:hover } as const; @@ -142,6 +144,7 @@ interface FileListItemProps { style?: CSS; tooltip?: React.JSX.Element | string; noPublish?: boolean; // for layout only – indicate that there is never a publish indicator button + dimFileExtensions?: boolean; } export const FileListItem = React.memo((props: Readonly) => { @@ -168,6 +171,7 @@ export const FileListItem = React.memo((props: Readonly) => { showCheckbox, style, tooltip, + dimFileExtensions = false, } = props; const isActive = mode === "active"; // only in files mode, we show the publish icon @@ -230,8 +234,8 @@ export const FileListItem = React.memo((props: Readonly) => { ? item.isopen ? { fontWeight: "bold" } : item.isdir - ? undefined - : { color: COLORS.FILE_EXT } + ? undefined + : { color: COLORS.FILE_EXT } : undefined; return ( @@ -247,7 +251,7 @@ export const FileListItem = React.memo((props: Readonly) => { {displayedNameOverride ?? basename} {displayedNameOverride == null ? ( ext === "" ? undefined : ( - + {`.${ext}`} ) @@ -279,8 +283,8 @@ export const FileListItem = React.memo((props: Readonly) => { ? "check-square" : "square" : item.isdir - ? "folder-open" - : file_options(item.name)?.icon ?? "file"); + ? "folder-open" + : (file_options(item.name)?.icon ?? "file")); return ( ) => { ? COLORS.STAR : COLORS.GRAY_L : isStarred && item.isopen - ? COLORS.STAR - : COLORS.GRAY_L; + ? COLORS.STAR + : COLORS.GRAY_L; return ( ) => { const actionNames = multiple ? ACTION_BUTTONS_MULTI : isdir - ? ACTION_BUTTONS_DIR - : ACTION_BUTTONS_FILE; + ? ACTION_BUTTONS_DIR + : ACTION_BUTTONS_FILE; for (const key of actionNames) { if (key === "download" && !item.isdir) continue; const disabled = @@ -538,10 +542,10 @@ export const FileListItem = React.memo((props: Readonly) => { ? FILE_ITEM_ACTIVE_STYLE_2 : {} : item.isopen - ? item.isactive - ? FILE_ITEM_ACTIVE_STYLE - : FILE_ITEM_OPENED_STYLE - : {}; + ? item.isactive + ? FILE_ITEM_ACTIVE_STYLE + : FILE_ITEM_OPENED_STYLE + : {}; return ( diff --git a/src/packages/frontend/project/page/flyouts/files.tsx b/src/packages/frontend/project/page/flyouts/files.tsx index ff35b697f7..173f492795 100644 --- a/src/packages/frontend/project/page/flyouts/files.tsx +++ b/src/packages/frontend/project/page/flyouts/files.tsx @@ -128,6 +128,7 @@ export function FilesFlyout({ const openFiles = useTypedRedux({ project_id }, "open_files_order"); const otherSettings = useTypedRedux("account", "other_settings"); const maskFiles = otherSettings?.get("mask_files"); + const dimFileExtensions = !!otherSettings?.get("dim_file_extensions"); // mainly controls what a single click does, plus additional UI elements const [mode, setMode] = useState<"open" | "select">("open"); const [prevSelected, setPrevSelected] = useState(null); @@ -631,6 +632,7 @@ export function FilesFlyout({ item.isdir && !fullPath.endsWith("/") ? `${fullPath}/` : fullPath; manageStarredFiles.setStarredPath(normalizedPath, starState); }} + dimFileExtensions={dimFileExtensions} /> ); } diff --git a/src/packages/frontend/project/page/flyouts/log.tsx b/src/packages/frontend/project/page/flyouts/log.tsx index e9d297dab6..ecd55e3b5e 100644 --- a/src/packages/frontend/project/page/flyouts/log.tsx +++ b/src/packages/frontend/project/page/flyouts/log.tsx @@ -251,6 +251,8 @@ export function LogFlyout({ const openFiles = useTypedRedux({ project_id }, "open_files_order"); const user_map = useTypedRedux("users", "user_map"); const activeTab = useTypedRedux({ project_id }, "active_project_tab"); + const otherSettings = useTypedRedux("account", "other_settings"); + const dimFileExtensions = !!otherSettings?.get("dim_file_extensions"); const virtuosoScroll = useVirtuosoScrollHook({ cacheId: `${project_id}::flyout::log`, }); @@ -379,6 +381,7 @@ export function LogFlyout({ } + dimFileExtensions={dimFileExtensions} /> ); } diff --git a/src/packages/frontend/project/page/flyouts/utils.ts b/src/packages/frontend/project/page/flyouts/utils.ts index d31b6c7c64..b730dfecfd 100644 --- a/src/packages/frontend/project/page/flyouts/utils.ts +++ b/src/packages/frontend/project/page/flyouts/utils.ts @@ -85,10 +85,10 @@ export function fileItemStyle(time: number = 0, masked: boolean = false): CSS { const opacity = 1 - (days - 1) / 14; col = hexColorToRGBA(ANTD_YELLOW[5], opacity); } - return { + const base = { ...fileItemBorder(col, "left"), - ...(masked ? { color: COLORS.GRAY_L } : {}), }; + return masked ? { ...base, color: COLORS.FILE_DIMMED } : base; } export function fileItemBorder(color: string, side: "left" | "top" | "bottom") { diff --git a/src/packages/util/db-schema/accounts.ts b/src/packages/util/db-schema/accounts.ts index 861d2347bb..405aba0707 100644 --- a/src/packages/util/db-schema/accounts.ts +++ b/src/packages/util/db-schema/accounts.ts @@ -502,7 +502,8 @@ Table({ other_settings: { katex: true, confirm_close: false, - mask_files: true, + mask_files: false, + dim_file_extensions: false, page_size: 500, standby_timeout_m: 15, default_file_sort: "name", diff --git a/src/packages/util/theme.ts b/src/packages/util/theme.ts index c9b1ef1a0c..f1b1566014 100644 --- a/src/packages/util/theme.ts +++ b/src/packages/util/theme.ts @@ -153,4 +153,5 @@ export const COLORS = { FILE_ICON: "rgb(66, 139, 202)", FILE_EXT: "#999", + FILE_DIMMED: "#959595", } as const; From 7393433518ddcd95a2592b80a8526658141e5e22 Mon Sep 17 00:00:00 2001 From: Andrey Novoseltsev Date: Mon, 24 Nov 2025 22:25:15 -0700 Subject: [PATCH 5/5] review comment: extract inline style to a constant --- src/packages/frontend/project/page/file-tab.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/packages/frontend/project/page/file-tab.tsx b/src/packages/frontend/project/page/file-tab.tsx index 492cd0a385..334c04a187 100644 --- a/src/packages/frontend/project/page/file-tab.tsx +++ b/src/packages/frontend/project/page/file-tab.tsx @@ -536,6 +536,8 @@ const LABEL_STYLE: CSS = { whiteSpace: "nowrap", } as const; +const DIMMED_STYLE = { color: COLORS.FILE_DIMMED } as const; + const FULLPATH_LABEL_STYLE: CSS = { // using a full path for the label instead of just a filename textOverflow: "ellipsis", @@ -592,11 +594,7 @@ function DisplayedLabel({ path, label, inline = true, project_id }) { > {label} - - {ext} - + {ext} );