Merge pull request #72 from MegaScenes/todos

Todos

src/app/page.tsx

@@ -18,13 +18,12 @@ import {
 	IconZoomOut,
 	IconPlus,
 	IconRefresh,
-	IconMenu2,
 } from "@tabler/icons-react";
 import OptionsDropdown from "../components/OptionsDropdown";
 import SidePanel from "../components/SidePanel";
 import SearchBar from "../components/SearchBar";
 import ImageModal from "../components/ImageModal";
-import { SceneType } from "@/types/scene";
+import { SceneType } from "../../types";
 import type { ImageData, CameraData } from "../hooks/useCOLMAPLoader";
 
 const CAM_MAX_SCALE = 1;
@@ -378,9 +377,11 @@ const Home: React.FC = () => {
 	return (
 		<Suspense
 			fallback={
-				<div className={`bg-darkgrey flex items-center justify-center`}>
+				<div
+					className={`bg-darkgrey flex items-center justify-center w-full h-screen`}
+				>
 					<div
-						className={`animate-spin rounded-full border-t-4 border-white h-12 w-12`}
+						className={`animate-spin rounded-full border-t-4 border-white h-8 w-8`}
 					></div>
 				</div>
 			}

src/components/Card.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { IconCircleDotted, IconCamera } from "@tabler/icons-react";
-import { SceneType } from "@/types/scene";
+import { SceneType } from "../../types";
 import { useRouter } from "next/navigation";
 
 interface CardProps {

src/components/OptionsDropdown.tsx

@@ -158,6 +158,7 @@ const OptionsDropdown: React.FC<OptionsDropdownProps> = ({
 			document.removeEventListener("mousedown", handleClickOutside);
 		};
 	}, [ref, toggleMenu]);
+
 	return (
 		<div className="relative" ref={ref}>
 			<button

src/components/SearchBar.tsx

@@ -4,7 +4,7 @@ import Autocomplete from "@mui/material/Autocomplete";
 import TextField from "@mui/material/TextField";
 import { VariableSizeList as List } from "react-window";
 import { useRouter } from "next/navigation";
-import { SceneType } from "@/types/scene";
+import { SceneType } from "../../types";
 import { IconMenu2 } from "@tabler/icons-react";
 
 const OuterElementContext = React.createContext({});

src/components/SidePanel.tsx

@@ -8,7 +8,7 @@ import {
 
 import Card from "./Card";
 import reconMetadata from "../../public/data/recon_metadata.json";
-import { SceneType } from "@/types/scene";
+import { SceneType } from "../../types";
 
 interface SidePanelProps {
 	scene?: SceneType;

types.d.ts

@@ -0,0 +1,13 @@
+declare module "react" {
+	interface InputHTMLAttributes<T> {
+		webkitdirectory?: string;
+		directory?: string;
+	}
+}
+
+export type SceneType = {
+	id: number;
+	name: string;
+	normalized_name: string;
+	no_of_rec: number;
+};