Skip to content

Commit

Permalink
change function export mech
Browse files Browse the repository at this point in the history
  • Loading branch information
@Lucien950
Lucien950 committed Jul 27, 2024
1 parent f03bfdd commit 0ad0cce
Show file tree
Hide file tree
Showing 2 changed files with 50 additions and 76 deletions.
105 changes: 45 additions & 60 deletions software/tracksight/frontend/src/app/dashboard/dashboard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,24 +9,19 @@ import LiveGraph from '../components/live/live_graph';
// found error occurs in livegraphs where it checks if data['id'] == graphId, and thus does not update graph,
// as id sometimes returns as 0 when returned from websocket process. unsure how to fix.

const Dashboard = (props: {
// deleteGraph: (graphId: number, live: boolean) => void;
}) => {
export default function Dashboard(props: {}) {
// const [items, setItems] = useState<Array<{ value: string, label: string }>>([]);
// const [selectedDashboard, setSelectedDashboard] = useState("");
// const [toDelete, setToDelete] = useState<string[]>([]);
// const [graphs, setGraphs] = useState({});
// const [modalOpen, setModalOpen] = useState<boolean>(false);

// const updateGraphSignals = (graphId: number, signals: string[]) => {
// setGraphs(prev => ({ ...prev, [graphId]: signals }));
// };

// // change handler for selecting dashboard to load from dropdown
// const handleChange = (value: string) => {
// setSelectedDashboard(value);
// };

// // delete graph from dashboard
// const deleteGraph = (graphId: number) => {
// setGraphs(prevGraphs => {
Expand All @@ -35,7 +30,6 @@ const Dashboard = (props: {
// return newGraphs;
// });
// };

// // get the list of available saved dashboards from firestore
// useEffect(() => {
// getRealtimeData("dashboards").then(data => {
Expand All @@ -47,7 +41,6 @@ const Dashboard = (props: {
// }
// )
// }, []);

// // load the selected dashboard from firestore
// const loadDashboard = () => {
// setGraphs({})
Expand All @@ -58,9 +51,7 @@ const Dashboard = (props: {
// message.error("Failed to load/find dashboard.");
// }
// });

// };

// // updates toDelete array accordingly when checkbox is checked/unchecked
// const handleCheckboxChange = (e: CheckboxChangeEvent, value: string) => {
// setToDelete(prev => {
Expand All @@ -71,14 +62,12 @@ const Dashboard = (props: {
// }
// });
// };

// // deletes selected dashboards from firestore
// const deleteDashboards = () => {
// if (toDelete.length === 0) {
// message.warning('No dashboards selected for deletion.');
// return;
// }

// Modal.confirm({
// title: 'Are you sure you want to delete the selected dashboards?',
// content: 'This action cannot be undone.',
Expand All @@ -95,57 +84,53 @@ const Dashboard = (props: {
// },
// });
// };


return (
<div className="layout">
{/* <Space size="middle">
<Select
showSearch
style={{ minWidth: "200px", maxWidth: "100%" }}
placeholder={"Select Dashboard to Load"}
onChange={handleChange}
options={items}
maxTagCount="responsive"
/>
<Button onClick={loadDashboard}>Load</Button>
<Button onClick={() => setModalOpen(true)}>Edit Saved Dashboards</Button>
<Modal open={modalOpen}
closeIcon={false} title='Delete Saved Dashboards'
cancelButtonProps={{ onClick: () => setModalOpen(false) }}
okButtonProps={{ onClick: () => deleteDashboards() }}
okText={"Delete Selected"}>
<List
size="small"
bordered
dataSource={items}
renderItem={item => (
<List.Item>
<Checkbox
onChange={(e) => handleCheckboxChange(e, item.value)}
checked={toDelete.includes(item.value)}>
{item.label}
</Checkbox>
</List.Item>
)}
/>
</Modal>
</Space>
<div className="graph-container">
{Object.entries(graphs).map(([graphId, signals]) => (
<LiveGraph
key={graphId}
id={parseInt(graphId)}
onDelete={() => deleteGraph(parseInt(graphId))}
updateGraphSignals={updateGraphSignals}
socket={props.socket}
signals={signals as string[]}
/>
))}
</div> */}
<Select
showSearch
style={{ minWidth: "200px", maxWidth: "100%" }}
placeholder={"Select Dashboard to Load"}
onChange={handleChange}
options={items}
maxTagCount="responsive"
/>
<Button onClick={loadDashboard}>Load</Button>
<Button onClick={() => setModalOpen(true)}>Edit Saved Dashboards</Button>
<Modal open={modalOpen}
closeIcon={false} title='Delete Saved Dashboards'
cancelButtonProps={{ onClick: () => setModalOpen(false) }}
okButtonProps={{ onClick: () => deleteDashboards() }}
okText={"Delete Selected"}>
<List
size="small"
bordered
dataSource={items}
renderItem={item => (
<List.Item>
<Checkbox
onChange={(e) => handleCheckboxChange(e, item.value)}
checked={toDelete.includes(item.value)}>
{item.label}
</Checkbox>
</List.Item>
)}
/>
</Modal>
</Space>
<div className="graph-container">
{Object.entries(graphs).map(([graphId, signals]) => (
<LiveGraph
key={graphId}
id={parseInt(graphId)}
onDelete={() => deleteGraph(parseInt(graphId))}
updateGraphSignals={updateGraphSignals}
socket={props.socket}
signals={signals as string[]}
/>
))}
</div> */}

</div>
);
};

export default Dashboard;
}
21 changes: 5 additions & 16 deletions software/tracksight/frontend/src/app/visualize/visualize.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,13 @@ import LiveGraph from '../components/live/live_graph';
import { PlotRelayoutEvent } from 'plotly.js';
import { saveDashboardData } from '../components/dashboardService'

const Visualize = (props: {
export default function Visualize(props: {
addGraph: (live: boolean) => void;
graphs: number[];
liveGraphs: number[];
url: string;
deleteGraph: (graphId: number, live: boolean) => void;
}) => {
}) {
const [sync, setSync] = useState<boolean>(false);
const [zoomData, setZoomData] = useState<PlotRelayoutEvent>({});
// const [dbName, setDbName] = useState<string>("test");
Expand All @@ -20,7 +20,6 @@ const Visualize = (props: {
// const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
// setDbName(event.target.value);
// }

const changeSync = (checked: boolean) => {
setSync(checked);
};
Expand All @@ -36,28 +35,23 @@ const Visualize = (props: {
// message.warning('stop trying to save a dashboard without any graphs brother');
// return;
// }

// const data: { dbname: string; graphs: Record<string, string[]> } = {
// dbname: dbName,
// graphs: {}
// };
// for (let graphId in graphSignals) {
// data.graphs[graphId] = graphSignals[graphId];
// }

// const path = `dashboards/${dbName}`;
// const success = await saveDashboardData(path, data);

// if (success) {
// message.success('Dashboard saved successfully!');
// setModalOpen(false);
// } else {
// message.error('Error saving the dashboard.');
// }
// setModalOpen(false);

// };

return (
<div className="layout">
<Space direction="vertical" size="large">
Expand All @@ -75,7 +69,6 @@ const Visualize = (props: {
<Button onClick={() => setModalOpen(true)}>Save Current Loadout</Button>
<Modal open={modalOpen} closeIcon={false} title='Save Dashboard'
cancelButtonProps={{ onClick: () => setModalOpen(false) }}
// okButtonProps={{ onClick: () => }}
>
{/* <Input placeholder='Name of dashboard...' onChange={handleInputChange}></Input> */}
</Modal>
Expand All @@ -91,8 +84,7 @@ const Visualize = (props: {
sync={sync}
zoomData={zoomData}
setZoomData={setZoomData}
onDelete={() => props.deleteGraph(graphId, false)}
/>
onDelete={() => props.deleteGraph(graphId, false)} />
))}
{props.liveGraphs.map((graphId) => (
<LiveGraph
Expand All @@ -102,12 +94,9 @@ const Visualize = (props: {
sync={sync}
zoomData={zoomData}
setZoomData={setZoomData}
onDelete={() => props.deleteGraph(graphId, true)}
/>
onDelete={() => props.deleteGraph(graphId, true)} />
))}
</div>
</div>
);
};

export default Visualize;
}

0 comments on commit 0ad0cce

Please sign in to comment.