feat: support minutes in autoplay and seperate speed from unit

terrestris · Jan 23, 2025 · 6519b5c · 6519b5c
1 parent 6de4ff9
commit 6519b5c
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/src/Panel/TimeLayerSliderPanel/TimeLayerSliderPanel.less b/src/Panel/TimeLayerSliderPanel/TimeLayerSliderPanel.less
@@ -55,10 +55,6 @@
     flex: 0 0 auto;
   }
 
-  .speed-picker {
-    margin-right: 20px;
-  }
-
   .ant-select-selection {
     background-color: white;
     width: 150px;

diff --git a/src/Panel/TimeLayerSliderPanel/TimeLayerSliderPanel.tsx b/src/Panel/TimeLayerSliderPanel/TimeLayerSliderPanel.tsx
@@ -31,13 +31,14 @@ export type TimeLayerSliderPanelTooltips = {
   dataRange: string;
   days: string;
   hours: string;
+  minutes: string;
   months: string;
   setToMostRecent: string;
   weeks: string;
   years: string;
 };
 
-export type PlaybackSpeedUnit = 'hours' | 'days' | 'weeks' | 'months' | 'years';
+export type PlaybackSpeedUnit = 'minute' | 'hours' | 'days' | 'weeks' | 'months' | 'years';
 
 export type TimeLayerSliderPanelProps = {
   autoPlaySpeedOptions?: number[];
@@ -59,6 +60,7 @@ export const TimeLayerSliderPanel: React.FC<TimeLayerSliderPanelProps> = ({
   timeAwareLayers = [],
   tooltips = {
     setToMostRecent: 'Set to most recent date',
+    minutes: 'Minutes',
     hours: 'Hours',
     days: 'Days',
     weeks: 'Weeks',
@@ -402,14 +404,16 @@ export const TimeLayerSliderPanel: React.FC<TimeLayerSliderPanelProps> = ({
       >
         {speedOptions}
       </Select>
+      <span>x</span>
       <Select<PlaybackSpeedUnit>
         className={extraCls + ' speed-picker'}
-        defaultValue={'hours'}
+        defaultValue={'minute'}
         dropdownStyle={{ minWidth: '100px' }}
         onChange={onPlaybackUnitChange}
         popupMatchSelectWidth={false}
         value={playbackSpeedUnit}
       >
+        <Option value="minutes">{tooltips.minutes}</Option>
         <Option value="hours">{tooltips.hours}</Option>
         <Option value="days">{tooltips.days}</Option>
         <Option value="weeks">{tooltips.weeks}</Option>