aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/MapBox/MapAnchorMenu.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2025-05-05 12:37:09 -0400
committerbobzel <zzzman@gmail.com>2025-05-05 12:37:09 -0400
commit3a733aa0fd24517e83649824dec0fc8bcc0bde43 (patch)
treeac01848cdab3b83582c0b7ab6f3d2b1c8187a24f /src/client/views/nodes/MapBox/MapAnchorMenu.tsx
parente058d227ccbce47c86b0fa558adb01dfccaf4d60 (diff)
parentd4659e2bd3ddb947683948083232c26fb1227f39 (diff)
Merge branch 'master' into joanne-tutorialagent
Diffstat (limited to 'src/client/views/nodes/MapBox/MapAnchorMenu.tsx')
-rw-r--r--src/client/views/nodes/MapBox/MapAnchorMenu.tsx45
1 files changed, 21 insertions, 24 deletions
diff --git a/src/client/views/nodes/MapBox/MapAnchorMenu.tsx b/src/client/views/nodes/MapBox/MapAnchorMenu.tsx
index 8079d96ea..fc5377ba4 100644
--- a/src/client/views/nodes/MapBox/MapAnchorMenu.tsx
+++ b/src/client/views/nodes/MapBox/MapAnchorMenu.tsx
@@ -1,7 +1,8 @@
+import { IconButton } from '@dash/components';
import { IconLookup, faAdd, faArrowDown, faArrowLeft, faArrowsRotate, faBicycle, faCalendarDays, faCar, faDiamondTurnRight, faEdit, faPersonWalking, faRoute } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Autocomplete, Checkbox, FormControlLabel, TextField } from '@mui/material';
-import { IconButton } from '@dash/components';
+import { LngLatLike } from 'mapbox-gl';
import { IReactionDisposer, ObservableMap, action, makeObservable, observable, reaction, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
@@ -14,12 +15,10 @@ import { CalendarManager } from '../../../util/CalendarManager';
import { SettingsManager } from '../../../util/SettingsManager';
import { AntimodeMenu, AntimodeMenuProps } from '../../AntimodeMenu';
import { DocumentView } from '../DocumentView';
+import { Position } from './AnimationUtility';
import './MapAnchorMenu.scss';
import { MapboxApiUtility, TransportationType } from './MapboxApiUtility';
import { MarkerIcons } from './MarkerIcons';
-import { LngLatLike } from 'mapbox-gl';
-import { Position } from './AnimationUtility';
-// import { GPTPopup, GPTPopupMode } from './../../GPTPopup/GPTPopup';
type MapAnchorMenuType = 'standard' | 'routeCreation' | 'calendar' | 'customize' | 'route';
@@ -46,7 +45,7 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
public IsTargetToggler: () => boolean = returnFalse;
public DisplayRoute: (routeInfoMap: Record<TransportationType, { coordinates: Position[] }> | undefined, type: TransportationType) => void = unimplementedFunction;
public AddNewRouteToMap: (coordinates: Position[], origin: string, destination: { place_name: string; center: number[] }, createPinForDestination: boolean) => void = unimplementedFunction;
- public CreatePin: (feature: { place_name: string; center: LngLatLike; properties: { wikiData: unknown } }) => void = unimplementedFunction;
+ public CreatePin: (feature: { place_name: string; center: LngLatLike; properties?: { wikiData: string } }) => void = unimplementedFunction;
public UpdateMarkerColor: (color: string) => void = unimplementedFunction;
public UpdateMarkerIcon: (iconKey: string) => void = unimplementedFunction;
@@ -293,7 +292,7 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
return undefined;
};
- getDirectionsButton: JSX.Element = (<IconButton tooltip="Get directions" onPointerDown={this.DirectionsClick} icon={<FontAwesomeIcon icon={faDiamondTurnRight as IconLookup} />} color={SettingsManager.userColor} />);
+ getDirectionsButton = () => <IconButton tooltip="Get directions" onPointerDown={this.DirectionsClick} icon={<FontAwesomeIcon icon={faDiamondTurnRight as IconLookup} />} color={SettingsManager.userColor} />;
getAddToCalendarButton = (docType: string): JSX.Element => (
<IconButton
@@ -305,9 +304,7 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
color={SettingsManager.userColor}
/>
);
- addToCalendarButton: JSX.Element = (
- <IconButton tooltip="Add to calendar" onPointerDown={() => CalendarManager.Instance.open(undefined, this.pinDoc)} icon={<FontAwesomeIcon icon={faCalendarDays as IconLookup} />} color={SettingsManager.userColor} />
- );
+ addToCalendarButton = () => <IconButton tooltip="Add to calendar" onPointerDown={() => CalendarManager.Instance.open(undefined, this.pinDoc)} icon={<FontAwesomeIcon icon={faCalendarDays as IconLookup} />} color={SettingsManager.userColor} />;
getLinkNoteToDocButton = (docType: string): JSX.Element => (
<div ref={this._commentRef}>
@@ -320,7 +317,7 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
</div>
);
- linkNoteToPinOrRoutenButton: JSX.Element = (
+ linkNoteToPinOrRoutenButton = () => (
<div ref={this._commentRef}>
<IconButton
tooltip="Link Note to Pin" //
@@ -331,9 +328,9 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
</div>
);
- customizePinButton: JSX.Element = (<IconButton tooltip="Customize pin" onPointerDown={this.CustomizeClick} icon={<FontAwesomeIcon icon={faEdit as IconLookup} />} color={SettingsManager.userColor} />);
+ customizePinButton = () => <IconButton tooltip="Customize pin" onPointerDown={this.CustomizeClick} icon={<FontAwesomeIcon icon={faEdit as IconLookup} />} color={SettingsManager.userColor} />;
- centerOnPinButton: JSX.Element = (
+ centerOnPinButton = () => (
<IconButton
tooltip="Center on pin" //
onPointerDown={this.Center}
@@ -342,7 +339,7 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
/>
);
- backButton: JSX.Element = (
+ backButton = () => (
<IconButton
tooltip="Go back" //
onPointerDown={this.BackClick}
@@ -351,7 +348,7 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
/>
);
- addRouteButton: JSX.Element = (
+ addRouteButton = () => (
<IconButton
tooltip="Add route" //
onPointerDown={this.HandleAddRouteClick}
@@ -369,9 +366,9 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
/>
);
- animateRouteButton: JSX.Element = (<IconButton tooltip="Animate route" onPointerDown={() => this.OpenAnimationPanel(this.routeDoc)} icon={<FontAwesomeIcon icon={faRoute as IconLookup} />} color={SettingsManager.userColor} />);
+ animateRouteButton = () => <IconButton tooltip="Animate route" onPointerDown={() => this.OpenAnimationPanel(this.routeDoc)} icon={<FontAwesomeIcon icon={faRoute as IconLookup} />} color={SettingsManager.userColor} />;
- revertToOriginalMarkerButton = (
+ revertToOriginalMarkerButton = () => (
<IconButton
tooltip="Revert to original" //
onPointerDown={() => this.revertToOriginalMarker()}
@@ -386,31 +383,31 @@ export class MapAnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
{this.menuType === 'standard' && (
<>
{this.getDeleteButton('pin')}
- {this.getDirectionsButton}
+ {this.getDirectionsButton()}
{this.getAddToCalendarButton('pin')}
{this.getLinkNoteToDocButton('pin')}
- {this.customizePinButton}
- {this.centerOnPinButton}
+ {this.customizePinButton()}
+ {this.centerOnPinButton()}
</>
)}
{this.menuType === 'routeCreation' && (
<>
- {this.backButton}
- {this.addRouteButton}
+ {this.backButton()}
+ {this.addRouteButton()}
</>
)}
{this.menuType === 'route' && (
<>
{this.getDeleteButton('route')}
- {this.animateRouteButton}
+ {this.animateRouteButton()}
{this.getAddToCalendarButton('route')}
{this.getLinkNoteToDocButton('route')}
</>
)}
{this.menuType === 'customize' && (
<>
- {this.backButton}
- {this.revertToOriginalMarkerButton}
+ {this.backButton()}
+ {this.revertToOriginalMarkerButton()}
</>
)}