fix: add "New Database" button to Open Diagram dialog (#1041)

* feat: add "New Database" button to Open Diagram dialog * fix: rename Browse to Open/All databases * fix --------- Co-authored-by: Guy Ben-Aharon <baguy3@gmail.com>
2026-02-09 13:14:31 -06:00 · 2026-01-01 12:47:05 +02:00
parent a63d2b3f74
commit a43cc30c52
23 changed files with 87 additions and 51 deletions
--- a/src/dialogs/open-diagram-dialog/open-diagram-dialog.tsx
+++ b/src/dialogs/open-diagram-dialog/open-diagram-dialog.tsx
@@ -37,7 +37,7 @@ export const OpenDiagramDialog: React.FC<OpenDiagramDialogProps> = ({
    dialog,
    canClose = true,
 }) => {
-    const { closeOpenDiagramDialog } = useDialog();
+    const { closeOpenDiagramDialog, openCreateDiagramDialog } = useDialog();
    const { t } = useTranslation();
    const { updateConfig } = useConfig();
    const navigate = useNavigate();
@@ -254,15 +254,29 @@ export const OpenDiagramDialog: React.FC<OpenDiagramDialogProps> = ({
                    ) : (
                        <div />
                    )}
-                    <DialogClose asChild>
+                    <div className="flex gap-2">
                        <Button
-                            type="submit"
-                            disabled={!selectedDiagramId}
-                            onClick={() => openDiagram(selectedDiagramId ?? '')}
+                            type="button"
+                            variant="secondary"
+                            onClick={() => {
+                                closeOpenDiagramDialog();
+                                openCreateDiagramDialog();
+                            }}
                        >
-                            {t('open_diagram_dialog.open')}
+                            {t('open_diagram_dialog.new_database')}
                        </Button>
-                    </DialogClose>
+                        <DialogClose asChild>
+                            <Button
+                                type="submit"
+                                disabled={!selectedDiagramId}
+                                onClick={() =>
+                                    openDiagram(selectedDiagramId ?? '')
+                                }
+                            >
+                                {t('open_diagram_dialog.open')}
+                            </Button>
+                        </DialogClose>
+                    </div>
                </DialogFooter>
            </DialogContent>
        </Dialog>
--- a/src/i18n/locales/ar.ts
+++ b/src/i18n/locales/ar.ts
@@ -4,7 +4,7 @@ export const ar: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'جديد',
-            browse: 'تصفح',
+            browse: 'فتح',
            tables: 'الجداول',
            refs: 'المراجع',
            dependencies: 'التبعيات',
@@ -15,7 +15,7 @@ export const ar: LanguageTranslation = {
            actions: {
                actions: 'الإجراءات',
                new: 'جديد...',
-                browse: 'تصفح...',
+                browse: 'جميع قواعد البيانات...',
                save: 'حفظ',
                import: 'استيراد قاعدة بيانات',
                export_sql: 'SQL تصدير',
@@ -351,6 +351,7 @@ export const ar: LanguageTranslation = {
            },
            cancel: 'إلغاء',
            open: 'فتح',
+            new_database: 'قاعدة بيانات جديدة',

            diagram_actions: {
                open: 'فتح',
--- a/src/i18n/locales/bn.ts
+++ b/src/i18n/locales/bn.ts
@@ -4,7 +4,7 @@ export const bn: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'নতুন',
-            browse: 'ব্রাউজ',
+            browse: 'খুলুন',
            tables: 'টেবিল',
            refs: 'রেফস',
            dependencies: 'নির্ভরতা',
@@ -15,7 +15,7 @@ export const bn: LanguageTranslation = {
            actions: {
                actions: 'কার্য',
                new: 'নতুন...',
-                browse: 'ব্রাউজ করুন...',
+                browse: 'সমস্ত ডেটাবেস...',
                save: 'সংরক্ষণ করুন',
                import: 'ডাটাবেস আমদানি করুন',
                export_sql: 'SQL রপ্তানি করুন',
@@ -355,6 +355,7 @@ export const bn: LanguageTranslation = {
            },
            cancel: 'বাতিল করুন',
            open: 'খুলুন',
+            new_database: 'নতুন ডেটাবেস',

            diagram_actions: {
                open: 'খুলুন',
--- a/src/i18n/locales/de.ts
+++ b/src/i18n/locales/de.ts
@@ -4,7 +4,7 @@ export const de: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Neu',
-            browse: 'Durchsuchen',
+            browse: 'Öffnen',
            tables: 'Tabellen',
            refs: 'Refs',
            dependencies: 'Abhängigkeiten',
@@ -15,7 +15,7 @@ export const de: LanguageTranslation = {
            actions: {
                actions: 'Aktionen',
                new: 'Neu...',
-                browse: 'Durchsuchen...',
+                browse: 'Alle Datenbanken...',
                save: 'Speichern',
                import: 'Datenbank importieren',
                export_sql: 'SQL exportieren',
@@ -358,6 +358,7 @@ export const de: LanguageTranslation = {
            },
            cancel: 'Abbrechen',
            open: 'Öffnen',
+            new_database: 'Neue Datenbank',

            diagram_actions: {
                open: 'Öffnen',
--- a/src/i18n/locales/en.ts
+++ b/src/i18n/locales/en.ts
@@ -4,7 +4,7 @@ export const en = {
    translation: {
        editor_sidebar: {
            new_diagram: 'New',
-            browse: 'Browse',
+            browse: 'Open',
            tables: 'Tables',
            refs: 'Refs',
            dependencies: 'Dependencies',
@@ -15,7 +15,7 @@ export const en = {
            actions: {
                actions: 'Actions',
                new: 'New...',
-                browse: 'Browse...',
+                browse: 'All Databases...',
                save: 'Save',
                import: 'Import',
                export_sql: 'Export SQL',
@@ -345,6 +345,7 @@ export const en = {
            },
            cancel: 'Cancel',
            open: 'Open',
+            new_database: 'New Database',

            diagram_actions: {
                open: 'Open',
--- a/src/i18n/locales/es.ts
+++ b/src/i18n/locales/es.ts
@@ -4,7 +4,7 @@ export const es: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Nuevo',
-            browse: 'Examinar',
+            browse: 'Abrir',
            tables: 'Tablas',
            refs: 'Refs',
            dependencies: 'Dependencias',
@@ -15,7 +15,7 @@ export const es: LanguageTranslation = {
            actions: {
                actions: 'Acciones',
                new: 'Nuevo...',
-                browse: 'Examinar...',
+                browse: 'Todas las bases de datos...',
                save: 'Guardar',
                import: 'Importar Base de Datos',
                export_sql: 'Exportar SQL',
@@ -356,6 +356,7 @@ export const es: LanguageTranslation = {
            },
            cancel: 'Cancelar',
            open: 'Abrir',
+            new_database: 'Nueva Base de Datos',

            diagram_actions: {
                open: 'Abrir',
--- a/src/i18n/locales/fr.ts
+++ b/src/i18n/locales/fr.ts
@@ -4,7 +4,7 @@ export const fr: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Nouveau',
-            browse: 'Parcourir',
+            browse: 'Ouvrir',
            tables: 'Tables',
            refs: 'Refs',
            dependencies: 'Dépendances',
@@ -15,7 +15,7 @@ export const fr: LanguageTranslation = {
            actions: {
                actions: 'Actions',
                new: 'Nouveau...',
-                browse: 'Parcourir...',
+                browse: 'Toutes les bases de données...',
                save: 'Enregistrer',
                import: 'Importer Base de Données',
                export_sql: 'Exporter SQL',
@@ -353,6 +353,7 @@ export const fr: LanguageTranslation = {
            },
            cancel: 'Annuler',
            open: 'Ouvrir',
+            new_database: 'Nouvelle Base de Données',

            diagram_actions: {
                open: 'Ouvrir',
--- a/src/i18n/locales/gu.ts
+++ b/src/i18n/locales/gu.ts
@@ -4,7 +4,7 @@ export const gu: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'નવું',
-            browse: 'બ્રાઉજ',
+            browse: 'ખોલો',
            tables: 'ટેબલો',
            refs: 'રેફ્સ',
            dependencies: 'નિર્ભરતાઓ',
@@ -15,7 +15,7 @@ export const gu: LanguageTranslation = {
            actions: {
                actions: 'ક્રિયાઓ',
                new: 'નવું...',
-                browse: 'બ્રાઉજ કરો...',
+                browse: 'બધા ડેટાબેસ...',
                save: 'સાચવો',
                import: 'ડેટાબેસ આયાત કરો',
                export_sql: 'SQL નિકાસ કરો',
@@ -355,6 +355,7 @@ export const gu: LanguageTranslation = {
            },
            cancel: 'રદ કરો',
            open: 'ખોલો',
+            new_database: 'નવું ડેટાબેસ',

            diagram_actions: {
                open: 'ખોલો',
--- a/src/i18n/locales/hi.ts
+++ b/src/i18n/locales/hi.ts
@@ -4,7 +4,7 @@ export const hi: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'नया',
-            browse: 'ब्राउज़',
+            browse: 'खोलें',
            tables: 'टेबल',
            refs: 'रेफ्स',
            dependencies: 'निर्भरताएं',
@@ -15,7 +15,7 @@ export const hi: LanguageTranslation = {
            actions: {
                actions: 'कार्य',
                new: 'नया...',
-                browse: 'ब्राउज़ करें...',
+                browse: 'सभी डेटाबेस...',
                save: 'सहेजें',
                import: 'डेटाबेस आयात करें',
                export_sql: 'SQL निर्यात करें',
@@ -357,6 +357,7 @@ export const hi: LanguageTranslation = {
            },
            cancel: 'रद्द करें',
            open: 'खोलें',
+            new_database: 'नया डेटाबेस',

            diagram_actions: {
                open: 'खोलें',
--- a/src/i18n/locales/hr.ts
+++ b/src/i18n/locales/hr.ts
@@ -4,7 +4,7 @@ export const hr: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Novi',
-            browse: 'Pregledaj',
+            browse: 'Otvori',
            tables: 'Tablice',
            refs: 'Refs',
            dependencies: 'Ovisnosti',
@@ -15,7 +15,7 @@ export const hr: LanguageTranslation = {
            actions: {
                actions: 'Akcije',
                new: 'Novi...',
-                browse: 'Pregledaj...',
+                browse: 'Sve baze podataka...',
                save: 'Spremi',
                import: 'Uvezi',
                export_sql: 'Izvezi SQL',
@@ -349,6 +349,7 @@ export const hr: LanguageTranslation = {
            },
            cancel: 'Odustani',
            open: 'Otvori',
+            new_database: 'Nova baza podataka',

            diagram_actions: {
                open: 'Otvori',
--- a/src/i18n/locales/id_ID.ts
+++ b/src/i18n/locales/id_ID.ts
@@ -4,7 +4,7 @@ export const id_ID: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Baru',
-            browse: 'Jelajahi',
+            browse: 'Buka',
            tables: 'Tabel',
            refs: 'Refs',
            dependencies: 'Ketergantungan',
@@ -15,7 +15,7 @@ export const id_ID: LanguageTranslation = {
            actions: {
                actions: 'Aksi',
                new: 'Baru...',
-                browse: 'Jelajahi...',
+                browse: 'Semua database...',
                save: 'Simpan',
                import: 'Impor Database',
                export_sql: 'Ekspor SQL',
@@ -354,6 +354,7 @@ export const id_ID: LanguageTranslation = {
            },
            cancel: 'Batal',
            open: 'Buka',
+            new_database: 'Database Baru',

            diagram_actions: {
                open: 'Buka',
--- a/src/i18n/locales/ja.ts
+++ b/src/i18n/locales/ja.ts
@@ -4,7 +4,7 @@ export const ja: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: '新規',
-            browse: '参照',
+            browse: '開く',
            tables: 'テーブル',
            refs: '参照',
            dependencies: '依存関係',
@@ -15,7 +15,7 @@ export const ja: LanguageTranslation = {
            actions: {
                actions: 'アクション',
                new: '新規...',
-                browse: '参照...',
+                browse: 'すべてのデータベース...',
                save: '保存',
                import: 'データベースをインポート',
                export_sql: 'SQLをエクスポート',
@@ -359,6 +359,7 @@ export const ja: LanguageTranslation = {
            },
            cancel: 'キャンセル',
            open: '開く',
+            new_database: '新しいデータベース',

            diagram_actions: {
                open: '開く',
--- a/src/i18n/locales/ko_KR.ts
+++ b/src/i18n/locales/ko_KR.ts
@@ -4,7 +4,7 @@ export const ko_KR: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: '새로 만들기',
-            browse: '찾아보기',
+            browse: '열기',
            tables: '테이블',
            refs: 'Refs',
            dependencies: '종속성',
@@ -15,7 +15,7 @@ export const ko_KR: LanguageTranslation = {
            actions: {
                actions: '작업',
                new: '새로 만들기...',
-                browse: '찾아보기...',
+                browse: '모든 데이터베이스...',
                save: '저장',
                import: '데이터베이스 가져오기',
                export_sql: 'SQL로 저장',
@@ -354,6 +354,7 @@ export const ko_KR: LanguageTranslation = {
            },
            cancel: '취소',
            open: '열기',
+            new_database: '새 데이터베이스',

            diagram_actions: {
                open: '열기',
--- a/src/i18n/locales/mr.ts
+++ b/src/i18n/locales/mr.ts
@@ -4,7 +4,7 @@ export const mr: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'नवीन',
-            browse: 'ब्राउज',
+            browse: 'उघडा',
            tables: 'टेबल',
            refs: 'Refs',
            dependencies: 'अवलंबने',
@@ -15,7 +15,7 @@ export const mr: LanguageTranslation = {
            actions: {
                actions: 'क्रिया',
                new: 'नवीन...',
-                browse: 'ब्राउज करा...',
+                browse: 'सर्व डेटाबेस...',
                save: 'जतन करा',
                import: 'डेटाबेस इम्पोर्ट करा',
                export_sql: 'SQL एक्स्पोर्ट करा',
@@ -360,6 +360,7 @@ export const mr: LanguageTranslation = {
            },
            cancel: 'रद्द करा',
            open: 'उघडा',
+            new_database: 'नवीन डेटाबेस',

            diagram_actions: {
                open: 'उघडा',
--- a/src/i18n/locales/ne.ts
+++ b/src/i18n/locales/ne.ts
@@ -4,7 +4,7 @@ export const ne: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'नयाँ',
-            browse: 'ब्राउज',
+            browse: 'खोल्नुहोस्',
            tables: 'टेबलहरू',
            refs: 'Refs',
            dependencies: 'निर्भरताहरू',
@@ -15,7 +15,7 @@ export const ne: LanguageTranslation = {
            actions: {
                actions: 'कार्यहरू',
                new: 'नयाँ...',
-                browse: 'ब्राउज गर्नुहोस्...',
+                browse: 'सबै डाटाबेसहरू...',
                save: 'सुरक्षित गर्नुहोस्',
                import: 'डाटाबेस आयात गर्नुहोस्',
                export_sql: 'SQL निर्यात गर्नुहोस्',
@@ -357,6 +357,7 @@ export const ne: LanguageTranslation = {
            },
            cancel: 'रद्द गर्नुहोस्',
            open: 'खोल्नुहोस्',
+            new_database: 'नयाँ डाटाबेस',

            diagram_actions: {
                open: 'खोल्नुहोस्',
--- a/src/i18n/locales/pt_BR.ts
+++ b/src/i18n/locales/pt_BR.ts
@@ -4,7 +4,7 @@ export const pt_BR: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Novo',
-            browse: 'Navegar',
+            browse: 'Abrir',
            tables: 'Tabelas',
            refs: 'Refs',
            dependencies: 'Dependências',
@@ -15,7 +15,7 @@ export const pt_BR: LanguageTranslation = {
            actions: {
                actions: 'Ações',
                new: 'Novo...',
-                browse: 'Navegar...',
+                browse: 'Todos os bancos de dados...',
                save: 'Salvar',
                import: 'Importar Banco de Dados',
                export_sql: 'Exportar SQL',
@@ -356,6 +356,7 @@ export const pt_BR: LanguageTranslation = {
            },
            cancel: 'Cancelar',
            open: 'Abrir',
+            new_database: 'Novo Banco de Dados',

            diagram_actions: {
                open: 'Abrir',
--- a/src/i18n/locales/ru.ts
+++ b/src/i18n/locales/ru.ts
@@ -4,7 +4,7 @@ export const ru: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Новая',
-            browse: 'Обзор',
+            browse: 'Открыть',
            tables: 'Таблицы',
            refs: 'Ссылки',
            dependencies: 'Зависимости',
@@ -15,7 +15,7 @@ export const ru: LanguageTranslation = {
            actions: {
                actions: 'Действия',
                new: 'Новая...',
-                browse: 'Обзор...',
+                browse: 'Все базы данных...',
                save: 'Сохранить',
                import: 'Импортировать базу данных',
                export_sql: 'Экспорт SQL',
@@ -353,6 +353,7 @@ export const ru: LanguageTranslation = {
            },
            cancel: 'Отмена',
            open: 'Открыть',
+            new_database: 'Новая база данных',

            diagram_actions: {
                open: 'Открыть',
--- a/src/i18n/locales/te.ts
+++ b/src/i18n/locales/te.ts
@@ -4,7 +4,7 @@ export const te: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'కొత్తది',
-            browse: 'బ్రాఉజ్',
+            browse: 'తెరవు',
            tables: 'టేబల్లు',
            refs: 'సంబంధాలు',
            dependencies: 'ఆధారతలు',
@@ -15,7 +15,7 @@ export const te: LanguageTranslation = {
            actions: {
                actions: 'చర్యలు',
                new: 'కొత్తది...',
-                browse: 'బ్రాఉజ్ చేయండి...',
+                browse: 'అన్ని డేటాబేస్‌లు...',
                save: 'సేవ్',
                import: 'డేటాబేస్‌ను దిగుమతి చేసుకోండి',
                export_sql: 'SQL ఎగుమతి',
@@ -357,6 +357,7 @@ export const te: LanguageTranslation = {
            },
            cancel: 'రద్దు',
            open: 'తెరవు',
+            new_database: 'కొత్త డేటాబేస్',

            diagram_actions: {
                open: 'తెరవు',
--- a/src/i18n/locales/tr.ts
+++ b/src/i18n/locales/tr.ts
@@ -4,7 +4,7 @@ export const tr: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Yeni',
-            browse: 'Gözat',
+            browse: 'Aç',
            tables: 'Tablolar',
            refs: 'Refs',
            dependencies: 'Bağımlılıklar',
@@ -15,7 +15,7 @@ export const tr: LanguageTranslation = {
            actions: {
                actions: 'Eylemler',
                new: 'Yeni...',
-                browse: 'Gözat...',
+                browse: 'Tüm veritabanları...',
                save: 'Kaydet',
                import: 'Veritabanı İçe Aktar',
                export_sql: 'SQL Olarak Dışa Aktar',
@@ -352,6 +352,7 @@ export const tr: LanguageTranslation = {
            },
            cancel: 'İptal',
            open: 'Aç',
+            new_database: 'Yeni Veritabanı',

            diagram_actions: {
                open: 'Aç',
--- a/src/i18n/locales/uk.ts
+++ b/src/i18n/locales/uk.ts
@@ -4,7 +4,7 @@ export const uk: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Нова',
-            browse: 'Огляд',
+            browse: 'Відкрити',
            tables: 'Таблиці',
            refs: 'Зв’язки',
            dependencies: 'Залежності',
@@ -15,7 +15,7 @@ export const uk: LanguageTranslation = {
            actions: {
                actions: 'Дії',
                new: 'Нова...',
-                browse: 'Огляд...',
+                browse: 'Усі бази даних...',
                save: 'Зберегти',
                import: 'Імпорт бази даних',
                export_sql: 'Експорт SQL',
@@ -354,6 +354,7 @@ export const uk: LanguageTranslation = {
            },
            cancel: 'Скасувати',
            open: 'Відкрити',
+            new_database: 'Нова база даних',

            diagram_actions: {
                open: 'Відкрити',
--- a/src/i18n/locales/vi.ts
+++ b/src/i18n/locales/vi.ts
@@ -4,7 +4,7 @@ export const vi: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: 'Mới',
-            browse: 'Duyệt',
+            browse: 'Mở',
            tables: 'Bảng',
            refs: 'Refs',
            dependencies: 'Phụ thuộc',
@@ -15,7 +15,7 @@ export const vi: LanguageTranslation = {
            actions: {
                actions: 'Hành động',
                new: 'Mới...',
-                browse: 'Duyệt...',
+                browse: 'Tất cả cơ sở dữ liệu...',
                save: 'Lưu',
                import: 'Nhập cơ sở dữ liệu',
                export_sql: 'Xuất SQL',
@@ -354,6 +354,7 @@ export const vi: LanguageTranslation = {
            },
            cancel: 'Hủy',
            open: 'Mở',
+            new_database: 'Cơ sở dữ liệu mới',

            diagram_actions: {
                open: 'Mở',
--- a/src/i18n/locales/zh_CN.ts
+++ b/src/i18n/locales/zh_CN.ts
@@ -4,7 +4,7 @@ export const zh_CN: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: '新建',
-            browse: '浏览',
+            browse: '打开',
            tables: '表',
            refs: '引用',
            dependencies: '依赖关系',
@@ -15,7 +15,7 @@ export const zh_CN: LanguageTranslation = {
            actions: {
                actions: '操作',
                new: '新建...',
-                browse: '浏览...',
+                browse: '所有数据库...',
                save: '保存',
                import: '导入数据库',
                export_sql: '导出 SQL 语句',
@@ -350,6 +350,7 @@ export const zh_CN: LanguageTranslation = {
            },
            cancel: '取消',
            open: '打开',
+            new_database: '新建数据库',

            diagram_actions: {
                open: '打开',
--- a/src/i18n/locales/zh_TW.ts
+++ b/src/i18n/locales/zh_TW.ts
@@ -4,7 +4,7 @@ export const zh_TW: LanguageTranslation = {
    translation: {
        editor_sidebar: {
            new_diagram: '新建',
-            browse: '瀏覽',
+            browse: '開啟',
            tables: '表格',
            refs: 'Refs',
            dependencies: '相依性',
@@ -15,7 +15,7 @@ export const zh_TW: LanguageTranslation = {
            actions: {
                actions: '操作',
                new: '新增...',
-                browse: '瀏覽...',
+                browse: '所有資料庫...',
                save: '儲存',
                import: '匯入資料庫',
                export_sql: '匯出 SQL',
@@ -349,6 +349,7 @@ export const zh_TW: LanguageTranslation = {
            },
            cancel: '取消',
            open: '開啟',
+            new_database: '新建資料庫',

            diagram_actions: {
                open: '開啟',