From adb5f3bd161846b317523f900183479f121deba8 Mon Sep 17 00:00:00 2001 From: Mitchell McCaffrey Date: Fri, 16 Jul 2021 17:20:05 +1000 Subject: [PATCH] Typescript --- src/ml/gridSize/GridSizeModel.ts | 3 +-- src/modals/AddPartyMemberModal.tsx | 14 +++++++++----- src/modals/ChangeNicknameModal.tsx | 8 +++++--- src/modals/EditMapModal.tsx | 12 +++++++----- src/modals/ImportExportModal.tsx | 13 +++++++------ src/modals/SelectMapModal.tsx | 4 ++-- src/modals/SelectTokensModal.tsx | 9 ++------- src/modals/SettingsModal.tsx | 9 ++++----- src/modals/StartModal.tsx | 11 +++++------ src/modals/StartTimerModal.tsx | 2 +- 10 files changed, 43 insertions(+), 42 deletions(-) diff --git a/src/ml/gridSize/GridSizeModel.ts b/src/ml/gridSize/GridSizeModel.ts index 565cf68..6652393 100644 --- a/src/ml/gridSize/GridSizeModel.ts +++ b/src/ml/gridSize/GridSizeModel.ts @@ -9,8 +9,7 @@ class GridSizeModel extends Model { // Store model as static to prevent extra network requests static model: LayersModel; // Load tensorflow dynamically - - static tf; + static tf: any; constructor() { super(config as ModelJSON, { "group1-shard1of1.bin": weights }); } diff --git a/src/modals/AddPartyMemberModal.tsx b/src/modals/AddPartyMemberModal.tsx index e4ed209..5cf613d 100644 --- a/src/modals/AddPartyMemberModal.tsx +++ b/src/modals/AddPartyMemberModal.tsx @@ -2,15 +2,19 @@ import { Box, Label, Text } from "theme-ui"; import Modal from "../components/Modal"; +import { RequestCloseEventHandler } from "../types/Events"; + +type AddPartyMemberModalProps = { + isOpen: boolean; + onRequestClose: RequestCloseEventHandler; + gameId: string; +}; + function AddPartyMemberModal({ isOpen, onRequestClose, gameId, -}: { - isOpen: boolean; - onRequestClose; - gameId: string; -}) { +}: AddPartyMemberModalProps) { return ( diff --git a/src/modals/ChangeNicknameModal.tsx b/src/modals/ChangeNicknameModal.tsx index 151c1bb..1fe7b02 100644 --- a/src/modals/ChangeNicknameModal.tsx +++ b/src/modals/ChangeNicknameModal.tsx @@ -3,12 +3,14 @@ import { Box, Input, Button, Label, Flex } from "theme-ui"; import Modal from "../components/Modal"; +import { RequestCloseEventHandler } from "../types/Events"; + type ChangeNicknameModalProps = { isOpen: boolean; - onRequestClose; - onChangeSubmit; + onRequestClose: RequestCloseEventHandler; + onChangeSubmit: React.FormEventHandler; nickname: string; - onChange; + onChange: React.ChangeEventHandler; }; function ChangeNicknameModal({ diff --git a/src/modals/EditMapModal.tsx b/src/modals/EditMapModal.tsx index a444eae..e4a08ce 100644 --- a/src/modals/EditMapModal.tsx +++ b/src/modals/EditMapModal.tsx @@ -101,11 +101,13 @@ function EditMapModal({ } } - const selectedMapWithChanges = map && { - ...map, - ...mapSettingChanges, - }; - const selectedMapStateWithChanges = mapState && { + const selectedMapWithChanges = + map && + ({ + ...map, + ...mapSettingChanges, + } as Map); + const selectedMapStateWithChanges: MapState = mapState && { ...mapState, ...mapStateSettingChanges, }; diff --git a/src/modals/ImportExportModal.tsx b/src/modals/ImportExportModal.tsx index 56ffa14..7e7ae89 100644 --- a/src/modals/ImportExportModal.tsx +++ b/src/modals/ImportExportModal.tsx @@ -22,6 +22,7 @@ import { MapState } from "../types/MapState"; import { Token } from "../types/Token"; import { Group } from "../types/Group"; import { RequestCloseEventHandler } from "../types/Events"; +import { Asset } from "../types/Asset"; const importDBName = "OwlbearRodeoImportDB"; @@ -46,7 +47,7 @@ function ImportExportModal({ const [error, setError] = useState(); const backgroundTaskRunningRef = useRef(false); - const fileInputRef = useRef(); + const fileInputRef = useRef(null); const [showImportSelector, setShowImportSelector] = useState(false); const [showExportSelector, setShowExportSelector] = useState(false); @@ -115,7 +116,7 @@ function ImportExportModal({ } // Set file input to null to allow adding the same data 2 times in a row if (fileInputRef.current) { - fileInputRef.current.value = null; + fileInputRef.current.value = ""; } } @@ -124,7 +125,7 @@ function ImportExportModal({ } useEffect(() => { - function handleBeforeUnload(event) { + function handleBeforeUnload(event: BeforeUnloadEvent) { if (backgroundTaskRunningRef.current) { event.returnValue = "Database is still processing, are you sure you want to leave?"; @@ -257,7 +258,7 @@ function ImportExportModal({ const assetsToAdd = await importDB .table("assets") .bulkGet(Object.keys(newAssetIds)); - let newAssets = []; + let newAssets: Asset[] = []; for (let asset of assetsToAdd) { if (asset) { newAssets.push({ @@ -271,7 +272,7 @@ function ImportExportModal({ } // Add map groups with new ids - let newMapGroups = []; + let newMapGroups: Group[] = []; if (checkedMapGroups.length > 0) { for (let group of checkedMapGroups) { if (group.type === "item") { @@ -290,7 +291,7 @@ function ImportExportModal({ } // Add token groups with new ids - let newTokenGroups = []; + let newTokenGroups: Group[] = []; if (checkedTokenGroups.length > 0) { for (let group of checkedTokenGroups) { if (group.type === "item") { diff --git a/src/modals/SelectMapModal.tsx b/src/modals/SelectMapModal.tsx index 4769a4b..730cd2e 100644 --- a/src/modals/SelectMapModal.tsx +++ b/src/modals/SelectMapModal.tsx @@ -81,7 +81,7 @@ function SelectMapModal({ * Image Upload */ - const fileInputRef = useRef(); + const fileInputRef = useRef(null); const [isLoading, setIsLoading] = useState(false); const [isLargeImageWarningModalOpen, setShowLargeImageWarning] = @@ -120,7 +120,7 @@ function SelectMapModal({ function clearFileInput() { // Set file input to null to allow adding the same image 2 times in a row if (fileInputRef.current) { - fileInputRef.current.value = null; + fileInputRef.current.value = ""; } } diff --git a/src/modals/SelectTokensModal.tsx b/src/modals/SelectTokensModal.tsx index b170948..0f8990a 100644 --- a/src/modals/SelectTokensModal.tsx +++ b/src/modals/SelectTokensModal.tsx @@ -76,7 +76,7 @@ function SelectTokensModal({ * Image Upload */ - const fileInputRef = useRef(); + const fileInputRef = useRef(null); const [isLoading, setIsLoading] = useState(false); const [isLargeImageWarningModalOpen, setShowLargeImageWarning] = @@ -89,11 +89,6 @@ function SelectTokensModal({ await navigator.storage.persist(); } - // TODO: handle null files - if (files === null) { - return; - } - let tokenFiles = []; for (let file of files) { if (file.size > 5e7) { @@ -120,7 +115,7 @@ function SelectTokensModal({ function clearFileInput() { // Set file input to null to allow adding the same image 2 times in a row if (fileInputRef.current) { - fileInputRef.current.value = null; + fileInputRef.current.value = ""; } } diff --git a/src/modals/SettingsModal.tsx b/src/modals/SettingsModal.tsx index 394507a..286017f 100644 --- a/src/modals/SettingsModal.tsx +++ b/src/modals/SettingsModal.tsx @@ -25,13 +25,12 @@ import ImportExportModal from "./ImportExportModal"; import { MapState } from "../types/MapState"; import { RequestCloseEventHandler } from "../types/Events"; -function SettingsModal({ - isOpen, - onRequestClose, -}: { +type SettingsModalProps = { isOpen: boolean; onRequestClose: RequestCloseEventHandler; -}) { +}; + +function SettingsModal({ isOpen, onRequestClose }: SettingsModalProps) { const { database, databaseStatus } = useDatabase(); const userId = useUserId(); const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); diff --git a/src/modals/StartModal.tsx b/src/modals/StartModal.tsx index 1886dd4..a823f8b 100644 --- a/src/modals/StartModal.tsx +++ b/src/modals/StartModal.tsx @@ -11,13 +11,12 @@ import Modal from "../components/Modal"; import { RequestCloseEventHandler } from "../types/Events"; -function StartModal({ - isOpen, - onRequestClose, -}: { +type StartModalProps = { isOpen: boolean; onRequestClose: RequestCloseEventHandler; -}) { +}; + +function StartModal({ isOpen, onRequestClose }: StartModalProps) { let history = useHistory(); const { password, setPassword } = useAuth(); @@ -38,7 +37,7 @@ function StartModal({ history.push(`/game/${shortid.generate()}`); } - const inputRef = useRef(); + const inputRef = useRef(null); function focusInput() { inputRef.current && inputRef.current.focus(); } diff --git a/src/modals/StartTimerModal.tsx b/src/modals/StartTimerModal.tsx index c70a280..ae16385 100644 --- a/src/modals/StartTimerModal.tsx +++ b/src/modals/StartTimerModal.tsx @@ -28,7 +28,7 @@ function StartTimerModal({ onTimerStop, timer, }: StartTimerProps) { - const inputRef = useRef(); + const inputRef = useRef(null); function focusInput() { inputRef.current && inputRef.current.focus(); }