Add setting to hide minimap

src/common/settings/migration.ts

@@ -5,7 +5,7 @@ export interface ReadonlyStorage {
     getItem(key: string): string | null;
 }
 
-export const migrateOldStorageSettings = (settings: ReadonlyStorage): ChainnerSettings => {
+export const migrateOldStorageSettings = (settings: ReadonlyStorage): Partial<ChainnerSettings> => {
     const get = <T>(key: string, defaultValue: T): T => {
         const stored = settings.getItem(key);
         if (stored === null) {

src/common/settings/settings.ts

@@ -12,6 +12,7 @@ export interface ChainnerSettings {
     snapToGrid: boolean;
     snapToGridAmount: number;
     viewportExportPadding: number;
+    showMinimap: boolean;
 
     experimentalFeatures: boolean;
     hardwareAcceleration: boolean;
@@ -38,6 +39,7 @@ export const defaultSettings: Readonly<ChainnerSettings> = {
     snapToGrid: false,
     snapToGridAmount: 16,
     viewportExportPadding: 20,
+    showMinimap: true,
 
     experimentalFeatures: false,
     hardwareAcceleration: false,

src/main/setting-storage.ts

@@ -2,7 +2,7 @@ import { existsSync, readFileSync, renameSync, writeFileSync } from 'fs';
 import { LocalStorage } from 'node-localstorage';
 import path from 'path';
 import { migrateOldStorageSettings } from '../common/settings/migration';
-import { ChainnerSettings } from '../common/settings/settings';
+import { ChainnerSettings, defaultSettings } from '../common/settings/settings';
 import { getRootDirSync } from './platform';
 
 const settingsJson = path.join(getRootDirSync(), 'settings.json');
@@ -20,10 +20,14 @@ export const readSettings = (): ChainnerSettings => {
     // legacy settings
     const storagePath = path.join(getRootDirSync(), 'settings');
     const storage = new LocalStorage(storagePath);
-    const settings = migrateOldStorageSettings({
+    const partialSettings = migrateOldStorageSettings({
         keys: Array.from({ length: storage.length }, (_, i) => storage.key(i)),
         getItem: (key: string) => storage.getItem(key),
     });
+    const settings: ChainnerSettings = {
+        ...defaultSettings,
+        ...partialSettings,
+    };
 
     // write a new settings.json we'll use form now on
     writeSettings(settings);

src/renderer/components/ReactFlowBox.tsx

@@ -76,7 +76,7 @@ export const ReactFlowBox = memo(({ wrapperRef, nodeTypes, edgeTypes }: ReactFlo
     } = useContext(GlobalContext);
     const { schemata, functionDefinitions } = useContext(BackendContext);
 
-    const { snapToGrid: isSnapToGrid, snapToGridAmount, animateChain } = useSettings();
+    const { snapToGrid: isSnapToGrid, snapToGridAmount, animateChain, showMinimap } = useSettings();
 
     const typeState = useContextSelector(GlobalVolatileContext, (c) => c.typeState);
     const chainLineage = useContextSelector(GlobalVolatileContext, (c) => c.chainLineage);
@@ -511,12 +511,14 @@ export const ReactFlowBox = memo(({ wrapperRef, nodeTypes, edgeTypes }: ReactFlo
                     size={1}
                     variant={BackgroundVariant.Dots}
                 />
-                <MiniMap
-                    pannable
-                    zoomable
-                    ariaLabel=""
-                    zoomStep={3}
-                />
+                {showMinimap && (
+                    <MiniMap
+                        pannable
+                        zoomable
+                        ariaLabel=""
+                        zoomStep={3}
+                    />
+                )}
                 <Controls>
                     <ControlButton
                         disabled={nodes.length === 0}

src/renderer/components/SettingsModal.tsx

@@ -46,6 +46,7 @@ const AppearanceSettings = memo(() => {
         useMutSetting('viewportExportPadding');
     const [snapToGrid, setSnapToGrid] = useMutSetting('snapToGrid');
     const [snapToGridAmount, setSnapToGridAmount] = useMutSetting('snapToGridAmount');
+    const [showMinimap, setShowMinimap] = useMutSetting('showMinimap');
 
     return (
         <VStack
@@ -76,6 +77,16 @@ const AppearanceSettings = memo(() => {
                 value={animateChain}
             />
 
+            <ToggleSetting
+                setValue={setShowMinimap}
+                setting={{
+                    label: 'Minimap',
+                    description:
+                        'Enable a minimap of the current chain in the bottom right corner of the node editor.',
+                }}
+                value={showMinimap}
+            />
+
             <ToggleSetting
                 setValue={setSnapToGrid}
                 setting={{