fix: update multiple schemas toast to require user action (#771)

* fix: update multiple schemas toast to require user action * fix * fix --------- Co-authored-by: Guy Ben-Aharon <baguy3@gmail.com>
2025-10-23 07:11:56 +00:00 · 2025-07-21 12:43:57 +03:00
parent c9ea7da092
commit f56fab9876
24 changed files with 53 additions and 54 deletions
--- a/src/components/toast/toaster.tsx
+++ b/src/components/toast/toaster.tsx
@@ -20,6 +20,7 @@ export function Toaster() {
                description,
                action,
                layout = 'row',
+                hideCloseButton = false,
                ...props
            }) {
                return (
@@ -38,7 +39,7 @@ export function Toaster() {
                            ) : null}
                        </div>
                        {layout === 'row' ? action : null}
-                        <ToastClose />
+                        {!hideCloseButton ? <ToastClose /> : null}
                    </Toast>
                );
            })}
--- a/src/components/toast/use-toast.ts
+++ b/src/components/toast/use-toast.ts
@@ -12,6 +12,7 @@ type ToasterToast = ToastProps & {
    description?: React.ReactNode;
    action?: ToastActionElement;
    layout?: 'row' | 'column';
+    hideCloseButton?: boolean;
 };

 // eslint-disable-next-line @typescript-eslint/no-unused-vars
--- a/src/i18n/locales/ar.ts
+++ b/src/i18n/locales/ar.ts
@@ -74,8 +74,8 @@ export const ar: LanguageTranslation = {
            title: 'مخططات متعددة',
            description:
                '{{formattedSchemas}} :مخططات في هذا الرسم البياني. يتم حاليا عرض {{schemasCount}} هناك',
-            dont_show_again: 'لا تظهره مجدداً',
-            change_schema: 'تغيير',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'لا شيء',
        },

--- a/src/i18n/locales/bn.ts
+++ b/src/i18n/locales/bn.ts
@@ -75,8 +75,8 @@ export const bn: LanguageTranslation = {
            title: 'বহু স্কিমা',
            description:
                '{{schemasCount}} স্কিমা এই ডায়াগ্রামে রয়েছে। বর্তমানে প্রদর্শিত: {{formattedSchemas}}।',
-            dont_show_again: 'পুনরায় দেখাবেন না',
-            change_schema: 'পরিবর্তন করুন',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'কিছুই না',
        },

--- a/src/i18n/locales/de.ts
+++ b/src/i18n/locales/de.ts
@@ -75,8 +75,8 @@ export const de: LanguageTranslation = {
            title: 'Mehrere Schemas',
            description:
                '{{schemasCount}} Schemas in diesem Diagramm. Derzeit angezeigt: {{formattedSchemas}}.',
-            dont_show_again: 'Nicht erneut anzeigen',
-            change_schema: 'Schema ändern',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'Keine',
        },

--- a/src/i18n/locales/en.ts
+++ b/src/i18n/locales/en.ts
@@ -73,8 +73,7 @@ export const en = {
            title: 'Multiple Schemas',
            description:
                '{{schemasCount}} schemas in this diagram. Currently displaying: {{formattedSchemas}}.',
-            dont_show_again: "Don't show again",
-            change_schema: 'Change',
+            show_me: 'Show me',
            none: 'none',
        },

--- a/src/i18n/locales/es.ts
+++ b/src/i18n/locales/es.ts
@@ -408,8 +408,8 @@ export const es: LanguageTranslation = {
            title: 'Múltiples Esquemas',
            description:
                '{{schemasCount}} esquemas en este diagrama. Actualmente mostrando: {{formattedSchemas}}.',
-            dont_show_again: 'No mostrar de nuevo',
-            change_schema: 'Cambiar',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'nada',
        },
        // TODO: Translate
--- a/src/i18n/locales/fr.ts
+++ b/src/i18n/locales/fr.ts
@@ -348,8 +348,8 @@ export const fr: LanguageTranslation = {
            title: 'Schémas Multiples',
            description:
                '{{schemasCount}} schémas dans ce diagramme. Actuellement affiché(s) : {{formattedSchemas}}.',
-            dont_show_again: 'Ne plus afficher',
-            change_schema: 'Changer',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'Aucun',
        },

--- a/src/i18n/locales/gu.ts
+++ b/src/i18n/locales/gu.ts
@@ -75,8 +75,8 @@ export const gu: LanguageTranslation = {
            title: 'કઈંક વધારે સ્કીમા',
            description:
                '{{schemasCount}} સ્કીમા આ ડાયાગ્રામમાં છે. હાલમાં દર્શાવેલ છે: {{formattedSchemas}}.',
-            dont_show_again: 'ફરીથી ન બતાવો',
-            change_schema: 'બદલો',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'કઈ નહીં',
        },

--- a/src/i18n/locales/hi.ts
+++ b/src/i18n/locales/hi.ts
@@ -74,8 +74,8 @@ export const hi: LanguageTranslation = {
            title: 'एकाधिक स्कीमा',
            description:
                '{{schemasCount}} स्कीमा इस आरेख में हैं। वर्तमान में प्रदर्शित: {{formattedSchemas}}।',
-            dont_show_again: 'फिर से न दिखाएँ',
-            change_schema: 'बदलें',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'कोई नहीं',
        },

--- a/src/i18n/locales/id_ID.ts
+++ b/src/i18n/locales/id_ID.ts
@@ -74,8 +74,8 @@ export const id_ID: LanguageTranslation = {
            title: 'Schema Lebih dari satu',
            description:
                '{{schemasCount}} schema di diagram ini. Sedang ditampilkan: {{formattedSchemas}}.',
-            dont_show_again: 'Jangan tampilkan lagi',
-            change_schema: 'Ubah',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'Tidak ada',
        },

--- a/src/i18n/locales/ja.ts
+++ b/src/i18n/locales/ja.ts
@@ -76,8 +76,8 @@ export const ja: LanguageTranslation = {
            title: '複数のスキーマ',
            description:
                'このダイアグラムには{{schemasCount}}個のスキーマがあります。現在表示中: {{formattedSchemas}}。',
-            dont_show_again: '再表示しない',
-            change_schema: '変更',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'なし',
        },

--- a/src/i18n/locales/ko_KR.ts
+++ b/src/i18n/locales/ko_KR.ts
@@ -74,8 +74,8 @@ export const ko_KR: LanguageTranslation = {
            title: '다중 스키마',
            description:
                '현재 다이어그램에 {{schemasCount}}개의 스키마가 있습니다. Currently displaying: {{formattedSchemas}}.',
-            dont_show_again: '다시 보여주지 마세요',
-            change_schema: '변경',
+            // TODO: Translate
+            show_me: 'Show me',
            none: '없음',
        },

--- a/src/i18n/locales/mr.ts
+++ b/src/i18n/locales/mr.ts
@@ -75,8 +75,8 @@ export const mr: LanguageTranslation = {
            title: 'एकाधिक स्कीमा',
            description:
                '{{schemasCount}} स्कीमा या आरेखात आहेत. सध्या दाखवत आहोत: {{formattedSchemas}}.',
-            dont_show_again: 'पुन्हा दाखवू नका',
-            change_schema: 'बदला',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'काहीही नाही',
        },

--- a/src/i18n/locales/ne.ts
+++ b/src/i18n/locales/ne.ts
@@ -75,8 +75,8 @@ export const ne: LanguageTranslation = {
            title: 'विविध स्कीमहरू',
            description:
                '{{schemasCount}} डायाग्राममा स्कीमहरू। हालको रूपमा देखाइएको छ: {{formattedSchemas}}।',
-            dont_show_again: 'फेरि देखाउन नदिनुहोस्',
-            change_schema: 'स्कीम परिवर्तन गर्नुहोस्',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'कुनै पनि छैन',
        },

--- a/src/i18n/locales/pt_BR.ts
+++ b/src/i18n/locales/pt_BR.ts
@@ -75,8 +75,8 @@ export const pt_BR: LanguageTranslation = {
            title: 'Múltiplos Esquemas',
            description:
                '{{schemasCount}} esquemas neste diagrama. Atualmente exibindo: {{formattedSchemas}}.',
-            dont_show_again: 'Não mostrar novamente',
-            change_schema: 'Alterar',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'nenhum',
        },

--- a/src/i18n/locales/ru.ts
+++ b/src/i18n/locales/ru.ts
@@ -73,8 +73,8 @@ export const ru: LanguageTranslation = {
            title: 'Множественные схемы',
            description:
                '{{schemasCount}} схем в этой диаграмме. В данный момент отображается: {{formattedSchemas}}.',
-            dont_show_again: 'Больше не показывать',
-            change_schema: 'Изменить',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'никто',
        },

--- a/src/i18n/locales/te.ts
+++ b/src/i18n/locales/te.ts
@@ -75,8 +75,8 @@ export const te: LanguageTranslation = {
            title: 'బహుళ స్కీమాలు',
            description:
                '{{schemasCount}} స్కీమాలు ఈ చిత్రంలో ఉన్నాయి. ప్రస్తుత స్కీమాలు: {{formattedSchemas}}.',
-            dont_show_again: 'మరలా చూపించవద్దు',
-            change_schema: 'మార్చు',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'ఎదరికాదు',
        },

--- a/src/i18n/locales/tr.ts
+++ b/src/i18n/locales/tr.ts
@@ -75,8 +75,8 @@ export const tr: LanguageTranslation = {
            title: 'Birden Fazla Şema',
            description:
                'Bu diyagramda {{schemasCount}} şema var. Şu anda görüntülenen: {{formattedSchemas}}.',
-            dont_show_again: 'Tekrar gösterme',
-            change_schema: 'Değiştir',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'yok',
        },

--- a/src/i18n/locales/uk.ts
+++ b/src/i18n/locales/uk.ts
@@ -73,8 +73,8 @@ export const uk: LanguageTranslation = {
            title: 'Кілька схем',
            description:
                '{{schemasCount}} схеми на цій діаграмі. Зараз відображається: {{formattedSchemas}}.',
-            dont_show_again: 'Більше не показувати',
-            change_schema: 'Зміна',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'немає',
        },

--- a/src/i18n/locales/vi.ts
+++ b/src/i18n/locales/vi.ts
@@ -74,8 +74,8 @@ export const vi: LanguageTranslation = {
            title: 'Có nhiều lược đồ',
            description:
                'Có {{schemasCount}} lược đồ trong sơ đồ này. Hiện đang hiển thị: {{formattedSchemas}}.',
-            dont_show_again: 'Không hiển thị lại',
-            change_schema: 'Thay đổi',
+            // TODO: Translate
+            show_me: 'Show me',
            none: 'không có',
        },

--- a/src/i18n/locales/zh_CN.ts
+++ b/src/i18n/locales/zh_CN.ts
@@ -71,8 +71,8 @@ export const zh_CN: LanguageTranslation = {
            title: '多个模式',
            description:
                '此关系图中有 {{schemasCount}} 个模式，当前显示：{{formattedSchemas}}。',
-            dont_show_again: '不再展示',
-            change_schema: '更改',
+            // TODO: Translate
+            show_me: 'Show me',
            none: '无',
        },

--- a/src/i18n/locales/zh_TW.ts
+++ b/src/i18n/locales/zh_TW.ts
@@ -71,8 +71,8 @@ export const zh_TW: LanguageTranslation = {
            title: '多重 Schema',
            description:
                '此圖表中包含 {{schemasCount}} 個 Schema，目前顯示：{{formattedSchemas}}。',
-            dont_show_again: '不再顯示',
-            change_schema: '變更',
+            // TODO: Translate
+            show_me: 'Show me',
            none: '無',
        },

--- a/src/pages/editor-page/editor-page.tsx
+++ b/src/pages/editor-page/editor-page.tsx
@@ -111,7 +111,7 @@ const EditorPageComponent: React.FC = () => {
                      .map((schema) => `'${schema?.name}'`)
                      .join(', ');
            toast({
-                duration: 5500,
+                duration: Infinity,
                title: t('multiple_schemas_alert.title'),
                description: t('multiple_schemas_alert.description', {
                    schemasCount: schemas.length,
@@ -119,23 +119,21 @@ const EditorPageComponent: React.FC = () => {
                }),
                variant: 'default',
                layout: 'column',
+                hideCloseButton: true,
                className:
                    'top-0 right-0 flex fixed md:max-w-[420px] md:top-4 md:right-4',
                action: (
                    <div className="flex justify-between gap-1">
+                        <div />
                        <ToastAction
-                            altText="Don't show this notification again"
-                            className="flex-nowrap"
-                            onClick={() => setHideMultiSchemaNotification(true)}
-                        >
-                            {t('multiple_schemas_alert.dont_show_again')}
-                        </ToastAction>
-                        <ToastAction
-                            onClick={() => handleChangeSchema()}
-                            altText="Change the schema"
+                            onClick={() => {
+                                handleChangeSchema();
+                                setHideMultiSchemaNotification(true);
+                            }}
+                            altText="Show me the schemas"
                            className="border border-pink-600 bg-pink-600 text-white hover:bg-pink-500"
                        >
-                            {t('multiple_schemas_alert.change_schema')}
+                            {t('multiple_schemas_alert.show_me')}
                        </ToastAction>
                    </div>
                ),