Merge pull request #64 from wanderer-industries/design-issues

feat(Map): a lot of design issues

assets/js/hooks/Mapper/components/mapInterface/widgets/RoutesWidget/RoutesList/RoutesList.tsx

@@ -5,7 +5,7 @@ import { SystemViewStandalone, WdTooltip, WdTooltipHandlers } from '@/hooks/Mapp
 import { getBackgroundClass, getShapeClass } from '@/hooks/Mapper/components/map/helpers';
 import { MouseEvent, useCallback, useRef, useState } from 'react';
 import { Commands } from '@/hooks/Mapper/types';
-import { useMapRootState } from '@/hooks/Mapper/mapRootProvider';
+import { emitMapEvent } from '@/hooks/Mapper/events';
 
 export type RouteSystemProps = {
   destination: number;
@@ -88,11 +88,10 @@ export interface RoutesListProps {
 
 export const RoutesList = ({ data, onContextMenu }: RoutesListProps) => {
   const [selected, setSelected] = useState<number | null>(null);
-  const { mapRef } = useMapRootState();
 
   const handleClick = useCallback(
-    (systemId: number) => mapRef.current?.command(Commands.centerSystem, systemId.toString()),
-    [mapRef],
+    (systemId: number) => emitMapEvent({ name: Commands.centerSystem, data: systemId?.toString() }),
+    [],
   );
 
   if (!data.has_connection) {

assets/js/hooks/Mapper/components/mapInterface/widgets/RoutesWidget/RoutesWidget.tsx

@@ -30,7 +30,6 @@ const sortByDist = (a: Route, b: Route) => {
 export const RoutesWidgetContent = () => {
   const {
     data: { selectedSystems, hubs = [], systems, routes },
-    mapRef,
     outCommand,
   } = useMapRootState();
 
@@ -42,7 +41,6 @@ export const RoutesWidgetContent = () => {
   const { open, ...systemCtxProps } = useContextMenuSystemInfoHandlers({
     outCommand,
     hubs,
-    mapRef,
   });
 
   const preparedHubs = useMemo(() => {