feat(demos): settings to redirect to demo's match page

ref #1056

src/node/settings/default-settings.ts

@@ -35,6 +35,7 @@ export const defaultSettings: Settings = {
     locale: 'en',
     theme: 'dark',
     initialPage: Page.Matches,
+    redirectDemoToMatch: false,
   },
   analyze: {
     analyzePositions: false,

src/node/settings/migrations/v6.ts

@@ -8,6 +8,7 @@ const v6: Migration = {
     settings.download.download5EPlayDemosInBackground = true;
     settings.video.showXRay = true;
     settings.video.playerVoicesEnabled = true;
+    settings.ui.redirectDemoToMatch = false;
 
     return Promise.resolve(settings);
   },

src/node/settings/settings.ts

@@ -33,6 +33,7 @@ type UISettings = {
   locale: string;
   theme: ThemeName;
   initialPage: Page;
+  redirectDemoToMatch: boolean;
 };
 
 type AnalyzeSettings = {

src/ui/changelog/changelog-dialog.tsx

@@ -93,6 +93,10 @@ export function ChangelogDialog() {
                 <Category>UI</Category> Comment columns are now sortable, and the comment is displayed in a tooltip when
                 the icon is hovered over.
               </li>
+              <li>
+                <Category>DEMOS</Category> Added a UI option to redirect to the match page (instead of the demo page)
+                when opening an analyzed demo. It's disabled by default.
+              </li>
               <li>
                 <Category>VIDEO</Category> Allow to set seconds before/after each kill/round to start/stop sequences
                 through a dialog.

src/ui/demos/table/demos-table-provider.tsx

@@ -23,6 +23,9 @@ import { useDemosState } from '../use-demos-state';
 import { useFetchDemos } from '../use-fetch-demos';
 import { useTableCommentWidgetVisibility } from 'csdm/ui/components/table/use-table-comment-widget-visibility';
 import { DemosTagsDialog } from './tags-dialog';
+import { useUiSettings } from 'csdm/ui/settings/ui/use-ui-settings';
+import { useIsDemoInDatabase } from 'csdm/ui/demo/use-is-demo-in-database';
+import { useNavigateToMatch } from 'csdm/ui/hooks/use-navigate-to-match';
 
 function getRowId(demo: Demo) {
   return demo.filePath;
@@ -37,10 +40,13 @@ type Props = {
 export function DemosTableProvider({ children }: Props) {
   const dispatch = useDispatch();
   const navigateToDemo = useNavigateToDemo();
+  const navigateToMatch = useNavigateToMatch();
   const demos = useDemos();
   const fuzzySearchText = useFuzzySearchText();
   const columns = useDemosColumns();
   const { showContextMenu } = useContextMenu();
+  const { redirectDemoToMatch } = useUiSettings();
+  const isDemoInDatabase = useIsDemoInDatabase();
   const selectedDemosPaths = useDemosState().selectedDemosPath;
   const status = useDemosStatus();
   const {
@@ -70,11 +76,15 @@ export function DemosTableProvider({ children }: Props) {
   };
 
   const handleNavigateToDemo = (demo: Demo, table: TableInstance<Demo>) => {
-    navigateToDemo(demo.filePath, {
-      state: {
-        siblingDemoPaths: table.getRowIds(),
-      },
-    });
+    if (redirectDemoToMatch && isDemoInDatabase(demo.checksum)) {
+      navigateToMatch(demo.checksum);
+    } else {
+      navigateToDemo(demo.filePath, {
+        state: {
+          siblingDemoPaths: table.getRowIds(),
+        },
+      });
+    }
   };
 
   const onKeyDown = (event: KeyboardEvent, table: TableInstance<Demo>) => {

src/ui/settings/ui/redirect-demo-to-match.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import { Trans } from '@lingui/react/macro';
+import { Switch } from 'csdm/ui/components/inputs/switch';
+import { SettingsEntry } from 'csdm/ui/settings/settings-entry';
+import { useUpdateSettings } from '../use-update-settings';
+import { useUiSettings } from './use-ui-settings';
+
+export function RedirectDemoToMatch() {
+  const { redirectDemoToMatch } = useUiSettings();
+  const updateSettings = useUpdateSettings();
+
+  const onChange = async (isChecked: boolean) => {
+    await updateSettings({
+      ui: {
+        redirectDemoToMatch: isChecked,
+      },
+    });
+  };
+
+  return (
+    <SettingsEntry
+      interactiveComponent={<Switch isChecked={redirectDemoToMatch} onChange={onChange} />}
+      description={<Trans>Navigate to the demo's match page when going to a analyzed demo page.</Trans>}
+      title={<Trans context="Settings title">Redirect demo to match</Trans>}
+    />
+  );
+}

src/ui/settings/ui/ui-settings.tsx

@@ -5,6 +5,7 @@ import { LanguageSelect } from 'csdm/ui/settings/ui/language-select';
 import { SystemStartupBehavior } from './system-startup-behavior';
 import { ResetTablesState } from './reset-tables-state';
 import { InitialPageSelect } from './initial-page-select';
+import { RedirectDemoToMatch } from './redirect-demo-to-match';
 
 export function UiSettings() {
   return (
@@ -13,6 +14,7 @@ export function UiSettings() {
       <LanguageSelect />
       <SystemStartupBehavior />
       <InitialPageSelect />
+      <RedirectDemoToMatch />
       <ResetTablesState />
     </SettingsView>
   );

src/ui/translations/de/messages.po

@@ -7325,6 +7325,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr ""
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr ""
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr ""
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"

src/ui/translations/en/messages.po

@@ -7324,6 +7324,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr "Language"
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr "Navigate to the demo's match page when going to a analyzed demo page."
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr "Redirect demo to match"
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"

src/ui/translations/es/messages.po

@@ -7325,6 +7325,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr ""
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr ""
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr ""
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"

src/ui/translations/fr/messages.po

@@ -7325,6 +7325,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr "Langue"
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr ""
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr ""
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"

src/ui/translations/pt-BR/messages.po

@@ -7325,6 +7325,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr "Idioma"
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr ""
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr ""
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"

src/ui/translations/zh-CN/messages.po

@@ -7325,6 +7325,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr "语言"
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr ""
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr ""
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"

src/ui/translations/zh-TW/messages.po

@@ -7325,6 +7325,15 @@ msgctxt "Settings title"
 msgid "Language"
 msgstr ""
 
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgid "Navigate to the demo's match page when going to a analyzed demo page."
+msgstr ""
+
+#: src/ui/settings/ui/redirect-demo-to-match.tsx
+msgctxt "Settings title"
+msgid "Redirect demo to match"
+msgstr ""
+
 #. Reset tables (columns order, visibility…)
 #: src/ui/settings/ui/reset-tables-state.tsx
 msgctxt "Button"