fix: typing + functions as components

lfglabs-dev · Sep 14, 2023 · dd905bb · dd905bb
1 parent 1ab9307
commit dd905bb
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 15 deletions.
diff --git a/components/lands/buildings.tsx b/components/lands/buildings.tsx
@@ -1,4 +1,4 @@
-import React, { ReactElement, useMemo } from "react";
+import React, { FunctionComponent, ReactElement, useMemo } from "react";
 import { TextureLoader, RepeatWrapping, NearestFilter, Vector2 } from "three";
 import { BuildingTileProps } from "../../types/land";
 import BuildingItem from "./buildingItem";
@@ -10,10 +10,10 @@ type BuildingsProps = {
   buildingData: (BuildingTileProps | null)[][];
 };
 
-export default function Buildings({
+const Buildings: FunctionComponent<BuildingsProps> = ({
   tilesets,
   buildingData,
-}: BuildingsProps): ReactElement | null {
+}) => {
   const buildingTexture = useMemo(() => {
     const texture = useLoader(
       TextureLoader,
@@ -56,4 +56,6 @@ export default function Buildings({
         })}
     </>
   );
-}
+};
+
+export default Buildings;
diff --git a/components/lands/ground.tsx b/components/lands/ground.tsx
@@ -1,4 +1,4 @@
-import React, { ReactElement, useMemo } from "react";
+import React, { FunctionComponent, ReactElement, useMemo } from "react";
 import {
   TextureLoader,
   RepeatWrapping,
@@ -16,10 +16,7 @@ type GroundProps = {
   cityData: (GroundTileProps | null)[][];
 };
 
-export default function Ground({
-  tileset,
-  cityData,
-}: GroundProps): ReactElement | null {
+const Ground: FunctionComponent<GroundProps> = ({ tileset, cityData }) => {
   const groundTexture = useMemo(() => {
     const textObj = useLoader(
       TextureLoader,
@@ -57,4 +54,6 @@ export default function Ground({
         })}
     </>
   );
-}
+};
+
+export default Ground;
diff --git a/components/lands/roadProps.tsx b/components/lands/roadProps.tsx
@@ -1,4 +1,4 @@
-import React, { ReactElement, useMemo } from "react";
+import React, { FunctionComponent, ReactElement, useMemo } from "react";
 import {
   TextureLoader,
   RepeatWrapping,
@@ -11,17 +11,17 @@ import { Tileset } from "../../types/ldtk";
 import { useLoader } from "@react-three/fiber";
 import RoadItem from "./roadItem";
 
-type RoadItemProps = {
+type RoadItemsProps = {
   tilesets: Tileset[];
   cityData: (RoadObjects | null)[][];
   tileData: TileData[];
 };
 
-export default function RoadProps({
+const RoadProps: FunctionComponent<RoadItemsProps> = ({
   tilesets,
   cityData,
   tileData,
-}: RoadItemProps): ReactElement | null {
+}) => {
   const buildingTexture = useMemo(() => {
     const texture = useLoader(
       TextureLoader,
@@ -84,4 +84,6 @@ export default function RoadProps({
         })}
     </>
   );
-}
+};
+
+export default RoadProps;