|
|
|
@ -19,10 +19,7 @@ export type ReducerAction = |
|
|
|
|
'add', |
|
|
|
|
{ |
|
|
|
|
coordinates: Coordinates; |
|
|
|
|
remove: (key: string) => void; |
|
|
|
|
moveUp: (key: string) => void; |
|
|
|
|
moveDown: (key: string) => void; |
|
|
|
|
changeLongLabel: (key: string, newLongLabel: string) => void; |
|
|
|
|
dispatcher: Dispatch<ReducerAction>; |
|
|
|
|
} |
|
|
|
|
> |
|
|
|
|
| GenericMarkerChangeReducerAction<'remove'> |
|
|
|
@ -65,11 +62,26 @@ export const markersReducer = ( |
|
|
|
|
key, |
|
|
|
|
shortLabel: 'placeholder', |
|
|
|
|
longLabel: key.substring(0, 4), |
|
|
|
|
remove: () => action.data.remove(key), |
|
|
|
|
moveUp: () => action.data.moveUp(key), |
|
|
|
|
moveDown: () => action.data.moveDown(key), |
|
|
|
|
remove: () => |
|
|
|
|
action.data.dispatcher({ |
|
|
|
|
type: 'remove', |
|
|
|
|
data: { key }, |
|
|
|
|
}), |
|
|
|
|
moveUp: () => |
|
|
|
|
action.data.dispatcher({ |
|
|
|
|
type: 'moveUp', |
|
|
|
|
data: { key }, |
|
|
|
|
}), |
|
|
|
|
moveDown: () => |
|
|
|
|
action.data.dispatcher({ |
|
|
|
|
type: 'moveDown', |
|
|
|
|
data: { key }, |
|
|
|
|
}), |
|
|
|
|
changeLongLabel: (newLongLabel: string) => |
|
|
|
|
action.data.changeLongLabel(key, newLongLabel), |
|
|
|
|
action.data.dispatcher({ |
|
|
|
|
type: 'changeLongLabel', |
|
|
|
|
data: { key, newLongLabel }, |
|
|
|
|
}), |
|
|
|
|
coordinates: action.data.coordinates, |
|
|
|
|
}, |
|
|
|
|
]); |
|
|
|
@ -131,61 +143,21 @@ export const markersReducer = ( |
|
|
|
|
|
|
|
|
|
export const createChangeStateMethods = ( |
|
|
|
|
dispatchMarkers: Dispatch<ReducerAction>, |
|
|
|
|
) => { |
|
|
|
|
const reorderMarkers = ({ |
|
|
|
|
oldIndex, |
|
|
|
|
newIndex, |
|
|
|
|
}: ReorderMarkersParams): void => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'reorder', |
|
|
|
|
data: { oldIndex, newIndex }, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const moveMarkerUp = (key: string) => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'moveUp', |
|
|
|
|
data: { key }, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const moveMarkerDown = (key: string) => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'moveDown', |
|
|
|
|
data: { key }, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const removeMarker = (key: string) => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'remove', |
|
|
|
|
data: { key }, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const changeMarkerLongLabel = (key: string, newLongLabel: string) => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'changeLongLabel', |
|
|
|
|
data: { key, newLongLabel }, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const addMarker = (coordinates: Coordinates) => |
|
|
|
|
) => ({ |
|
|
|
|
addMarker: (coordinates: Coordinates) => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'add', |
|
|
|
|
data: { |
|
|
|
|
coordinates, |
|
|
|
|
moveUp: moveMarkerUp, |
|
|
|
|
moveDown: moveMarkerDown, |
|
|
|
|
remove: removeMarker, |
|
|
|
|
changeLongLabel: changeMarkerLongLabel, |
|
|
|
|
dispatcher: dispatchMarkers, |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
reorderMarkers, |
|
|
|
|
moveMarkerUp, |
|
|
|
|
moveMarkerDown, |
|
|
|
|
removeMarker, |
|
|
|
|
addMarker, |
|
|
|
|
changeMarkerLongLabel, |
|
|
|
|
}; |
|
|
|
|
}; |
|
|
|
|
}), |
|
|
|
|
reorderMarkers: ({ oldIndex, newIndex }: ReorderMarkersParams): void => |
|
|
|
|
dispatchMarkers({ |
|
|
|
|
type: 'reorder', |
|
|
|
|
data: { oldIndex, newIndex }, |
|
|
|
|
}), |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
export const useMarkers = () => { |
|
|
|
|
const [markers, dispatchMarkers] = useReducer(markersReducer, []); |
|
|
|
|