Skip to content

Commit

Permalink
Fixed npm run build
Browse files Browse the repository at this point in the history
  • Loading branch information
Jasmine Yuen committed Dec 17, 2024
1 parent df16b52 commit e148262
Show file tree
Hide file tree
Showing 4 changed files with 84 additions and 96 deletions.
14 changes: 7 additions & 7 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
"@mantine/hooks": "^7.13.1",
"@tabler/icons-react": "3.17.0",
"dayjs": "^1.11.13",
"nuqs": "^2.2.1",
"nuqs": "^2.2.3",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-router-dom": "^6.27.0",
Expand Down
45 changes: 0 additions & 45 deletions src/App.tsx
View file

This file was deleted.

119 changes: 76 additions & 43 deletions src/components/PreviewCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,34 +29,39 @@ function PreviewCard({ selectedData }: PreviewCardProps) {
const [success, setSuccess] = useState<string | null>(null);

const handleDelete = async () => {
setLoading(true)
setLoading(true);
setError(null);
setSuccess(null)
setSuccess(null);
try {
const response = await fetch(`${import.meta.env.VITE_API_URL}/mcaps/${selectedData?.id}`, {
method: 'DELETE',
});
const response = await fetch(
`${import.meta.env.VITE_API_URL}/mcaps/${selectedData?.id}`,
{
method: "DELETE",
},
);

if (!response.ok) {
if (response.status === 503) {
const errorMsg = await response.text();
setError(`Failed to delete: ${errorMsg} \nTry again in a few minutes!`);
} else {
const errorMsg = await response.text();
setError(`Failed to delete: ${errorMsg}`);
}
if (!response.ok) {
if (response.status === 503) {
const errorMsg = await response.text();
setError(
`Failed to delete: ${errorMsg} \nTry again in a few minutes!`,
);
} else {
const result = await response.json();
setSuccess('File deleted successfully!');
console.log('Delete successful:', result);
const errorMsg = await response.text();
setError(`Failed to delete: ${errorMsg}`);
}
} else {
const result = await response.json();
setSuccess("File deleted successfully!");
console.log("Delete successful:", result);
}
} catch (error) {
console.error('Error sending Delete request:', error);
setError('An error occurred during file deletion.');
console.error("Error sending Delete request:", error);
setError("An error occurred during file deletion.");
}
setLoading(false)
}
setLoading(false);
};

const formatDate = (dateString: string) => {
const date = new Date(dateString);
return date.toLocaleDateString("en-US", {
Expand All @@ -69,30 +74,30 @@ function PreviewCard({ selectedData }: PreviewCardProps) {

// Take out when API server team implements filename id in their get route
const getFileNameWithoutExtension = (fileNameWithExtension: string) => {
const lastDotIndex = fileNameWithExtension.lastIndexOf('.');
return lastDotIndex !== -1 ? fileNameWithExtension.slice(0, lastDotIndex) : fileNameWithExtension;
const lastDotIndex = fileNameWithExtension.lastIndexOf(".");
return lastDotIndex !== -1
? fileNameWithExtension.slice(0, lastDotIndex)
: fileNameWithExtension;
};

const imageUrl = selectedData?.content_files?.vn_lat_lon_plot?.[0]?.signed_url ?? "https://camo.githubusercontent.com/25de56138803873d9ea83567c55b9a022ad86d0acb53bb7c733bb038583e2279/68747470733a2f2f6d69726f2e6d656469756d2e636f6d2f76322f726573697a653a6669743a3430302f312a7241676c6b664c4c316676384a6363697a4a33572d512e706e67"; // Fallback to a default image if none exists.

const imageUrl =
selectedData?.content_files?.vn_lat_lon_plot?.[0]?.signed_url ??
"https://camo.githubusercontent.com/25de56138803873d9ea83567c55b9a022ad86d0acb53bb7c733bb038583e2279/68747470733a2f2f6d69726f2e6d656469756d2e636f6d2f76322f726573697a653a6669743a3430302f312a7241676c6b664c4c316676384a6363697a4a33572d512e706e67"; // Fallback to a default image if none exists.

const formatTime = (dateString: string) => {
const date = new Date(dateString);
return date.toLocaleTimeString("en-US", {
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
hour12: true,
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
hour12: true,
});
};
return (
<div className="preview-container">
<Grid>
<Grid.Col span={3} className="image-column">
<img
src={imageUrl}
alt="Preview"
className="preview-image"
/>
<img src={imageUrl} alt="Preview" className="preview-image" />
</Grid.Col>
<Grid.Col span={3} className="image-column">
<img
Expand Down Expand Up @@ -158,13 +163,26 @@ function PreviewCard({ selectedData }: PreviewCardProps) {
}}
>
<div className="previewFileButtons">
<DownloadButton buttonText="MAT" />
<DownloadButton buttonText="MCAP" />
<DownloadButton
buttonText="MAT"
fileName={selectedData?.mcap_file_name ?? ""}
signedUrl={selectedData?.signed_url ?? null}
/>
<DownloadButton
buttonText="MCAP"
fileName={selectedData?.mcap_file_name ?? ""}
signedUrl={selectedData?.signed_url ?? null}
/>
</div>
</div>
{selectedData ? (
<>
<PreviewDataDiv name={getFileNameWithoutExtension(selectedData.mcap_files[0].file_name)} val={""} />
<PreviewDataDiv
name={getFileNameWithoutExtension(
selectedData.mcap_files[0].file_name,
)}
val={""}
/>
<PreviewDataDiv
name={"Car Model"}
val={selectedData.car_model ?? "NA"}
Expand Down Expand Up @@ -210,19 +228,34 @@ function PreviewCard({ selectedData }: PreviewCardProps) {
signedUrl={item.signed_url}
/>
))}
<Button loading={loading} loaderProps={{ type: 'dots' }} size="compact-md" color="red" onClick={handleDelete}>Delete</Button>
<Button
loading={loading}
loaderProps={{ type: "dots" }}
size="compact-md"
color="red"
onClick={handleDelete}
>
Delete
</Button>
{success && (
<Notification color="green" onClose={() => setSuccess(null)} style={{ marginTop: 10 }}>
<Notification
color="green"
onClose={() => setSuccess(null)}
style={{ marginTop: 10 }}
>
{success}
</Notification>
)}
{error && (
<Notification color="red" onClose={() => setError(null)} style={{ marginTop: 10 }}>
<Notification
color="red"
onClose={() => setError(null)}
style={{ marginTop: 10 }}
>
{error}
</Notification>
)}
</div>

</div>
</>
) : (
Expand Down Expand Up @@ -291,7 +324,7 @@ export function DownloadButton({
<Menu.Dropdown>
<Menu.Item
style={{
fontSize: '10px',
fontSize: "10px",
}}
leftSection={
<IconFile
Expand Down Expand Up @@ -344,7 +377,7 @@ export const SchemaTable = () => {
handleSearch(e.target.value);
}}
/>
<ScrollArea style={{ height: 180, width: 250 , padding: 10}}>
<ScrollArea style={{ height: 180, width: 250, padding: 10 }}>
{" "}
{/* Scrollable area with height limit */}
<Table
Expand Down

0 comments on commit e148262

Please sign in to comment.