Merge branch 'main' into sig-temp-names

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

@@ -3,7 +3,7 @@ import { Dialog } from 'primereact/dialog';
 import { useCallback, useRef, useState } from 'react';
 import { TabPanel, TabView } from 'primereact/tabview';
 import { useMapRootState } from '@/hooks/Mapper/mapRootProvider';
-import { OutCommand } from '@/hooks/Mapper/types';
+import { OutCommand, UserPermission } from '@/hooks/Mapper/types';
 import { CONNECTIONS_CHECKBOXES_PROPS, SIGNATURES_CHECKBOXES_PROPS, SYSTEMS_CHECKBOXES_PROPS } from './constants.ts';
 import {
   MapSettingsProvider,
@@ -12,7 +12,10 @@ import {
 import { WidgetsSettings } from './components/WidgetsSettings';
 import { CommonSettings } from './components/CommonSettings';
 import { SettingsListItem } from './types.ts';
-import { ImportExport } from '@/hooks/Mapper/components/mapRootContent/components/MapSettings/components/ImportExport.tsx';
+import { ImportExport } from './components/ImportExport.tsx';
+import { ServerSettings } from './components/ServerSettings.tsx';
+import { AdminSettings } from './components/AdminSettings.tsx';
+import { useMapCheckPermissions } from '@/hooks/Mapper/mapRootProvider/hooks/api';
 
 export interface MapSettingsProps {
   visible: boolean;
@@ -24,6 +27,7 @@ export const MapSettingsComp = ({ visible, onHide }: MapSettingsProps) => {
   const { outCommand } = useMapRootState();
 
   const { renderSettingItem, setUserRemoteSettings } = useMapSettings();
+  const isAdmin = useMapCheckPermissions([UserPermission.ADMIN_MAP]);
 
   const refVars = useRef({ outCommand, onHide, visible });
   refVars.current = { outCommand, onHide, visible };
@@ -58,7 +62,7 @@ export const MapSettingsComp = ({ visible, onHide }: MapSettingsProps) => {
       header="Map user settings"
       visible
       draggable={false}
-      style={{ width: '550px' }}
+      style={{ width: '600px' }}
       onShow={handleShow}
       onHide={handleHide}
     >
@@ -92,6 +96,16 @@ export const MapSettingsComp = ({ visible, onHide }: MapSettingsProps) => {
             <TabPanel header="Import/Export" className="h-full" headerClassName={styles.verticalTabHeader}>
               <ImportExport />
             </TabPanel>
+
+            <TabPanel header="Server Settings" className="h-full" headerClassName="color-warn">
+              <ServerSettings />
+            </TabPanel>
+
+            {isAdmin && (
+              <TabPanel header="Admin Settings" className="h-full" headerClassName="color-warn">
+                <AdminSettings />
+              </TabPanel>
+            )}
           </TabView>
         </div>
       </div>

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

@@ -0,0 +1,128 @@
+import { useMapRootState } from '@/hooks/Mapper/mapRootProvider';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { Toast } from 'primereact/toast';
+import { Button } from 'primereact/button';
+import { callToastError, callToastSuccess, callToastWarn } from '@/hooks/Mapper/helpers';
+import { OutCommand } from '@/hooks/Mapper/types';
+import { ConfirmPopup } from 'primereact/confirmpopup';
+import { useConfirmPopup } from '@/hooks/Mapper/hooks';
+import { MapUserSettings, RemoteAdminSettingsResponse } from '@/hooks/Mapper/mapRootProvider/types.ts';
+import { parseMapUserSettings } from '@/hooks/Mapper/components/helpers';
+import fastDeepEqual from 'fast-deep-equal';
+import { useDetectSettingsChanged } from '@/hooks/Mapper/components/hooks';
+
+export const AdminSettings = () => {
+  const {
+    storedSettings: { getSettingsForExport },
+    outCommand,
+  } = useMapRootState();
+
+  const settingsChanged = useDetectSettingsChanged();
+
+  const [currentRemoteSettings, setCurrentRemoteSettings] = useState<MapUserSettings | null>(null);
+
+  const { cfShow, cfHide, cfVisible, cfRef } = useConfirmPopup();
+  const toast = useRef<Toast | null>(null);
+
+  const hasSettingsForExport = useMemo(() => !!getSettingsForExport(), [getSettingsForExport]);
+
+  const refVars = useRef({ currentRemoteSettings, getSettingsForExport });
+  refVars.current = { currentRemoteSettings, getSettingsForExport };
+
+  useEffect(() => {
+    const load = async () => {
+      let res: RemoteAdminSettingsResponse | undefined;
+      try {
+        res = await outCommand({ type: OutCommand.getDefaultSettings, data: null });
+      } catch (error) {
+        // do nothing
+      }
+
+      if (!res || res.default_settings == null) {
+        return;
+      }
+
+      setCurrentRemoteSettings(parseMapUserSettings(res.default_settings));
+    };
+
+    load();
+  }, [outCommand]);
+
+  const isDirty = useMemo(() => {
+    const { currentRemoteSettings, getSettingsForExport } = refVars.current;
+    const localCurrent = parseMapUserSettings(getSettingsForExport());
+
+    return !fastDeepEqual(currentRemoteSettings, localCurrent);
+    // eslint-disable-next-line
+  }, [settingsChanged, currentRemoteSettings]);
+
+  const handleSync = useCallback(async () => {
+    const settings = getSettingsForExport();
+
+    if (!settings) {
+      callToastWarn(toast.current, 'No settings to save');
+
+      return;
+    }
+
+    let response: { success: boolean } | undefined;
+
+    try {
+      response = await outCommand({
+        type: OutCommand.saveDefaultSettings,
+        data: { settings },
+      });
+    } catch (err) {
+      callToastError(toast.current, 'Something went wrong while saving settings');
+      console.error('ERROR: ', err);
+      return;
+    }
+
+    if (!response || !response.success) {
+      callToastError(toast.current, 'Settings not saved - dont not why it');
+      return;
+    }
+
+    setCurrentRemoteSettings(parseMapUserSettings(settings));
+
+    callToastSuccess(toast.current, 'Settings saved successfully');
+  }, [getSettingsForExport, outCommand]);
+
+  return (
+    <div className="w-full h-full flex flex-col gap-5">
+      <div className="flex flex-col gap-1">
+        <div>
+          <Button
+            // @ts-ignore
+            ref={cfRef}
+            onClick={cfShow}
+            icon="pi pi-save"
+            size="small"
+            severity="danger"
+            label="Save as Map Default"
+            className="py-[4px]"
+            disabled={!hasSettingsForExport || !isDirty}
+          />
+        </div>
+
+        {!isDirty && <span className="text-red-500/70 text-[12px]">*Local and remote are identical.</span>}
+
+        <span className="text-stone-500 text-[12px]">
+          *Will save your current settings as the default for all new users of this map. This action will overwrite any
+          existing default settings.
+        </span>
+      </div>
+
+      <Toast ref={toast} />
+
+      <ConfirmPopup
+        target={cfRef.current}
+        visible={cfVisible}
+        onHide={cfHide}
+        message="Your settings will overwrite default. Sure?."
+        icon="pi pi-exclamation-triangle"
+        accept={handleSync}
+      />
+    </div>
+  );
+};

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

@@ -7,9 +7,14 @@ import {
 import { useMapSettings } from '@/hooks/Mapper/components/mapRootContent/components/MapSettings/MapSettingsProvider.tsx';
 import { SettingsListItem } from '@/hooks/Mapper/components/mapRootContent/components/MapSettings/types.ts';
 import { useCallback } from 'react';
+import { Button } from 'primereact/button';
+import { TooltipPosition, WdTooltipWrapper } from '@/hooks/Mapper/components/ui-kit';
+import { ConfirmPopup } from 'primereact/confirmpopup';
+import { useConfirmPopup } from '@/hooks/Mapper/hooks';
 
 export const CommonSettings = () => {
   const { renderSettingItem } = useMapSettings();
+  const { cfShow, cfHide, cfVisible, cfRef } = useConfirmPopup();
 
   const renderSettingsList = useCallback(
     (list: SettingsListItem[]) => {
@@ -18,6 +23,8 @@ export const CommonSettings = () => {
     [renderSettingItem],
   );
 
+  const handleResetSettings = () => {};
+
   return (
     <div className="flex flex-col h-full gap-1">
       <div>
@@ -29,6 +36,33 @@ export const CommonSettings = () => {
       <div className="grid grid-cols-[1fr_auto]">{renderSettingItem(MINI_MAP_PLACEMENT)}</div>
       <div className="grid grid-cols-[1fr_auto]">{renderSettingItem(PINGS_PLACEMENT)}</div>
       <div className="grid grid-cols-[1fr_auto]">{renderSettingItem(THEME_SETTING)}</div>
+
+      <div className="border-b-2 border-dotted border-stone-700/50 h-px my-3" />
+
+      <div className="grid grid-cols-[1fr_auto]">
+        <div />
+        <WdTooltipWrapper content="This dangerous action. And can not be undone" position={TooltipPosition.top}>
+          <Button
+            // @ts-ignore
+            ref={cfRef}
+            className="py-[4px]"
+            onClick={cfShow}
+            outlined
+            size="small"
+            severity="danger"
+            label="Reset Settings"
+          />
+        </WdTooltipWrapper>
+      </div>
+
+      <ConfirmPopup
+        target={cfRef.current}
+        visible={cfVisible}
+        onHide={cfHide}
+        message="All settings for this map will be reset to default."
+        icon="pi pi-exclamation-triangle"
+        accept={handleResetSettings}
+      />
     </div>
   );
 };

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

@@ -0,0 +1,90 @@
+import { useMapRootState } from '@/hooks/Mapper/mapRootProvider';
+import { useCallback, useRef, useState } from 'react';
+import { Toast } from 'primereact/toast';
+import { Button } from 'primereact/button';
+import { OutCommand } from '@/hooks/Mapper/types';
+import { Divider } from 'primereact/divider';
+import { callToastError, callToastSuccess, callToastWarn } from '@/hooks/Mapper/helpers';
+
+type SaveDefaultSettingsReturn = { success: boolean; error: string };
+
+export const DefaultSettings = () => {
+  const {
+    outCommand,
+    storedSettings: { getSettingsForExport },
+    data: { userPermissions },
+  } = useMapRootState();
+
+  const [loading, setLoading] = useState(false);
+  const toast = useRef<Toast | null>(null);
+
+  const refVars = useRef({ getSettingsForExport, outCommand });
+  refVars.current = { getSettingsForExport, outCommand };
+
+  const handleSaveAsDefault = useCallback(async () => {
+    const settings = refVars.current.getSettingsForExport();
+    if (!settings) {
+      callToastWarn(toast.current, 'No settings to save');
+      return;
+    }
+
+    setLoading(true);
+
+    let response: SaveDefaultSettingsReturn;
+    try {
+      response = await refVars.current.outCommand({
+        type: OutCommand.saveDefaultSettings,
+        data: { settings },
+      });
+    } catch (error) {
+      console.error('Save default settings error:', error);
+      callToastError(toast.current, 'Failed to save default settings');
+      setLoading(false);
+      return;
+    }
+
+    if (response.success) {
+      callToastSuccess(toast.current, 'Default settings saved successfully');
+      setLoading(false);
+      return;
+    }
+
+    callToastError(toast.current, response.error || 'Failed to save default settings');
+    setLoading(false);
+  }, []);
+
+  if (!userPermissions?.admin_map) {
+    return null;
+  }
+
+  return (
+    <>
+      <Divider />
+      <div className="w-full h-full flex flex-col gap-5">
+        <h3 className="text-lg font-semibold">Default Settings (Admin Only)</h3>
+
+        <div className="flex flex-col gap-1">
+          <div>
+            <Button
+              onClick={handleSaveAsDefault}
+              icon="pi pi-save"
+              size="small"
+              severity="danger"
+              label="Save as Map Default"
+              className="py-[4px]"
+              loading={loading}
+              disabled={loading}
+            />
+          </div>
+
+          <span className="text-stone-500 text-[12px]">
+            *Will save your current settings as the default for all new users of this map. This action will overwrite
+            any existing default settings.
+          </span>
+        </div>
+
+        <Toast ref={toast} />
+      </div>
+    </>
+  );
+};

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

@@ -0,0 +1,97 @@
+import { useMapRootState } from '@/hooks/Mapper/mapRootProvider';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { Toast } from 'primereact/toast';
+import { parseMapUserSettings } from '@/hooks/Mapper/components/helpers';
+import { Button } from 'primereact/button';
+import { OutCommand } from '@/hooks/Mapper/types';
+import { createDefaultWidgetSettings } from '@/hooks/Mapper/mapRootProvider/helpers/createDefaultWidgetSettings.ts';
+import { callToastSuccess } from '@/hooks/Mapper/helpers';
+import { ConfirmPopup } from 'primereact/confirmpopup';
+import { useConfirmPopup } from '@/hooks/Mapper/hooks';
+import { RemoteAdminSettingsResponse } from '@/hooks/Mapper/mapRootProvider/types.ts';
+
+export const ServerSettings = () => {
+  const {
+    storedSettings: { applySettings },
+    outCommand,
+  } = useMapRootState();
+
+  const [hasSettings, setHasSettings] = useState(false);
+  const { cfShow, cfHide, cfVisible, cfRef } = useConfirmPopup();
+  const toast = useRef<Toast | null>(null);
+
+  const handleSync = useCallback(async () => {
+    let res: RemoteAdminSettingsResponse | undefined;
+    try {
+      res = await outCommand({ type: OutCommand.getDefaultSettings, data: null });
+    } catch (error) {
+      // do nothing
+    }
+
+    if (res?.default_settings == null) {
+      applySettings(createDefaultWidgetSettings());
+      return;
+    }
+
+    try {
+      applySettings(parseMapUserSettings(res.default_settings));
+      callToastSuccess(toast.current, 'Settings synchronized successfully');
+    } catch (error) {
+      applySettings(createDefaultWidgetSettings());
+    }
+  }, [applySettings, outCommand]);
+
+  useEffect(() => {
+    const load = async () => {
+      let res: RemoteAdminSettingsResponse | undefined;
+      try {
+        res = await outCommand({ type: OutCommand.getDefaultSettings, data: null });
+      } catch (error) {
+        // do nothing
+      }
+
+      if (res?.default_settings == null) {
+        return;
+      }
+
+      setHasSettings(true);
+    };
+
+    load();
+  }, [outCommand]);
+
+  return (
+    <div className="w-full h-full flex flex-col gap-5">
+      <div className="flex flex-col gap-1">
+        <div>
+          <Button
+            // @ts-ignore
+            ref={cfRef}
+            onClick={cfShow}
+            icon="pi pi-file-import"
+            size="small"
+            severity="warning"
+            label="Sync with Default Settings"
+            className="py-[4px]"
+            disabled={!hasSettings}
+          />
+        </div>
+        {!hasSettings && (
+          <span className="text-red-500/70 text-[12px]">*Default settings was not set by map administrator.</span>
+        )}
+        <span className="text-stone-500 text-[12px]">*Will apply admin settings which set as Default for map.</span>
+      </div>
+
+      <Toast ref={toast} />
+
+      <ConfirmPopup
+        target={cfRef.current}
+        visible={cfVisible}
+        onHide={cfHide}
+        message="You lost your current settings. Sure?."
+        icon="pi pi-exclamation-triangle"
+        accept={handleSync}
+      />
+    </div>
+  );
+};

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

@@ -28,6 +28,9 @@ export const WidgetsSettings = ({}: WidgetsSettingsProps) => {
           />
         ))}
       </div>
+
+      <div className="border-b-2 border-dotted border-stone-700/50 h-px my-3" />
+
       <div className="grid grid-cols-[1fr_auto]">
         <div />
         <Button className="py-[4px]" onClick={resetWidgets} outlined size="small" label="Reset Widgets"></Button>

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

@@ -1,7 +1,7 @@
 import { Dialog } from 'primereact/dialog';
 import { Button } from 'primereact/button';
 import { ConfirmPopup } from 'primereact/confirmpopup';
-import { useCallback, useRef, useState } from 'react';
+import { useCallback, useRef } from 'react';
 import { MapUserSettings } from '@/hooks/Mapper/mapRootProvider/types.ts';
 import {
   DEFAULT_KILLS_WIDGET_SETTINGS,
@@ -15,6 +15,7 @@ import { DEFAULT_SIGNATURE_SETTINGS } from '@/hooks/Mapper/constants/signatures.
 import { Toast } from 'primereact/toast';
 import { useMapRootState } from '@/hooks/Mapper/mapRootProvider';
 import { saveTextFile } from '@/hooks/Mapper/utils';
+import { useConfirmPopup } from '@/hooks/Mapper/hooks';
 
 const createSettings = function <T>(lsSettings: string | null, defaultValues: T) {
   return {
@@ -24,10 +25,7 @@ const createSettings = function <T>(lsSettings: string | null, defaultValues: T)
 };
 
 export const OldSettingsDialog = () => {
-  const cpRemoveBtnRef = useRef<HTMLElement>();
-  const [cpRemoveVisible, setCpRemoveVisible] = useState(false);
-  const handleShowCP = useCallback(() => setCpRemoveVisible(true), []);
-  const handleHideCP = useCallback(() => setCpRemoveVisible(false), []);
+  const { cfShow, cfHide, cfVisible, cfRef } = useConfirmPopup();
   const toast = useRef<Toast | null>(null);
 
   const {
@@ -143,8 +141,8 @@ export const OldSettingsDialog = () => {
           <div className="flex items-center justify-end">
             <Button
               // @ts-ignore
-              ref={cpRemoveBtnRef}
-              onClick={handleShowCP}
+              ref={cfRef}
+              onClick={cfShow}
               icon="pi pi-exclamation-triangle"
               size="small"
               severity="warning"
@@ -192,9 +190,9 @@ export const OldSettingsDialog = () => {
       </Dialog>
 
       <ConfirmPopup
-        target={cpRemoveBtnRef.current}
-        visible={cpRemoveVisible}
-        onHide={handleHideCP}
+        target={cfRef.current}
+        visible={cfVisible}
+        onHide={cfHide}
         message="After click dialog will disappear. Ready?"
         icon="pi pi-exclamation-triangle"
         accept={handleProceed}

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

@@ -13,6 +13,8 @@ import { InputText } from 'primereact/inputtext';
 import { IconField } from 'primereact/iconfield';
 
 const itemTemplate = (item: CharacterTypeRaw & WithIsOwnCharacter, options: VirtualScrollerTemplateOptions) => {
+  const showAllyLogoPlaceholder = options.props.items?.some(x => x.alliance_id != null);
+
   return (
     <div
       className={clsx(classes.CharacterRow, 'w-full box-border px-2 py-1', {
@@ -22,7 +24,15 @@ const itemTemplate = (item: CharacterTypeRaw & WithIsOwnCharacter, options: Virt
       })}
       style={{ height: options.props.itemSize + 'px' }}
     >
-      <CharacterCard showCorporationLogo showAllyLogo showSystem showTicker showShip {...item} />
+      <CharacterCard
+        showCorporationLogo
+        showAllyLogo
+        showAllyLogoPlaceholder={showAllyLogoPlaceholder}
+        showSystem
+        showTicker
+        showShip
+        {...item}
+      />
     </div>
   );
 };