Converted /modals to typescript

src/helpers/drawing.ts

@@ -70,7 +70,7 @@ type ShapeType = "line" | "rectangle" | "circle" | "triangle"
  * @typedef {("fill"|"stroke")} PathType
  */
 
-// type PathType = "fill" | "stroke"
+type PathType = "fill" | "stroke"
 
 /**
  * @typedef Path
@@ -83,15 +83,15 @@ type ShapeType = "line" | "rectangle" | "circle" | "triangle"
  * @property {"path"} type
  */
 
-// type Path = {
-//   blend: boolean, 
-//   color: string, 
-//   data: PointsData,
-//   id: string, 
-//   pathType: PathType, 
-//   strokeWidth: number, 
-//   type: "path"
-// }
+export type Path = {
+  blend: boolean, 
+  color: string, 
+  data: PointsData,
+  id: string, 
+  pathType: PathType, 
+  strokeWidth: number, 
+  type: "path"
+}
 
 /**
  * @typedef Shape
@@ -104,15 +104,15 @@ type ShapeType = "line" | "rectangle" | "circle" | "triangle"
  * @property {"shape"} type
  */
 
-// type Shape = {
-//   blend: boolean, 
-//   color: string, 
-//   data: ShapeData, 
-//   id: string, 
-//   shapeType: ShapeType, 
-//   strokeWidth: number, 
-//   type: "shape"
-// }
+export type Shape = {
+  blend: boolean, 
+  color: string, 
+  data: ShapeData, 
+  id: string, 
+  shapeType: ShapeType, 
+  strokeWidth: number, 
+  type: "shape"
+}
 
 /**
  * @typedef Fog
@@ -124,7 +124,7 @@ type ShapeType = "line" | "rectangle" | "circle" | "triangle"
  * @property {boolean} visible
  */
 
-type Fog = {
+export type Fog = {
   color: string, 
   data: FogData, 
   id: string, 

src/helpers/grid.ts

@@ -38,10 +38,10 @@ type GridMeasurement ={
  * @property {GridMeasurement} measurement
  */
 export type Grid = {
-  inset: GridInset,
+  inset?: GridInset,
   size: Vector2,
   type: ("square"|"hexVertical"|"hexHorizontal"),
-  measurement: GridMeasurement
+  measurement?: GridMeasurement
 }
 
 /**
@@ -51,7 +51,7 @@ export type Grid = {
  * @param {number} baseHeight Height of the grid in pixels before inset
  * @returns {Size}
  */
-export function getGridPixelSize(grid: Grid, baseWidth: number, baseHeight: number): Size {
+export function getGridPixelSize(grid: Required<Grid>, baseWidth: number, baseHeight: number): Size {
   const width = (grid.inset.bottomRight.x - grid.inset.topLeft.x) * baseWidth;
   const height = (grid.inset.bottomRight.y - grid.inset.topLeft.y) * baseHeight;
   return new Size(width, height);
@@ -225,7 +225,7 @@ export function getGridDefaultInset(grid: Grid, mapWidth: number, mapHeight: num
  * @param {number} mapHeight Height of the map in pixels before inset
  * @returns {GridInset}
  */
-export function getGridUpdatedInset(grid: Grid, mapWidth: number, mapHeight: number): GridInset {
+export function getGridUpdatedInset(grid: Required<Grid>, mapWidth: number, mapHeight: number): GridInset {
   let inset = grid.inset;
   // Take current inset width and use it to calculate the new height
   if (grid.size.x > 0 && grid.size.x > 0) {
@@ -295,7 +295,7 @@ export function hexOffsetToCube(offset: Vector2, type: ("hexVertical"|"hexHorizo
  * @param {Vector2} b
  * @param {Size} cellSize
  */
-export function gridDistance(grid: Grid, a: Vector2, b: Vector2, cellSize: Size) {
+export function gridDistance(grid: Required<Grid>, a: Vector2, b: Vector2, cellSize: Size) {
   // Get grid coordinates
   const aCoord = getNearestCellCoordinates(grid, a.x, a.y, cellSize);
   const bCoord = getNearestCellCoordinates(grid, b.x, b.y, cellSize);

src/helpers/image.ts

@@ -109,7 +109,7 @@ export async function resizeImage(image: HTMLImageElement, size: number, type: s
  * @property {string} id
  */
 
-type ImageFile = {
+export type ImageFile = {
   file: Uint8Array | null, 
   width: number, 
   height: number, 

src/helpers/select.tsx

@@ -8,7 +8,7 @@ import { groupBy } from "./shared";
  */
 
 // Helper for generating search results for items
-export function useSearch(items: [], search: string) {
+export function useSearch(items: any[], search: string) {
   // TODO: add types to search items -> don't like the never type
   const [filteredItems, setFilteredItems]: [
     filteredItems: any,
@@ -18,10 +18,7 @@ export function useSearch(items: [], search: string) {
     filteredItemScores: {},
     setFilteredItemScores: React.Dispatch<React.SetStateAction<{}>>
   ] = useState({});
-  const [fuse, setFuse]: [
-    fuse: Fuse<never> | undefined,
-    setFuse: React.Dispatch<Fuse<never> | undefined>
-  ] = useState();
+  const [fuse, setFuse] = useState<any>();
 
   // Update search index when items change
   useEffect(() => {
@@ -85,7 +82,7 @@ export function useGroup(
 export function handleItemSelect(
   item: any,
   selectMode: any,
-  selectedIds: number[],
+  selectedIds: string[],
   setSelectedIds: any,
   itemsByGroup: any,
   itemGroups: any
@@ -120,15 +117,15 @@ export function handleItemSelect(
         const lastIndex = items.findIndex(
           (m: any) => m.id === selectedIds[selectedIds.length - 1]
         );
-        let idsToAdd: number[] = [];
-        let idsToRemove: number[] = [];
+        let idsToAdd: string[] = [];
+        let idsToRemove: string[] = [];
         const direction = mapIndex > lastIndex ? 1 : -1;
         for (
           let i = lastIndex + direction;
           direction < 0 ? i >= mapIndex : i <= mapIndex;
           i += direction
         ) {
-          const itemId: number = items[i].id;
+          const itemId: string = items[i].id;
           if (selectedIds.includes(itemId)) {
             idsToRemove.push(itemId);
           } else {