chore: release version v1.12.3

feat(Map): Prettify user settings

CHANGELOG.md

@@ -2,7 +2,73 @@
 
 <!-- changelog -->
 
-## [v1.6.0](https://github.com/wanderer-industries/wanderer/compare/v1.5.0...v1.6.0) (2024-10-13)
+## [v1.12.3](https://github.com/wanderer-industries/wanderer/compare/v1.12.2...v1.12.3) (2024-10-18)
+
+
+
+
+### Bug Fixes:
+
+* Map: Fix regression issues
+
+## [v1.12.2](https://github.com/wanderer-industries/wanderer/compare/v1.12.1...v1.12.2) (2024-10-16)
+
+
+
+
+## [v1.12.1](https://github.com/wanderer-industries/wanderer/compare/v1.12.0...v1.12.1) (2024-10-16)
+
+
+
+
+### Bug Fixes:
+
+* Map: Fix system add error after map page refresh
+
+## [v1.12.0](https://github.com/wanderer-industries/wanderer/compare/v1.11.5...v1.12.0) (2024-10-16)
+
+
+
+
+### Features:
+
+* Map: Prettify user settings
+
+## [v1.11.5](https://github.com/wanderer-industries/wanderer/compare/v1.11.4...v1.11.5) (2024-10-16)
+
+
+
+
+## [v1.11.4](https://github.com/wanderer-industries/wanderer/compare/v1.11.3...v1.11.4) (2024-10-16)
+
+
+
+
+## [v1.11.3](https://github.com/wanderer-industries/wanderer/compare/v1.11.2...v1.11.3) (2024-10-16)
+
+
+
+
+## [v1.11.2](https://github.com/wanderer-industries/wanderer/compare/v1.11.1...v1.11.2) (2024-10-15)
+
+
+
+
+## [v1.11.1](https://github.com/wanderer-industries/wanderer/compare/v1.11.0...v1.11.1) (2024-10-14)
+
+
+
+
+## [v1.11.0](https://github.com/wanderer-industries/wanderer/compare/v1.10.0...v1.11.0) (2024-10-14)
+
+
+
+
+### Features:
+
+* Map: Add map level option to store custom labels
+
+## [v1.10.0](https://github.com/wanderer-industries/wanderer/compare/v1.9.0...v1.10.0) (2024-10-13)
 
 
 
@@ -16,15 +82,6 @@
 
 
 
-### Features:
-
-* Map: Follow Character on Map and auto select their current system
-
-## [v1.4.0](https://github.com/wanderer-industries/wanderer/compare/v1.3.6...v1.4.0) (2024-10-11)
-
-
-
-
 ### Features:
 
 * Map: Follow Character on Map and auto select their current system
@@ -38,35 +95,6 @@
 
 * Signatures: Signatures update fixes
 
-## [v1.3.5](https://github.com/wanderer-industries/wanderer/compare/v1.3.4...v1.3.5) (2024-10-09)
-
-
-
-
-### Bug Fixes:
-
-* Signatures: Signatures update fixes
-
-## [v1.3.4](https://github.com/wanderer-industries/wanderer/compare/v1.3.3...v1.3.4) (2024-10-09)
-
-
-
-
-## [v1.3.3](https://github.com/wanderer-industries/wanderer/compare/v1.3.2...v1.3.3) (2024-10-08)
-
-
-
-
-## [v1.3.2](https://github.com/wanderer-industries/wanderer/compare/v1.3.1...v1.3.2) (2024-10-07)
-
-
-
-
-## [v1.3.1](https://github.com/wanderer-industries/wanderer/compare/v1.3.0...v1.3.1) (2024-10-07)
-
-
-
-
 ## [v1.3.0](https://github.com/wanderer-industries/wanderer/compare/v1.2.10...v1.3.0) (2024-10-07)
 
 
@@ -80,26 +108,6 @@
 
 * Map: Revision of sorting from also adding ability to sort all columns
 
-## [v1.2.10](https://github.com/wanderer-industries/wanderer/compare/v1.2.9...v1.2.10) (2024-10-07)
-
-
-
-
-## [v1.2.9](https://github.com/wanderer-industries/wanderer/compare/v1.2.8...v1.2.9) (2024-10-07)
-
-
-
-
-## [v1.2.8](https://github.com/wanderer-industries/wanderer/compare/v1.2.7...v1.2.8) (2024-10-06)
-
-
-
-
-## [v1.2.7](https://github.com/wanderer-industries/wanderer/compare/v1.2.6...v1.2.7) (2024-10-05)
-
-
-
-
 ## [v1.2.6](https://github.com/wanderer-industries/wanderer/compare/v1.2.5...v1.2.6) (2024-10-05)
 
 
@@ -136,11 +144,6 @@
 
 * Map: Fix map loading after select a different map.
 
-## [v1.2.2](https://github.com/wanderer-industries/wanderer/compare/v1.2.1...v1.2.2) (2024-10-02)
-
-
-
-
 ## [v1.2.1](https://github.com/wanderer-industries/wanderer/compare/v1.2.0...v1.2.1) (2024-10-02)
 
 
@@ -257,20 +260,10 @@
 
 * docker: Fix DB connection in docker-compose internal network
 
-## [v1.0.7](https://github.com/wanderer-industries/wanderer/compare/v1.0.6...v1.0.7) (2024-09-19)
-
-## [v1.0.6](https://github.com/wanderer-industries/wanderer/compare/v1.0.5...v1.0.6) (2024-09-18)
-
-## [v1.0.5](https://github.com/wanderer-industries/wanderer/compare/v1.0.4...v1.0.5) (2024-09-18)
-
 ## [v1.0.4](https://github.com/wanderer-industries/wanderer/compare/v1.0.3...v1.0.4) (2024-09-18)
 
 ### Bug Fixes
 
 * core: skip search results for failed character info request
 
-## [v1.0.3](https://github.com/wanderer-industries/wanderer/compare/v1.0.2...v1.0.3) (2024-09-18)
-
-## [v1.0.2](https://github.com/wanderer-industries/wanderer/compare/v1.0.1...v1.0.2) (2024-09-18)
-
 ## [v1.0.1](https://github.com/wanderer-industries/wanderer/compare/v1.0.0...v1.0.1) (2024-09-18)

assets/js/hooks/Mapper/common-styles/prime-fixes/fix-dialog.scss

@@ -1,5 +1,5 @@
 /* Основной класс диалога */
-.p-dialog {
+body .p-dialog {
   display: flex;
   flex-direction: column;
   //position: absolute;
@@ -7,11 +7,26 @@
   left: 0;
   //visibility: hidden;
   overflow: hidden;
-  border-radius: 6px;
+  border-radius: 2px;
   box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2);
   transition: box-shadow 0.3s;
-  background: #fff;
   z-index: 1000;
+  border: 1px solid #212121;
+  background: var(--surface-h);
+  color: var(--text-color);
+
+  .p-dialog-header {
+    background: #171717 !important;
+    color: var(--text-color);
+
+    .p-dialog-header-icon:focus-visible {
+      box-shadow: none !important;
+    }
+  }
+
+  .p-dialog-footer {
+    border-top: 1px solid var(--surface-d);
+  }
 }
 
 /* Стиль видимого диалога */
@@ -45,12 +60,12 @@
   justify-content: space-between;
   padding: 1rem;
   background: #f4f4f4;
-  border-bottom: 1px solid #ddd;
+  //border-bottom: 1px solid #ddd;
 }
 
 /* Содержимое диалога */
 .p-dialog-content {
-  padding: 1rem;
+  padding: 0.5rem;
   overflow-y: auto;
   flex: 1;
 }
@@ -78,23 +93,3 @@
 .p-dialog-header-close .pi {
   font-size: 1.25rem;
 }
-
-/* Тема Saga Blue (пример) */
-body .p-dialog {
-  background: var(--surface-a);
-  color: var(--text-color);
-}
-
-body .p-dialog .p-dialog-header,
-body .p-dialog .p-dialog-footer {
-  background: var(--surface-b);
-  color: var(--text-color);
-}
-
-body .p-dialog .p-dialog-header {
-  border-bottom: 1px solid var(--surface-d);
-}
-
-body .p-dialog .p-dialog-footer {
-  border-top: 1px solid var(--surface-d);
-}

assets/js/hooks/Mapper/common-styles/prime-fixes/theme.scss

@@ -9,6 +9,7 @@
   --surface-d: #3f4b5b;
   --surface-e: #2a323d;
   --surface-f: #2a323d;
+  --surface-h: #171717;
   --text-color: rgba(255, 255, 255, 0.87);
   --text-color-secondary: rgba(255, 255, 255, 0.6);
   --primary-color: #8dd0ff;

assets/js/hooks/Mapper/components/contexts/ContextMenuSystem/hooks/useLabelsMenu/useLabelsMenu.ts

@@ -46,7 +46,7 @@ export const useLabelsMenu = (
     }
 
     // const labels = getLabels(system.labels);
-    const hasLabels = labels.list.length > 0;
+    const hasLabels = labels?.list?.length > 0;
     const statusList = hasLabels ? LABELS_ORDER : LABELS_ORDER.slice(1);
 
     return [

assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.tsx

@@ -29,7 +29,7 @@ const SpaceToClass: Record<string, string> = {
 };
 
 const sortedLabels = (labels: string[]) => {
-  if (labels === null) {
+  if (!labels) {
     return [];
   }
 

assets/js/hooks/Mapper/components/map/hooks/api/useCenterSystem.ts

@@ -1,18 +1,18 @@
 import { useReactFlow } from 'reactflow';
-import { useCallback } from 'react';
+import { useCallback, useRef } from 'react';
 import { CommandCenterSystem } from '@/hooks/Mapper/types';
 
 export const useCenterSystem = () => {
   const rf = useReactFlow();
 
+  const ref = useRef({ rf });
+  ref.current = { rf };
+
   return useCallback((systemId: CommandCenterSystem) => {
-    if (!rf) {
-      return;
-    }
-    const systemNode = rf.getNodes().find(x => x.data.id === systemId);
+    const systemNode = ref.current.rf.getNodes().find(x => x.data.id === systemId);
     if (!systemNode) {
       return;
     }
-    rf.setCenter(systemNode.position.x, systemNode.position.y, { duration: 1000 });
+    ref.current.rf.setCenter(systemNode.position.x, systemNode.position.y, { duration: 1000 });
   }, []);
 };

assets/js/hooks/Mapper/components/map/hooks/api/useSelectSystem.ts

@@ -1,15 +1,15 @@
 import { useReactFlow } from 'reactflow';
-import { useCallback } from 'react';
+import { useCallback, useRef } from 'react';
 import { CommandSelectSystem } from '@/hooks/Mapper/types';
 
 export const useSelectSystem = () => {
   const rf = useReactFlow();
 
+  const ref = useRef({ rf });
+  ref.current = { rf };
+
   return useCallback((systemId: CommandSelectSystem) => {
-    if (!rf) {
-      return;
-    }
-    rf.setNodes(nds =>
+    ref.current.rf.setNodes(nds =>
       nds.map(node => {
         return {
           ...node,

assets/js/hooks/Mapper/components/mapInterface/components/SystemCustomLabelDialog/SystemCustomLabelDialog.tsx

@@ -7,7 +7,7 @@ import { Button } from 'primereact/button';
 import { OutCommand } from '@/hooks/Mapper/types';
 import { IconField } from 'primereact/iconfield';
 import { LabelsManager } from '@/hooks/Mapper/utils/labelsManager.ts';
-import { WdImageSize, WdImgButton } from '@/hooks/Mapper/components/ui-kit';
+import { WdImageSize, WdImgButton, TooltipPosition } from '@/hooks/Mapper/components/ui-kit';
 
 interface SystemCustomLabelDialog {
   systemId: string;
@@ -79,14 +79,14 @@ export const SystemCustomLabelDialog = ({ systemId, visible, setVisible }: Syste
 
   // @ts-ignore
   const handleInput = useCallback(e => {
-    e.target.value = e.target.value.toUpperCase().replace(/[^A-Z0-9]/g, '');
+    e.target.value = e.target.value.toUpperCase().replace(/[^A-Z0-9[\](){}]/g, '');
   }, []);
 
   return (
     <Dialog
       header="Edit label"
       visible={visible}
-      draggable={false}
+      draggable={true}
       style={{ width: '250px' }}
       onHide={onHide}
       onShow={onShow}
@@ -100,9 +100,13 @@ export const SystemCustomLabelDialog = ({ systemId, visible, setVisible }: Syste
               <IconField>
                 {label !== '' && (
                   <WdImgButton
-                    className="pi pi-trash p-input-icon"
+                    className="pi pi-trash text-red-400"
                     textSize={WdImageSize.large}
-                    tooltip={{ content: 'Reset label' }}
+                    tooltip={{
+                      content: 'Remove custom label',
+                      className: 'pi p-input-icon',
+                      position: TooltipPosition.top,
+                    }}
                     onClick={handleReset}
                   />
                 )}
@@ -111,7 +115,7 @@ export const SystemCustomLabelDialog = ({ systemId, visible, setVisible }: Syste
                   aria-describedby="username-help"
                   autoComplete="off"
                   value={label}
-                  maxLength={3}
+                  maxLength={5}
                   onChange={e => setLabel(e.target.value)}
                   // @ts-expect-error
                   ref={inputRef}

assets/js/hooks/Mapper/components/mapInterface/components/SystemLinkSignatureDialog/SystemLinkSignatureDialog.tsx

@@ -21,8 +21,6 @@ const signatureSettings: Setting[] = [{ key: COSMIC_SIGNATURE, name: 'Show Cosmi
 export const SystemLinkSignatureDialog = ({ data, setVisible }: SystemLinkSignatureDialogProps) => {
   const { outCommand } = useMapRootState();
 
-  console.log(data);
-
   const ref = useRef({ outCommand });
   ref.current = { outCommand };
 
@@ -31,8 +29,8 @@ export const SystemLinkSignatureDialog = ({ data, setVisible }: SystemLinkSignat
   }, [setVisible]);
 
   const handleSelect = useCallback(
-    (signatures: SystemSignature[]) => {
-      if (!signatures.length) {
+    (signature: SystemSignature) => {
+      if (!signature) {
         return;
       }
 
@@ -42,12 +40,12 @@ export const SystemLinkSignatureDialog = ({ data, setVisible }: SystemLinkSignat
         type: OutCommand.linkSignatureToSystem,
         data: {
           ...data,
-          signature_eve_id: signatures[0].eve_id,
+          signature_eve_id: signature.eve_id,
         },
       });
       setVisible(false);
     },
-    [setVisible],
+    [data, setVisible],
   );
 
   return (

assets/js/hooks/Mapper/components/mapInterface/components/SystemSettingsDialog/SystemSettingsDialog.tsx

@@ -90,7 +90,7 @@ export const SystemSettingsDialog = ({ systemId, visible, setVisible }: SystemSe
   }, []);
 
   const handleInput = useCallback((e: any) => {
-    e.target.value = e.target.value.toUpperCase().replace(/[^A-Z0-9]/g, '');
+    e.target.value = e.target.value.toUpperCase().replace(/[^A-Z0-9[\](){}]/g, '');
   }, []);
 
   return (
@@ -160,7 +160,7 @@ export const SystemSettingsDialog = ({ systemId, visible, setVisible }: SystemSe
                   aria-describedby="label"
                   autoComplete="off"
                   value={label}
-                  maxLength={3}
+                  maxLength={5}
                   onChange={e => setLabel(e.target.value)}
                   onInput={handleInput}
                 />

assets/js/hooks/Mapper/components/mapInterface/widgets/SystemSignatures/SystemSignaturesContent/SystemSignaturesContent.tsx

@@ -43,7 +43,7 @@ interface SystemSignaturesContentProps {
   systemId: string;
   settings: Setting[];
   selectable?: boolean;
-  onSelect?: (signatures: SystemSignature[]) => void;
+  onSelect?: (signature: SystemSignature) => void;
 }
 export const SystemSignaturesContent = ({ systemId, settings, selectable, onSelect }: SystemSignaturesContentProps) => {
   const { outCommand } = useMapRootState();
@@ -163,10 +163,16 @@ export const SystemSignaturesContent = ({ systemId, settings, selectable, onSele
     setAskUser(false);
   }, [parsedSignatures, handleUpdateSignatures]);
 
-  const handleSelectSignatures = useCallback(e => {
-    setSelectedSignatures(e.value);
-    onSelect?.(e.value);
-  }, []);
+  const handleSelectSignatures = useCallback(
+    e => {
+      if (selectable) {
+        onSelect?.(e.value);
+      } else {
+        setSelectedSignatures(e.value);
+      }
+    },
+    [onSelect, selectable],
+  );
 
   useHotkey(true, ['a'], handleSelectAll);
 
@@ -255,7 +261,7 @@ export const SystemSignaturesContent = ({ systemId, settings, selectable, onSele
               className={classes.Table}
               value={filteredSignatures}
               size="small"
-              // selectionMode={selectable ? 'multiple' : 'single'}
+              selectionMode={selectable ? 'single' : 'multiple'}
               selection={selectedSignatures}
               metaKeySelection
               onSelectionChange={handleSelectSignatures}
@@ -312,17 +318,16 @@ export const SystemSignaturesContent = ({ systemId, settings, selectable, onSele
                 hidden={compact || medium}
                 sortable
               ></Column>
-              {!selectable && (
-                <Column
-                  field="linked_system"
-                  header="Linked System"
-                  bodyClassName="text-ellipsis overflow-hidden whitespace-nowrap"
-                  body={renderLinkedSystem}
-                  style={{ maxWidth: nameColumnWidth }}
-                  hidden={compact}
-                  sortable
-                ></Column>
-              )}
+              <Column
+                field="linked_system"
+                header="Leads To"
+                headerClassName="whitespace-nowrap"
+                bodyClassName="text-ellipsis overflow-hidden whitespace-nowrap"
+                body={renderLinkedSystem}
+                style={{ maxWidth: nameColumnWidth }}
+                hidden={compact}
+                sortable
+              ></Column>
 
               <Column
                 field="updated_at"
@@ -360,7 +365,7 @@ export const SystemSignaturesContent = ({ systemId, settings, selectable, onSele
                   </button>
                   <button className="p-button p-component p-button-outlined p-button-sm btn-wide">
                     <span className="p-button-label p-c" onClick={handleReplaceAll}>
-                      Update & Delete
+                      Update & Delete missing
                     </span>
                   </button>
                 </div>

assets/js/hooks/Mapper/components/mapRootContent/MapRootContent.tsx

@@ -7,6 +7,7 @@ import { useCallback, useState } from 'react';
 import { OnTheMap, RightBar } from '@/hooks/Mapper/components/mapRootContent/components';
 import { MapContextMenu } from '@/hooks/Mapper/components/mapRootContent/components/MapContextMenu/MapContextMenu.tsx';
 import { useSkipContextMenu } from '@/hooks/Mapper/hooks/useSkipContextMenu';
+import { MapSettings } from "@/hooks/Mapper/components/mapRootContent/components/MapSettings";
 
 export interface MapRootContentProps {}
 
@@ -16,9 +17,11 @@ export const MapRootContent = ({}: MapRootContentProps) => {
   const { isShowMenu } = interfaceSettings;
 
   const [showOnTheMap, setShowOnTheMap] = useState(false);
+  const [showMapSettings, setShowMapSettings] = useState(false);
   const mapInterface = <MapInterface />;
 
   const handleShowOnTheMap = useCallback(() => setShowOnTheMap(true), []);
+  const handleShowMapSettings = useCallback(() => setShowMapSettings(true), []);
 
   useSkipContextMenu();
 
@@ -31,18 +34,19 @@ export const MapRootContent = ({}: MapRootContentProps) => {
             {mapInterface}
           </div>
           <div className="absolute top-0 right-0 w-14 h-[calc(100%+3.5rem)] pointer-events-auto">
-            <RightBar onShowOnTheMap={handleShowOnTheMap} />
+            <RightBar onShowOnTheMap={handleShowOnTheMap} onShowMapSettings={handleShowMapSettings} />
           </div>
         </div>
       ) : (
         <div className="absolute top-0 left-14 w-[calc(100%-3.5rem)] h-[calc(100%-3.5rem)] pointer-events-none">
           <Topbar>
-            <MapContextMenu onShowOnTheMap={handleShowOnTheMap} />
+            <MapContextMenu onShowOnTheMap={handleShowOnTheMap} onShowMapSettings={handleShowMapSettings} />
           </Topbar>
           {mapInterface}
         </div>
       )}
       <OnTheMap show={showOnTheMap} onHide={() => setShowOnTheMap(false)} />
+      <MapSettings show={showMapSettings} onHide={() => setShowMapSettings(false)} />
     </Layout>
   );
 };

assets/js/hooks/Mapper/components/mapRootContent/components/MapContextMenu/MapContextMenu.tsx

@@ -8,10 +8,11 @@ import { MenuItem } from 'primereact/menuitem';
 
 export interface MapContextMenuProps {
   onShowOnTheMap?: () => void;
+  onShowMapSettings?: () => void;
 }
 
-export const MapContextMenu = ({ onShowOnTheMap }: MapContextMenuProps) => {
-  const { outCommand, interfaceSettings, setInterfaceSettings } = useMapRootState();
+export const MapContextMenu = ({ onShowOnTheMap, onShowMapSettings }: MapContextMenuProps) => {
+  const { outCommand, setInterfaceSettings } = useMapRootState();
 
   const menuRight = useRef<Menu>(null);
 
@@ -22,13 +23,6 @@ export const MapContextMenu = ({ onShowOnTheMap }: MapContextMenuProps) => {
     });
   }, [outCommand]);
 
-  const toggleMinimap = useCallback(() => {
-    setInterfaceSettings(x => ({
-      ...x,
-      isShowMinimap: !x.isShowMinimap,
-    }));
-  }, [setInterfaceSettings]);
-
   const items = useMemo(() => {
     return [
       {
@@ -43,9 +37,9 @@ export const MapContextMenu = ({ onShowOnTheMap }: MapContextMenuProps) => {
       },
       { separator: true },
       {
-        label: interfaceSettings.isShowMinimap ? 'Hide minimap' : 'Show minimap',
-        icon: `pi ${interfaceSettings.isShowMinimap ? 'pi-eye-slash' : 'pi-eye'}`,
-        command: toggleMinimap,
+        label: 'Settings',
+        icon: `pi pi-cog`,
+        command: onShowMapSettings,
       },
       {
         label: 'Dock menu',
@@ -57,7 +51,7 @@ export const MapContextMenu = ({ onShowOnTheMap }: MapContextMenuProps) => {
           })),
       },
     ] as MenuItem[];
-  }, [handleAddCharacter, interfaceSettings.isShowMinimap, onShowOnTheMap, setInterfaceSettings, toggleMinimap]);
+  }, [handleAddCharacter, onShowMapSettings, onShowOnTheMap, setInterfaceSettings]);
 
   return (
     <div className="ml-1">

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/MapSettings.module.scss

@@ -0,0 +1,127 @@
+.verticalTabsContainer {
+  display: flex;
+  width: 100%;
+  min-height: 300px;
+
+  :global {
+    .p-tabview {
+      width: 100%;
+      display: flex;
+      align-items: flex-start;
+    }
+
+    .p-tabview-panels {
+      padding: 6px 1rem !important;
+      flex-grow: 1;
+    }
+
+    .p-tabview-nav-container {
+      border-right: none;
+      height: 100%;
+    }
+
+    .p-tabview-nav {
+      flex-direction: column;
+      width: 150px;
+      min-height: 100%;
+      border: none;
+
+      li {
+        width: 100%;
+        border-right: 4px solid var(--surface-hover);
+        background-color: var(--surface-card);
+
+        transition: background-color 200ms, border-right-color 200ms;
+
+        &:hover {
+          background-color: var(--surface-hover);
+          border-right: 4px solid var(--surface-100);
+        }
+
+        .p-tabview-nav-link {
+          transition: color 200ms;
+
+          justify-content: flex-end;
+          padding: 10px;
+          //background-color: var(--surface-card);
+          background-color: initial;
+          border: none;
+          color: var(--gray-400);
+
+          border-radius: initial;
+          font-weight: 400;
+          margin: 0;
+        }
+
+        &.p-tabview-selected {
+          background-color: var(--surface-50);
+          border-right: 4px solid var(--primary-color);
+
+          .p-tabview-nav-link {
+            font-weight: 600;
+            color: var(--primary-color);
+          }
+
+          &:hover {
+            //background-color: var(--surface-hover);
+            border-right: 4px solid var(--primary-color);
+          }
+
+        }
+      }
+    }
+
+    .p-tabview-panel {
+      flex-grow: 1;
+    }
+  }
+}
+
+
+.CheckboxContainer {
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+  align-items: center;
+
+  & > span:nth-child(1) {
+    color: var(--gray-200);
+    font-size: 13px;
+  }
+
+  & > :nth-child(2){
+    border-bottom: 2px dotted #3f3f3f;
+    height: 2px;
+    margin: 0 12px;
+  }
+}
+
+/* Уменьшение размеров InputSwitch с использованием глобальных стилей */
+.smallInputSwitch {
+  height: 100%;
+  display: flex;
+  align-items: center;
+
+  :global {
+    .p-inputswitch {
+      height: 1rem;
+      width: 2rem;
+      &.p-inputswitch-checked {
+        .p-inputswitch-slider::before {
+          transform: translateX(1rem);
+        }
+      }
+
+      &.p-highlight .p-inputswitch-slider:before {
+        transform: translateX(1rem);
+      }
+
+      .p-inputswitch-slider::before {
+        width: 0.8rem;
+        height: 0.8rem;
+        margin-top: -0.4rem;
+        margin-left: -3px;
+      }
+    }
+  }
+
+}

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/MapSettings.tsx

@@ -0,0 +1,167 @@
+import styles from './MapSettings.module.scss';
+import { Dialog } from 'primereact/dialog';
+import { useCallback, useMemo, useState } from 'react';
+import { TabPanel, TabView } from 'primereact/tabview';
+import { PrettySwitchbox } from './components';
+import { InterfaceStoredSettings, InterfaceStoredSettingsProps, useMapRootState } from '@/hooks/Mapper/mapRootProvider';
+import { OutCommand } from '@/hooks/Mapper/types';
+
+export enum UserSettingsRemoteProps {
+  link_signature_on_splash = 'link_signature_on_splash',
+  select_on_spash = 'select_on_spash',
+}
+
+export const DEFAULT_REMOTE_SETTINGS = {
+  [UserSettingsRemoteProps.link_signature_on_splash]: false,
+  [UserSettingsRemoteProps.select_on_spash]: false,
+};
+
+export const UserSettingsRemoteList = [
+  UserSettingsRemoteProps.link_signature_on_splash,
+  UserSettingsRemoteProps.select_on_spash,
+];
+
+export type UserSettingsRemote = {
+  link_signature_on_splash: boolean;
+  select_on_spash: boolean;
+};
+
+export type UserSettings = UserSettingsRemote & InterfaceStoredSettings;
+
+export interface MapSettingsProps {
+  show: boolean;
+  onHide: () => void;
+}
+
+type CheckboxesList = {
+  prop: keyof UserSettings;
+  label: string;
+}[];
+
+const COMMON_CHECKBOXES_PROPS: CheckboxesList = [
+  { prop: InterfaceStoredSettingsProps.isShowMinimap, label: 'Show Minimap' },
+];
+
+const SYSTEMS_CHECKBOXES_PROPS: CheckboxesList = [
+  { prop: InterfaceStoredSettingsProps.isShowKSpace, label: 'Highlight Low/High-security systems' },
+  { prop: UserSettingsRemoteProps.select_on_spash, label: 'Auto-select splashed' },
+];
+
+const SIGNATURES_CHECKBOXES_PROPS: CheckboxesList = [
+  { prop: UserSettingsRemoteProps.link_signature_on_splash, label: 'Link signature on splash' },
+];
+
+const UI_CHECKBOXES_PROPS: CheckboxesList = [
+  { prop: InterfaceStoredSettingsProps.isShowMenu, label: 'Enable compact map menu bar' },
+];
+
+export const MapSettings = ({ show, onHide }: MapSettingsProps) => {
+  const [activeIndex, setActiveIndex] = useState(0);
+  const { outCommand, interfaceSettings, setInterfaceSettings } = useMapRootState();
+  const [userRemoteSettings, setUserRemoteSettings] = useState<UserSettingsRemote>({ ...DEFAULT_REMOTE_SETTINGS });
+
+  const mergedSettings = useMemo(() => {
+    return {
+      ...interfaceSettings,
+      ...userRemoteSettings,
+    };
+  }, [userRemoteSettings, interfaceSettings]);
+
+  const handleShow = async () => {
+    const { user_settings } = await outCommand({
+      type: OutCommand.getUserSettings,
+      data: null,
+    });
+
+    setUserRemoteSettings({
+      ...user_settings,
+    });
+  };
+
+  const handleChangeChecked = useCallback(
+    (prop: keyof UserSettings) => async (checked: boolean) => {
+      // @ts-ignore
+      if (UserSettingsRemoteList.includes(prop)) {
+        const newRemoteSettings = {
+          ...userRemoteSettings,
+          [prop]: checked,
+        };
+
+        await outCommand({
+          type: OutCommand.updateUserSettings,
+          data: newRemoteSettings,
+        });
+
+        setUserRemoteSettings(newRemoteSettings);
+        return;
+      }
+
+      setInterfaceSettings({
+        ...interfaceSettings,
+        [prop]: checked,
+      });
+    },
+    [interfaceSettings, outCommand, setInterfaceSettings, userRemoteSettings],
+  );
+
+  const renderCheckboxesList = (list: CheckboxesList) => {
+    return list.map(x => {
+      return (
+        <PrettySwitchbox
+          key={x.prop}
+          label={x.label}
+          checked={mergedSettings[x.prop]}
+          setChecked={handleChangeChecked(x.prop)}
+        />
+      );
+    });
+  };
+
+  return (
+    <Dialog
+      header="Map settings"
+      visible={show}
+      draggable={false}
+      style={{ width: '550px' }}
+      onShow={handleShow}
+      onHide={() => {
+        if (!show) {
+          return;
+        }
+
+        setActiveIndex(0);
+        onHide();
+      }}
+    >
+      <div className="flex flex-col gap-3">
+        <div className="flex flex-col gap-2">
+          <div className={styles.verticalTabsContainer}>
+            <TabView
+              activeIndex={activeIndex}
+              onTabChange={e => setActiveIndex(e.index)}
+              className={styles.verticalTabView}
+            >
+              <TabPanel header="Common" headerClassName={styles.verticalTabHeader}>
+                <div className="w-full h-full flex flex-col gap-1">{renderCheckboxesList(COMMON_CHECKBOXES_PROPS)}</div>
+              </TabPanel>
+              <TabPanel header="Systems" headerClassName={styles.verticalTabHeader}>
+                <div className="w-full h-full flex flex-col gap-1">
+                  {renderCheckboxesList(SYSTEMS_CHECKBOXES_PROPS)}
+                </div>
+              </TabPanel>
+              <TabPanel disabled header="Connections" headerClassName={styles.verticalTabHeader}>
+                <p>Connections</p>
+              </TabPanel>
+              <TabPanel header="Signatures" headerClassName={styles.verticalTabHeader}>
+                {renderCheckboxesList(SIGNATURES_CHECKBOXES_PROPS)}
+              </TabPanel>
+              <TabPanel header="User Interface" headerClassName={styles.verticalTabHeader}>
+                {renderCheckboxesList(UI_CHECKBOXES_PROPS)}
+              </TabPanel>
+            </TabView>
+          </div>
+        </div>
+      </div>
+    </Dialog>
+  );
+};

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/components/PrettySwitchbox/MapSettings.module.scss

@@ -0,0 +1,48 @@
+.CheckboxContainer {
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+  align-items: center;
+
+  & > span:nth-child(1) {
+    color: var(--gray-200);
+    font-size: 13px;
+    user-select: none;
+  }
+
+  & > :nth-child(2){
+    border-bottom: 2px dotted #3f3f3f;
+    height: 1px;
+    margin: 0 12px;
+  }
+}
+
+/* Уменьшение размеров InputSwitch с использованием глобальных стилей */
+.smallInputSwitch {
+  height: 100%;
+  display: flex;
+  align-items: center;
+
+  :global {
+    .p-inputswitch {
+      height: 1rem;
+      width: 2rem;
+      &.p-inputswitch-checked {
+        .p-inputswitch-slider::before {
+          transform: translateX(1rem);
+        }
+      }
+
+      &.p-highlight .p-inputswitch-slider:before {
+        transform: translateX(1rem);
+      }
+
+      .p-inputswitch-slider::before {
+        width: 0.8rem;
+        height: 0.8rem;
+        margin-top: -0.4rem;
+        margin-left: -3px;
+      }
+    }
+  }
+
+}

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/components/PrettySwitchbox/PrettySwitchbox.tsx

@@ -0,0 +1,20 @@
+import styles from './MapSettings.module.scss';
+import { WdCheckbox } from '@/hooks/Mapper/components/ui-kit';
+
+interface PrettySwitchboxProps {
+  checked: boolean;
+  setChecked: (checked: boolean) => void;
+  label: string;
+}
+
+export const PrettySwitchbox = ({ checked, setChecked, label }: PrettySwitchboxProps) => {
+  return (
+    <label className={styles.CheckboxContainer}>
+      <span>{label}</span>
+      <div />
+      <div className={styles.smallInputSwitch}>
+        <WdCheckbox size="m" label={''} value={checked} onChange={e => setChecked(e.checked ?? false)} />
+      </div>
+    </label>
+  );
+};

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/components/PrettySwitchbox/index.ts

@@ -0,0 +1 @@
+export * from './PrettySwitchbox';

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/components/index.ts

@@ -0,0 +1 @@
+export * from './PrettySwitchbox';

assets/js/hooks/Mapper/components/mapRootContent/components/MapSettings/index.ts

@@ -0,0 +1 @@
+export * from './MapSettings';

assets/js/hooks/Mapper/components/mapRootContent/components/RightBar/RightBar.tsx

@@ -8,9 +8,10 @@ import { TooltipPosition } from '@/hooks/Mapper/components/ui-kit';
 
 interface RightBarProps {
   onShowOnTheMap?: () => void;
+  onShowMapSettings?: () => void;
 }
 
-export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
+export const RightBar = ({ onShowOnTheMap, onShowMapSettings }: RightBarProps) => {
   const { outCommand, interfaceSettings, setInterfaceSettings } = useMapRootState();
 
   const isShowMinimap = interfaceSettings.isShowMinimap === undefined ? true : interfaceSettings.isShowMinimap;
@@ -22,13 +23,6 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
     });
   }, [outCommand]);
 
-  const handleOpenUserSettings = useCallback(() => {
-    outCommand({
-      type: OutCommand.openUserSettings,
-      data: null,
-    });
-  }, [outCommand]);
-
   const toggleMinimap = useCallback(() => {
     setInterfaceSettings(x => ({
       ...x,
@@ -66,17 +60,7 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
             type="button"
             onClick={handleAddCharacter}
           >
-            <i className="pi pi-user-plus text-lg"></i>
-          </button>
-        </WdTooltipWrapper>
-
-        <WdTooltipWrapper content="User settings" position={TooltipPosition.left}>
-          <button
-            className="btn bg-transparent text-gray-400 hover:text-white border-transparent hover:bg-transparent py-2 h-auto min-h-auto"
-            type="button"
-            onClick={handleOpenUserSettings}
-          >
-            <i className="pi pi-cog text-lg"></i>
+            <i className="pi pi-user-plus"></i>
           </button>
         </WdTooltipWrapper>
 
@@ -86,12 +70,22 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
             type="button"
             onClick={onShowOnTheMap}
           >
-            <i className="pi pi-hashtag text-lg"></i>
+            <i className="pi pi-hashtag"></i>
           </button>
         </WdTooltipWrapper>
       </div>
 
       <div className="flex flex-col items-center mb-2 gap-1">
+        <WdTooltipWrapper content="User settings" position={TooltipPosition.left}>
+          <button
+            className="btn bg-transparent text-gray-400 hover:text-white border-transparent hover:bg-transparent py-2 h-auto min-h-auto"
+            type="button"
+            onClick={onShowMapSettings}
+          >
+            <i className="pi pi-cog"></i>
+          </button>
+        </WdTooltipWrapper>
+
         <WdTooltipWrapper
           content={
             interfaceSettings.isShowKSpace ? 'Hide highlighting Imperial Space' : 'Show highlighting Imperial Space'
@@ -103,11 +97,7 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
             type="button"
             onClick={toggleKSpace}
           >
-            {interfaceSettings.isShowKSpace ? (
-              <i className="pi pi-heart-fill text-lg"></i>
-            ) : (
-              <i className="pi pi-heart text-lg"></i>
-            )}
+            <i className={interfaceSettings.isShowKSpace ? 'hero-cloud-solid' : 'hero-cloud'}></i>
           </button>
         </WdTooltipWrapper>
 
@@ -117,7 +107,7 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
             type="button"
             onClick={toggleMinimap}
           >
-            {isShowMinimap ? <i className="pi pi-eye text-lg"></i> : <i className="pi pi-eye-slash text-lg"></i>}
+            <i className={isShowMinimap ? 'pi pi-eye' : 'pi pi-eye-slash'}></i>
           </button>
         </WdTooltipWrapper>
 
@@ -127,7 +117,7 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
             type="button"
             onClick={toggleMenu}
           >
-            <i className="pi pi-window-minimize text-lg"></i>
+            <i className="pi pi-window-minimize"></i>
           </button>
         </WdTooltipWrapper>
       </div>

assets/js/hooks/Mapper/mapRootProvider/MapRootProvider.tsx

@@ -26,7 +26,13 @@ const INITIAL_DATA: MapRootData = {
   selectedConnections: [],
 };
 
-type InterfaceStoredSettings = {
+export enum InterfaceStoredSettingsProps {
+  isShowMenu = 'isShowMenu',
+  isShowMinimap = 'isShowMinimap',
+  isShowKSpace = 'isShowKSpace',
+}
+
+export type InterfaceStoredSettings = {
   isShowMenu: boolean;
   isShowMinimap: boolean;
   isShowKSpace: boolean;

assets/js/hooks/Mapper/types/mapHandlers.ts

@@ -80,7 +80,6 @@ export type CommandCenterSystem = string | undefined;
 export type CommandLinkSignatureToSystem = {
   solar_system_source: number;
   solar_system_target: number;
-  signatures: any[];
 };
 
 export interface CommandData {
@@ -141,6 +140,9 @@ export enum OutCommand {
 
   // Only UI commands
   openSettings = 'open_settings',
+
+  getUserSettings = 'get_user_settings',
+  updateUserSettings = 'update_user_settings',
 }
 
 export type OutCommandHandler = <T = any>(event: { type: OutCommand; data: any }) => Promise<T>;

assets/js/hooks/Mapper/utils/labelsManager.ts

@@ -65,7 +65,7 @@ export class LabelsManager {
   }
 
   hasLabel(label: string) {
-    return this.parsedLabels.labels.includes(label);
+    return this.parsedLabels.labels?.includes(label);
   }
 
   toggleLabel(label: string) {

config/runtime.exs

@@ -77,7 +77,7 @@ config :wanderer_app,
   web_app_url: web_app_url,
   git_sha: System.get_env("GIT_SHA", "111"),
   custom_route_base_url: System.get_env("CUSTOM_ROUTE_BASE_URL"),
-  invites: System.get_env("WANDERER_INVITES", "false") == "true",
+  invites: System.get_env("WANDERER_INVITES", "false") |> String.to_existing_atom(),
   admin_username: System.get_env("WANDERER_ADMIN_USERNAME", "admin"),
   admin_password: System.get_env("WANDERER_ADMIN_PASSWORD"),
   admins: admins,

lib/wanderer_app/map.ex

@@ -52,15 +52,6 @@ defmodule WandererApp.Map do
     end
   end
 
-  def get_map_options!(map) do
-    map
-    |> Map.get(:options)
-    |> case do
-      nil -> %{"layout" => "left_to_right"}
-      options -> Jason.decode!(options)
-    end
-  end
-
   def update_map(map_id, map_update) do
     Cachex.get_and_update(:map_cache, map_id, fn map ->
       case map do

lib/wanderer_app/map/map_server_impl.ex

@@ -149,7 +149,7 @@ defmodule WandererApp.Map.Server.Impl do
 
       WandererApp.Cache.insert("map_#{map_id}:started", true)
 
-      broadcast!(map_id, :map_started)
+      broadcast!(map_id, :map_server_started)
 
       :telemetry.execute([:wanderer_app, :map, :started], %{count: 1})
 
@@ -333,7 +333,7 @@ defmodule WandererApp.Map.Server.Impl do
   end
 
   def delete_systems(
-        %{map_id: map_id, rtree_name: rtree_name} = state,
+        %{map_id: map_id, rtree_name: rtree_name, map_opts: map_opts} = state,
         removed_ids,
         user_id,
         character_id
@@ -352,7 +352,7 @@ defmodule WandererApp.Map.Server.Impl do
     removed_ids
     |> Enum.each(fn solar_system_id ->
       map_id
-      |> WandererApp.MapSystemRepo.remove_from_map(solar_system_id)
+      |> WandererApp.MapSystemRepo.remove_from_map(solar_system_id, map_opts)
       |> case do
         {:ok, _} ->
           :ok
@@ -801,7 +801,13 @@ defmodule WandererApp.Map.Server.Impl do
   end
 
   def handle_event({:options_updated, options}, %{map: map, map_id: map_id} = state),
-    do: %{state | map_opts: [layout: options.layout]}
+    do: %{
+      state
+      | map_opts: [
+          layout: options |> Map.get("layout"),
+          store_custom_labels: options |> Map.get("store_custom_labels")
+        ]
+    }
 
   def handle_event({ref, _result}, %{map_id: _map_id} = state) do
     Process.demonitor(ref, [:flush])
@@ -1278,9 +1284,14 @@ defmodule WandererApp.Map.Server.Impl do
       |> WandererApp.Map.add_connections!(connections)
       |> WandererApp.Map.add_characters!(characters)
 
-    map_options = WandererApp.Map.get_map_options!(initial_map)
+    {:ok, map_options} = WandererApp.MapRepo.options_to_form_data(initial_map)
 
-    %{state | map: map, map_opts: [layout: map_options |> Map.get("layout")]}
+    map_opts = [
+      layout: map_options |> Map.get("layout"),
+      store_custom_labels: map_options |> Map.get("store_custom_labels")
+    ]
+
+    %{state | map: map, map_opts: map_opts}
   end
 
   defp _init_map_systems(state, [] = _systems), do: state
@@ -1630,10 +1641,11 @@ defmodule WandererApp.Map.Server.Impl do
         WandererApp.Map.add_connection(map_id, connection)
 
         broadcast!(map_id, :add_connection, connection)
+
         broadcast!(map_id, :maybe_link_signature, %{
           character_id: character_id,
           solar_system_source: old_location.solar_system_id,
-          solar_system_target: location.solar_system_id,
+          solar_system_target: location.solar_system_id
         })
 
         :ok

lib/wanderer_app/repositories/map_repo.ex

@@ -1,6 +1,8 @@
 defmodule WandererApp.MapRepo do
   use WandererApp, :repository
 
+  @default_map_options %{"layout" => "left_to_right", "store_custom_labels" => false}
+
   def get(map_id, relationships \\ []) do
     map_id
     |> WandererApp.Api.Map.by_id()
@@ -13,10 +15,23 @@ defmodule WandererApp.MapRepo do
     end
   end
 
+  def get_by_slug_with_permissions(map_slug, current_user),
+    do:
+      map_slug
+      |> WandererApp.Api.Map.get_map_by_slug()
+      |> load_user_permissions(current_user)
+
   def load_relationships(map, []), do: {:ok, map}
 
   def load_relationships(map, relationships), do: map |> Ash.load(relationships)
 
+  defp load_user_permissions({:ok, map}, current_user),
+    do:
+      map
+      |> Ash.load([:acls, :user_permissions], actor: current_user)
+
+  defp load_user_permissions(error, _current_user), do: error
+
   def update_hubs(map_id, hubs) do
     map_id
     |> WandererApp.Api.Map.by_id()
@@ -28,4 +43,19 @@ defmodule WandererApp.MapRepo do
         {:error, :map_not_found}
     end
   end
+
+  def update_options(map, options),
+    do:
+      map
+      |> WandererApp.Api.Map.update_options(%{options: Jason.encode!(options)})
+
+  def options_to_form_data(%{options: options} = _map_options) when not is_nil(options),
+    do: {:ok, Jason.decode!(options)}
+
+  def options_to_form_data(_), do: {:ok, @default_map_options}
+
+  def options_to_form_data!(options) do
+    {:ok, data} = options_to_form_data(options)
+    data
+  end
 end

lib/wanderer_app/repositories/map_system_repo.ex

@@ -22,14 +22,12 @@ defmodule WandererApp.MapSystemRepo do
   def get_visible_by_map(map_id),
     do: WandererApp.Api.MapSystem.read_visible_by_map(%{map_id: map_id})
 
-  def remove_from_map(map_id, solar_system_id) do
+  def remove_from_map(map_id, solar_system_id, opts) do
     WandererApp.Api.MapSystem.read_by_map_and_solar_system!(%{
       map_id: map_id,
       solar_system_id: solar_system_id
     })
-    |> WandererApp.Api.MapSystem.update_labels!(%{
-      labels: nil
-    })
+    |> cleanup_labels(opts)
     |> WandererApp.Api.MapSystem.update_tag!(%{
       tag: nil
     })
@@ -39,6 +37,33 @@ defmodule WandererApp.MapSystemRepo do
       {:error, error}
   end
 
+  def cleanup_labels(%{labels: labels} = system, opts) do
+    store_custom_labels? =
+      Keyword.get(opts, :store_custom_labels, "false") |> String.to_existing_atom()
+
+    labels = get_filtered_labels(labels, store_custom_labels?)
+
+    system
+    |> WandererApp.Api.MapSystem.update_labels!(%{
+      labels: labels
+    })
+  end
+
+  def get_filtered_labels(labels, true) when is_binary(labels) do
+    labels
+    |> Jason.decode!()
+    |> case do
+      %{"customLabel" => customLabel} = labels when is_binary(customLabel) ->
+        %{"customLabel" => customLabel, "labels" => []}
+        |> Jason.encode!()
+
+      _ ->
+        nil
+    end
+  end
+
+  def get_filtered_labels(_, _store_custom_labels), do: nil
+
   def update_name(system, update),
     do:
       system

lib/wanderer_app/repositories/map_user_settings_repo.ex

@@ -46,4 +46,13 @@ defmodule WandererApp.MapUserSettingsRepo do
     {:ok, data} = to_form_data(user_settings)
     data
   end
+
+  def get_boolean_setting(settings, key, default \\ false) do
+    settings
+    |> Map.get(key, default)
+    |> to_boolean()
+  end
+
+  def to_boolean(value) when is_binary(value), do: value |> String.to_existing_atom()
+  def to_boolean(value) when is_boolean(value), do: value
 end

lib/wanderer_app_web.ex

@@ -62,6 +62,7 @@ defmodule WandererAppWeb do
       use Phoenix.LiveView, @opts
 
       unquote(html_helpers())
+      defguard is_connected?(socket) when socket.transport_pid != nil
     end
   end
 

lib/wanderer_app_web/components/map/map_loader.ex

@@ -0,0 +1,38 @@
+defmodule WandererAppWeb.MapLoader do
+  use WandererAppWeb, :live_component
+
+  def render(assigns) do
+    ~H"""
+    <div
+      id="map-loader"
+      data-loading={show_loader("map-loader")}
+      data-loaded={hide_loader("map-loader")}
+      class="!z-100 w-screen h-screen hidden relative"
+    >
+      <div class="hs-overlay-backdrop transition duration absolute inset-0 blur" />
+      <div class="flex !z-[150] w-full h-full items-center justify-center">
+        <div class="Loader" data-text="Wanderer">
+          <span class="Loader__Circle"></span>
+          <span class="Loader__Circle"></span>
+          <span class="Loader__Circle"></span>
+          <span class="Loader__Circle"></span>
+        </div>
+      </div>
+    </div>
+    """
+  end
+
+  defp show_loader(js \\ %JS{}, id),
+    do:
+      JS.show(js,
+        to: "##{id}",
+        transition: {"transition-opacity ease-out duration-500", "opacity-0", "opacity-100"}
+      )
+
+  defp hide_loader(js \\ %JS{}, id),
+    do:
+      JS.hide(js,
+        to: "##{id}",
+        transition: {"transition-opacity ease-in duration-500", "opacity-100", "opacity-0"}
+      )
+end

lib/wanderer_app_web/components/map/map_picker.ex

@@ -0,0 +1,75 @@
+defmodule WandererAppWeb.MapPicker do
+  use WandererAppWeb, :live_component
+
+  use LiveViewEvents
+
+  @impl true
+  def mount(socket) do
+    socket =
+      socket
+      |> assign(form: to_form(%{"map_slug" => nil}))
+
+    {:ok, socket}
+  end
+
+  def update(
+        %{
+          current_user: current_user,
+          map_slug: map_slug
+        } = assigns,
+        socket
+      ) do
+    socket = handle_info_or_assign(socket, assigns)
+
+    {:ok,
+     socket
+     |> assign(form: to_form(%{"map_slug" => map_slug}))
+     |> assign_async(:maps, fn ->
+       get_available_maps(current_user)
+     end)}
+  end
+
+  def render(assigns) do
+    ~H"""
+    <div id={@id}>
+      <.form
+        :let={f}
+        :if={not is_nil(assigns |> Map.get(:maps))}
+        for={@form}
+        phx-change="select"
+        phx-target={@myself}
+      >
+        <.async_result :let={maps} assign={@maps}>
+          <:loading><span class="loading loading-dots loading-xs" /></:loading>
+          <:failed :let={reason}><%= reason %></:failed>
+          <.input
+            :if={maps}
+            type="select"
+            field={f[:map_slug]}
+            class="select h-8 min-h-[0px] !pt-1 !pb-1 text-sm bg-neutral-900"
+            placeholder="Select a map..."
+            options={Enum.map(@maps.result, fn map -> {map.label, map.value} end)}
+          />
+        </.async_result>
+      </.form>
+    </div>
+    """
+  end
+
+  def handle_event("select", %{"map_slug" => map_slug} = _params, socket) do
+    notify_to(socket.assigns.notify_to, socket.assigns.event_name, map_slug)
+
+    {:noreply, socket}
+  end
+
+  defp get_available_maps(current_user) do
+    {:ok, maps} =
+      current_user
+      |> WandererApp.Maps.get_available_maps()
+
+    {:ok, %{maps: maps |> Enum.sort_by(& &1.name, :asc) |> Enum.map(&map_map/1)}}
+  end
+
+  defp map_map(%{name: name, slug: slug} = _map),
+    do: %{label: name, value: slug}
+end

lib/wanderer_app_web/live/admin/admin_live.ex

@@ -12,7 +12,7 @@ defmodule WandererAppWeb.AdminLive do
       {:ok, socket.assigns.current_user.characters}
     )
 
-    admin_character =
+    corp_wallet_character =
       socket.assigns.current_user.characters
       |> Enum.find(fn character ->
         WandererApp.Character.can_track_corp_wallet?(character)
@@ -31,39 +31,35 @@ defmodule WandererAppWeb.AdminLive do
     end)
 
     socket =
-      if not is_nil(admin_character) do
+      if not is_nil(corp_wallet_character) do
         {:ok, total_balance} =
-          WandererApp.Character.TransactionsTracker.get_total_balance(admin_character.id)
+          WandererApp.Character.TransactionsTracker.get_total_balance(corp_wallet_character.id)
 
         {:ok, transactions} =
-          WandererApp.Character.TransactionsTracker.get_transactions(admin_character.id)
-
-        {:ok, active_map_subscriptions} =
-          WandererApp.Api.MapSubscription.all_active()
+          WandererApp.Character.TransactionsTracker.get_transactions(corp_wallet_character.id)
 
         socket
         |> assign(
-          show_invites?: WandererApp.Env.invites(),
-          admin_character_id: admin_character.id,
           total_balance: total_balance,
-          transactions: transactions,
-          user_character_ids: user_character_ids,
-          active_map_subscriptions: active_map_subscriptions
+          transactions: transactions
         )
       else
         socket
         |> assign(
-          admin_character_id: nil,
-          show_invites?: false,
           total_balance: 0,
-          transactions: [],
-          active_map_subscriptions: []
+          transactions: []
         )
       end
 
+    {:ok, active_map_subscriptions} =
+      WandererApp.Api.MapSubscription.all_active()
+
     {:ok,
      socket
      |> assign(
+       active_map_subscriptions: active_map_subscriptions,
+       show_invites?: WandererApp.Env.invites(),
+       user_character_ids: user_character_ids,
        user_id: user_id,
        invite_link: nil,
        map_subscriptions_enabled?: WandererApp.Env.map_subscriptions_enabled?()
@@ -72,7 +68,7 @@ defmodule WandererAppWeb.AdminLive do
 
   @impl true
   def mount(_params, _session, socket) do
-    {:ok, socket |> assign(user_id: nil, admin_character_id: nil)}
+    {:ok, socket |> assign(user_id: nil)}
   end
 
   @impl true

lib/wanderer_app_web/live/maps/map_live.html.heex

@@ -1,34 +1,17 @@
-<div
-  id="map-loader"
-  data-loading={show_loader("map-loader")}
-  data-loaded={hide_loader("map-loader")}
-  class="!z-100 w-screen h-screen hidden relative"
->
-  <div class="hs-overlay-backdrop transition duration absolute inset-0 blur" />
-  <div class="flex !z-[150] w-full h-full items-center justify-center">
-    <div class="Loader" data-text="Wanderer">
-      <span class="Loader__Circle"></span>
-      <span class="Loader__Circle"></span>
-      <span class="Loader__Circle"></span>
-      <span class="Loader__Circle"></span>
-    </div>
-  </div>
-</div>
+<.live_component module={WandererAppWeb.MapLoader} id="map-loader" />
 
 <div class="w-full h-full" id="mapper" phx-hook="Mapper" phx-update="ignore"></div>
 
 <div class="absolute top-0 mt-2 left-16 flex gap-1">
-  <.form :let={f} for={@form} phx-change="change_map">
-    <span :if={@maps_loading} class="loading loading-dots loading-xs"></span>
-    <.input
-      :if={not @maps_loading}
-      type="select"
-      field={f[:map_slug]}
-      class="select h-8 min-h-[0px] !pt-1 !pb-1 text-sm bg-neutral-900"
-      placeholder="Select a map..."
-      options={Enum.map(@maps, fn map -> {map.label, map.value} end)}
-    />
-  </.form>
+  <.live_component
+    :if={not is_nil(assigns |> Map.get(:map_slug))}
+    module={WandererAppWeb.MapPicker}
+    id="map-picker"
+    notify_to={self()}
+    current_user={@current_user}
+    map_slug={@map_slug}
+    event_name="change_map"
+  />
 
   <.button
     :if={(@user_permissions || %{}) |> Map.get(:view_character, false)}
@@ -49,7 +32,7 @@
 </div>
 
 <.modal
-  :if={@live_action in [:add_system]}
+  :if={@live_action in [:add_system] && not is_nil(assigns |> Map.get(:map_slug)) && @map_loaded?}
   id="add-system-modal"
   class="!w-[400px]"
   title="Add System"
@@ -149,25 +132,3 @@
     </.table>
   </.async_result>
 </.modal>
-
-<.modal
-  :if={assigns |> Map.get(:show_user_settings?, false)}
-  id="map-user-settings-modal"
-  title="Map user settings"
-  show
-  on_cancel={JS.push("hide_user_settings")}
->
-  <.form
-    :let={f}
-    :if={assigns |> Map.get(:user_settings_form, false)}
-    for={@user_settings_form}
-    phx-change="update_user_settings"
-  >
-    <.input type="checkbox" field={f[:select_on_spash]} label="Auto select splashed systems" />
-    <.input
-      type="checkbox"
-      field={f[:link_signature_on_splash]}
-      label="Link splashed systems to signatures"
-    />
-  </.form>
-</.modal>

lib/wanderer_app_web/live/maps/maps_live.ex

@@ -114,12 +114,7 @@ defmodule WandererAppWeb.MapsLive do
       "auto_renew?" => true
     }
 
-    options_form =
-      map.options
-      |> case do
-        nil -> %{"layout" => "left_to_right"}
-        options -> Jason.decode!(options)
-      end
+    {:ok, options_form_data} = WandererApp.MapRepo.options_to_form_data(map)
 
     {:ok, estimated_price, discount} =
       WandererApp.Map.SubscriptionManager.estimate_price(subscription_form, false)
@@ -139,7 +134,7 @@ defmodule WandererAppWeb.MapsLive do
       active_settings_tab: "general",
       is_adding_subscription?: false,
       selected_subscription: nil,
-      options_form: options_form |> to_form(),
+      options_form: options_form_data |> to_form(),
       map_subscriptions: map_subscriptions,
       subscription_form: subscription_form |> to_form(),
       estimated_price: estimated_price,
@@ -661,16 +656,14 @@ defmodule WandererAppWeb.MapsLive do
 
   def handle_event(
         "update_options",
-        %{
-          "layout" => layout
-        } = options_form,
+        options_form,
         %{assigns: %{map_id: map_id, map: map}} = socket
       ) do
-    options = %{layout: layout}
+    options =
+      options_form
+      |> Map.take(["layout", "store_custom_labels"])
 
-    updated_map =
-      map
-      |> WandererApp.Api.Map.update_options!(%{options: Jason.encode!(options)})
+    {:ok, updated_map} = WandererApp.MapRepo.update_options(map, options)
 
     @pubsub_client.broadcast(
       WandererApp.PubSub,

lib/wanderer_app_web/live/maps/maps_live.html.heex

@@ -243,16 +243,23 @@
         for={@options_form}
         phx-change="update_options"
       >
-        <div class="stat-title">Map systems layout</div>
-        <div class="stat-value text-white">
-          <.input
-            type="select"
-            field={f[:layout]}
-            class="p-dropdown p-component p-inputwrapper"
-            placeholder="Map default layout"
-            options={@layout_options}
-          />
+        <div>
+          <div class="stat-title">Map systems layout</div>
+          <div class="stat-value text-white">
+            <.input
+              type="select"
+              field={f[:layout]}
+              class="p-dropdown p-component p-inputwrapper"
+              placeholder="Map default layout"
+              options={@layout_options}
+            />
+          </div>
         </div>
+        <.input
+          type="checkbox"
+          field={f[:store_custom_labels]}
+          label="Store system custom labels"
+        />
       </.form>
     </:actions>
   </.header>

mix.exs

@@ -2,7 +2,7 @@ defmodule WandererApp.MixProject do
   use Mix.Project
 
   @source_url "https://github.com/wanderer-industries/wanderer"
-  @version "1.6.0"
+  @version "1.12.3"
 
   def project do
     [
@@ -112,7 +112,8 @@ defmodule WandererApp.MixProject do
       {:git_ops, "~> 2.6.1"},
       {:version_tasks, "~> 0.12.0"},
       {:error_tracker, "~> 0.2"},
-      {:ddrt, "~> 0.2.1"}
+      {:ddrt, "~> 0.2.1"},
+      {:live_view_events, "~> 0.1.0"}
     ]
   end
 

mix.lock

@@ -58,6 +58,7 @@
   "jumper": {:hex, :jumper, "1.0.2", "68cdcd84472a00ac596b4e6459a41b3062d4427cbd4f1e8c8793c5b54f1406a7", [:mix], [], "hexpm", "9b7782409021e01ab3c08270e26f36eb62976a38c1aa64b2eaf6348422f165e1"},
   "libgraph": {:hex, :libgraph, "0.16.0", "3936f3eca6ef826e08880230f806bfea13193e49bf153f93edcf0239d4fd1d07", [:mix], [], "hexpm", "41ca92240e8a4138c30a7e06466acc709b0cbb795c643e9e17174a178982d6bf"},
   "live_select": {:hex, :live_select, "1.4.2", "193056948a52144177bb53266b116117c5ae129939a67f15d7927750d35dd1a9", [:mix], [{:ecto, "~> 3.8", [hex: :ecto, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:phoenix, ">= 1.6.0", [hex: :phoenix, repo: "hexpm", optional: true]}, {:phoenix_html, "~> 4.0", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:phoenix_html_helpers, "~> 1.0", [hex: :phoenix_html_helpers, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.19", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}], "hexpm", "fc59e20d8fcb78f3971e898019ad82a4fe2bb516414ccfd63c8463231030ed1f"},
+  "live_view_events": {:hex, :live_view_events, "0.1.2", "cd8df6d330c1e5e376664e9bd924ea2272c6060d234019be3cb7579c1c562590", [:mix], [{:phoenix_live_view, "~> 0.19", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}], "hexpm", "d54cb2515698a548a7ec9cc8d36798fc4799a157e9344f10642c3f848a6a1174"},
   "makeup": {:hex, :makeup, "1.1.2", "9ba8837913bdf757787e71c1581c21f9d2455f4dd04cfca785c70bbfff1a76a3", [:mix], [{:nimble_parsec, "~> 1.2.2 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "cce1566b81fbcbd21eca8ffe808f33b221f9eee2cbc7a1706fc3da9ff18e6cac"},
   "makeup_elixir": {:hex, :makeup_elixir, "0.16.2", "627e84b8e8bf22e60a2579dad15067c755531fea049ae26ef1020cad58fe9578", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}, {:nimble_parsec, "~> 1.2.3 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "41193978704763f6bbe6cc2758b84909e62984c7752b3784bd3c218bb341706b"},
   "makeup_erlang": {:hex, :makeup_erlang, "1.0.0", "6f0eff9c9c489f26b69b61440bf1b238d95badae49adac77973cbacae87e3c2e", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}], "hexpm", "ea7a9307de9d1548d2a72d299058d1fd2339e3d398560a0e46c27dab4891e4d2"},

priv/repo/data/wormholes.json

@@ -100,9 +100,9 @@
     "dest": "c5",
     "src": ["c6"],
     "static": true,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": [],
     "typeID": 30711,
     "name": "V911"
@@ -124,9 +124,9 @@
     "dest": "c6",
     "src": ["c6"],
     "static": true,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": [],
     "typeID": 30712,
     "name": "W237"
@@ -172,9 +172,9 @@
     "dest": "c6",
     "src": ["c5"],
     "static": true,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": [],
     "typeID": 30703,
     "name": "V753"
@@ -208,9 +208,9 @@
     "dest": "c6",
     "src": ["ls", "ns"],
     "static": false,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "48",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": null,
     "typeID": 30646,
     "name": "U319"
@@ -424,9 +424,9 @@
     "dest": "ns",
     "src": ["c5", "c6"],
     "static": false,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "16",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": null,
     "typeID": 30706,
     "name": "Z142"
@@ -532,9 +532,9 @@
     "dest": "ls",
     "src": ["c4"],
     "static": false,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": null,
     "typeID": 30696,
     "name": "N290"
@@ -616,9 +616,9 @@
     "dest": "c5",
     "src": ["c5"],
     "static": true,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": [],
     "typeID": 30702,
     "name": "H296"
@@ -772,7 +772,7 @@
     "dest": "c5",
     "src": ["c2"],
     "static": true,
-    "max_mass_per_jump": 300000000,
+    "max_mass_per_jump": 375000000,
     "lifetime": "24",
     "total_mass": 3000000000,
     "sibling_groups": [["E545"]],
@@ -796,9 +796,9 @@
     "dest": "ns",
     "src": ["ls", "ns"],
     "static": false,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "16",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": null,
     "typeID": 30649,
     "name": "S199"
@@ -844,9 +844,9 @@
     "dest": "ls",
     "src": ["ls", "ns"],
     "static": false,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": null,
     "typeID": 30648,
     "name": "N944"
@@ -1024,9 +1024,9 @@
     "dest": "c5",
     "src": ["ls", "ns"],
     "static": false,
-    "max_mass_per_jump": 1350000000,
+    "max_mass_per_jump": 2000000000,
     "lifetime": "24",
-    "total_mass": 3000000000,
+    "total_mass": 3300000000,
     "sibling_groups": null,
     "typeID": 30643,
     "name": "N432"