feat(wip): schedule settings

src/components/molecules/ScheduleSettings.tsx

@@ -9,25 +9,29 @@ interface ScheduleSettingsProps {
   isOpen: boolean;
   handleStart: (settings: ScheduleSettings) => void;
   handleClose: () => void;
-  isTask: boolean;
-  params?: string[];
 }
 
 export interface ScheduleSettings {
-  maxConcurrency: number;
-  maxRepeats: number;
-  debug: boolean;
-  params?: any;
+  runEvery: number;
+  runEveryUnit: string;
+  startFrom: string;
+  atTime: string;
+  timezone: string;
 }
 
-export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, isTask, params }: ScheduleSettingsProps) => {
-
-  const [settings, setSettings] = React.useState<ScheduleSettings>({
-    maxConcurrency: 1,
-    maxRepeats: 1,
-    debug: true,
+export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose }: ScheduleSettingsProps) => {
+  const [settings, setSettings] = useState<ScheduleSettings>({
+    runEvery: 1,
+    runEveryUnit: 'hours',
+    startFrom: 'Monday',
+    atTime: '00:00',
+    timezone: 'UTC'
   });
 
+  const handleChange = (field: keyof ScheduleSettings, value: string | number) => {
+    setSettings(prev => ({ ...prev, [field]: value }));
+  };
+
   return (
     <GenericModal
       isOpen={isOpen}
@@ -40,75 +44,76 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, isTask
         alignItems: 'flex-start',
         marginLeft: '65px',
       }}>
-        { isTask
-          ?
-          (
-            <React.Fragment>
-            <Typography sx={{ margin: '20px 0px' }} >Recording parameters:</Typography>
-              { params?.map((item, index) => {
-            return <TextField
-              sx={{ marginBottom: '15px' }}
-              key={`param-${index}`}
-              type="string"
-              label={item}
-              required
-              onChange={(e) => setSettings(
-                {
-                  ...settings,
-                  params: settings.params
-                    ? {
-                    ...settings.params,
-                    [item]: e.target.value,
-                  }
-                  : {
-                    [item]: e.target.value,
-                  },
-                })}
-            />
-          }) }
-            </React.Fragment>)
-          : null
-        }
-        <Typography sx={{ margin: '20px 0px' }} >Interpreter settings:</Typography>
-        <TextField
-          sx={{ marginBottom: '15px' }}
-          type="number"
-          label="maxConcurrency"
-          required
-          onChange={(e) => setSettings(
-            {
-              ...settings,
-              maxConcurrency: parseInt(e.target.value),
-            })}
-          defaultValue={settings.maxConcurrency}
-        />
-        <TextField
-          sx={{ marginBottom: '15px' }}
-          type="number"
-          label="maxRepeats"
-          required
-          onChange={(e) => setSettings(
-            {
-              ...settings,
-              maxRepeats: parseInt(e.target.value),
-            })}
-          defaultValue={settings.maxRepeats}
-        />
-        <Dropdown
-          id="debug"
-          label="debug"
-          value={settings.debug?.toString()}
-          handleSelect={(e) => setSettings(
-            {
-              ...settings,
-              debug: e.target.value === "true",
-            })}
-        >
-          <MenuItem value="true">true</MenuItem>
-          <MenuItem value="false">false</MenuItem>
-        </Dropdown>
+        <div style={{ display: 'flex', alignItems: 'center', marginBottom: '15px' }}>
+          <Typography>Run once every</Typography>
+          <TextField
+            type="number"
+            value={settings.runEvery}
+            onChange={(e) => handleChange('runEvery', parseInt(e.target.value))}
+            style={{ width: '60px', margin: '0 10px' }}
+          />
+          <Dropdown
+            label="unit"
+            id="runEveryUnit"
+            value={settings.runEveryUnit}
+            handleSelect={(e) => handleChange('runEveryUnit', e.target.value)}
+          >
+            <MenuItem value="minutes">minutes</MenuItem>
+            <MenuItem value="hours">hours</MenuItem>
+            <MenuItem value="days">days</MenuItem>
+            <MenuItem value="weeks">weeks</MenuItem>
+            <MenuItem value="months">months</MenuItem>
+          </Dropdown>
+        </div>
+
+        <div style={{ marginBottom: '15px' }}>
+          <Typography>Start from</Typography>
+          <Dropdown
+          label="start from"
+            id="startFrom"
+            value={settings.startFrom}
+            handleSelect={(e) => handleChange('startFrom', e.target.value)}
+          >
+            <MenuItem value="Monday">Monday</MenuItem>
+            <MenuItem value="Tuesday">Tuesday</MenuItem>
+            <MenuItem value="Wednesday">Wednesday</MenuItem>
+            <MenuItem value="Thursday">Thursday</MenuItem>
+            <MenuItem value="Friday">Friday</MenuItem>
+            <MenuItem value="Saturday">Saturday</MenuItem>
+            <MenuItem value="Sunday">Sunday</MenuItem>
+          </Dropdown>
+        </div>
+
+        <div style={{ marginBottom: '15px' }}>
+          <Typography>At around</Typography>
+          <TextField
+            type="time"
+            value={settings.atTime}
+            onChange={(e) => handleChange('atTime', e.target.value)}
+          />
+        </div>
+
+        <div style={{ marginBottom: '15px' }}>
+          <Typography>Timezone</Typography>
+          <Dropdown
+            label="timezone"	
+            id="timezone"
+            value={settings.timezone}
+            handleSelect={(e) => handleChange('timezone', e.target.value)}
+          >
+            <MenuItem value="UTC">UTC</MenuItem>
+            <MenuItem value="America/New_York">America/New_York</MenuItem>
+            <MenuItem value="Europe/London">Europe/London</MenuItem>
+            <MenuItem value="Asia/Tokyo">Asia/Tokyo</MenuItem>
+            <MenuItem value="Asia/Kolkata">Asia/Kolkata</MenuItem>
+            {/* Add more timezone options as needed */}
+          </Dropdown>
+        </div>
+
         <Button onClick={() => handleStart(settings)}>Start</Button>
       </div>
     </GenericModal>
   );
 }
+
+export default ScheduleSettingsModal;