From 41dc92c59697c7fac27f8f8388a5c70876413485 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:11:05 +0530 Subject: [PATCH 01/81] feat: proper ts for NavBar component --- src/components/molecules/NavBar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 1bfec709..ee9627b3 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -17,7 +17,7 @@ interface NavBarProps { isRecording: boolean; } -export const NavBar = ({ newRecording, recordingName, isRecording }: NavBarProps) => { +export const NavBar: React.FC = ({ newRecording, recordingName, isRecording }) => { const { notify, browserId, setBrowserId, recordingLength } = useGlobalInfoStore(); const { state, dispatch } = useContext(AuthContext); From a3cf33e002e820d44df0ae2b67601a9434ebb2f1 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:14:51 +0530 Subject: [PATCH 02/81] feat: black text bg white --- src/components/molecules/NavBar.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index ee9627b3..2696b98c 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -133,13 +133,13 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR const NavBarWrapper = styled.div` grid-area: navbar; - background-color: #3f4853; + background-color: white; padding:5px; display: flex; justify-content: space-between; `; const ProjectName = styled.b` - color: white; + color: #3f4853; font-size: 1.3em; `; From f5713a4a0092350553b6dd396da6b251f06ed581 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:16:24 +0530 Subject: [PATCH 03/81] feat: variant h4 --- src/pages/Register.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Register.tsx b/src/pages/Register.tsx index 3f6f2c55..e132cb53 100644 --- a/src/pages/Register.tsx +++ b/src/pages/Register.tsx @@ -58,7 +58,7 @@ const Register = () => { alignItems: 'center', }} > - + Create an account From 53786da12861ce7ed0c3c0a373b82a6452d73476 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:18:28 +0530 Subject: [PATCH 04/81] feat: register & login ui --- src/pages/Login.tsx | 1 - src/pages/Register.tsx | 20 +++++++++++--------- 2 files changed, 11 insertions(+), 10 deletions(-) diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx index 53f3d01e..f9eb8ab4 100644 --- a/src/pages/Login.tsx +++ b/src/pages/Login.tsx @@ -104,7 +104,6 @@ const Login = () => { )} - {/* Redirect to Register */} Don’t have an account?{' '} diff --git a/src/pages/Register.tsx b/src/pages/Register.tsx index e132cb53..ed4b5de1 100644 --- a/src/pages/Register.tsx +++ b/src/pages/Register.tsx @@ -50,18 +50,18 @@ const Register = () => { }; return ( - Create an account - + { disabled={loading || !email || !password} > {loading ? ( - + <> + + Loading + ) : ( 'Register' )} @@ -107,7 +110,6 @@ const Register = () => { - ); }; From 501332432ea6064c36a5066e804f1e2b2ce5fa1f Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:18:49 +0530 Subject: [PATCH 05/81] chore; liint --- src/pages/Register.tsx | 102 ++++++++++++++++++++--------------------- 1 file changed, 51 insertions(+), 51 deletions(-) diff --git a/src/pages/Register.tsx b/src/pages/Register.tsx index ed4b5de1..d3ccd666 100644 --- a/src/pages/Register.tsx +++ b/src/pages/Register.tsx @@ -50,66 +50,66 @@ const Register = () => { }; return ( - - - Create an account - - - - - - - Already have an account?{' '} - - Login - - - + + ) : ( + 'Register' + )} + + + Already have an account?{' '} + + Login + + + ); }; From 15c973bc83b466b6e313df3efbda9d4ccb5608c7 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:25:31 +0530 Subject: [PATCH 06/81] feat: create robot --- src/components/molecules/NavBar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 2696b98c..adf8254d 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -88,7 +88,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR } } > - {isRecording ? 'NEW' : 'RECORD'} + {isRecording ? 'New' : 'Create a Robot'} { recordingLength > 0 From 11873f4228176d5379ac75c505df1e53ff113f83 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:34:22 +0530 Subject: [PATCH 07/81] feat: create robot style --- src/components/molecules/NavBar.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index adf8254d..c09a4ca7 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -6,7 +6,7 @@ import { useGlobalInfoStore } from "../../context/globalInfo"; import { Button, IconButton } from "@mui/material"; import { RecordingIcon } from "../atoms/RecorderIcon"; import { SaveRecording } from "./SaveRecording"; -import { Circle } from "@mui/icons-material"; +import { Circle, Add } from "@mui/icons-material"; import MeetingRoomIcon from '@mui/icons-material/MeetingRoom'; import { Link, useLocation, useNavigate } from 'react-router-dom'; import { AuthContext } from '../../context/auth'; @@ -73,22 +73,22 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR size={"small"} onClick={handleNewRecording} sx={{ - width: isRecording ? '100px' : '130px', + width: isRecording ? '130px' : '140px', borderRadius: '5px', padding: '8px', - background: 'white', - color: 'rgba(255,0,0,0.7)', + background: '#ff00c3', + color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', fontWeight: '500', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', - '&:hover': { color: 'red', backgroundColor: 'white' } + '&:hover': { color: 'white', backgroundColor: '#ff00c3' } } } > - {isRecording ? 'New' : 'Create a Robot'} + {isRecording ? 'New Robot' : 'Create Robot'} { recordingLength > 0 From 6bd31fabbced3095aaa28b809e53cfa3d8117a10 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:39:58 +0530 Subject: [PATCH 08/81] feat: logout button style --- src/components/molecules/NavBar.tsx | 27 +++++++++++++++------------ 1 file changed, 15 insertions(+), 12 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index c09a4ca7..9f98b299 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -6,7 +6,7 @@ import { useGlobalInfoStore } from "../../context/globalInfo"; import { Button, IconButton } from "@mui/material"; import { RecordingIcon } from "../atoms/RecorderIcon"; import { SaveRecording } from "./SaveRecording"; -import { Circle, Add } from "@mui/icons-material"; +import { Circle, Add, Logout } from "@mui/icons-material"; import MeetingRoomIcon from '@mui/icons-material/MeetingRoom'; import { Link, useLocation, useNavigate } from 'react-router-dom'; import { AuthContext } from '../../context/auth'; @@ -110,18 +110,21 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR exit : null} + + Logout ) : "" From 32322bb9b49f7b84530fdab96158256dd56613ae Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:40:07 +0530 Subject: [PATCH 09/81] chore; liint --- src/components/molecules/NavBar.tsx | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 9f98b299..697ba0bc 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -112,16 +112,16 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR From 22f9ba2687d4a7e25f4890db177c6bc2157fcef8 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:41:38 +0530 Subject: [PATCH 10/81] feat: use Icon button --- src/components/molecules/NavBar.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 697ba0bc..a401f5ea 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -109,7 +109,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR exit : null} - + Logout ) : "" From e670461799b97c9167db11b4b2646b6fefb4cd40 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:45:09 +0530 Subject: [PATCH 11/81] feat: !new robot button --- src/components/molecules/NavBar.tsx | 48 ++++++++++++++++------------- 1 file changed, 26 insertions(+), 22 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index a401f5ea..82c1b64d 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -68,28 +68,32 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR display: 'flex', justifyContent: 'flex-end', }}> - - {isRecording ? 'New Robot' : 'Create Robot'} - + { + !isRecording ? ( + + Create Robot + + ) : "" + } { recordingLength > 0 ? From c5312e3d2f17d88e3c795e7727a927b6d8bc8f49 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:47:23 +0530 Subject: [PATCH 12/81] feat: show button based on recording state --- src/components/molecules/NavBar.tsx | 54 +++++++++++++++-------------- 1 file changed, 28 insertions(+), 26 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 82c1b64d..9baf8a10 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -70,11 +70,30 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR }}> { !isRecording ? ( - + + Create Robot + + = ({ newRecording, recordingName, isR lineHeight: '1.75', letterSpacing: '0.02857em', '&:hover': { color: 'white', backgroundColor: '#ff00c3' } - } - } - > - Create Robot - + }} onClick={logout}> + + Logout + ) : "" } { @@ -113,22 +131,6 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR exit : null} - - - Logout ) : "" From 7e5f1b807fda34490912244dd94d97bec62e8645 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:48:53 +0530 Subject: [PATCH 13/81] feat: show button based on recording state --- src/components/molecules/NavBar.tsx | 28 +++++++++++++--------------- 1 file changed, 13 insertions(+), 15 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 9baf8a10..12864b37 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -110,27 +110,25 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR Logout - ) : "" + ) : } { recordingLength > 0 ? : null } - {isRecording ? - : null} ) : "" From 18e842fc43495104951344045878e7d663f2cae4 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:50:10 +0530 Subject: [PATCH 14/81] feat: discard recording --- src/components/molecules/NavBar.tsx | 25 ++++++++++++++----------- 1 file changed, 14 insertions(+), 11 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 12864b37..ad57f7f1 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -110,19 +110,22 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR Logout - ) : + Discard } { recordingLength > 0 From 03747794b591743b6e5ea186716d8605da9273be Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:51:58 +0530 Subject: [PATCH 15/81] feat: discard icon --- src/components/molecules/NavBar.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index ad57f7f1..0da1bd2b 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -6,7 +6,7 @@ import { useGlobalInfoStore } from "../../context/globalInfo"; import { Button, IconButton } from "@mui/material"; import { RecordingIcon } from "../atoms/RecorderIcon"; import { SaveRecording } from "./SaveRecording"; -import { Circle, Add, Logout } from "@mui/icons-material"; +import { Circle, Add, Logout, Clear } from "@mui/icons-material"; import MeetingRoomIcon from '@mui/icons-material/MeetingRoom'; import { Link, useLocation, useNavigate } from 'react-router-dom'; import { AuthContext } from '../../context/auth'; @@ -124,7 +124,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR letterSpacing: '0.02857em', '&:hover': { color: 'white', backgroundColor: '#ff00c3' } }} onClick={goToMainMenu}> - + Discard } { From af6a7d58dd8e03effc6ea11b8ac0ed32786b69b5 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 21:53:00 +0530 Subject: [PATCH 16/81] feat: discard red color --- src/components/molecules/NavBar.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 0da1bd2b..a1bdf107 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -114,7 +114,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR width: '140px', borderRadius: '5px', padding: '8px', - background: '#ff00c3', + background: 'red', color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', @@ -122,7 +122,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', - '&:hover': { color: 'white', backgroundColor: '#ff00c3' } + '&:hover': { color: 'white', backgroundColor: 'red' } }} onClick={goToMainMenu}> Discard From b25a60057ee592cf1024129ef051b60707c677c8 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 22:17:56 +0530 Subject: [PATCH 17/81] feat: finish button --- src/components/molecules/SaveRecording.tsx | 23 ++++++++++++++-------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/src/components/molecules/SaveRecording.tsx b/src/components/molecules/SaveRecording.tsx index 05ff43af..b6c0d596 100644 --- a/src/components/molecules/SaveRecording.tsx +++ b/src/components/molecules/SaveRecording.tsx @@ -8,6 +8,7 @@ import { TextField, Typography } from "@mui/material"; import { WarningText } from "../atoms/texts"; import NotificationImportantIcon from "@mui/icons-material/NotificationImportant"; import FlagIcon from '@mui/icons-material/Flag'; +import { DoneAll } from '@mui/icons-material' import { useNavigate } from 'react-router-dom'; interface SaveRecordingProps { @@ -68,16 +69,22 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => { return (
- + Finish + setOpenModal(false)} modalStyle={modalStyle}>
From aa81556f745ca4841de899ba86365c8da27d3c48 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 22:22:50 +0530 Subject: [PATCH 18/81] feat: save robot --- src/components/molecules/SaveRecording.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/molecules/SaveRecording.tsx b/src/components/molecules/SaveRecording.tsx index b6c0d596..c2f6911b 100644 --- a/src/components/molecules/SaveRecording.tsx +++ b/src/components/molecules/SaveRecording.tsx @@ -87,14 +87,14 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => { setOpenModal(false)} modalStyle={modalStyle}> - - Save the recording as: + + Save the robot as @@ -104,7 +104,7 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => { - Recording already exists, please confirm the recording's overwrite. + Robot with this name already exists, please confirm the Robot's overwrite. ) : From 98af7bad705c5c0ced58dfc05c238f1eaf0f762b Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 22:50:37 +0530 Subject: [PATCH 19/81] feat: remove id --- src/components/molecules/RecordingsTable.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index 3da2a452..6cf00494 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -16,7 +16,7 @@ import { useGlobalInfoStore } from "../../context/globalInfo"; import { deleteRecordingFromStorage, getStoredRecordings } from "../../api/storage"; interface Column { - id: 'id' | 'interpret' | 'name' | 'createdAt' | 'edit' | 'updatedAt' | 'delete' | 'schedule' | 'integrate'; + id: 'interpret' | 'name' | 'createdAt' | 'edit' | 'updatedAt' | 'delete' | 'schedule' | 'integrate'; label: string; minWidth?: number; align?: 'right'; @@ -24,7 +24,6 @@ interface Column { } const columns: readonly Column[] = [ - { id: 'id', label: 'ID', minWidth: 80 }, { id: 'interpret', label: 'Run', minWidth: 80 }, { id: 'name', label: 'Name', minWidth: 80 }, { From 3b46e29cf9f4b39d22bdf5bce3f4f925ddfba498 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 22:56:04 +0530 Subject: [PATCH 20/81] feat: remove edit --- src/components/molecules/RecordingsTable.tsx | 27 ++++++++------------ 1 file changed, 11 insertions(+), 16 deletions(-) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index 6cf00494..2c2448cb 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -16,7 +16,7 @@ import { useGlobalInfoStore } from "../../context/globalInfo"; import { deleteRecordingFromStorage, getStoredRecordings } from "../../api/storage"; interface Column { - id: 'interpret' | 'name' | 'createdAt' | 'edit' | 'updatedAt' | 'delete' | 'schedule' | 'integrate'; + id: 'interpret' | 'name' | 'createdAt' | 'updatedAt' | 'delete' | 'schedule' | 'integrate'; label: string; minWidth?: number; align?: 'right'; @@ -32,11 +32,6 @@ const columns: readonly Column[] = [ minWidth: 80, //format: (value: string) => value.toLocaleString('en-US'), }, - { - id: 'edit', - label: 'Edit', - minWidth: 80, - }, { id: 'schedule', label: 'Schedule', @@ -158,16 +153,16 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl handleRunRecording(row.id, row.name, row.params || [])} /> ); - case 'edit': - return ( - - { - handleEditRecording(row.id, row.name); - }} sx={{ '&:hover': { color: '#1976d2', backgroundColor: 'transparent' } }}> - - - - ); + // case 'edit': + // return ( + // + // { + // handleEditRecording(row.id, row.name); + // }} sx={{ '&:hover': { color: '#1976d2', backgroundColor: 'transparent' } }}> + // + // + // + // ); case 'schedule': return ( From d0ca0659a0e00c95b645e0d68cb45a7e5ff3fec9 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 22:56:44 +0530 Subject: [PATCH 21/81] feat: disable edit --- src/components/molecules/RecordingsTable.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index 2c2448cb..788cae8a 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -32,6 +32,11 @@ const columns: readonly Column[] = [ minWidth: 80, //format: (value: string) => value.toLocaleString('en-US'), }, + // { + // id: 'edit', + // label: 'Edit', + // minWidth: 80, + // }, { id: 'schedule', label: 'Schedule', From 0d95f7c753bf1d38a6b078b572143c05034083b4 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:00:39 +0530 Subject: [PATCH 22/81] feat: disable createdAt updatedAt --- src/components/molecules/RecordingsTable.tsx | 26 ++++++++++---------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index 788cae8a..f48af7ed 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -16,7 +16,7 @@ import { useGlobalInfoStore } from "../../context/globalInfo"; import { deleteRecordingFromStorage, getStoredRecordings } from "../../api/storage"; interface Column { - id: 'interpret' | 'name' | 'createdAt' | 'updatedAt' | 'delete' | 'schedule' | 'integrate'; + id: 'interpret' | 'name' | 'delete' | 'schedule' | 'integrate'; label: string; minWidth?: number; align?: 'right'; @@ -26,12 +26,12 @@ interface Column { const columns: readonly Column[] = [ { id: 'interpret', label: 'Run', minWidth: 80 }, { id: 'name', label: 'Name', minWidth: 80 }, - { - id: 'createdAt', - label: 'Created at', - minWidth: 80, - //format: (value: string) => value.toLocaleString('en-US'), - }, + // { + // id: 'createdAt', + // label: 'Created at', + // minWidth: 80, + // //format: (value: string) => value.toLocaleString('en-US'), + // }, // { // id: 'edit', // label: 'Edit', @@ -47,12 +47,12 @@ const columns: readonly Column[] = [ label: 'Integrate', minWidth: 80, }, - { - id: 'updatedAt', - label: 'Updated at', - minWidth: 80, - //format: (value: string) => value.toLocaleString('en-US'), - }, + // { + // id: 'updatedAt', + // label: 'Updated at', + // minWidth: 80, + // //format: (value: string) => value.toLocaleString('en-US'), + // }, { id: 'delete', label: 'Delete', From 82e705264c428039bcca5901c195d84a274eb909 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:05:15 +0530 Subject: [PATCH 23/81] chore: todo --- src/components/molecules/RecordingsTable.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index f48af7ed..cb300c28 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -15,6 +15,11 @@ import LinkIcon from '@mui/icons-material/Link'; import { useGlobalInfoStore } from "../../context/globalInfo"; import { deleteRecordingFromStorage, getStoredRecordings } from "../../api/storage"; +/** TODO: + * 1. allow editing existing robot after persisting browser steps + * 2. show robot settings: id, url, etc. +*/ + interface Column { id: 'interpret' | 'name' | 'delete' | 'schedule' | 'integrate'; label: string; From 011959a056521bbdbac482c689284e1db2541fd5 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:10:35 +0530 Subject: [PATCH 24/81] feat: outlined variant --- src/components/organisms/MainMenu.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/organisms/MainMenu.tsx b/src/components/organisms/MainMenu.tsx index 6d8c6324..6391d83e 100644 --- a/src/components/organisms/MainMenu.tsx +++ b/src/components/organisms/MainMenu.tsx @@ -20,9 +20,10 @@ export const MainMenu = ({ value = 'recordings', handleChangeContent }: MainMenu sx={{ height: 'auto', maxWidth: 'fit-content', - backgroundColor: 'lightgray', + backgroundColor: 'white', paddingTop: '2rem', }} + variant="outlined" > Date: Thu, 10 Oct 2024 23:11:24 +0530 Subject: [PATCH 25/81] feat: rename to robots --- src/components/organisms/MainMenu.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/organisms/MainMenu.tsx b/src/components/organisms/MainMenu.tsx index 6391d83e..713452df 100644 --- a/src/components/organisms/MainMenu.tsx +++ b/src/components/organisms/MainMenu.tsx @@ -39,7 +39,7 @@ export const MainMenu = ({ value = 'recordings', handleChangeContent }: MainMenu + }} value="recordings" label="Robots" /> Date: Thu, 10 Oct 2024 23:15:28 +0530 Subject: [PATCH 26/81] feat: set width 250px --- src/components/organisms/MainMenu.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/organisms/MainMenu.tsx b/src/components/organisms/MainMenu.tsx index 713452df..4cb10b3a 100644 --- a/src/components/organisms/MainMenu.tsx +++ b/src/components/organisms/MainMenu.tsx @@ -19,7 +19,8 @@ export const MainMenu = ({ value = 'recordings', handleChangeContent }: MainMenu Date: Thu, 10 Oct 2024 23:24:39 +0530 Subject: [PATCH 27/81] feat: set width 250px --- src/components/organisms/MainMenu.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/organisms/MainMenu.tsx b/src/components/organisms/MainMenu.tsx index 4cb10b3a..9be030e4 100644 --- a/src/components/organisms/MainMenu.tsx +++ b/src/components/organisms/MainMenu.tsx @@ -20,7 +20,6 @@ export const MainMenu = ({ value = 'recordings', handleChangeContent }: MainMenu sx={{ height: 'auto', width: '250px', - maxWidth: '100%', backgroundColor: 'white', paddingTop: '2rem', }} From 6c77f87e36d68f7c6d6c6733ce0281691833b4cc Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:26:40 +0530 Subject: [PATCH 28/81] feat: set overflow hidden html --- src/index.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.css b/src/index.css index 1d4c3871..887eda85 100644 --- a/src/index.css +++ b/src/index.css @@ -19,5 +19,5 @@ code { } html { - overflow-y:scroll; + overflow: hidden; } From 266ebfa545e0bb0706d74ccf2677bd359c6a8ad7 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:29:25 +0530 Subject: [PATCH 29/81] fix: revert --- src/index.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.css b/src/index.css index 887eda85..1d4c3871 100644 --- a/src/index.css +++ b/src/index.css @@ -19,5 +19,5 @@ code { } html { - overflow: hidden; + overflow-y:scroll; } From afb3f8d2f2fe4c59f372826471a58dbab4a371de Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:42:02 +0530 Subject: [PATCH 30/81] feat: my robots --- src/components/molecules/RecordingsTable.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index cb300c28..dffcfc17 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -14,6 +14,7 @@ import { Schedule, DeleteForever, Edit, PlayCircle } from "@mui/icons-material"; import LinkIcon from '@mui/icons-material/Link'; import { useGlobalInfoStore } from "../../context/globalInfo"; import { deleteRecordingFromStorage, getStoredRecordings } from "../../api/storage"; +import { Typography } from '@mui/material'; /** TODO: * 1. allow editing existing robot after persisting browser steps @@ -125,6 +126,9 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl return ( + + My Robots + From 3d30825d109eedafd1bd8f3489b515c0fcb3bae1 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:44:51 +0530 Subject: [PATCH 31/81] feat: margintop --- src/components/molecules/RecordingsTable.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx index dffcfc17..904b6011 100644 --- a/src/components/molecules/RecordingsTable.tsx +++ b/src/components/molecules/RecordingsTable.tsx @@ -129,7 +129,7 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl My Robots - +
From ce4c25f1e779344e9e9b112d54eaef1e8d0a3ff7 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:49:56 +0530 Subject: [PATCH 32/81] feat: robot name --- src/components/molecules/RunsTable.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RunsTable.tsx b/src/components/molecules/RunsTable.tsx index 7f414c58..5e60fe9e 100644 --- a/src/components/molecules/RunsTable.tsx +++ b/src/components/molecules/RunsTable.tsx @@ -25,7 +25,7 @@ interface Column { export const columns: readonly Column[] = [ { id: 'status', label: 'Status', minWidth: 80 }, - { id: 'name', label: 'Name', minWidth: 80 }, + { id: 'name', label: 'Robot Name', minWidth: 80 }, { id: 'startedAt', label: 'Started at', minWidth: 80 }, { id: 'finishedAt', label: 'Finished at', minWidth: 80 }, { id: 'duration', label: 'Duration', minWidth: 80 }, From c80a5f337e3257f2dd29cf72cd15b4b5b2979eed Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:52:19 +0530 Subject: [PATCH 33/81] feat: remove duration --- src/components/molecules/RunsTable.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/molecules/RunsTable.tsx b/src/components/molecules/RunsTable.tsx index 5e60fe9e..c55b3482 100644 --- a/src/components/molecules/RunsTable.tsx +++ b/src/components/molecules/RunsTable.tsx @@ -16,7 +16,7 @@ import { Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/ import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; interface Column { - id: 'status' | 'name' | 'startedAt' | 'finishedAt' | 'duration' | 'task' | 'runId' | 'delete'; + id: 'status' | 'name' | 'startedAt' | 'finishedAt' | 'task' | 'runId' | 'delete'; label: string; minWidth?: number; align?: 'right'; @@ -28,9 +28,8 @@ export const columns: readonly Column[] = [ { id: 'name', label: 'Robot Name', minWidth: 80 }, { id: 'startedAt', label: 'Started at', minWidth: 80 }, { id: 'finishedAt', label: 'Finished at', minWidth: 80 }, - { id: 'duration', label: 'Duration', minWidth: 80 }, { id: 'runId', label: 'Run id', minWidth: 80 }, - { id: 'task', label: 'Task', minWidth: 80 }, + // { id: 'task', label: 'Task', minWidth: 80 }, { id: 'delete', label: 'Delete', minWidth: 80 }, ]; @@ -40,7 +39,6 @@ export interface Data { name: string; startedAt: string; finishedAt: string; - duration: string; task: string; log: string; runId: string; From 77931809ea495f31f868f03a69f4c6bc691e3ded Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:53:36 +0530 Subject: [PATCH 34/81] feat: disable task --- src/components/molecules/RunsTable.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/molecules/RunsTable.tsx b/src/components/molecules/RunsTable.tsx index c55b3482..4a67c85c 100644 --- a/src/components/molecules/RunsTable.tsx +++ b/src/components/molecules/RunsTable.tsx @@ -16,7 +16,7 @@ import { Accordion, AccordionSummary, AccordionDetails, Typography } from '@mui/ import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; interface Column { - id: 'status' | 'name' | 'startedAt' | 'finishedAt' | 'task' | 'runId' | 'delete'; + id: 'status' | 'name' | 'startedAt' | 'finishedAt' | 'runId' | 'delete'; label: string; minWidth?: number; align?: 'right'; @@ -39,7 +39,7 @@ export interface Data { name: string; startedAt: string; finishedAt: string; - task: string; + // task: string; log: string; runId: string; interpreterSettings: RunSettings; From 0f0b341c2a0122bfc48bde0d8ec2813f99a5d6f7 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:58:30 +0530 Subject: [PATCH 35/81] feat: run ID --- src/components/molecules/RunsTable.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RunsTable.tsx b/src/components/molecules/RunsTable.tsx index 4a67c85c..7f36659f 100644 --- a/src/components/molecules/RunsTable.tsx +++ b/src/components/molecules/RunsTable.tsx @@ -28,7 +28,7 @@ export const columns: readonly Column[] = [ { id: 'name', label: 'Robot Name', minWidth: 80 }, { id: 'startedAt', label: 'Started at', minWidth: 80 }, { id: 'finishedAt', label: 'Finished at', minWidth: 80 }, - { id: 'runId', label: 'Run id', minWidth: 80 }, + { id: 'runId', label: 'Run ID', minWidth: 80 }, // { id: 'task', label: 'Task', minWidth: 80 }, { id: 'delete', label: 'Delete', minWidth: 80 }, ]; From 1ff5598fc8b022d3cc642679e50c775e6b48a33d Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Thu, 10 Oct 2024 23:59:32 +0530 Subject: [PATCH 36/81] feat: rm json.parse run --- src/components/molecules/RunsTable.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/molecules/RunsTable.tsx b/src/components/molecules/RunsTable.tsx index 7f36659f..01b940c2 100644 --- a/src/components/molecules/RunsTable.tsx +++ b/src/components/molecules/RunsTable.tsx @@ -76,7 +76,6 @@ export const RunsTable = ( if (runs) { const parsedRows: Data[] = []; runs.map((run: any, index) => { - // const run = JSON.parse(run); parsedRows.push({ id: index, ...run, From 520594d57e01995bfe8e6e4ccc23001c9654e2c9 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 00:28:23 +0530 Subject: [PATCH 37/81] feat: disable log --- src/components/molecules/RunContent.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index 5b219f16..bd109ac8 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -31,7 +31,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe setTab(newTab)} aria-label="run-content-tabs"> - + {/* */} From b13b74ea87f0a6246854277e1640212f240e5200 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 00:45:04 +0530 Subject: [PATCH 38/81] feat: output data --- src/components/molecules/RunContent.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index bd109ac8..c70eec7b 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -33,7 +33,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe setTab(newTab)} aria-label="run-content-tabs"> {/* */} - + From 643faeb3c0376b30399ea648c2badeb38238b199 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 01:19:05 +0530 Subject: [PATCH 39/81] feat: show output data in table --- src/components/molecules/RunContent.tsx | 87 ++++++++++++++++++------- 1 file changed, 62 insertions(+), 25 deletions(-) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index c70eec7b..5374f978 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -1,4 +1,4 @@ -import { Box, Tabs, Typography, Tab } from "@mui/material"; +import { Box, Tabs, Typography, Tab, Paper } from "@mui/material"; import Highlight from "react-highlight"; import Button from "@mui/material/Button"; import * as React from "react"; @@ -8,8 +8,14 @@ import SettingsIcon from '@mui/icons-material/Settings'; import ImageIcon from '@mui/icons-material/Image'; import ArticleIcon from '@mui/icons-material/Article'; import { Buffer } from 'buffer'; -import { useEffect } from "react"; +import { useEffect, useState } from "react"; import AssignmentIcon from '@mui/icons-material/Assignment'; +import Table from '@mui/material/Table'; +import TableBody from '@mui/material/TableBody'; +import TableCell from '@mui/material/TableCell'; +import TableContainer from '@mui/material/TableContainer'; +import TableHead from '@mui/material/TableHead'; +import TableRow from '@mui/material/TableRow'; interface RunContentProps { row: Data, @@ -21,11 +27,26 @@ interface RunContentProps { export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRef, abortRunHandler }: RunContentProps) => { const [tab, setTab] = React.useState('log'); + const [tableData, setTableData] = useState([]); + const [columns, setColumns] = useState([]); useEffect(() => { setTab(tab); }, [interpretationInProgress]) + useEffect(() => { + if (row.serializableOutput && Object.keys(row.serializableOutput).length > 0) { + const firstKey = Object.keys(row.serializableOutput)[0]; + const data = row.serializableOutput[firstKey]; + if (Array.isArray(data)) { + setTableData(data); + if (data.length > 0) { + setColumns(Object.keys(data[0])); + } + } + } + }, [row.serializableOutput]); + return ( @@ -102,34 +123,50 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0) ? The output is empty. : null} +{!row || !row.serializableOutput || !row.binaryOutput + || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0) + ? The output is empty. : null} + {row.serializableOutput && Object.keys(row.serializableOutput).length !== 0 &&
- Serializable output - {Object.keys(row.serializableOutput).map((key) => { - return ( -
- - {key}: - Download - - - 
-                        {row.serializableOutput[key] ? JSON.stringify(row.serializableOutput[key], null, 2)
-                          : 'The output is empty.'}
-
- -
- ) - })} + Serializable output + + {tableData.length > 0 ? ( + +
+ + + {columns.map((column) => ( + {column} + ))} + + + + {tableData.map((row, index) => ( + + {columns.map((column) => ( + {row[column]} + ))} + + ))} + +
+ + ) : ( + + 
+                    {JSON.stringify(row.serializableOutput, null, 2)}
+
+ + )}
} {row.binaryOutput From 0378652bfafe037f5fcb4f631c53d95eaa7172f3 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 01:19:21 +0530 Subject: [PATCH 40/81] chore: lint --- src/components/molecules/RunContent.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index 5374f978..8c8199c0 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -123,7 +123,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0) ? The output is empty. : null} -{!row || !row.serializableOutput || !row.binaryOutput + {!row || !row.serializableOutput || !row.binaryOutput || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0) ? The output is empty. : null} From 7605b9fc1413159cbc395ce366a256dde78a793d Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 01:29:43 +0530 Subject: [PATCH 41/81] feat: remove duplicate code --- src/components/molecules/RunContent.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index 8c8199c0..3558f913 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -123,10 +123,6 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0) ? The output is empty. : null} - {!row || !row.serializableOutput || !row.binaryOutput - || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0) - ? The output is empty. : null} - {row.serializableOutput && Object.keys(row.serializableOutput).length !== 0 &&
From 4c98b1953d2b07ed15710f2168c45ce047e63c1e Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 01:59:50 +0530 Subject: [PATCH 42/81] feat: download JSON --- src/components/molecules/RunContent.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index 3558f913..05b065e0 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -130,6 +130,17 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe Serializable output + {Object.keys(row.serializableOutput).map((key) => { + return ( +
+ + {key}: + Download + +
+ ) + })} {tableData.length > 0 ? ( From a9b71ddd038bba1e89eb2ef6b683cfec5108ec79 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 02:01:25 +0530 Subject: [PATCH 43/81] feat: download as JSON --- src/components/molecules/RunContent.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx index 05b065e0..2ac4d369 100644 --- a/src/components/molecules/RunContent.tsx +++ b/src/components/molecules/RunContent.tsx @@ -136,7 +136,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe {key}: Download + download={key} style={{ margin: '10px' }}>Download as JSON ) From 1592416dc79140a5da26d791a02fa011db0e46d9 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 02:53:45 +0530 Subject: [PATCH 44/81] feat: !color error --- src/components/organisms/ApiKey.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/organisms/ApiKey.tsx b/src/components/organisms/ApiKey.tsx index 030194de..4053d4dd 100644 --- a/src/components/organisms/ApiKey.tsx +++ b/src/components/organisms/ApiKey.tsx @@ -117,7 +117,7 @@ const ApiKeyManager = () => { - + From 96cfa0f66ecd8858a487c5d0b1ce38f3933a3e75 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 02:54:14 +0530 Subject: [PATCH 45/81] feat: cleaner tooltip --- src/components/organisms/ApiKey.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/ApiKey.tsx b/src/components/organisms/ApiKey.tsx index 4053d4dd..bdc393e7 100644 --- a/src/components/organisms/ApiKey.tsx +++ b/src/components/organisms/ApiKey.tsx @@ -106,17 +106,17 @@ const ApiKeyManager = () => { {apiKeyName} {showKey ? `${apiKey?.substring(0, 10)}...` : '***************'} - + - + setShowKey(!showKey)}> - + From 4c46f726fbee629abe3717e675bff07dccd2ad63 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 02:54:30 +0530 Subject: [PATCH 46/81] chore: lint --- src/components/organisms/ApiKey.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/organisms/ApiKey.tsx b/src/components/organisms/ApiKey.tsx index bdc393e7..7bcf728d 100644 --- a/src/components/organisms/ApiKey.tsx +++ b/src/components/organisms/ApiKey.tsx @@ -89,7 +89,7 @@ const ApiKeyManager = () => { return ( - Manage Your API Key + Manage Your API Key {apiKey ? ( @@ -129,7 +129,7 @@ const ApiKeyManager = () => { ) : ( <> You haven't generated an API key yet. - From 18e52fcc9e8507c41080cad4fd888d74e15198c6 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 02:57:36 +0530 Subject: [PATCH 47/81] feat: better ui --- src/components/organisms/ProxyForm.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index 3c6b9a80..914824fd 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -8,8 +8,6 @@ const FormContainer = styled(Box)({ display: 'flex', flexDirection: 'column', gap: '16px', - padding: '20px', - borderRadius: '8px', }); const FormControl = styled(Box)({ @@ -85,7 +83,7 @@ const ProxyForm: React.FC = () => { return ( - + Proxy Configuration @@ -147,7 +145,7 @@ const ProxyForm: React.FC = () => { > Add Proxy - + ); }; From 9713c52822bf89e452050793eb6b2dc92c66f7e7 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 02:59:21 +0530 Subject: [PATCH 48/81] feat: align items center --- src/components/organisms/ProxyForm.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index 914824fd..1cebaac0 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -7,6 +7,7 @@ import { useGlobalInfoStore } from '../../context/globalInfo'; const FormContainer = styled(Box)({ display: 'flex', flexDirection: 'column', + alignItems: 'center', gap: '16px', }); From f975c3743d6c83b9dd6436fe0146488f4f3f741d Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 03:03:22 +0530 Subject: [PATCH 49/81] feat: use typography h6 --- src/components/organisms/ProxyForm.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index 1cebaac0..c95cb3ef 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -7,7 +7,6 @@ import { useGlobalInfoStore } from '../../context/globalInfo'; const FormContainer = styled(Box)({ display: 'flex', flexDirection: 'column', - alignItems: 'center', gap: '16px', }); @@ -84,10 +83,10 @@ const ProxyForm: React.FC = () => { return ( - - + Proxy Configuration + Date: Fri, 11 Oct 2024 03:04:23 +0530 Subject: [PATCH 50/81] chore: lint --- src/components/organisms/ProxyForm.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index c95cb3ef..43792087 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -83,9 +83,9 @@ const ProxyForm: React.FC = () => { return ( - - Proxy Configuration - + + Proxy Configuration + Date: Fri, 11 Oct 2024 03:07:11 +0530 Subject: [PATCH 51/81] feat: margin left --- src/components/organisms/ProxyForm.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index 43792087..f940eb19 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -8,6 +8,7 @@ const FormContainer = styled(Box)({ display: 'flex', flexDirection: 'column', gap: '16px', + marginLeft: '30px' }); const FormControl = styled(Box)({ From 70e0b7cabd12f16f1a90d8a40a00c8ee63a1873c Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 03:09:14 +0530 Subject: [PATCH 52/81] feat: proxy helper text --- src/components/organisms/ProxyForm.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index f940eb19..a799490d 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -97,9 +97,9 @@ const ProxyForm: React.FC = () => { fullWidth required error={!!errors.server_url} - helperText={errors.server_url || `Proxy to be used for all requests. - HTTP and SOCKS proxies are supported, for example http://myproxy.com:3128 or - socks5://myproxy.com:3128. Short form myproxy.com:3128 is considered an HTTP proxy.`} + helperText={errors.server_url || `Proxy to be used for all robots. HTTP and SOCKS proxies are supported. + Example http://myproxy.com:3128 or socks5://myproxy.com:3128. + Short form myproxy.com:3128 is considered an HTTP proxy.`} /> From af016302e264251d79c019d679eaf9b8aa5f58e4 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 03:11:03 +0530 Subject: [PATCH 53/81] feat: use typography h6 --- src/components/organisms/ApiKey.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/organisms/ApiKey.tsx b/src/components/organisms/ApiKey.tsx index 7bcf728d..d2f85d90 100644 --- a/src/components/organisms/ApiKey.tsx +++ b/src/components/organisms/ApiKey.tsx @@ -89,7 +89,7 @@ const ApiKeyManager = () => { return ( - Manage Your API Key + Manage Your API Key {apiKey ? ( From 4b8eb6ae252516f2a7d9c55800f87cdebfb8f6ac Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 03:15:21 +0530 Subject: [PATCH 54/81] feat: alignSelf flex start --- src/components/organisms/ApiKey.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/organisms/ApiKey.tsx b/src/components/organisms/ApiKey.tsx index d2f85d90..f973c0ea 100644 --- a/src/components/organisms/ApiKey.tsx +++ b/src/components/organisms/ApiKey.tsx @@ -89,7 +89,9 @@ const ApiKeyManager = () => { return ( - Manage Your API Key + + Manage Your API Key + {apiKey ? ( From b2024121aa8fdb71f7bf3784ada6bf7355cfc515 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 03:15:36 +0530 Subject: [PATCH 55/81] fix: whitespace --- src/components/organisms/ApiKey.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/organisms/ApiKey.tsx b/src/components/organisms/ApiKey.tsx index f973c0ea..35dbd033 100644 --- a/src/components/organisms/ApiKey.tsx +++ b/src/components/organisms/ApiKey.tsx @@ -92,7 +92,6 @@ const ApiKeyManager = () => { Manage Your API Key - {apiKey ? (
From c64dc2c9fce9e0f2186c60a773e6386ecd06782f Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 03:18:25 +0530 Subject: [PATCH 56/81] fix: whitespace --- src/components/molecules/NavBar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index a1bdf107..dee9ea26 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -91,7 +91,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR } } > - Create Robot + Create Robot Date: Fri, 11 Oct 2024 03:23:30 +0530 Subject: [PATCH 57/81] temp: GenericModal styling revert --- src/components/atoms/GenericModal.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/atoms/GenericModal.tsx b/src/components/atoms/GenericModal.tsx index bb6dc77f..56b3df43 100644 --- a/src/components/atoms/GenericModal.tsx +++ b/src/components/atoms/GenericModal.tsx @@ -33,13 +33,13 @@ const defaultModalStyle = { top: '50%', left: '50%', transform: 'translate(-50%, -50%)', - width: '50%', + width: 500, bgcolor: 'background.paper', boxShadow: 24, p: 4, height: '30%', display: 'block', - overflow: 'hidden', + overflow: 'scroll', padding: '5px 25px 10px 25px', zIndex: 3147483647, -}; +}; \ No newline at end of file From e8aea59f92322af6412fb00db1779d3cd9f69cd3 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 04:48:25 +0530 Subject: [PATCH 58/81] feat: accept url --- src/components/molecules/NavBar.tsx | 35 +++++++++++++++++++++++++++-- 1 file changed, 33 insertions(+), 2 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index dee9ea26..56762422 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -10,6 +10,8 @@ import { Circle, Add, Logout, Clear } from "@mui/icons-material"; import MeetingRoomIcon from '@mui/icons-material/MeetingRoom'; import { Link, useLocation, useNavigate } from 'react-router-dom'; import { AuthContext } from '../../context/auth'; +import { GenericModal } from '../atoms/GenericModal'; +import TextField from '@mui/material/TextField'; interface NavBarProps { newRecording: () => void; @@ -22,6 +24,9 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR const { notify, browserId, setBrowserId, recordingLength } = useGlobalInfoStore(); const { state, dispatch } = useContext(AuthContext); const { user } = state; + const [isModalOpen, setModalOpen] = useState(false); + const [url, setUrl] = useState(''); + const navigate = useNavigate(); const logout = async () => { @@ -48,9 +53,14 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR setBrowserId(null); await stopRecording(browserId); } + setModalOpen(true); + }; + + const startRecording = () => { + setModalOpen(false); newRecording(); - notify('info', 'New Recording started'); - } + notify('info', 'New Recording started for ' + url); + }; return ( @@ -133,6 +143,27 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR : null } + setModalOpen(false)}> +
+

Enter URL

+ setUrl(e.target.value)} + style={{ marginBottom: '20px' }} + /> + +
+ ) : "" } From 8d5b286c001ab67dd6869d898e29729462c2ae1b Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 04:49:47 +0530 Subject: [PATCH 59/81] chore: lint --- src/components/molecules/NavBar.tsx | 42 ++++++++++++++--------------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 56762422..2bd5a8ef 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -101,7 +101,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR } } > - Create Robot + Create Robot = ({ newRecording, recordingName, isR } setModalOpen(false)}> -
-

Enter URL

- setUrl(e.target.value)} - style={{ marginBottom: '20px' }} - /> - -
- +
+

Enter URL

+ setUrl(e.target.value)} + style={{ marginBottom: '20px' }} + /> + +
+ ) : "" } From 2ed09970e9b17c225a71f9e56e9a7af39abeaf30 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 04:51:19 +0530 Subject: [PATCH 60/81] feat: recordingURl --- src/context/globalInfo.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/context/globalInfo.tsx b/src/context/globalInfo.tsx index 7e7a3826..9b8934a1 100644 --- a/src/context/globalInfo.tsx +++ b/src/context/globalInfo.tsx @@ -20,6 +20,8 @@ interface GlobalInfo { setRecordingId: (newId: string | null) => void; recordingName: string; setRecordingName: (recordingName: string) => void; + recordingUrl: string; + setRecordingUrl: (recordingUrl: string) => void; }; class GlobalInfoStore implements Partial { @@ -35,6 +37,7 @@ class GlobalInfoStore implements Partial { recordings: string[] = []; rerenderRuns = false; recordingName = ''; + recordingUrl = ''; }; const globalInfoStore = new GlobalInfoStore(); @@ -51,6 +54,7 @@ export const GlobalInfoProvider = ({ children }: { children: JSX.Element }) => { const [recordingLength, setRecordingLength] = useState(globalInfoStore.recordingLength); const [recordingId, setRecordingId] = useState(globalInfoStore.recordingId); const [recordingName, setRecordingName] = useState(globalInfoStore.recordingName); + const [recordingUrl, setRecordingUrl] = useState(globalInfoStore.recordingUrl); const notify = (severity: 'error' | 'warning' | 'info' | 'success', message: string) => { setNotification({ severity, message, isOpen: true }); @@ -86,7 +90,9 @@ export const GlobalInfoProvider = ({ children }: { children: JSX.Element }) => { recordingId, setRecordingId, recordingName, - setRecordingName + setRecordingName, + recordingUrl, + setRecordingUrl, }} > {children} From 08abedee03933fb6726b6ca4888baa761e720810 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 04:57:48 +0530 Subject: [PATCH 61/81] feat: use recordingUrl --- src/components/molecules/NavBar.tsx | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index 2bd5a8ef..f06bebd3 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -21,11 +21,12 @@ interface NavBarProps { export const NavBar: React.FC = ({ newRecording, recordingName, isRecording }) => { - const { notify, browserId, setBrowserId, recordingLength } = useGlobalInfoStore(); + const { notify, browserId, setBrowserId, recordingLength, recordingUrl, setRecordingUrl } = useGlobalInfoStore(); const { state, dispatch } = useContext(AuthContext); const { user } = state; const [isModalOpen, setModalOpen] = useState(false); - const [url, setUrl] = useState(''); + + console.log(`Recording URL: ${recordingUrl}`) const navigate = useNavigate(); @@ -59,7 +60,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR const startRecording = () => { setModalOpen(false); newRecording(); - notify('info', 'New Recording started for ' + url); + notify('info', 'New Recording started for ' + recordingUrl); }; return ( @@ -150,15 +151,15 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR label="URL" variant="outlined" fullWidth - value={url} - onChange={(e: any) => setUrl(e.target.value)} + value={recordingUrl} + onChange={(e: any) => setRecordingUrl(e.target.value)} style={{ marginBottom: '20px' }} /> From c3fe08a54d92ea0f81a1c5a64ae81e3c4efe1519 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 05:01:01 +0530 Subject: [PATCH 62/81] feat: use https:// --- src/context/globalInfo.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/context/globalInfo.tsx b/src/context/globalInfo.tsx index 9b8934a1..137ce14c 100644 --- a/src/context/globalInfo.tsx +++ b/src/context/globalInfo.tsx @@ -37,7 +37,7 @@ class GlobalInfoStore implements Partial { recordings: string[] = []; rerenderRuns = false; recordingName = ''; - recordingUrl = ''; + recordingUrl = 'https://'; }; const globalInfoStore = new GlobalInfoStore(); From b8e12cba35a89d932da056eb8ea9f6b02f8d7b09 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 05:48:20 +0530 Subject: [PATCH 63/81] feat: use recordingUrl instead of currentUrl --- src/components/molecules/BrowserNavBar.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/molecules/BrowserNavBar.tsx b/src/components/molecules/BrowserNavBar.tsx index b35e4d7f..ad4e7d2d 100644 --- a/src/components/molecules/BrowserNavBar.tsx +++ b/src/components/molecules/BrowserNavBar.tsx @@ -12,6 +12,7 @@ import { UrlForm } from './UrlForm'; import { useCallback, useEffect, useState } from "react"; import { useSocketStore } from "../../context/socket"; import { getCurrentUrl } from "../../api/recording"; +import { useGlobalInfoStore } from '../../context/globalInfo'; const StyledNavBar = styled.div<{ browserWidth: number }>` display: flex; @@ -31,8 +32,7 @@ const BrowserNavBar: FC = ({ }) => { const { socket } = useSocketStore(); - - const [currentUrl, setCurrentUrl] = useState('https://'); + const { recordingUrl, setRecordingUrl } = useGlobalInfoStore(); const handleRefresh = useCallback((): void => { socket?.emit('input:refresh'); @@ -44,14 +44,13 @@ const BrowserNavBar: FC = ({ const handleCurrentUrlChange = useCallback((url: string) => { handleUrlChanged(url); - setCurrentUrl(url); - }, [handleUrlChanged, currentUrl]); + setRecordingUrl(url); + }, [handleUrlChanged, recordingUrl]); useEffect(() => { getCurrentUrl().then((response) => { if (response) { handleUrlChanged(response); - setCurrentUrl(response); } }).catch((error) => { console.log("Fetching current url failed"); @@ -72,6 +71,7 @@ const BrowserNavBar: FC = ({ const addAddress = (address: string) => { if (socket) { handleUrlChanged(address); + setRecordingUrl(address); handleGoTo(address); } }; @@ -111,7 +111,7 @@ const BrowserNavBar: FC = ({ From f8ea0aeefc95285624534c8c8747de4c36f7db01 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 05:51:14 +0530 Subject: [PATCH 64/81] feat: ensure manual & programmatic url works --- src/components/molecules/UrlForm.tsx | 46 +++++++++++++--------------- 1 file changed, 21 insertions(+), 25 deletions(-) diff --git a/src/components/molecules/UrlForm.tsx b/src/components/molecules/UrlForm.tsx index a6681ab9..336fd7a7 100644 --- a/src/components/molecules/UrlForm.tsx +++ b/src/components/molecules/UrlForm.tsx @@ -1,7 +1,6 @@ -import { useState, useCallback, useEffect, } from 'react'; -import type { SyntheticEvent, } from 'react'; +import { useState, useEffect, useCallback } from 'react'; +import type { SyntheticEvent } from 'react'; import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight'; - import { NavBarForm, NavBarInput } from "../atoms/form"; import { UrlFormButton } from "../atoms/buttons/buttons"; import { useSocketStore } from '../../context/socket'; @@ -18,44 +17,41 @@ export const UrlForm = ({ handleRefresh, setCurrentAddress, }: Props) => { - // states: + // Internal address state, initially set to currentAddress. We need this else the input field will not update with recordingUrl const [address, setAddress] = useState(currentAddress); - // context: const { socket } = useSocketStore(); - const areSameAddresses = address === currentAddress; - const onChange = useCallback((event: SyntheticEvent): void => { setAddress((event.target as HTMLInputElement).value); - }, [address]); + }, []); const onSubmit = (event: SyntheticEvent): void => { event.preventDefault(); let url = address; - // add protocol if missing - if (!/^(?:f|ht)tps?\:\/\//.test(address)) { - url = "https://" + address; - setAddress(url); + // If no manual change, use the currentAddress prop + if (address === currentAddress) { + url = currentAddress; } - if (areSameAddresses) { - if (socket) { - handleRefresh(socket); - } - } else { - try { - // try the validity of url - new URL(url); - setCurrentAddress(url); - } catch (e) { - alert(`ERROR: ${url} is not a valid url!`); - } + // Add protocol if missing + if (!/^(?:f|ht)tps?\:\/\//.test(url)) { + url = "https://" + url; + setAddress(url); // Update the input field to reflect protocol addition + } + + try { + // Validate the URL + new URL(url); + setCurrentAddress(url); + } catch (e) { + alert(`ERROR: ${url} is not a valid url!`); } }; + // Sync internal state with currentAddress prop when it changes useEffect(() => { - setAddress(currentAddress) + setAddress(currentAddress); }, [currentAddress]); return ( From 44739eb65d4f7592300c424c7279fbaafe0c102d Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 06:01:02 +0530 Subject: [PATCH 65/81] chore: todo --- src/components/molecules/UrlForm.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/components/molecules/UrlForm.tsx b/src/components/molecules/UrlForm.tsx index 336fd7a7..f790bcfa 100644 --- a/src/components/molecules/UrlForm.tsx +++ b/src/components/molecules/UrlForm.tsx @@ -6,6 +6,8 @@ import { UrlFormButton } from "../atoms/buttons/buttons"; import { useSocketStore } from '../../context/socket'; import { Socket } from "socket.io-client"; +// TODO: Bring back REFRESH + type Props = { currentAddress: string; handleRefresh: (socket: Socket) => void; From fb7a998175d0f495c525dc42957f3e4e5d6e1193 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 06:14:40 +0530 Subject: [PATCH 66/81] feat: auto form submission --- src/components/molecules/UrlForm.tsx | 29 +++++++++++++--------------- 1 file changed, 13 insertions(+), 16 deletions(-) diff --git a/src/components/molecules/UrlForm.tsx b/src/components/molecules/UrlForm.tsx index f790bcfa..9853d64a 100644 --- a/src/components/molecules/UrlForm.tsx +++ b/src/components/molecules/UrlForm.tsx @@ -1,4 +1,4 @@ -import { useState, useEffect, useCallback } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import type { SyntheticEvent } from 'react'; import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight'; import { NavBarForm, NavBarInput } from "../atoms/form"; @@ -6,8 +6,6 @@ import { UrlFormButton } from "../atoms/buttons/buttons"; import { useSocketStore } from '../../context/socket'; import { Socket } from "socket.io-client"; -// TODO: Bring back REFRESH - type Props = { currentAddress: string; handleRefresh: (socket: Socket) => void; @@ -19,7 +17,6 @@ export const UrlForm = ({ handleRefresh, setCurrentAddress, }: Props) => { - // Internal address state, initially set to currentAddress. We need this else the input field will not update with recordingUrl const [address, setAddress] = useState(currentAddress); const { socket } = useSocketStore(); @@ -27,15 +24,7 @@ export const UrlForm = ({ setAddress((event.target as HTMLInputElement).value); }, []); - const onSubmit = (event: SyntheticEvent): void => { - event.preventDefault(); - let url = address; - - // If no manual change, use the currentAddress prop - if (address === currentAddress) { - url = currentAddress; - } - + const submitForm = useCallback((url: string): void => { // Add protocol if missing if (!/^(?:f|ht)tps?\:\/\//.test(url)) { url = "https://" + url; @@ -49,12 +38,20 @@ export const UrlForm = ({ } catch (e) { alert(`ERROR: ${url} is not a valid url!`); } + }, [setCurrentAddress]); + + const onSubmit = (event: SyntheticEvent): void => { + event.preventDefault(); + submitForm(address); }; - // Sync internal state with currentAddress prop when it changes + // Sync internal state with currentAddress prop when it changes and auto-submit useEffect(() => { setAddress(currentAddress); - }, [currentAddress]); + if (currentAddress !== '') { + submitForm(currentAddress); + } + }, [currentAddress, submitForm]); return ( @@ -68,4 +65,4 @@ export const UrlForm = ({ ); -}; +}; \ No newline at end of file From 6cd30f49798a52792cae026fc7f51ab64b82ce0c Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 06:17:58 +0530 Subject: [PATCH 67/81] fix: infinite loop while auto-submit --- src/components/molecules/UrlForm.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/components/molecules/UrlForm.tsx b/src/components/molecules/UrlForm.tsx index 9853d64a..8540fab7 100644 --- a/src/components/molecules/UrlForm.tsx +++ b/src/components/molecules/UrlForm.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect, useCallback } from 'react'; +import React, { useState, useEffect, useCallback, useRef } from 'react'; import type { SyntheticEvent } from 'react'; import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight'; import { NavBarForm, NavBarInput } from "../atoms/form"; @@ -19,6 +19,7 @@ export const UrlForm = ({ }: Props) => { const [address, setAddress] = useState(currentAddress); const { socket } = useSocketStore(); + const lastSubmittedRef = useRef(''); const onChange = useCallback((event: SyntheticEvent): void => { setAddress((event.target as HTMLInputElement).value); @@ -34,7 +35,8 @@ export const UrlForm = ({ try { // Validate the URL new URL(url); - setCurrentAddress(url); + setCurrentAddress(url); + lastSubmittedRef.current = url; // Update the last submitted URL } catch (e) { alert(`ERROR: ${url} is not a valid url!`); } @@ -45,10 +47,10 @@ export const UrlForm = ({ submitForm(address); }; - // Sync internal state with currentAddress prop when it changes and auto-submit + // Sync internal state with currentAddress prop when it changes and auto-submit once useEffect(() => { setAddress(currentAddress); - if (currentAddress !== '') { + if (currentAddress !== '' && currentAddress !== lastSubmittedRef.current) { submitForm(currentAddress); } }, [currentAddress, submitForm]); From 59cc78821b64a547ed3f8a2baf5c2389d7bc9ef9 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 06:18:29 +0530 Subject: [PATCH 68/81] chore: todo --- src/components/molecules/UrlForm.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/molecules/UrlForm.tsx b/src/components/molecules/UrlForm.tsx index 8540fab7..b8b8658c 100644 --- a/src/components/molecules/UrlForm.tsx +++ b/src/components/molecules/UrlForm.tsx @@ -6,6 +6,7 @@ import { UrlFormButton } from "../atoms/buttons/buttons"; import { useSocketStore } from '../../context/socket'; import { Socket } from "socket.io-client"; +// TODO: Bring back REFRESHHHHHHH type Props = { currentAddress: string; handleRefresh: (socket: Socket) => void; From 3fa18aa45ce9c84c096778741d3c7859cc65542f Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 07:36:14 +0530 Subject: [PATCH 69/81] chore: browser tabs todo --- src/components/organisms/BrowserContent.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/organisms/BrowserContent.tsx b/src/components/organisms/BrowserContent.tsx index 21c337f5..7017ace3 100644 --- a/src/components/organisms/BrowserContent.tsx +++ b/src/components/organisms/BrowserContent.tsx @@ -7,6 +7,7 @@ import { BrowserTabs } from "../molecules/BrowserTabs"; import { useSocketStore } from "../../context/socket"; import { getCurrentTabs, getCurrentUrl, interpretCurrentRecording } from "../../api/recording"; +// TODO: Tab !show currentUrl after recordingUrl global state export const BrowserContent = () => { const { width } = useBrowserDimensionsStore(); const { socket } = useSocketStore(); From 8c86e84a19998d79daf265c64bbbd3c2c5829108 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 10:20:24 +0530 Subject: [PATCH 70/81] feat: browser & right panel ui --- src/components/atoms/AlertSnackbar.tsx | 2 +- src/components/atoms/GenericModal.tsx | 2 +- src/components/atoms/PairDisplayDiv.tsx | 2 +- src/components/atoms/RecorderIcon.tsx | 2 +- src/components/atoms/canvas.tsx | 4 +- src/components/atoms/texts.tsx | 2 +- src/components/molecules/BrowserNavBar.tsx | 2 +- src/components/molecules/BrowserTabs.tsx | 2 +- .../molecules/InterpretationButtons.tsx | 2 +- .../molecules/InterpretationLog.tsx | 6 +-- src/components/molecules/NavBar.tsx | 6 +-- src/components/molecules/SaveRecording.tsx | 2 +- src/components/organisms/BrowserContent.tsx | 8 +-- src/components/organisms/BrowserWindow.tsx | 10 ++-- src/components/organisms/LeftSidePanel.tsx | 2 +- src/components/organisms/ProxyForm.tsx | 2 +- src/components/organisms/RightSidePanel.tsx | 4 +- src/constants/const.ts | 4 +- src/context/browserDimensions.tsx | 4 +- src/pages/Login.tsx | 2 +- src/pages/MainPage.tsx | 2 +- src/pages/RecordingPage.tsx | 50 +++++++++++-------- src/pages/Register.tsx | 2 +- 23 files changed, 67 insertions(+), 57 deletions(-) diff --git a/src/components/atoms/AlertSnackbar.tsx b/src/components/atoms/AlertSnackbar.tsx index 3cf5c554..a2803392 100644 --- a/src/components/atoms/AlertSnackbar.tsx +++ b/src/components/atoms/AlertSnackbar.tsx @@ -31,7 +31,7 @@ export const AlertSnackbar = ({ severity, message, isOpen }: AlertSnackbarProps) }; return ( - + {message} diff --git a/src/components/atoms/GenericModal.tsx b/src/components/atoms/GenericModal.tsx index 56b3df43..bca0f51a 100644 --- a/src/components/atoms/GenericModal.tsx +++ b/src/components/atoms/GenericModal.tsx @@ -33,7 +33,7 @@ const defaultModalStyle = { top: '50%', left: '50%', transform: 'translate(-50%, -50%)', - width: 500, + width: 300, bgcolor: 'background.paper', boxShadow: 24, p: 4, diff --git a/src/components/atoms/PairDisplayDiv.tsx b/src/components/atoms/PairDisplayDiv.tsx index c7c4447c..38e3147c 100644 --- a/src/components/atoms/PairDisplayDiv.tsx +++ b/src/components/atoms/PairDisplayDiv.tsx @@ -35,7 +35,7 @@ export const PairDisplayDiv: FC = ({ index, pair }) => { const DescriptionWrapper = styled.div` margin: 0; font-family: "Roboto","Helvetica","Arial",sans-serif; - font-weight: 400; + font-weight: 300; font-size: 1rem; line-height: 1.5; letter-spacing: 0.00938em; diff --git a/src/components/atoms/RecorderIcon.tsx b/src/components/atoms/RecorderIcon.tsx index afed1756..c604c150 100644 --- a/src/components/atoms/RecorderIcon.tsx +++ b/src/components/atoms/RecorderIcon.tsx @@ -15,7 +15,7 @@ export const RecordingIcon = () => { textTransform: 'none', }} fill="white" - d="m82.048,962.36c-0.18271-0.003-0.35147-0.001-0.53125,0.0312-0.69633,0.12662-1.3353,0.54943-1.7812,1.1562l-0.03125-0.0312-0.03125,0.0625-18.031,22.125h-44.438c-2.809,0-5.0938,2.2847-5.0938,5.0938v35.531c0,2.8091,2.2847,5.125,5.0938,5.125h20.562l-1.3125,4.5938h-0.71875c-1.1137,0-2.0312,0.9175-2.0312,2.0312v2.2188c0,1.1137,0.91751,2.0625,2.0312,2.0625h19.938c1.1137,0,2.0312-0.9488,2.0312-2.0625v-2.2188c0-1.1137-0.91751-2.0312-2.0312-2.0312h-0.71875l-1.3438-4.5938h20.438c2.809,0,5.0938-2.3159,5.0938-5.125v-35.531c0-1.7706-0.90663-3.3369-2.2812-4.25l10.531-17.625,0.03125-0.0625c0.84234-1.2783,0.51486-3.0308-0.75-3.9062l-3.0312-2.0938c-0.48208-0.33338-1.0456-0.49073-1.5938-0.5zm-0.21875,1.6875c0.28723-0.0523,0.57635,0.0338,0.84375,0.21875l3.0312,2.0938c0.53421,0.36973,0.65504,1.0569,0.28125,1.5938a0.85008,0.85008,0,0,0,-0.03125,0.0312l-17.906,30.062-9.0938-6.3125,22.094-27.125a0.85008,0.85008,0,0,0,0.03125,-0.0625c0.18694-0.26873,0.46277-0.4477,0.75-0.5zm-64.625,23.344,43.062,0-2.3438,2.9062-40.688,0c-0.0312-0.002-0.06255-0.002-0.09375,0-0.0312-0.002-0.06255-0.002-0.09375,0-0.38644,0.0753-0.69183,0.45007-0.6875,0.84375v34.844c0.003,0.4514,0.42377,0.857,0.875,0.8437h56.781c0.44088,0,0.84048-0.4028,0.84375-0.8437v-34.844c-0.008-0.25538-0.13841-0.50419-0.34375-0.65625l1.5-2.5c0.87419,0.61342,1.4375,1.6512,1.4375,2.8125v35.531c0,1.8967-1.5096,3.4063-3.4062,3.4063h-56.844c-1.8966,0-3.4062-1.5096-3.4062-3.4063v-35.531c0-1.8966,1.5096-3.4062,3.4062-3.4062zm0.875,4.5938,38.469,0-1.0312,1.25,0,0.0312c-0.48971,0.60518-0.64056,1.3922-0.5,2.0312,0.14234,0.64722,0.49536,1.1659,0.84375,1.6562a0.85008,0.85008,0,0,0,0.1875,0.21875l1.2812,0.875c-1.0387,0.79518-2.0706,1.1661-3.2188,1.6562-1.4337,0.61212-3.0045,1.4512-4.3438,3.375-1.1451,1.6448-1.0525,3.5446-0.78125,5.3437,0.27121,1.7991,0.70152,3.5802,0.5625,5.2188a0.85008,0.85008,0,0,0,1.2188,0.8437c1.4928-0.7039,3.3085-0.9361,5.0938-1.3125s3.6049-0.9489,4.75-2.5937c1.34-1.9249,1.5559-3.6628,1.625-5.2188,0.05552-1.2502,0.05447-2.363,0.4375-3.625l1.2812,0.875c1.2744,0.8814,3.0499,0.4785,3.8438-0.8437l0.03125-0.031,1.125-1.9063a0.85008,0.85008,0,0,0,0.03125,-0.0312l0.03125-0.0312a0.85008,0.85008,0,0,0,0.09375,-0.21875l4.0625-6.8125v32.406h-55.094v-33.156zm39.812,1.0625,9.3125,6.4375-0.84375,1.4062a0.85008,0.85008,0,0,0,-0.03125,0c-0.33037,0.5726-0.86691,0.7168-1.4062,0.3438l-2.1875-1.5-0.1875-0.15625-0.65625-0.4375-1.8438-1.2812-0.84375-0.59375-0.0625-0.0312-1.9688-1.3438c-0.25075-0.36937-0.4494-0.7387-0.5-0.96875-0.0558-0.25371-0.0497-0.34572,0.15625-0.59375l1.0625-1.2812zm0.84375,5.9688,0.34375,0.25,1.8438,1.25,0.375,0.25c-0.60662,1.6994-0.69236,3.2017-0.75,4.5-0.0657,1.481-0.18871,2.7295-1.3125,4.3438-0.76502,1.0988-2.0465,1.5537-3.7188,1.9062-1.3283,0.2801-2.854,0.5618-4.3438,1.0625-0.0521-1.5631-0.29881-3.0716-0.5-4.4062-0.25388-1.6841-0.29624-3.0262,0.46875-4.125,1.1246-1.6154,2.2602-2.1673,3.625-2.75,1.1932-0.5094,2.5901-1.1274,3.9688-2.2813zm-30.5,2.5313c-1.6815,0-3.0625,1.4119-3.0625,3.0937s1.381,3.0313,3.0625,3.0313,3.0625-1.3495,3.0625-3.0313-1.381-3.0937-3.0625-3.0937zm0,1.7187c0.76283,0,1.375,0.612,1.375,1.375s-0.61217,1.3438-1.375,1.3438-1.3438-0.5808-1.3438-1.3438,0.58092-1.375,1.3438-1.375zm8,5.6563c-3.3379,0.1812-7.1915,2.4749-10.344,4.6875-3.1522,2.2126-5.5625,4.4062-5.5625,4.4062-0.3273,0.3027-0.36527,0.8915-0.0625,1.2188,0.30273,0.3272,0.89151,0.334,1.2188,0.031,0,0,2.3185-2.1046,5.375-4.25s6.8989-4.2667,9.4688-4.4063c1.6177-0.088,4.3314,1.0381,6.5312,2.25,2.1999,1.212,3.9375,2.4375,3.9375,2.4375,0.35264,0.3353,1.001,0.2728,1.2812-0.125,0.28024-0.3977,0.12188-1.0307-0.3125-1.25,0,0-1.7602-1.2941-4.0625-2.5625-2.3024-1.2684-5.0831-2.567-7.4688-2.4375zm3.2812,22.562,12.344,0,1.3438,4.5312-15,0,1.3125-4.5312zm-3.7812,6.25,19.938,0c0.20135,0,0.3125,0.1424,0.3125,0.3437v2.2188c0,0.2013-0.11115,0.3437-0.3125,0.3437h-19.938c-0.20135,0-0.34375-0.1424-0.34375-0.3437v-2.2188c0-0.2013,0.1424-0.3437,0.34375-0.3437z" /> + d="m82.048,962.36c-0.18271-0.003-0.35147-0.001-0.53125,0.0312-0.69633,0.12662-1.3353,0.54943-1.7812,1.1562l-0.03125-0.0312-0.03125,0.0625-18.031,22.125h-44.438c-2.809,0-5.0938,2.2847-5.0938,5.0938v35.531c0,2.8091,2.2847,5.125,5.0938,5.125h20.562l-1.3125,4.5938h-0.71875c-1.1137,0-2.0312,0.9175-2.0312,2.0312v2.2188c0,1.1137,0.91751,2.0625,2.0312,2.0625h19.938c1.1137,0,2.0312-0.9488,2.0312-2.0625v-2.2188c0-1.1137-0.91751-2.0312-2.0312-2.0312h-0.71875l-1.3438-4.5938h20.438c2.809,0,5.0938-2.3159,5.0938-5.125v-35.531c0-1.7706-0.90663-3.3369-2.2812-4.25l10.531-17.625,0.03125-0.0625c0.84234-1.2783,0.51486-3.0308-0.75-3.9062l-3.0312-2.0938c-0.48208-0.33338-1.0456-0.49073-1.5938-0.5zm-0.21875,1.6875c0.28723-0.0523,0.57635,0.0338,0.84375,0.21875l3.0312,2.0938c0.53421,0.36973,0.65504,1.0569,0.28125,1.5938a0.83008,0.83008,0,0,0,-0.03125,0.0312l-17.906,30.062-9.0938-6.3125,22.094-27.125a0.83008,0.83008,0,0,0,0.03125,-0.0625c0.18694-0.26873,0.46277-0.4477,0.75-0.5zm-64.625,23.344,43.062,0-2.3438,2.9062-40.688,0c-0.0312-0.002-0.06255-0.002-0.09375,0-0.0312-0.002-0.06255-0.002-0.09375,0-0.38644,0.0753-0.69183,0.43007-0.6875,0.84375v34.844c0.003,0.4514,0.42377,0.857,0.875,0.8437h56.781c0.44088,0,0.84048-0.4028,0.84375-0.8437v-34.844c-0.008-0.25538-0.13841-0.50419-0.34375-0.65625l1.5-2.5c0.87419,0.61342,1.4375,1.6512,1.4375,2.8125v35.531c0,1.8967-1.5096,3.4063-3.4062,3.4063h-56.844c-1.8966,0-3.4062-1.5096-3.4062-3.4063v-35.531c0-1.8966,1.5096-3.4062,3.4062-3.4062zm0.875,4.5938,38.469,0-1.0312,1.25,0,0.0312c-0.48971,0.60518-0.64056,1.3922-0.5,2.0312,0.14234,0.64722,0.49536,1.1659,0.84375,1.6562a0.83008,0.83008,0,0,0,0.1875,0.21875l1.2812,0.875c-1.0387,0.79518-2.0706,1.1661-3.2188,1.6562-1.4337,0.61212-3.0045,1.4512-4.3438,3.375-1.1451,1.6448-1.0525,3.5446-0.78125,5.3437,0.27121,1.7991,0.70152,3.5802,0.5625,5.2188a0.83008,0.83008,0,0,0,1.2188,0.8437c1.4928-0.7039,3.3085-0.9361,5.0938-1.3125s3.6049-0.9489,4.75-2.5937c1.34-1.9249,1.5559-3.6628,1.625-5.2188,0.05552-1.2502,0.05447-2.363,0.4375-3.625l1.2812,0.875c1.2744,0.8814,3.0499,0.4785,3.8438-0.8437l0.03125-0.031,1.125-1.9063a0.83008,0.83008,0,0,0,0.03125,-0.0312l0.03125-0.0312a0.83008,0.83008,0,0,0,0.09375,-0.21875l4.0625-6.8125v32.406h-55.094v-33.156zm39.812,1.0625,9.3125,6.4375-0.84375,1.4062a0.83008,0.83008,0,0,0,-0.03125,0c-0.33037,0.5726-0.86691,0.7168-1.4062,0.3438l-2.1875-1.5-0.1875-0.15625-0.65625-0.4375-1.8438-1.2812-0.84375-0.59375-0.0625-0.0312-1.9688-1.3438c-0.25075-0.36937-0.4494-0.7387-0.5-0.96875-0.0558-0.25371-0.0497-0.34572,0.15625-0.59375l1.0625-1.2812zm0.84375,5.9688,0.34375,0.25,1.8438,1.25,0.375,0.25c-0.60662,1.6994-0.69236,3.2017-0.75,4.5-0.0657,1.481-0.18871,2.7295-1.3125,4.3438-0.76502,1.0988-2.0465,1.5537-3.7188,1.9062-1.3283,0.2801-2.854,0.5618-4.3438,1.0625-0.0521-1.5631-0.29881-3.0716-0.5-4.4062-0.25388-1.6841-0.29624-3.0262,0.46875-4.125,1.1246-1.6154,2.2602-2.1673,3.625-2.75,1.1932-0.5094,2.5901-1.1274,3.9688-2.2813zm-30.5,2.5313c-1.6815,0-3.0625,1.4119-3.0625,3.0937s1.381,3.0313,3.0625,3.0313,3.0625-1.3495,3.0625-3.0313-1.381-3.0937-3.0625-3.0937zm0,1.7187c0.76283,0,1.375,0.612,1.375,1.375s-0.61217,1.3438-1.375,1.3438-1.3438-0.5808-1.3438-1.3438,0.58092-1.375,1.3438-1.375zm8,5.6563c-3.3379,0.1812-7.1915,2.4749-10.344,4.6875-3.1522,2.2126-5.5625,4.4062-5.5625,4.4062-0.3273,0.3027-0.36527,0.8915-0.0625,1.2188,0.30273,0.3272,0.89151,0.334,1.2188,0.031,0,0,2.3185-2.1046,5.375-4.25s6.8989-4.2667,9.4688-4.4063c1.6177-0.088,4.3314,1.0381,6.5312,2.25,2.1999,1.212,3.9375,2.4375,3.9375,2.4375,0.35264,0.3353,1.001,0.2728,1.2812-0.125,0.28024-0.3977,0.12188-1.0307-0.3125-1.25,0,0-1.7602-1.2941-4.0625-2.5625-2.3024-1.2684-5.0831-2.567-7.4688-2.4375zm3.2812,22.562,12.344,0,1.3438,4.5312-15,0,1.3125-4.5312zm-3.7812,6.25,19.938,0c0.20135,0,0.3125,0.1424,0.3125,0.3437v2.2188c0,0.2013-0.11115,0.3437-0.3125,0.3437h-19.938c-0.20135,0-0.34375-0.1424-0.34375-0.3437v-2.2188c0-0.2013,0.1424-0.3437,0.34375-0.3437z" /> diff --git a/src/components/atoms/canvas.tsx b/src/components/atoms/canvas.tsx index 654c782a..d96e0874 100644 --- a/src/components/atoms/canvas.tsx +++ b/src/components/atoms/canvas.tsx @@ -140,8 +140,8 @@ const Canvas = ({ width, height, onCreateRef }: CanvasProps) => { ); diff --git a/src/components/atoms/texts.tsx b/src/components/atoms/texts.tsx index e31b9ceb..046b9e55 100644 --- a/src/components/atoms/texts.tsx +++ b/src/components/atoms/texts.tsx @@ -9,7 +9,7 @@ export const WarningText = styled.p` background: rgba(255,165,0,0.15); padding: 5px; font-family: "Roboto","Helvetica","Arial",sans-serif; - font-weight: 400; + font-weight: 300; line-height: 1.5; letter-spacing: 0.00938em; ` diff --git a/src/components/molecules/BrowserNavBar.tsx b/src/components/molecules/BrowserNavBar.tsx index ad4e7d2d..cf00c8bd 100644 --- a/src/components/molecules/BrowserNavBar.tsx +++ b/src/components/molecules/BrowserNavBar.tsx @@ -77,7 +77,7 @@ const BrowserNavBar: FC = ({ }; return ( - + { diff --git a/src/components/molecules/BrowserTabs.tsx b/src/components/molecules/BrowserTabs.tsx index 2cda3937..a430d26f 100644 --- a/src/components/molecules/BrowserTabs.tsx +++ b/src/components/molecules/BrowserTabs.tsx @@ -31,7 +31,7 @@ export const BrowserTabs = ( return ( = ({ isOpen, se background: '#3f4853', border: 'none', padding: '10px 20px', - width: 1280, + width: 900, textAlign: 'left' }}> Interpretation Log @@ -129,7 +129,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se background: 'white', color: 'black', padding: '10px', - height: 720, + height: 300, width: width - 10, display: 'flex' } @@ -173,7 +173,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se

What is the maximum number of rows you want to extract?

 - + } label="10" /> } label="100" /> } label="Custom" /> diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index f06bebd3..b20d7ee9 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -94,7 +94,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '500', + fontWeight: '300', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', @@ -112,7 +112,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '500', + fontWeight: '300', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', @@ -129,7 +129,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '500', + fontWeight: '300', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', diff --git a/src/components/molecules/SaveRecording.tsx b/src/components/molecules/SaveRecording.tsx index c2f6911b..6f2becb3 100644 --- a/src/components/molecules/SaveRecording.tsx +++ b/src/components/molecules/SaveRecording.tsx @@ -78,7 +78,7 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => { marginRight: '10px', borderRadius: '5px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '500', + fontWeight: '300', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', diff --git a/src/components/organisms/BrowserContent.tsx b/src/components/organisms/BrowserContent.tsx index 7017ace3..18fbce19 100644 --- a/src/components/organisms/BrowserContent.tsx +++ b/src/components/organisms/BrowserContent.tsx @@ -6,6 +6,7 @@ import { useBrowserDimensionsStore } from "../../context/browserDimensions"; import { BrowserTabs } from "../molecules/BrowserTabs"; import { useSocketStore } from "../../context/socket"; import { getCurrentTabs, getCurrentUrl, interpretCurrentRecording } from "../../api/recording"; +import { Box } from '@mui/material'; // TODO: Tab !show currentUrl after recordingUrl global state export const BrowserContent = () => { @@ -114,7 +115,7 @@ export const BrowserContent = () => { }, []) return ( - + <> { /> - + ); } const BrowserContentWrapper = styled.div` - grid-area: browser; `; \ No newline at end of file diff --git a/src/components/organisms/BrowserWindow.tsx b/src/components/organisms/BrowserWindow.tsx index ddf4d0e1..00b485fd 100644 --- a/src/components/organisms/BrowserWindow.tsx +++ b/src/components/organisms/BrowserWindow.tsx @@ -360,15 +360,15 @@ export const BrowserWindow = () => { : null} ); @@ -383,7 +383,7 @@ const drawImage = (image: string, canvas: HTMLCanvasElement): void => { img.src = image; img.onload = () => { URL.revokeObjectURL(img.src); - ctx?.drawImage(img, 0, 0, 1280, 720); + ctx?.drawImage(img, 0, 0, 900, 300); }; }; \ No newline at end of file diff --git a/src/components/organisms/LeftSidePanel.tsx b/src/components/organisms/LeftSidePanel.tsx index 09c5fc46..7504be2e 100644 --- a/src/components/organisms/LeftSidePanel.tsx +++ b/src/components/organisms/LeftSidePanel.tsx @@ -63,7 +63,7 @@ export const LeftSidePanel = ( if (id) { fetchWorkflow(id, workflowHandler); } - }, (1000 * 60 * 15)); + }, (900 * 60 * 15)); return () => clearInterval(interval) }, [id]); diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index a799490d..9e0a9f2b 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -87,7 +87,7 @@ const ProxyForm: React.FC = () => { Proxy Configuration - + = ({ onFinishCapture if (id) { fetchWorkflow(id, workflowHandler); } - }, (1000 * 60 * 15)); + }, (900 * 60 * 15)); return () => { socket?.off("workflow", workflowHandler); clearInterval(interval); @@ -408,7 +408,7 @@ export const RightSidePanel: React.FC = ({ onFinishCapture sx={{ display: 'flex', flexDirection: 'column', - width: '500px' + width: '300px' }} > } label="10" /> diff --git a/src/constants/const.ts b/src/constants/const.ts index 7337da31..ed87d18f 100644 --- a/src/constants/const.ts +++ b/src/constants/const.ts @@ -1,5 +1,5 @@ -export const VIEWPORT_W = 1280; -export const VIEWPORT_H = 720; +export const VIEWPORT_W = 900; +export const VIEWPORT_H = 300; export const ONE_PERCENT_OF_VIEWPORT_W = VIEWPORT_W / 100; export const ONE_PERCENT_OF_VIEWPORT_H = VIEWPORT_H / 100; diff --git a/src/context/browserDimensions.tsx b/src/context/browserDimensions.tsx index e1d81681..e8b8394a 100644 --- a/src/context/browserDimensions.tsx +++ b/src/context/browserDimensions.tsx @@ -7,8 +7,8 @@ interface BrowserDimensions { }; class BrowserDimensionsStore implements Partial{ - width: number = 1280; - height: number = 720; + width: number = 900; + height: number = 300; }; const browserDimensionsStore = new BrowserDimensionsStore(); diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx index f9eb8ab4..3ad04a82 100644 --- a/src/pages/Login.tsx +++ b/src/pages/Login.tsx @@ -63,7 +63,7 @@ const Login = () => { Welcome Back! - + { } return ( - + {DisplayContent()} diff --git a/src/pages/RecordingPage.tsx b/src/pages/RecordingPage.tsx index 19d94c20..a11258e3 100644 --- a/src/pages/RecordingPage.tsx +++ b/src/pages/RecordingPage.tsx @@ -1,9 +1,8 @@ import React, { useCallback, useEffect, useState } from 'react'; -import { Grid } from '@mui/material'; +import { Grid, Box } from '@mui/material'; import { BrowserContent } from "../components/organisms/BrowserContent"; import { InterpretationLog } from "../components/molecules/InterpretationLog"; import { startRecording, getActiveBrowserId } from "../api/recording"; -import { LeftSidePanel } from "../components/organisms/LeftSidePanel"; import { RightSidePanel } from "../components/organisms/RightSidePanel"; import { Loader } from "../components/atoms/Loader"; import { useSocketStore } from "../context/socket"; @@ -35,7 +34,6 @@ export const RecordingPage = ({ recordingName }: RecordingPageProps) => { const [showOutputData, setShowOutputData] = useState(false); const browserContentRef = React.useRef(null); - const workflowListRef = React.useRef(null); const { setId, socket } = useSocketStore(); const { setWidth } = useBrowserDimensionsStore(); @@ -52,7 +50,7 @@ export const RecordingPage = ({ recordingName }: RecordingPageProps) => { }); }; - useEffect(() => changeBrowserDimensions(), [isLoaded]) + // useEffect(() => changeBrowserDimensions(), [isLoaded]) useEffect(() => { let isCancelled = false; @@ -113,27 +111,19 @@ export const RecordingPage = ({ recordingName }: RecordingPageProps) => { return ( -
- {isLoaded ? - - - - - + + {isLoaded ? ( + + - + - : } -
+ ) : } + ); @@ -144,4 +134,24 @@ const RecordingPageWrapper = styled.div` width: 100vw; height: 100vh; overflow: hidden; -`; \ No newline at end of file +`; + +// Fixed grid container to ensure elements stay next to each other +const FixedGridContainer = styled(Grid)` + display: flex; + height: 100vh; + overflow: hidden; + flex-direction: row; + align-items: stretch; + + #browser-content { + flex: 1; + position: relative; + height: 100%; + } + + .MuiGrid-item { + position: relative; + height: 100%; + } +`; diff --git a/src/pages/Register.tsx b/src/pages/Register.tsx index d3ccd666..63935051 100644 --- a/src/pages/Register.tsx +++ b/src/pages/Register.tsx @@ -61,7 +61,7 @@ const Register = () => { Create an account - + Date: Fri, 11 Oct 2024 17:58:27 +0530 Subject: [PATCH 71/81] chore: todo --- server/src/api/record.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/server/src/api/record.ts b/server/src/api/record.ts index bd5e2f74..9d8dfa29 100644 --- a/server/src/api/record.ts +++ b/server/src/api/record.ts @@ -106,7 +106,7 @@ router.get("/robots/:id", requireAPIKey, async (req: Request, res: Response) => } }); -// TODO: Format runs to send more data formatted +// TODO: Format runs to send more data formatted router.get("/robots/:id/runs", requireAPIKey, async (req: Request, res: Response) => { try { const runs = await Run.findAll({ From 6c667253b301f420494ce735109c33a7a86a5186 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:22:11 +0530 Subject: [PATCH 72/81] fix: revert to 5000 duration --- src/components/atoms/AlertSnackbar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/atoms/AlertSnackbar.tsx b/src/components/atoms/AlertSnackbar.tsx index a2803392..3cf5c554 100644 --- a/src/components/atoms/AlertSnackbar.tsx +++ b/src/components/atoms/AlertSnackbar.tsx @@ -31,7 +31,7 @@ export const AlertSnackbar = ({ severity, message, isOpen }: AlertSnackbarProps) }; return ( - + {message} From 63bc4749cf79175e5d19cc6655aa41666b79d0bb Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:23:09 +0530 Subject: [PATCH 73/81] fix: revert to width 500 --- src/components/atoms/GenericModal.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/atoms/GenericModal.tsx b/src/components/atoms/GenericModal.tsx index bca0f51a..56b3df43 100644 --- a/src/components/atoms/GenericModal.tsx +++ b/src/components/atoms/GenericModal.tsx @@ -33,7 +33,7 @@ const defaultModalStyle = { top: '50%', left: '50%', transform: 'translate(-50%, -50%)', - width: 300, + width: 500, bgcolor: 'background.paper', boxShadow: 24, p: 4, From f51f0553f3edf3ff67de3cdfab4d4d2435a8fe8d Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:24:48 +0530 Subject: [PATCH 74/81] fix: revert to font 400 --- src/components/atoms/PairDisplayDiv.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/atoms/PairDisplayDiv.tsx b/src/components/atoms/PairDisplayDiv.tsx index 38e3147c..c7c4447c 100644 --- a/src/components/atoms/PairDisplayDiv.tsx +++ b/src/components/atoms/PairDisplayDiv.tsx @@ -35,7 +35,7 @@ export const PairDisplayDiv: FC = ({ index, pair }) => { const DescriptionWrapper = styled.div` margin: 0; font-family: "Roboto","Helvetica","Arial",sans-serif; - font-weight: 300; + font-weight: 400; font-size: 1rem; line-height: 1.5; letter-spacing: 0.00938em; From 1cbdf3c49b3374cd9c6a6dfba1b7e7d631c475b2 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:25:16 +0530 Subject: [PATCH 75/81] fix: revert to old svg --- src/components/atoms/RecorderIcon.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/atoms/RecorderIcon.tsx b/src/components/atoms/RecorderIcon.tsx index c604c150..afed1756 100644 --- a/src/components/atoms/RecorderIcon.tsx +++ b/src/components/atoms/RecorderIcon.tsx @@ -15,7 +15,7 @@ export const RecordingIcon = () => { textTransform: 'none', }} fill="white" - d="m82.048,962.36c-0.18271-0.003-0.35147-0.001-0.53125,0.0312-0.69633,0.12662-1.3353,0.54943-1.7812,1.1562l-0.03125-0.0312-0.03125,0.0625-18.031,22.125h-44.438c-2.809,0-5.0938,2.2847-5.0938,5.0938v35.531c0,2.8091,2.2847,5.125,5.0938,5.125h20.562l-1.3125,4.5938h-0.71875c-1.1137,0-2.0312,0.9175-2.0312,2.0312v2.2188c0,1.1137,0.91751,2.0625,2.0312,2.0625h19.938c1.1137,0,2.0312-0.9488,2.0312-2.0625v-2.2188c0-1.1137-0.91751-2.0312-2.0312-2.0312h-0.71875l-1.3438-4.5938h20.438c2.809,0,5.0938-2.3159,5.0938-5.125v-35.531c0-1.7706-0.90663-3.3369-2.2812-4.25l10.531-17.625,0.03125-0.0625c0.84234-1.2783,0.51486-3.0308-0.75-3.9062l-3.0312-2.0938c-0.48208-0.33338-1.0456-0.49073-1.5938-0.5zm-0.21875,1.6875c0.28723-0.0523,0.57635,0.0338,0.84375,0.21875l3.0312,2.0938c0.53421,0.36973,0.65504,1.0569,0.28125,1.5938a0.83008,0.83008,0,0,0,-0.03125,0.0312l-17.906,30.062-9.0938-6.3125,22.094-27.125a0.83008,0.83008,0,0,0,0.03125,-0.0625c0.18694-0.26873,0.46277-0.4477,0.75-0.5zm-64.625,23.344,43.062,0-2.3438,2.9062-40.688,0c-0.0312-0.002-0.06255-0.002-0.09375,0-0.0312-0.002-0.06255-0.002-0.09375,0-0.38644,0.0753-0.69183,0.43007-0.6875,0.84375v34.844c0.003,0.4514,0.42377,0.857,0.875,0.8437h56.781c0.44088,0,0.84048-0.4028,0.84375-0.8437v-34.844c-0.008-0.25538-0.13841-0.50419-0.34375-0.65625l1.5-2.5c0.87419,0.61342,1.4375,1.6512,1.4375,2.8125v35.531c0,1.8967-1.5096,3.4063-3.4062,3.4063h-56.844c-1.8966,0-3.4062-1.5096-3.4062-3.4063v-35.531c0-1.8966,1.5096-3.4062,3.4062-3.4062zm0.875,4.5938,38.469,0-1.0312,1.25,0,0.0312c-0.48971,0.60518-0.64056,1.3922-0.5,2.0312,0.14234,0.64722,0.49536,1.1659,0.84375,1.6562a0.83008,0.83008,0,0,0,0.1875,0.21875l1.2812,0.875c-1.0387,0.79518-2.0706,1.1661-3.2188,1.6562-1.4337,0.61212-3.0045,1.4512-4.3438,3.375-1.1451,1.6448-1.0525,3.5446-0.78125,5.3437,0.27121,1.7991,0.70152,3.5802,0.5625,5.2188a0.83008,0.83008,0,0,0,1.2188,0.8437c1.4928-0.7039,3.3085-0.9361,5.0938-1.3125s3.6049-0.9489,4.75-2.5937c1.34-1.9249,1.5559-3.6628,1.625-5.2188,0.05552-1.2502,0.05447-2.363,0.4375-3.625l1.2812,0.875c1.2744,0.8814,3.0499,0.4785,3.8438-0.8437l0.03125-0.031,1.125-1.9063a0.83008,0.83008,0,0,0,0.03125,-0.0312l0.03125-0.0312a0.83008,0.83008,0,0,0,0.09375,-0.21875l4.0625-6.8125v32.406h-55.094v-33.156zm39.812,1.0625,9.3125,6.4375-0.84375,1.4062a0.83008,0.83008,0,0,0,-0.03125,0c-0.33037,0.5726-0.86691,0.7168-1.4062,0.3438l-2.1875-1.5-0.1875-0.15625-0.65625-0.4375-1.8438-1.2812-0.84375-0.59375-0.0625-0.0312-1.9688-1.3438c-0.25075-0.36937-0.4494-0.7387-0.5-0.96875-0.0558-0.25371-0.0497-0.34572,0.15625-0.59375l1.0625-1.2812zm0.84375,5.9688,0.34375,0.25,1.8438,1.25,0.375,0.25c-0.60662,1.6994-0.69236,3.2017-0.75,4.5-0.0657,1.481-0.18871,2.7295-1.3125,4.3438-0.76502,1.0988-2.0465,1.5537-3.7188,1.9062-1.3283,0.2801-2.854,0.5618-4.3438,1.0625-0.0521-1.5631-0.29881-3.0716-0.5-4.4062-0.25388-1.6841-0.29624-3.0262,0.46875-4.125,1.1246-1.6154,2.2602-2.1673,3.625-2.75,1.1932-0.5094,2.5901-1.1274,3.9688-2.2813zm-30.5,2.5313c-1.6815,0-3.0625,1.4119-3.0625,3.0937s1.381,3.0313,3.0625,3.0313,3.0625-1.3495,3.0625-3.0313-1.381-3.0937-3.0625-3.0937zm0,1.7187c0.76283,0,1.375,0.612,1.375,1.375s-0.61217,1.3438-1.375,1.3438-1.3438-0.5808-1.3438-1.3438,0.58092-1.375,1.3438-1.375zm8,5.6563c-3.3379,0.1812-7.1915,2.4749-10.344,4.6875-3.1522,2.2126-5.5625,4.4062-5.5625,4.4062-0.3273,0.3027-0.36527,0.8915-0.0625,1.2188,0.30273,0.3272,0.89151,0.334,1.2188,0.031,0,0,2.3185-2.1046,5.375-4.25s6.8989-4.2667,9.4688-4.4063c1.6177-0.088,4.3314,1.0381,6.5312,2.25,2.1999,1.212,3.9375,2.4375,3.9375,2.4375,0.35264,0.3353,1.001,0.2728,1.2812-0.125,0.28024-0.3977,0.12188-1.0307-0.3125-1.25,0,0-1.7602-1.2941-4.0625-2.5625-2.3024-1.2684-5.0831-2.567-7.4688-2.4375zm3.2812,22.562,12.344,0,1.3438,4.5312-15,0,1.3125-4.5312zm-3.7812,6.25,19.938,0c0.20135,0,0.3125,0.1424,0.3125,0.3437v2.2188c0,0.2013-0.11115,0.3437-0.3125,0.3437h-19.938c-0.20135,0-0.34375-0.1424-0.34375-0.3437v-2.2188c0-0.2013,0.1424-0.3437,0.34375-0.3437z" /> + d="m82.048,962.36c-0.18271-0.003-0.35147-0.001-0.53125,0.0312-0.69633,0.12662-1.3353,0.54943-1.7812,1.1562l-0.03125-0.0312-0.03125,0.0625-18.031,22.125h-44.438c-2.809,0-5.0938,2.2847-5.0938,5.0938v35.531c0,2.8091,2.2847,5.125,5.0938,5.125h20.562l-1.3125,4.5938h-0.71875c-1.1137,0-2.0312,0.9175-2.0312,2.0312v2.2188c0,1.1137,0.91751,2.0625,2.0312,2.0625h19.938c1.1137,0,2.0312-0.9488,2.0312-2.0625v-2.2188c0-1.1137-0.91751-2.0312-2.0312-2.0312h-0.71875l-1.3438-4.5938h20.438c2.809,0,5.0938-2.3159,5.0938-5.125v-35.531c0-1.7706-0.90663-3.3369-2.2812-4.25l10.531-17.625,0.03125-0.0625c0.84234-1.2783,0.51486-3.0308-0.75-3.9062l-3.0312-2.0938c-0.48208-0.33338-1.0456-0.49073-1.5938-0.5zm-0.21875,1.6875c0.28723-0.0523,0.57635,0.0338,0.84375,0.21875l3.0312,2.0938c0.53421,0.36973,0.65504,1.0569,0.28125,1.5938a0.85008,0.85008,0,0,0,-0.03125,0.0312l-17.906,30.062-9.0938-6.3125,22.094-27.125a0.85008,0.85008,0,0,0,0.03125,-0.0625c0.18694-0.26873,0.46277-0.4477,0.75-0.5zm-64.625,23.344,43.062,0-2.3438,2.9062-40.688,0c-0.0312-0.002-0.06255-0.002-0.09375,0-0.0312-0.002-0.06255-0.002-0.09375,0-0.38644,0.0753-0.69183,0.45007-0.6875,0.84375v34.844c0.003,0.4514,0.42377,0.857,0.875,0.8437h56.781c0.44088,0,0.84048-0.4028,0.84375-0.8437v-34.844c-0.008-0.25538-0.13841-0.50419-0.34375-0.65625l1.5-2.5c0.87419,0.61342,1.4375,1.6512,1.4375,2.8125v35.531c0,1.8967-1.5096,3.4063-3.4062,3.4063h-56.844c-1.8966,0-3.4062-1.5096-3.4062-3.4063v-35.531c0-1.8966,1.5096-3.4062,3.4062-3.4062zm0.875,4.5938,38.469,0-1.0312,1.25,0,0.0312c-0.48971,0.60518-0.64056,1.3922-0.5,2.0312,0.14234,0.64722,0.49536,1.1659,0.84375,1.6562a0.85008,0.85008,0,0,0,0.1875,0.21875l1.2812,0.875c-1.0387,0.79518-2.0706,1.1661-3.2188,1.6562-1.4337,0.61212-3.0045,1.4512-4.3438,3.375-1.1451,1.6448-1.0525,3.5446-0.78125,5.3437,0.27121,1.7991,0.70152,3.5802,0.5625,5.2188a0.85008,0.85008,0,0,0,1.2188,0.8437c1.4928-0.7039,3.3085-0.9361,5.0938-1.3125s3.6049-0.9489,4.75-2.5937c1.34-1.9249,1.5559-3.6628,1.625-5.2188,0.05552-1.2502,0.05447-2.363,0.4375-3.625l1.2812,0.875c1.2744,0.8814,3.0499,0.4785,3.8438-0.8437l0.03125-0.031,1.125-1.9063a0.85008,0.85008,0,0,0,0.03125,-0.0312l0.03125-0.0312a0.85008,0.85008,0,0,0,0.09375,-0.21875l4.0625-6.8125v32.406h-55.094v-33.156zm39.812,1.0625,9.3125,6.4375-0.84375,1.4062a0.85008,0.85008,0,0,0,-0.03125,0c-0.33037,0.5726-0.86691,0.7168-1.4062,0.3438l-2.1875-1.5-0.1875-0.15625-0.65625-0.4375-1.8438-1.2812-0.84375-0.59375-0.0625-0.0312-1.9688-1.3438c-0.25075-0.36937-0.4494-0.7387-0.5-0.96875-0.0558-0.25371-0.0497-0.34572,0.15625-0.59375l1.0625-1.2812zm0.84375,5.9688,0.34375,0.25,1.8438,1.25,0.375,0.25c-0.60662,1.6994-0.69236,3.2017-0.75,4.5-0.0657,1.481-0.18871,2.7295-1.3125,4.3438-0.76502,1.0988-2.0465,1.5537-3.7188,1.9062-1.3283,0.2801-2.854,0.5618-4.3438,1.0625-0.0521-1.5631-0.29881-3.0716-0.5-4.4062-0.25388-1.6841-0.29624-3.0262,0.46875-4.125,1.1246-1.6154,2.2602-2.1673,3.625-2.75,1.1932-0.5094,2.5901-1.1274,3.9688-2.2813zm-30.5,2.5313c-1.6815,0-3.0625,1.4119-3.0625,3.0937s1.381,3.0313,3.0625,3.0313,3.0625-1.3495,3.0625-3.0313-1.381-3.0937-3.0625-3.0937zm0,1.7187c0.76283,0,1.375,0.612,1.375,1.375s-0.61217,1.3438-1.375,1.3438-1.3438-0.5808-1.3438-1.3438,0.58092-1.375,1.3438-1.375zm8,5.6563c-3.3379,0.1812-7.1915,2.4749-10.344,4.6875-3.1522,2.2126-5.5625,4.4062-5.5625,4.4062-0.3273,0.3027-0.36527,0.8915-0.0625,1.2188,0.30273,0.3272,0.89151,0.334,1.2188,0.031,0,0,2.3185-2.1046,5.375-4.25s6.8989-4.2667,9.4688-4.4063c1.6177-0.088,4.3314,1.0381,6.5312,2.25,2.1999,1.212,3.9375,2.4375,3.9375,2.4375,0.35264,0.3353,1.001,0.2728,1.2812-0.125,0.28024-0.3977,0.12188-1.0307-0.3125-1.25,0,0-1.7602-1.2941-4.0625-2.5625-2.3024-1.2684-5.0831-2.567-7.4688-2.4375zm3.2812,22.562,12.344,0,1.3438,4.5312-15,0,1.3125-4.5312zm-3.7812,6.25,19.938,0c0.20135,0,0.3125,0.1424,0.3125,0.3437v2.2188c0,0.2013-0.11115,0.3437-0.3125,0.3437h-19.938c-0.20135,0-0.34375-0.1424-0.34375-0.3437v-2.2188c0-0.2013,0.1424-0.3437,0.34375-0.3437z" /> From 5e2148b40987c22677243d62269df463a12904a5 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:25:44 +0530 Subject: [PATCH 76/81] fix: revert to font 400 --- src/components/atoms/texts.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/atoms/texts.tsx b/src/components/atoms/texts.tsx index 046b9e55..e31b9ceb 100644 --- a/src/components/atoms/texts.tsx +++ b/src/components/atoms/texts.tsx @@ -9,7 +9,7 @@ export const WarningText = styled.p` background: rgba(255,165,0,0.15); padding: 5px; font-family: "Roboto","Helvetica","Arial",sans-serif; - font-weight: 300; + font-weight: 400; line-height: 1.5; letter-spacing: 0.00938em; ` From fd9247481b3a24a6bc9dea55dbf7a110d153a5b5 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:29:30 +0530 Subject: [PATCH 77/81] fix: revert to old css --- src/components/molecules/InterpretationButtons.tsx | 2 +- src/components/molecules/InterpretationLog.tsx | 6 +++--- src/components/molecules/NavBar.tsx | 6 +++--- src/components/molecules/SaveRecording.tsx | 2 +- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/molecules/InterpretationButtons.tsx b/src/components/molecules/InterpretationButtons.tsx index cb82da02..c9f45be2 100644 --- a/src/components/molecules/InterpretationButtons.tsx +++ b/src/components/molecules/InterpretationButtons.tsx @@ -160,7 +160,7 @@ export const InterpretationButtons = ({ enableStepping }: InterpretationButtonsP top: '50%', left: '50%', transform: 'translate(-50%, -50%)', - width: 300, + width: 500, background: 'white', border: '2px solid #000', boxShadow: '24', diff --git a/src/components/molecules/InterpretationLog.tsx b/src/components/molecules/InterpretationLog.tsx index 9dce3fd7..1af5bc8c 100644 --- a/src/components/molecules/InterpretationLog.tsx +++ b/src/components/molecules/InterpretationLog.tsx @@ -114,7 +114,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se background: '#3f4853', border: 'none', padding: '10px 20px', - width: 900, + width: 1280, textAlign: 'left' }}> Interpretation Log @@ -129,7 +129,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se background: 'white', color: 'black', padding: '10px', - height: 300, + height: 720, width: width - 10, display: 'flex' } @@ -173,7 +173,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se

What is the maximum number of rows you want to extract?

 - + } label="10" /> } label="100" /> } label="Custom" /> diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx index b20d7ee9..f06bebd3 100644 --- a/src/components/molecules/NavBar.tsx +++ b/src/components/molecules/NavBar.tsx @@ -94,7 +94,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '300', + fontWeight: '500', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', @@ -112,7 +112,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '300', + fontWeight: '500', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', @@ -129,7 +129,7 @@ export const NavBar: React.FC = ({ newRecording, recordingName, isR color: 'white', marginRight: '10px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '300', + fontWeight: '500', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', diff --git a/src/components/molecules/SaveRecording.tsx b/src/components/molecules/SaveRecording.tsx index 6f2becb3..c2f6911b 100644 --- a/src/components/molecules/SaveRecording.tsx +++ b/src/components/molecules/SaveRecording.tsx @@ -78,7 +78,7 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => { marginRight: '10px', borderRadius: '5px', fontFamily: '"Roboto","Helvetica","Arial",sans-serif', - fontWeight: '300', + fontWeight: '500', fontSize: '0.875rem', lineHeight: '1.75', letterSpacing: '0.02857em', From 11e570ed80f50e8f2db0fa08c0854e0dd5cbbe61 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:32:38 +0530 Subject: [PATCH 78/81] fix: revert to old css --- src/components/organisms/ProxyForm.tsx | 2 +- src/components/organisms/RightSidePanel.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/ProxyForm.tsx b/src/components/organisms/ProxyForm.tsx index 9e0a9f2b..a799490d 100644 --- a/src/components/organisms/ProxyForm.tsx +++ b/src/components/organisms/ProxyForm.tsx @@ -87,7 +87,7 @@ const ProxyForm: React.FC = () => { Proxy Configuration - + = ({ onFinishCapture if (id) { fetchWorkflow(id, workflowHandler); } - }, (900 * 60 * 15)); + }, (1000 * 60 * 15)); return () => { socket?.off("workflow", workflowHandler); clearInterval(interval); @@ -408,7 +408,7 @@ export const RightSidePanel: React.FC = ({ onFinishCapture sx={{ display: 'flex', flexDirection: 'column', - width: '300px' + width: '500px' }} > } label="10" /> From 1b21df92afd1d2e06c37a3b400f2bb351f94a5a5 Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 18:34:27 +0530 Subject: [PATCH 79/81] fix: set maxWidth to 400 --- src/pages/Login.tsx | 2 +- src/pages/Register.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx index 3ad04a82..f9eb8ab4 100644 --- a/src/pages/Login.tsx +++ b/src/pages/Login.tsx @@ -63,7 +63,7 @@ const Login = () => { Welcome Back! - + { Create an account - + Date: Fri, 11 Oct 2024 23:12:18 +0530 Subject: [PATCH 80/81] fix: revert ALL new browser changes --- server/src/browser-management/classes/RemoteBrowser.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/server/src/browser-management/classes/RemoteBrowser.ts b/server/src/browser-management/classes/RemoteBrowser.ts index 70677ed4..11b9a124 100644 --- a/server/src/browser-management/classes/RemoteBrowser.ts +++ b/server/src/browser-management/classes/RemoteBrowser.ts @@ -275,7 +275,7 @@ export class RemoteBrowser { if (page) { await this.stopScreencast(); this.currentPage = page; - await this.currentPage.setViewportSize({ height: 720, width: 1280 }) + await this.currentPage.setViewportSize({ height: 500, width: 1280 }) this.client = await this.currentPage.context().newCDPSession(this.currentPage); this.socket.emit('urlChanged', this.currentPage.url()); await this.makeAndEmitScreenshot(); From d8e269e1cddcf788f863a273fe0bb41dff9ae26c Mon Sep 17 00:00:00 2001 From: karishmas6 Date: Fri, 11 Oct 2024 23:12:32 +0530 Subject: [PATCH 81/81] fix: revert ALL new browser changes --- src/components/atoms/canvas.tsx | 4 +- .../molecules/InterpretationLog.tsx | 2 +- src/components/organisms/BrowserWindow.tsx | 10 ++-- src/constants/const.ts | 4 +- src/context/browserDimensions.tsx | 4 +- src/pages/RecordingPage.tsx | 50 ++++++++----------- 6 files changed, 32 insertions(+), 42 deletions(-) diff --git a/src/components/atoms/canvas.tsx b/src/components/atoms/canvas.tsx index d96e0874..654c782a 100644 --- a/src/components/atoms/canvas.tsx +++ b/src/components/atoms/canvas.tsx @@ -140,8 +140,8 @@ const Canvas = ({ width, height, onCreateRef }: CanvasProps) => { ); diff --git a/src/components/molecules/InterpretationLog.tsx b/src/components/molecules/InterpretationLog.tsx index 1af5bc8c..e7da5791 100644 --- a/src/components/molecules/InterpretationLog.tsx +++ b/src/components/molecules/InterpretationLog.tsx @@ -208,4 +208,4 @@ export const InterpretationLog: React.FC = ({ isOpen, se ); -} +} \ No newline at end of file diff --git a/src/components/organisms/BrowserWindow.tsx b/src/components/organisms/BrowserWindow.tsx index 00b485fd..ddf4d0e1 100644 --- a/src/components/organisms/BrowserWindow.tsx +++ b/src/components/organisms/BrowserWindow.tsx @@ -360,15 +360,15 @@ export const BrowserWindow = () => { : null} ); @@ -383,7 +383,7 @@ const drawImage = (image: string, canvas: HTMLCanvasElement): void => { img.src = image; img.onload = () => { URL.revokeObjectURL(img.src); - ctx?.drawImage(img, 0, 0, 900, 300); + ctx?.drawImage(img, 0, 0, 1280, 720); }; }; \ No newline at end of file diff --git a/src/constants/const.ts b/src/constants/const.ts index ed87d18f..7337da31 100644 --- a/src/constants/const.ts +++ b/src/constants/const.ts @@ -1,5 +1,5 @@ -export const VIEWPORT_W = 900; -export const VIEWPORT_H = 300; +export const VIEWPORT_W = 1280; +export const VIEWPORT_H = 720; export const ONE_PERCENT_OF_VIEWPORT_W = VIEWPORT_W / 100; export const ONE_PERCENT_OF_VIEWPORT_H = VIEWPORT_H / 100; diff --git a/src/context/browserDimensions.tsx b/src/context/browserDimensions.tsx index e8b8394a..e1d81681 100644 --- a/src/context/browserDimensions.tsx +++ b/src/context/browserDimensions.tsx @@ -7,8 +7,8 @@ interface BrowserDimensions { }; class BrowserDimensionsStore implements Partial{ - width: number = 900; - height: number = 300; + width: number = 1280; + height: number = 720; }; const browserDimensionsStore = new BrowserDimensionsStore(); diff --git a/src/pages/RecordingPage.tsx b/src/pages/RecordingPage.tsx index a11258e3..19d94c20 100644 --- a/src/pages/RecordingPage.tsx +++ b/src/pages/RecordingPage.tsx @@ -1,8 +1,9 @@ import React, { useCallback, useEffect, useState } from 'react'; -import { Grid, Box } from '@mui/material'; +import { Grid } from '@mui/material'; import { BrowserContent } from "../components/organisms/BrowserContent"; import { InterpretationLog } from "../components/molecules/InterpretationLog"; import { startRecording, getActiveBrowserId } from "../api/recording"; +import { LeftSidePanel } from "../components/organisms/LeftSidePanel"; import { RightSidePanel } from "../components/organisms/RightSidePanel"; import { Loader } from "../components/atoms/Loader"; import { useSocketStore } from "../context/socket"; @@ -34,6 +35,7 @@ export const RecordingPage = ({ recordingName }: RecordingPageProps) => { const [showOutputData, setShowOutputData] = useState(false); const browserContentRef = React.useRef(null); + const workflowListRef = React.useRef(null); const { setId, socket } = useSocketStore(); const { setWidth } = useBrowserDimensionsStore(); @@ -50,7 +52,7 @@ export const RecordingPage = ({ recordingName }: RecordingPageProps) => { }); }; - // useEffect(() => changeBrowserDimensions(), [isLoaded]) + useEffect(() => changeBrowserDimensions(), [isLoaded]) useEffect(() => { let isCancelled = false; @@ -111,19 +113,27 @@ export const RecordingPage = ({ recordingName }: RecordingPageProps) => { return ( - - {isLoaded ? ( - - +
+ {isLoaded ? + + + + + - + - ) : } - + : } +
); @@ -134,24 +144,4 @@ const RecordingPageWrapper = styled.div` width: 100vw; height: 100vh; overflow: hidden; -`; - -// Fixed grid container to ensure elements stay next to each other -const FixedGridContainer = styled(Grid)` - display: flex; - height: 100vh; - overflow: hidden; - flex-direction: row; - align-items: stretch; - - #browser-content { - flex: 1; - position: relative; - height: 100%; - } - - .MuiGrid-item { - position: relative; - height: 100%; - } -`; +`; \ No newline at end of file