feat: create recorder ui directory

src/components/molecules/BrowserRecordingSave.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react'
 import { Grid, Button, Box, Typography } from '@mui/material';
-import { SaveRecording } from "./SaveRecording";
+import { SaveRecording } from "../recorder/SaveRecording";
 import { useGlobalInfoStore } from '../../context/globalInfo';
 import { stopRecording } from "../../api/recording";
 import { useNavigate } from 'react-router-dom';

src/components/molecules/NavBar.tsx

@@ -8,7 +8,7 @@ import { IconButton, Menu, MenuItem, Typography, Chip, Button, Modal, Tabs, Tab,
 import { AccountCircle, Logout, Clear, YouTube, X, Update, Close, Language, Brightness7, Brightness4, Description } from "@mui/icons-material";
 import { useNavigate } from 'react-router-dom';
 import { AuthContext } from '../../context/auth';
-import { SaveRecording } from '../molecules/SaveRecording';
+import { SaveRecording } from '../recorder/SaveRecording';
 import DiscordIcon from '../icons/DiscordIcon';
 import { apiUrl } from '../../apiConfig';
 import MaxunLogo from "../../assets/maxunlogo.png";

src/components/organisms/BrowserWindow.tsx

@@ -1,8 +1,8 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { useSocketStore } from '../../context/socket';
 import { Button } from '@mui/material';
-import Canvas from "../atoms/canvas";
-import { Highlighter } from "../atoms/Highlighter";
+import Canvas from "../recorder/canvas";
+import { Highlighter } from "../recorder/Highlighter";
 import { GenericModal } from '../ui/GenericModal';
 import { useActionContext } from '../../context/browserActions';
 import { useBrowserSteps, TextStep } from '../../context/browserSteps';

src/components/pickers/DateTimeLocalPicker.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useSocketStore } from '../../context/socket';
-import { Coordinates } from '../atoms/canvas';
+import { Coordinates } from '../recorder/canvas';
 
 interface DateTimeLocalPickerProps {
   coordinates: Coordinates;

src/components/pickers/Dropdown.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useSocketStore } from '../../context/socket';
-import { Coordinates } from '../atoms/canvas';
+import { Coordinates } from '../recorder/canvas';
 
 interface DropdownProps {
     coordinates: Coordinates;

src/components/pickers/TimePicker.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useSocketStore } from '../../context/socket';
-import { Coordinates } from '../atoms/canvas';
+import { Coordinates } from '../recorder/canvas';
 
 interface TimePickerProps {
     coordinates: Coordinates;

src/components/recorder/LeftSidePanel.tsx

@@ -3,7 +3,7 @@ import React, { useCallback, useEffect, useState } from "react";
 import { getActiveWorkflow, getParamsOfActiveWorkflow } from "../../api/workflow";
 import { useSocketStore } from '../../context/socket';
 import { WhereWhatPair, WorkflowFile } from "maxun-core";
-import { SidePanelHeader } from "../molecules/SidePanelHeader";
+import { SidePanelHeader } from "./SidePanelHeader";
 import { emptyWorkflow } from "../../shared/constants";
 import { LeftSidePanelContent } from "../molecules/LeftSidePanelContent";
 import { useBrowserDimensionsStore } from "../../context/browserDimensions";

src/components/recorder/RightSidePanel.tsx

@@ -12,7 +12,7 @@ import { useBrowserSteps } from '../../context/browserSteps';
 import { useSocketStore } from '../../context/socket';
 import { ScreenshotSettings } from '../../shared/types';
 import InputAdornment from '@mui/material/InputAdornment';
-import { SidePanelHeader } from '../molecules/SidePanelHeader';
+import { SidePanelHeader } from './SidePanelHeader';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import FormControl from '@mui/material/FormControl';
 import FormLabel from '@mui/material/FormLabel';

src/components/run/InterpretationLog.tsx

@@ -15,7 +15,7 @@ import TableRow from '@mui/material/TableRow';
 import Paper from '@mui/material/Paper';
 import StorageIcon from '@mui/icons-material/Storage';
 import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
-import { SidePanelHeader } from '../molecules/SidePanelHeader';
+import { SidePanelHeader } from '../recorder/SidePanelHeader';
 import { useGlobalInfoStore } from '../../context/globalInfo';
 import { useThemeMode } from '../../context/theme-provider';
 import { useTranslation } from 'react-i18next';

src/helpers/inputHelpers.ts

@@ -4,7 +4,7 @@ import {
   VIEWPORT_W,
   VIEWPORT_H,
 } from "../constants/const";
-import { Coordinates } from '../components/atoms/canvas';
+import { Coordinates } from '../components/recorder/canvas';
 
 export const throttle = (callback: any, limit: number) => {
   let wait = false;

src/pages/RecordingPage.tsx

@@ -3,8 +3,8 @@ import { Grid } from '@mui/material';
 import { BrowserContent } from "../components/organisms/BrowserContent";
 import { InterpretationLog } from "../components/run/InterpretationLog";
 import { startRecording, getActiveBrowserId } from "../api/recording";
-import { LeftSidePanel } from "../components/organisms/LeftSidePanel";
-import { RightSidePanel } from "../components/organisms/RightSidePanel";
+import { LeftSidePanel } from "../components/recorder/LeftSidePanel";
+import { RightSidePanel } from "../components/recorder/RightSidePanel";
 import { Loader } from "../components/ui/Loader";
 import { useSocketStore } from "../context/socket";
 import { useBrowserDimensionsStore } from "../context/browserDimensions";