From 437a7292d13c9601e0683fc406ba4d9942dbbe83 Mon Sep 17 00:00:00 2001 From: unknown Date: Sun, 22 Sep 2024 17:04:14 -0400 Subject: [PATCH 1/7] Save first checkpoint for TS refactor --- Frontend/package-lock.json | 61 ++++++++++++++++--- Frontend/package.json | 4 ++ Frontend/shared/.babelrc | 15 ----- Frontend/shared/package.json | 2 +- Frontend/shared/src/constants/BaseUrl.ts | 5 ++ .../shared/src/constants/config/config.js | 2 - Frontend/shared/src/constants/config/index.js | 1 - Frontend/shared/src/constants/index.d.ts | 5 ++ Frontend/shared/src/constants/index.js | 1 - ...ateGroceryItem.js => createGroceryItem.ts} | 6 +- .../createGroceryItem/{index.js => index.ts} | 0 ...{createShareLink.js => createShareLink.ts} | 4 +- .../createShareLink/{index.js => index.ts} | 0 ...issions.js => createSharingPermissions.ts} | 4 +- .../{index.js => index.ts} | 0 ...eShoppingList.js => createShoppingList.ts} | 4 +- .../createShoppingList/{index.js => index.ts} | 0 ...eteGroceryItem.js => deleteGroceryItem.ts} | 5 +- .../deleteGroceryItem/{index.js => index.ts} | 0 ...eShoppingList.js => deleteShoppingList.ts} | 4 +- .../deleteShoppingList/{index.js => index.ts} | 0 ...chGroceryItems.js => fetchGroceryItems.ts} | 4 +- .../fetchGroceryItems/{index.js => index.ts} | 0 ...ingLists.js => fetchOwnedShoppingLists.ts} | 2 +- .../{index.js => index.ts} | 0 ...ngLists.js => fetchSharedShoppingLists.ts} | 2 +- .../{index.js => index.ts} | 0 ...chShoppingList.js => fetchShoppingList.ts} | 4 +- .../fetchShoppingList/{index.js => index.ts} | 0 .../src/functions/{index.js => index.ts} | 0 .../updateGroceryItem/{index.js => index.ts} | 0 ...ateGroceryItem.js => updateGroceryItem.ts} | 5 +- .../{index.js => index.ts} | 0 ...istTitle.js => updateShoppingListTitle.ts} | 4 +- .../{AuthContext.js => AuthContext.tsx} | 37 ++++++----- .../shared/src/hooks/AuthContext/index.d.ts | 4 ++ .../hooks/AuthContext/{index.js => index.ts} | 0 .../shared/src/hooks/{index.js => index.ts} | 0 Frontend/shared/src/{index.js => index.ts} | 5 +- Frontend/shared/src/types/GroceryItem.ts | 10 +++ Frontend/shared/src/types/index.d.ts | 5 ++ Frontend/shared/tsconfig.json | 22 +++++++ Frontend/shared/webpack.config.js | 56 +++++++++++++++++ 43 files changed, 215 insertions(+), 68 deletions(-) delete mode 100644 Frontend/shared/.babelrc create mode 100644 Frontend/shared/src/constants/BaseUrl.ts delete mode 100644 Frontend/shared/src/constants/config/config.js delete mode 100644 Frontend/shared/src/constants/config/index.js create mode 100644 Frontend/shared/src/constants/index.d.ts delete mode 100644 Frontend/shared/src/constants/index.js rename Frontend/shared/src/functions/createGroceryItem/{createGroceryItem.js => createGroceryItem.ts} (73%) rename Frontend/shared/src/functions/createGroceryItem/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/createShareLink/{createShareLink.js => createShareLink.ts} (68%) rename Frontend/shared/src/functions/createShareLink/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/createSharingPermissions/{createSharingPermissions.js => createSharingPermissions.ts} (64%) rename Frontend/shared/src/functions/createSharingPermissions/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/createShoppingList/{createShoppingList.js => createShoppingList.ts} (79%) rename Frontend/shared/src/functions/createShoppingList/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/deleteGroceryItem/{deleteGroceryItem.js => deleteGroceryItem.ts} (59%) rename Frontend/shared/src/functions/deleteGroceryItem/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/deleteShoppingList/{deleteShoppingList.js => deleteShoppingList.ts} (79%) rename Frontend/shared/src/functions/deleteShoppingList/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/fetchGroceryItems/{fetchGroceryItems.js => fetchGroceryItems.ts} (87%) rename Frontend/shared/src/functions/fetchGroceryItems/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/fetchOwnedShoppingLists/{fetchOwnedShoppingLists.js => fetchOwnedShoppingLists.ts} (85%) rename Frontend/shared/src/functions/fetchOwnedShoppingLists/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/fetchSharedShoppingLists/{fetchSharedShoppingLists.js => fetchSharedShoppingLists.ts} (85%) rename Frontend/shared/src/functions/fetchSharedShoppingLists/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/fetchShoppingList/{fetchShoppingList.js => fetchShoppingList.ts} (81%) rename Frontend/shared/src/functions/fetchShoppingList/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/updateGroceryItem/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/updateGroceryItem/{updateGroceryItem.js => updateGroceryItem.ts} (62%) rename Frontend/shared/src/functions/updateShoppingListTItle/{index.js => index.ts} (100%) rename Frontend/shared/src/functions/updateShoppingListTItle/{updateShoppingListTitle.js => updateShoppingListTitle.ts} (65%) rename Frontend/shared/src/hooks/AuthContext/{AuthContext.js => AuthContext.tsx} (78%) create mode 100644 Frontend/shared/src/hooks/AuthContext/index.d.ts rename Frontend/shared/src/hooks/AuthContext/{index.js => index.ts} (100%) rename Frontend/shared/src/hooks/{index.js => index.ts} (100%) rename Frontend/shared/src/{index.js => index.ts} (52%) create mode 100644 Frontend/shared/src/types/GroceryItem.ts create mode 100644 Frontend/shared/src/types/index.d.ts create mode 100644 Frontend/shared/tsconfig.json create mode 100644 Frontend/shared/webpack.config.js diff --git a/Frontend/package-lock.json b/Frontend/package-lock.json index 1cf32a8..f9f527f 100644 --- a/Frontend/package-lock.json +++ b/Frontend/package-lock.json @@ -55,6 +55,9 @@ "@babel/plugin-proposal-private-property-in-object": "^7.16.7", "@babel/preset-env": "^7.25.3", "@babel/preset-react": "^7.24.7", + "@types/node": "^22.5.5", + "@types/react": "^18.3.8", + "@types/react-native": "^0.73.0", "babel-plugin-inline-dotenv": "^1.7.0", "babel-plugin-module-resolver": "^5.0.2", "babel-plugin-transform-inline-environment-variables": "^0.4.4", @@ -62,6 +65,7 @@ "eslint": "^8.56.0", "eslint-config-react-app": "^7.0.1", "jest": "^29.7.0", + "typescript": "^4.9.5", "webpack": "^5.92.1" } }, @@ -6787,6 +6791,14 @@ "node": ">=14.15" } }, + "node_modules/@rnx-kit/chromium-edge-launcher/node_modules/@types/node": { + "version": "18.19.50", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.50.tgz", + "integrity": "sha512-xonK+NRrMBRtkL1hVCc3G+uXtjh1Al4opBLjqVmipe5ZAaBYWW6cNAiBVZ1BvmkBhep698rP3UM3aRAdSALuhg==", + "dependencies": { + "undici-types": "~5.26.4" + } + }, "node_modules/@rnx-kit/chromium-edge-launcher/node_modules/escape-string-regexp": { "version": "4.0.0", "license": "MIT", @@ -6807,6 +6819,11 @@ "node": ">=10" } }, + "node_modules/@rnx-kit/chromium-edge-launcher/node_modules/undici-types": { + "version": "5.26.5", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", + "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==" + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "license": "MIT", @@ -7606,10 +7623,11 @@ "license": "MIT" }, "node_modules/@types/node": { - "version": "18.19.50", - "license": "MIT", + "version": "22.5.5", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.5.5.tgz", + "integrity": "sha512-Xjs4y5UPO/CLdzpgR6GirZJx36yScjh73+2NlLlkFRSoQN8B0DpfXPdZGnvVmLRLOsqDpOfTNv7D9trgGhmOIA==", "dependencies": { - "undici-types": "~5.26.4" + "undici-types": "~6.19.2" } }, "node_modules/@types/node-forge": { @@ -7644,8 +7662,9 @@ "license": "MIT" }, "node_modules/@types/react": { - "version": "18.3.5", - "license": "MIT", + "version": "18.3.8", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.8.tgz", + "integrity": "sha512-syBUrW3/XpnW4WJ41Pft+I+aPoDVbrBVQGEnbD7NijDGlVC+8gV/XKRY+7vMDlfPpbwYt0l1vd/Sj8bJGMbs9Q==", "dependencies": { "@types/prop-types": "*", "csstype": "^3.0.2" @@ -7658,6 +7677,16 @@ "@types/react": "*" } }, + "node_modules/@types/react-native": { + "version": "0.73.0", + "resolved": "https://registry.npmjs.org/@types/react-native/-/react-native-0.73.0.tgz", + "integrity": "sha512-6ZRPQrYM72qYKGWidEttRe6M5DZBEV5F+MHMHqd4TTYx0tfkcdrUFGdef6CCxY0jXU7wldvd/zA/b0A/kTeJmA==", + "deprecated": "This is a stub types definition. react-native provides its own type definitions, so you do not need this installed.", + "dev": true, + "dependencies": { + "react-native": "*" + } + }, "node_modules/@types/resolve": { "version": "1.17.1", "license": "MIT", @@ -13188,6 +13217,19 @@ "version": "1.0.0", "license": "ISC" }, + "node_modules/fsevents": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", + "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "hasInstallScript": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, "node_modules/function-bind": { "version": "1.1.2", "license": "MIT", @@ -25608,8 +25650,8 @@ }, "node_modules/typescript": { "version": "4.9.5", - "license": "Apache-2.0", - "peer": true, + "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", + "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -25661,8 +25703,9 @@ "license": "MIT" }, "node_modules/undici-types": { - "version": "5.26.5", - "license": "MIT" + "version": "6.19.8", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz", + "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==" }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.0", diff --git a/Frontend/package.json b/Frontend/package.json index 473ec34..1b2ca49 100644 --- a/Frontend/package.json +++ b/Frontend/package.json @@ -53,6 +53,9 @@ "@babel/plugin-proposal-private-property-in-object": "^7.16.7", "@babel/preset-env": "^7.25.3", "@babel/preset-react": "^7.24.7", + "@types/node": "^22.5.5", + "@types/react": "^18.3.8", + "@types/react-native": "^0.73.0", "babel-plugin-inline-dotenv": "^1.7.0", "babel-plugin-module-resolver": "^5.0.2", "babel-plugin-transform-inline-environment-variables": "^0.4.4", @@ -60,6 +63,7 @@ "eslint": "^8.56.0", "eslint-config-react-app": "^7.0.1", "jest": "^29.7.0", + "typescript": "^4.9.5", "webpack": "^5.92.1" }, "version": "1.0.0", diff --git a/Frontend/shared/.babelrc b/Frontend/shared/.babelrc deleted file mode 100644 index 96addf5..0000000 --- a/Frontend/shared/.babelrc +++ /dev/null @@ -1,15 +0,0 @@ -{ - "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": [ - "inline-dotenv", - [ - "module-resolver", - { - "alias": { - "@constants": "./src/constants" - } - } - ] - ] - } - \ No newline at end of file diff --git a/Frontend/shared/package.json b/Frontend/shared/package.json index 2e9dcc5..2c5580e 100644 --- a/Frontend/shared/package.json +++ b/Frontend/shared/package.json @@ -4,7 +4,7 @@ "description": "", "main": "./dist/index.js", "scripts": { - "build": "babel src --out-dir dist && echo Success" + "build": "tsc && echo Success" }, "keywords": [], "author": "", diff --git a/Frontend/shared/src/constants/BaseUrl.ts b/Frontend/shared/src/constants/BaseUrl.ts new file mode 100644 index 0000000..94850c9 --- /dev/null +++ b/Frontend/shared/src/constants/BaseUrl.ts @@ -0,0 +1,5 @@ +// src/constants/config/config.ts + +// This can be reused for all backend interactions +const BASE_URL: string = `https://${process.env.REACT_APP_API_DOMAIN}:${process.env.REACT_APP_API_PORT}`; +export default BASE_URL; \ No newline at end of file diff --git a/Frontend/shared/src/constants/config/config.js b/Frontend/shared/src/constants/config/config.js deleted file mode 100644 index b94fd32..0000000 --- a/Frontend/shared/src/constants/config/config.js +++ /dev/null @@ -1,2 +0,0 @@ -// This can be reused for all backend interactions -export const BASE_URL = `https://${process.env.REACT_APP_API_DOMAIN}:${process.env.REACT_APP_API_PORT}`; \ No newline at end of file diff --git a/Frontend/shared/src/constants/config/index.js b/Frontend/shared/src/constants/config/index.js deleted file mode 100644 index ff87ad7..0000000 --- a/Frontend/shared/src/constants/config/index.js +++ /dev/null @@ -1 +0,0 @@ -export { BASE_URL } from './config'; \ No newline at end of file diff --git a/Frontend/shared/src/constants/index.d.ts b/Frontend/shared/src/constants/index.d.ts new file mode 100644 index 0000000..db7c382 --- /dev/null +++ b/Frontend/shared/src/constants/index.d.ts @@ -0,0 +1,5 @@ +// src/constants/index.d.ts + +declare module '@constants' { + export const BASE_URL; +} \ No newline at end of file diff --git a/Frontend/shared/src/constants/index.js b/Frontend/shared/src/constants/index.js deleted file mode 100644 index ff87ad7..0000000 --- a/Frontend/shared/src/constants/index.js +++ /dev/null @@ -1 +0,0 @@ -export { BASE_URL } from './config'; \ No newline at end of file diff --git a/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.js b/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts similarity index 73% rename from Frontend/shared/src/functions/createGroceryItem/createGroceryItem.js rename to Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts index 80bb3fa..2ec117c 100644 --- a/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.js +++ b/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts @@ -1,4 +1,6 @@ -import { BASE_URL } from '@constants/config'; +import BASE_URL from '@constants'; +import GroceryItem from '@types'; + /* This is what item must look like: { @@ -9,7 +11,7 @@ This is what item must look like: list_id: uuid (or Number, one of these?) } */ -export const createGroceryItem = async (item) => { +export const createGroceryItem = async (item: GroceryItem) => { return fetch(`${BASE_URL}/grocery-items`, { method: 'POST', headers: { diff --git a/Frontend/shared/src/functions/createGroceryItem/index.js b/Frontend/shared/src/functions/createGroceryItem/index.ts similarity index 100% rename from Frontend/shared/src/functions/createGroceryItem/index.js rename to Frontend/shared/src/functions/createGroceryItem/index.ts diff --git a/Frontend/shared/src/functions/createShareLink/createShareLink.js b/Frontend/shared/src/functions/createShareLink/createShareLink.ts similarity index 68% rename from Frontend/shared/src/functions/createShareLink/createShareLink.js rename to Frontend/shared/src/functions/createShareLink/createShareLink.ts index 39fd68f..dd345f7 100644 --- a/Frontend/shared/src/functions/createShareLink/createShareLink.js +++ b/Frontend/shared/src/functions/createShareLink/createShareLink.ts @@ -1,6 +1,6 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; -export const createShareLink = async (shareListId, permissions) => { +export const createShareLink = async (shareListId: string, permissions: string) => { return fetch(`${BASE_URL}/share/${shareListId}`, { method: 'POST', headers: { diff --git a/Frontend/shared/src/functions/createShareLink/index.js b/Frontend/shared/src/functions/createShareLink/index.ts similarity index 100% rename from Frontend/shared/src/functions/createShareLink/index.js rename to Frontend/shared/src/functions/createShareLink/index.ts diff --git a/Frontend/shared/src/functions/createSharingPermissions/createSharingPermissions.js b/Frontend/shared/src/functions/createSharingPermissions/createSharingPermissions.ts similarity index 64% rename from Frontend/shared/src/functions/createSharingPermissions/createSharingPermissions.js rename to Frontend/shared/src/functions/createSharingPermissions/createSharingPermissions.ts index 82655ad..7ce2526 100644 --- a/Frontend/shared/src/functions/createSharingPermissions/createSharingPermissions.js +++ b/Frontend/shared/src/functions/createSharingPermissions/createSharingPermissions.ts @@ -1,6 +1,6 @@ -import { BASE_URL } from "@constants/config"; +import { BASE_URL } from '@constants'; -export const createSharingPermissions = async (token) => { +export const createSharingPermissions = async (token: string) => { return fetch(`${BASE_URL}/share/${token}`, { method: 'GET', headers: { diff --git a/Frontend/shared/src/functions/createSharingPermissions/index.js b/Frontend/shared/src/functions/createSharingPermissions/index.ts similarity index 100% rename from Frontend/shared/src/functions/createSharingPermissions/index.js rename to Frontend/shared/src/functions/createSharingPermissions/index.ts diff --git a/Frontend/shared/src/functions/createShoppingList/createShoppingList.js b/Frontend/shared/src/functions/createShoppingList/createShoppingList.ts similarity index 79% rename from Frontend/shared/src/functions/createShoppingList/createShoppingList.js rename to Frontend/shared/src/functions/createShoppingList/createShoppingList.ts index ea1271c..438ffe8 100644 --- a/Frontend/shared/src/functions/createShoppingList/createShoppingList.js +++ b/Frontend/shared/src/functions/createShoppingList/createShoppingList.ts @@ -1,6 +1,6 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; -export const createShoppingList = async (name, routeId = null) => { +export const createShoppingList = async (name: string, routeId = null) => { const url = `${BASE_URL}/shopping-lists`; const body = JSON.stringify({ diff --git a/Frontend/shared/src/functions/createShoppingList/index.js b/Frontend/shared/src/functions/createShoppingList/index.ts similarity index 100% rename from Frontend/shared/src/functions/createShoppingList/index.js rename to Frontend/shared/src/functions/createShoppingList/index.ts diff --git a/Frontend/shared/src/functions/deleteGroceryItem/deleteGroceryItem.js b/Frontend/shared/src/functions/deleteGroceryItem/deleteGroceryItem.ts similarity index 59% rename from Frontend/shared/src/functions/deleteGroceryItem/deleteGroceryItem.js rename to Frontend/shared/src/functions/deleteGroceryItem/deleteGroceryItem.ts index 9607e8b..60b5719 100644 --- a/Frontend/shared/src/functions/deleteGroceryItem/deleteGroceryItem.js +++ b/Frontend/shared/src/functions/deleteGroceryItem/deleteGroceryItem.ts @@ -1,6 +1,7 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; +import GroceryItem from '@types'; -export const deleteGroceryItem = async (item) => { +export const deleteGroceryItem = async (item: GroceryItem) => { fetch(`${BASE_URL}/grocery-items/${item.item_id}`, { method: 'DELETE', headers: { diff --git a/Frontend/shared/src/functions/deleteGroceryItem/index.js b/Frontend/shared/src/functions/deleteGroceryItem/index.ts similarity index 100% rename from Frontend/shared/src/functions/deleteGroceryItem/index.js rename to Frontend/shared/src/functions/deleteGroceryItem/index.ts diff --git a/Frontend/shared/src/functions/deleteShoppingList/deleteShoppingList.js b/Frontend/shared/src/functions/deleteShoppingList/deleteShoppingList.ts similarity index 79% rename from Frontend/shared/src/functions/deleteShoppingList/deleteShoppingList.js rename to Frontend/shared/src/functions/deleteShoppingList/deleteShoppingList.ts index f32fa8b..676defb 100644 --- a/Frontend/shared/src/functions/deleteShoppingList/deleteShoppingList.js +++ b/Frontend/shared/src/functions/deleteShoppingList/deleteShoppingList.ts @@ -1,4 +1,4 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; /* This is what item must look like: { @@ -9,7 +9,7 @@ This is what item must look like: list_id: uuid (or Number, one of these?) } */ -export const deleteShoppingList = async (listId) => { +export const deleteShoppingList = async (listId: string) => { return fetch(`${BASE_URL}/shopping-lists/${listId}`, { method: 'DELETE', headers: { diff --git a/Frontend/shared/src/functions/deleteShoppingList/index.js b/Frontend/shared/src/functions/deleteShoppingList/index.ts similarity index 100% rename from Frontend/shared/src/functions/deleteShoppingList/index.js rename to Frontend/shared/src/functions/deleteShoppingList/index.ts diff --git a/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.js b/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts similarity index 87% rename from Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.js rename to Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts index 05b7bc1..d080288 100644 --- a/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.js +++ b/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts @@ -1,6 +1,6 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; -export const fetchGroceryItems = async (listId) => { +export const fetchGroceryItems = async (listId: string) => { const url = `${BASE_URL}/grocery-items/${listId}`; const response = await fetch(url, { diff --git a/Frontend/shared/src/functions/fetchGroceryItems/index.js b/Frontend/shared/src/functions/fetchGroceryItems/index.ts similarity index 100% rename from Frontend/shared/src/functions/fetchGroceryItems/index.js rename to Frontend/shared/src/functions/fetchGroceryItems/index.ts diff --git a/Frontend/shared/src/functions/fetchOwnedShoppingLists/fetchOwnedShoppingLists.js b/Frontend/shared/src/functions/fetchOwnedShoppingLists/fetchOwnedShoppingLists.ts similarity index 85% rename from Frontend/shared/src/functions/fetchOwnedShoppingLists/fetchOwnedShoppingLists.js rename to Frontend/shared/src/functions/fetchOwnedShoppingLists/fetchOwnedShoppingLists.ts index cb62d22..dc1baba 100644 --- a/Frontend/shared/src/functions/fetchOwnedShoppingLists/fetchOwnedShoppingLists.js +++ b/Frontend/shared/src/functions/fetchOwnedShoppingLists/fetchOwnedShoppingLists.ts @@ -1,4 +1,4 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; export const fetchOwnedShoppingLists = () => { return fetch(`${BASE_URL}/shopping-lists`, { diff --git a/Frontend/shared/src/functions/fetchOwnedShoppingLists/index.js b/Frontend/shared/src/functions/fetchOwnedShoppingLists/index.ts similarity index 100% rename from Frontend/shared/src/functions/fetchOwnedShoppingLists/index.js rename to Frontend/shared/src/functions/fetchOwnedShoppingLists/index.ts diff --git a/Frontend/shared/src/functions/fetchSharedShoppingLists/fetchSharedShoppingLists.js b/Frontend/shared/src/functions/fetchSharedShoppingLists/fetchSharedShoppingLists.ts similarity index 85% rename from Frontend/shared/src/functions/fetchSharedShoppingLists/fetchSharedShoppingLists.js rename to Frontend/shared/src/functions/fetchSharedShoppingLists/fetchSharedShoppingLists.ts index a660a6a..4eac7c5 100644 --- a/Frontend/shared/src/functions/fetchSharedShoppingLists/fetchSharedShoppingLists.js +++ b/Frontend/shared/src/functions/fetchSharedShoppingLists/fetchSharedShoppingLists.ts @@ -1,4 +1,4 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; export const fetchSharedShoppingLists = () => { return fetch(`${BASE_URL}/shopping-lists/shared`, { diff --git a/Frontend/shared/src/functions/fetchSharedShoppingLists/index.js b/Frontend/shared/src/functions/fetchSharedShoppingLists/index.ts similarity index 100% rename from Frontend/shared/src/functions/fetchSharedShoppingLists/index.js rename to Frontend/shared/src/functions/fetchSharedShoppingLists/index.ts diff --git a/Frontend/shared/src/functions/fetchShoppingList/fetchShoppingList.js b/Frontend/shared/src/functions/fetchShoppingList/fetchShoppingList.ts similarity index 81% rename from Frontend/shared/src/functions/fetchShoppingList/fetchShoppingList.js rename to Frontend/shared/src/functions/fetchShoppingList/fetchShoppingList.ts index ecd19f3..8610659 100644 --- a/Frontend/shared/src/functions/fetchShoppingList/fetchShoppingList.js +++ b/Frontend/shared/src/functions/fetchShoppingList/fetchShoppingList.ts @@ -1,6 +1,6 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; -export const fetchShoppingList = async (listId) => { +export const fetchShoppingList = async (listId: string) => { const url = `${BASE_URL}/shopping-lists/${listId}`; const response = await fetch(url, { diff --git a/Frontend/shared/src/functions/fetchShoppingList/index.js b/Frontend/shared/src/functions/fetchShoppingList/index.ts similarity index 100% rename from Frontend/shared/src/functions/fetchShoppingList/index.js rename to Frontend/shared/src/functions/fetchShoppingList/index.ts diff --git a/Frontend/shared/src/functions/index.js b/Frontend/shared/src/functions/index.ts similarity index 100% rename from Frontend/shared/src/functions/index.js rename to Frontend/shared/src/functions/index.ts diff --git a/Frontend/shared/src/functions/updateGroceryItem/index.js b/Frontend/shared/src/functions/updateGroceryItem/index.ts similarity index 100% rename from Frontend/shared/src/functions/updateGroceryItem/index.js rename to Frontend/shared/src/functions/updateGroceryItem/index.ts diff --git a/Frontend/shared/src/functions/updateGroceryItem/updateGroceryItem.js b/Frontend/shared/src/functions/updateGroceryItem/updateGroceryItem.ts similarity index 62% rename from Frontend/shared/src/functions/updateGroceryItem/updateGroceryItem.js rename to Frontend/shared/src/functions/updateGroceryItem/updateGroceryItem.ts index c937866..83a4fda 100644 --- a/Frontend/shared/src/functions/updateGroceryItem/updateGroceryItem.js +++ b/Frontend/shared/src/functions/updateGroceryItem/updateGroceryItem.ts @@ -1,6 +1,7 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; +import GroceryItem from '@types'; -export const updateGroceryItem = async (item) => { +export const updateGroceryItem = async (item: GroceryItem) => { return fetch(`${BASE_URL}/grocery-items/${item.item_id}`, { method: 'PUT', headers: { diff --git a/Frontend/shared/src/functions/updateShoppingListTItle/index.js b/Frontend/shared/src/functions/updateShoppingListTItle/index.ts similarity index 100% rename from Frontend/shared/src/functions/updateShoppingListTItle/index.js rename to Frontend/shared/src/functions/updateShoppingListTItle/index.ts diff --git a/Frontend/shared/src/functions/updateShoppingListTItle/updateShoppingListTitle.js b/Frontend/shared/src/functions/updateShoppingListTItle/updateShoppingListTitle.ts similarity index 65% rename from Frontend/shared/src/functions/updateShoppingListTItle/updateShoppingListTitle.js rename to Frontend/shared/src/functions/updateShoppingListTItle/updateShoppingListTitle.ts index f9f2a2c..701d737 100644 --- a/Frontend/shared/src/functions/updateShoppingListTItle/updateShoppingListTitle.js +++ b/Frontend/shared/src/functions/updateShoppingListTItle/updateShoppingListTitle.ts @@ -1,6 +1,6 @@ -import { BASE_URL } from '@constants/config'; +import { BASE_URL } from '@constants'; -export const updateShoppingListTitle = async (shoppingListName, shoppingListId) => { +export const updateShoppingListTitle = async (shoppingListName: string, shoppingListId: string) => { return fetch(`${BASE_URL}/shopping-lists/${shoppingListId}`, { method: 'PUT', headers: { diff --git a/Frontend/shared/src/hooks/AuthContext/AuthContext.js b/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx similarity index 78% rename from Frontend/shared/src/hooks/AuthContext/AuthContext.js rename to Frontend/shared/src/hooks/AuthContext/AuthContext.tsx index bc9922e..81e3af3 100644 --- a/Frontend/shared/src/hooks/AuthContext/AuthContext.js +++ b/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx @@ -1,21 +1,28 @@ import React, { createContext, useContext, useState, useEffect } from "react"; import { jwtDecode } from "jwt-decode"; import { googleLogout } from "@react-oauth/google"; -import { BASE_URL } from '@constants/config'; -// Create the context -const AuthContext = createContext(); +import { BASE_URL } from '@constants'; -// Helper function to get the CSRF token from the cookies -const getCookie = (name) => { - const value = `; ${document.cookie}`; - const parts = value.split(`; ${name}=`); - if (parts.length === 2) return parts.pop().split(";").shift(); +// Create an interface for AuthContext +interface AuthContextType { + isAuthenticated: boolean; + userPicture: string | null; + login: (token: string) => void; + logout: () => void; +} + +// Initialize the context with a default value of `null` +const AuthContext = createContext(null); + +interface GoogleToken { + picture: string; }; + // Create a provider component -export const AuthProvider = ({ children }) => { - const [isAuthenticated, setIsAuthenticated] = useState(true); - const [userPicture, setUserPicture] = useState(null); +export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => { + const [isAuthenticated, setIsAuthenticated] = useState(false); + const [userPicture, setUserPicture] = useState(null); useEffect(() => { const token = localStorage.getItem("speedcart_auth_exists"); @@ -27,8 +34,8 @@ export const AuthProvider = ({ children }) => { } }, []); - const login = (token) => { - const userInfo = jwtDecode(JSON.parse(token).credential); + const login = (token: string) => { + const userInfo: GoogleToken = jwtDecode(JSON.parse(token).credential); // Initialize CSRF protection for the application fetch(`${BASE_URL}/sanctum/csrf-cookie`, { @@ -56,7 +63,7 @@ export const AuthProvider = ({ children }) => { if (response.status === 200) { setIsAuthenticated(true); localStorage.setItem("speedcart_auth_bearer_token", token); - localStorage.setItem("speedcart_auth_exists", true); + localStorage.setItem("speedcart_auth_exists", 'true'); localStorage.setItem("userImageUrl", userInfo.picture); } return response.json(); @@ -105,4 +112,4 @@ export const AuthProvider = ({ children }) => { }; // Create a custom hook to use the AuthContext -export const useAuth = () => useContext(AuthContext); \ No newline at end of file +export const useAuth: any = () => useContext(AuthContext); \ No newline at end of file diff --git a/Frontend/shared/src/hooks/AuthContext/index.d.ts b/Frontend/shared/src/hooks/AuthContext/index.d.ts new file mode 100644 index 0000000..f1efde3 --- /dev/null +++ b/Frontend/shared/src/hooks/AuthContext/index.d.ts @@ -0,0 +1,4 @@ +declare module 'AuthContext' { + export const AuthProvider: React.FC<{ children: React.ReactNode }>; + export const useAuth: any; +}; \ No newline at end of file diff --git a/Frontend/shared/src/hooks/AuthContext/index.js b/Frontend/shared/src/hooks/AuthContext/index.ts similarity index 100% rename from Frontend/shared/src/hooks/AuthContext/index.js rename to Frontend/shared/src/hooks/AuthContext/index.ts diff --git a/Frontend/shared/src/hooks/index.js b/Frontend/shared/src/hooks/index.ts similarity index 100% rename from Frontend/shared/src/hooks/index.js rename to Frontend/shared/src/hooks/index.ts diff --git a/Frontend/shared/src/index.js b/Frontend/shared/src/index.ts similarity index 52% rename from Frontend/shared/src/index.js rename to Frontend/shared/src/index.ts index 61b6100..87fb5ae 100644 --- a/Frontend/shared/src/index.js +++ b/Frontend/shared/src/index.ts @@ -1,6 +1,7 @@ // shared/index.js //export * from "./components"; export * from "./hooks"; -export * from './constants'; +export * from './constants/BaseUrl'; // Function exports (purely functional code; no UI content) -export * from "./functions"; \ No newline at end of file +export * from "./functions"; +export {default as GroceryItem} from './types/GroceryItem'; \ No newline at end of file diff --git a/Frontend/shared/src/types/GroceryItem.ts b/Frontend/shared/src/types/GroceryItem.ts new file mode 100644 index 0000000..85d7df5 --- /dev/null +++ b/Frontend/shared/src/types/GroceryItem.ts @@ -0,0 +1,10 @@ + +interface GroceryItem { + item_id: number; + name: string; + is_food: boolean; + quantity: number; + list_id: any; // This is technically a uuid value +} + +export default GroceryItem; \ No newline at end of file diff --git a/Frontend/shared/src/types/index.d.ts b/Frontend/shared/src/types/index.d.ts new file mode 100644 index 0000000..4d39896 --- /dev/null +++ b/Frontend/shared/src/types/index.d.ts @@ -0,0 +1,5 @@ +// src/types/types.d.ts + +declare module '@types' { + export default GroceryItem; +}; \ No newline at end of file diff --git a/Frontend/shared/tsconfig.json b/Frontend/shared/tsconfig.json new file mode 100644 index 0000000..dcc663a --- /dev/null +++ b/Frontend/shared/tsconfig.json @@ -0,0 +1,22 @@ +{ + "compilerOptions": { + "target": "es5", + "baseUrl": "./", // Base directory for resolving non-relative module names + "paths": { + "@constants": ["src/constants"], + "@types": ["src/types"] + }, + "module": "commonjs", + "lib": ["es6", "dom"], + "jsx": "react", + "outDir": "./dist", + "rootDir": "./src", + "strict": true, + "moduleResolution": "node", + "esModuleInterop": true, + "skipLibCheck": true, + "forceConsistentCasingInFileNames": true + }, + "include": ["src"], + "exclude": ["node_modules", "dist"] +} \ No newline at end of file diff --git a/Frontend/shared/webpack.config.js b/Frontend/shared/webpack.config.js new file mode 100644 index 0000000..0bd0a80 --- /dev/null +++ b/Frontend/shared/webpack.config.js @@ -0,0 +1,56 @@ +const { Configuration } = require("webpack"); +const { resolve } = require("path"); +require("dotenv").config({ + path: "../.env" +}); + +const DotenvPlugin = require("dotenv-webpack"); + +const nodeEnv = process.env.NODE_ENV || "production"; + +/** + * @type {Configuration} + */ +module.exports = { + entry: "./src/index.tsx", + output: { + filename: "bundle.js", + path: resolve("./dist") + }, + resolve: { + extensions: [".js", ".jsx", ".ts", ".tsx", ".json"], + alias: { + "@components": resolve("./src/components"), + "@hooks": resolve("./src/hooks"), + "@constants": resolve("./src/constants"), + } + }, + module: { + rules: [ + { + test: /\.tsx?$/i, + use: "babel-loader" + }, + { + test: /\.css$/i, + use: [ + "style-loader", + { + loader: "css-loader", + options: { + modules: true + } + } + ] + }, + { + test: /\.(png|jpe?g|gif|svg|webp|ttf)$/i, + type: "asset" + } + ] + }, + plugins: [ + new DotenvPlugin({ path: "../.env" }) + ], + mode: nodeEnv +}; \ No newline at end of file From 37cc2fbac4b90043fe337fc47f0bae4848906b0b Mon Sep 17 00:00:00 2001 From: unknown Date: Sun, 22 Sep 2024 17:46:15 -0400 Subject: [PATCH 2/7] First semi-working version of TypeScript in shared --- Frontend/package-lock.json | 61 +++++++++++++++++++ Frontend/package.json | 1 + Frontend/shared/package.json | 2 +- Frontend/shared/src/constants/BaseUrl.ts | 3 +- Frontend/shared/src/constants/index.ts | 1 + .../createGroceryItem/createGroceryItem.ts | 2 +- Frontend/shared/webpack.config.js | 56 ----------------- 7 files changed, 66 insertions(+), 60 deletions(-) create mode 100644 Frontend/shared/src/constants/index.ts delete mode 100644 Frontend/shared/webpack.config.js diff --git a/Frontend/package-lock.json b/Frontend/package-lock.json index f9f527f..4149d47 100644 --- a/Frontend/package-lock.json +++ b/Frontend/package-lock.json @@ -65,6 +65,7 @@ "eslint": "^8.56.0", "eslint-config-react-app": "^7.0.1", "jest": "^29.7.0", + "tsc-alias": "^1.8.10", "typescript": "^4.9.5", "webpack": "^5.92.1" } @@ -19118,6 +19119,19 @@ "multicast-dns": "cli.js" } }, + "node_modules/mylas": { + "version": "2.1.13", + "resolved": "https://registry.npmjs.org/mylas/-/mylas-2.1.13.tgz", + "integrity": "sha512-+MrqnJRtxdF+xngFfUUkIMQrUUL0KsxbADUkn23Z/4ibGg192Q+z+CQyiYwvWTsYjJygmMR8+w3ZDa98Zh6ESg==", + "dev": true, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/raouldeheer" + } + }, "node_modules/mz": { "version": "2.7.0", "license": "MIT", @@ -19986,6 +20000,18 @@ "node": ">=4" } }, + "node_modules/plimit-lit": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/plimit-lit/-/plimit-lit-1.6.1.tgz", + "integrity": "sha512-B7+VDyb8Tl6oMJT9oSO2CW8XC/T4UcJGrwOVoNGwOQsQYhlpfajmrMj5xeejqaASq3V/EqThyOeATEOMuSEXiA==", + "dev": true, + "dependencies": { + "queue-lit": "^1.5.1" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/plist": { "version": "3.1.0", "license": "MIT", @@ -21353,6 +21379,15 @@ "inherits": "~2.0.3" } }, + "node_modules/queue-lit": { + "version": "1.5.2", + "resolved": "https://registry.npmjs.org/queue-lit/-/queue-lit-1.5.2.tgz", + "integrity": "sha512-tLc36IOPeMAubu8BkW8YDBV+WyIgKlYU7zUNs0J5Vk9skSZ4JfGlPOqplP0aHdfv7HL0B2Pg6nwiq60Qc6M2Hw==", + "dev": true, + "engines": { + "node": ">=12" + } + }, "node_modules/queue-microtask": { "version": "1.2.3", "funding": [ @@ -25472,6 +25507,32 @@ "version": "0.1.13", "license": "Apache-2.0" }, + "node_modules/tsc-alias": { + "version": "1.8.10", + "resolved": "https://registry.npmjs.org/tsc-alias/-/tsc-alias-1.8.10.tgz", + "integrity": "sha512-Ibv4KAWfFkFdKJxnWfVtdOmB0Zi1RJVxcbPGiCDsFpCQSsmpWyuzHG3rQyI5YkobWwxFPEyQfu1hdo4qLG2zPw==", + "dev": true, + "dependencies": { + "chokidar": "^3.5.3", + "commander": "^9.0.0", + "globby": "^11.0.4", + "mylas": "^2.1.9", + "normalize-path": "^3.0.0", + "plimit-lit": "^1.2.6" + }, + "bin": { + "tsc-alias": "dist/bin/index.js" + } + }, + "node_modules/tsc-alias/node_modules/commander": { + "version": "9.5.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz", + "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==", + "dev": true, + "engines": { + "node": "^12.20.0 || >=14" + } + }, "node_modules/tsconfig-paths": { "version": "3.15.0", "license": "MIT", diff --git a/Frontend/package.json b/Frontend/package.json index 1b2ca49..432e98e 100644 --- a/Frontend/package.json +++ b/Frontend/package.json @@ -63,6 +63,7 @@ "eslint": "^8.56.0", "eslint-config-react-app": "^7.0.1", "jest": "^29.7.0", + "tsc-alias": "^1.8.10", "typescript": "^4.9.5", "webpack": "^5.92.1" }, diff --git a/Frontend/shared/package.json b/Frontend/shared/package.json index 2c5580e..b24aabc 100644 --- a/Frontend/shared/package.json +++ b/Frontend/shared/package.json @@ -4,7 +4,7 @@ "description": "", "main": "./dist/index.js", "scripts": { - "build": "tsc && echo Success" + "build": "tsc && tsc-alias && echo Success" }, "keywords": [], "author": "", diff --git a/Frontend/shared/src/constants/BaseUrl.ts b/Frontend/shared/src/constants/BaseUrl.ts index 94850c9..b5d7e5a 100644 --- a/Frontend/shared/src/constants/BaseUrl.ts +++ b/Frontend/shared/src/constants/BaseUrl.ts @@ -1,5 +1,4 @@ // src/constants/config/config.ts // This can be reused for all backend interactions -const BASE_URL: string = `https://${process.env.REACT_APP_API_DOMAIN}:${process.env.REACT_APP_API_PORT}`; -export default BASE_URL; \ No newline at end of file +export const BASE_URL: string = `https://${process.env.REACT_APP_API_DOMAIN}:${process.env.REACT_APP_API_PORT}`; diff --git a/Frontend/shared/src/constants/index.ts b/Frontend/shared/src/constants/index.ts new file mode 100644 index 0000000..d5c8cd9 --- /dev/null +++ b/Frontend/shared/src/constants/index.ts @@ -0,0 +1 @@ +export * from './BaseUrl'; \ No newline at end of file diff --git a/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts b/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts index 2ec117c..4f6398c 100644 --- a/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts +++ b/Frontend/shared/src/functions/createGroceryItem/createGroceryItem.ts @@ -1,4 +1,4 @@ -import BASE_URL from '@constants'; +import { BASE_URL } from '@constants'; import GroceryItem from '@types'; /* diff --git a/Frontend/shared/webpack.config.js b/Frontend/shared/webpack.config.js deleted file mode 100644 index 0bd0a80..0000000 --- a/Frontend/shared/webpack.config.js +++ /dev/null @@ -1,56 +0,0 @@ -const { Configuration } = require("webpack"); -const { resolve } = require("path"); -require("dotenv").config({ - path: "../.env" -}); - -const DotenvPlugin = require("dotenv-webpack"); - -const nodeEnv = process.env.NODE_ENV || "production"; - -/** - * @type {Configuration} - */ -module.exports = { - entry: "./src/index.tsx", - output: { - filename: "bundle.js", - path: resolve("./dist") - }, - resolve: { - extensions: [".js", ".jsx", ".ts", ".tsx", ".json"], - alias: { - "@components": resolve("./src/components"), - "@hooks": resolve("./src/hooks"), - "@constants": resolve("./src/constants"), - } - }, - module: { - rules: [ - { - test: /\.tsx?$/i, - use: "babel-loader" - }, - { - test: /\.css$/i, - use: [ - "style-loader", - { - loader: "css-loader", - options: { - modules: true - } - } - ] - }, - { - test: /\.(png|jpe?g|gif|svg|webp|ttf)$/i, - type: "asset" - } - ] - }, - plugins: [ - new DotenvPlugin({ path: "../.env" }) - ], - mode: nodeEnv -}; \ No newline at end of file From 34ab8b75f49616d49d55304cb6840324a6505f27 Mon Sep 17 00:00:00 2001 From: Cameron Green Date: Fri, 27 Sep 2024 14:59:00 -0400 Subject: [PATCH 3/7] Save good checkpoint in Issue #59 implementation --- Frontend/package-lock.json | 3 +- Frontend/shared/.env | 4 +- Frontend/shared/.gitignore | 1 + Frontend/shared/generate-config.js | 15 +++ Frontend/shared/package.json | 2 +- Frontend/shared/src/constants/BaseUrl.ts | 6 +- .../createShoppingList/createShoppingList.ts | 2 +- .../src/hooks/AuthContext/AuthContext.tsx | 5 +- Frontend/shared/tsconfig.json | 2 + .../src/pages/Dashboard/Dashboard.js | 125 +++++++++--------- 10 files changed, 99 insertions(+), 66 deletions(-) create mode 100644 Frontend/shared/generate-config.js diff --git a/Frontend/package-lock.json b/Frontend/package-lock.json index 4149d47..d7152d4 100644 --- a/Frontend/package-lock.json +++ b/Frontend/package-lock.json @@ -11146,7 +11146,8 @@ }, "node_modules/dotenv": { "version": "16.4.5", - "license": "BSD-2-Clause", + "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.5.tgz", + "integrity": "sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==", "engines": { "node": ">=12" }, diff --git a/Frontend/shared/.env b/Frontend/shared/.env index e5fe75f..2f01cf9 100644 --- a/Frontend/shared/.env +++ b/Frontend/shared/.env @@ -1,2 +1,2 @@ -REACT_APP_API_DOMAIN=api.speedcartapp.com -REACT_APP_API_PORT=8443 \ No newline at end of file +API_DOMAIN=api.speedcartapp.com +API_PORT=8443 \ No newline at end of file diff --git a/Frontend/shared/.gitignore b/Frontend/shared/.gitignore index b947077..c228cbe 100644 --- a/Frontend/shared/.gitignore +++ b/Frontend/shared/.gitignore @@ -1,2 +1,3 @@ node_modules/ dist/ +src/constants/config.json \ No newline at end of file diff --git a/Frontend/shared/generate-config.js b/Frontend/shared/generate-config.js new file mode 100644 index 0000000..0632042 --- /dev/null +++ b/Frontend/shared/generate-config.js @@ -0,0 +1,15 @@ +const fs = require('fs'); +const path = require('path'); +const dotenv = require('dotenv'); + +// Load environment variables from the .env file +dotenv.config(); + +const config = { + API_DOMAIN: process.env.API_DOMAIN, + API_PORT: process.env.API_PORT, +}; + +// Write the config to a file in the shared directory +fs.writeFileSync(path.resolve(__dirname, './src/constants/config.json'), JSON.stringify(config, null, 2)); +console.log('Config file generated successfully.'); diff --git a/Frontend/shared/package.json b/Frontend/shared/package.json index b24aabc..f2e6cd4 100644 --- a/Frontend/shared/package.json +++ b/Frontend/shared/package.json @@ -4,7 +4,7 @@ "description": "", "main": "./dist/index.js", "scripts": { - "build": "tsc && tsc-alias && echo Success" + "build": "node generate-config.js && tsc && tsc-alias && echo Success" }, "keywords": [], "author": "", diff --git a/Frontend/shared/src/constants/BaseUrl.ts b/Frontend/shared/src/constants/BaseUrl.ts index b5d7e5a..c1c0a0d 100644 --- a/Frontend/shared/src/constants/BaseUrl.ts +++ b/Frontend/shared/src/constants/BaseUrl.ts @@ -1,4 +1,8 @@ // src/constants/config/config.ts +import config from './config.json'; + +const API_DOMAIN = config.API_DOMAIN; +const API_PORT = config.API_PORT; // This can be reused for all backend interactions -export const BASE_URL: string = `https://${process.env.REACT_APP_API_DOMAIN}:${process.env.REACT_APP_API_PORT}`; +export const BASE_URL: string = `https://${API_DOMAIN}:${API_PORT}`; diff --git a/Frontend/shared/src/functions/createShoppingList/createShoppingList.ts b/Frontend/shared/src/functions/createShoppingList/createShoppingList.ts index 438ffe8..ceff78e 100644 --- a/Frontend/shared/src/functions/createShoppingList/createShoppingList.ts +++ b/Frontend/shared/src/functions/createShoppingList/createShoppingList.ts @@ -1,6 +1,6 @@ import { BASE_URL } from '@constants'; -export const createShoppingList = async (name: string, routeId = null) => { +export const createShoppingList = async (name: string, routeId: any = null) => { const url = `${BASE_URL}/shopping-lists`; const body = JSON.stringify({ diff --git a/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx b/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx index 81e3af3..8b74a61 100644 --- a/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx +++ b/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx @@ -26,11 +26,14 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children useEffect(() => { const token = localStorage.getItem("speedcart_auth_exists"); - if (token) { + console.log("token checked: " + token + typeof token); + if (token === "true") { setIsAuthenticated(true); + console.log("SET AUTHENTICATED TO TRUE"); setUserPicture(localStorage.getItem("userImageUrl")); } else { setIsAuthenticated(false); + console.log("NO IT'S FALSE"); } }, []); diff --git a/Frontend/shared/tsconfig.json b/Frontend/shared/tsconfig.json index dcc663a..f7757ac 100644 --- a/Frontend/shared/tsconfig.json +++ b/Frontend/shared/tsconfig.json @@ -12,8 +12,10 @@ "outDir": "./dist", "rootDir": "./src", "strict": true, + "strictNullChecks": false, "moduleResolution": "node", "esModuleInterop": true, + "resolveJsonModule": true, "skipLibCheck": true, "forceConsistentCasingInFileNames": true }, diff --git a/Frontend/speedcart-react/src/pages/Dashboard/Dashboard.js b/Frontend/speedcart-react/src/pages/Dashboard/Dashboard.js index 1010b7a..e263e8f 100644 --- a/Frontend/speedcart-react/src/pages/Dashboard/Dashboard.js +++ b/Frontend/speedcart-react/src/pages/Dashboard/Dashboard.js @@ -14,10 +14,10 @@ function Dashboard() { const [shoppingListTitles, setShoppingListTitles] = useState([]); const [sharedShoppingListTitles, setSharedShoppingListTitles] = useState([]); const [error, setError] = useState(null); + const [sharedListsError, setSharedListsError] = useState(null); const [deletionStatus, setDeletionStatus] = useState(RequestStatus.IDLE); const [ownerListsAreLoading, setOwnerListsAreLoading] = useState(true); const [sharedListsAreLoading, setSharedListsAreLoading] = useState(true); - const [sharedListsError, setSharedListsError] = useState(null); const [searchQuery, setSearchQuery] = useState(''); const [isCaseSensitive, setIsCaseSensitive] = useState(false); // All state variables for list sharing @@ -30,73 +30,80 @@ function Dashboard() { useEffect(() => { document.title = "View shopping lists"; + console.log("isAuthenticated state: " + isAuthenticated); + if (!isAuthenticated) { setOwnerListsAreLoading(false); setSharedListsAreLoading(false); setSharedListsError('You are not signed in; please try signing in at the Login page'); setError('You are not signed in; please try signing in at the Login page'); - return; - } - - // Retrieve lists owned by user - fetchOwnedShoppingLists() - .then(response => { - console.log('Owned lists response:', response); // Log the response object - if (!response.ok) { - if (response.status === 401) { - setOwnerListsAreLoading(false); - logout(); - throw new Error('Authorization error; please try signing in again at the Login page'); - } else { - throw new Error('Network response was not ok with status ' + response.status); + //return; + } else { + setOwnerListsAreLoading(true); + setSharedListsAreLoading(true); + setSharedListsError(null); + setError(null); + console.log('Starting queries...'); + // Retrieve lists owned by user + fetchOwnedShoppingLists() + .then(response => { + console.log('Owned lists response:', response); // Log the response object + if (!response.ok) { + if (response.status === 401) { + setOwnerListsAreLoading(false); + logout(); + throw new Error('Authorization error; please try signing in again at the Login page'); + } else { + throw new Error('Network response was not ok with status ' + response.status); + } } - } - return response.json(); - }) - .then(data => { - setShoppingListTitles(data); - setOwnerListsAreLoading(false); - }) - .catch(error => { - setError(error.toString()); - setOwnerListsAreLoading(false); - }); + return response.json(); + }) + .then(data => { + setShoppingListTitles(data); + setOwnerListsAreLoading(false); + }) + .catch(error => { + setError(error.toString()); + setOwnerListsAreLoading(false); + }); - // Retrieve lists shared with user - fetchSharedShoppingLists() - .then(response => { - if (!response.ok) { - console.log('Shared lists response:', response); // Log the response object - // We need to read this - // Read and log the response body - const reader = response.body.getReader(); - reader.read().then(({ done, value }) => { - if (!done) { - const decoder = new TextDecoder(); - const text = decoder.decode(value); - console.log('Shared lists response body:', text); // Log the response body + // Retrieve lists shared with user + fetchSharedShoppingLists() + .then(response => { + if (!response.ok) { + console.log('Shared lists response:', response); // Log the response object + // We need to read this + // Read and log the response body + const reader = response.body.getReader(); + reader.read().then(({ done, value }) => { + if (!done) { + const decoder = new TextDecoder(); + const text = decoder.decode(value); + console.log('Shared lists response body:', text); // Log the response body + } + }).catch(err => { + console.error('Error reading response body:', err); + }); + + if (response.status === 401) { + logout(); + throw new Error('Authorization error; please try signing in again at the Login page'); + } else { + throw new Error('Network response was not ok with status ' + response.status); } - }).catch(err => { - console.error('Error reading response body:', err); - }); - - if (response.status === 401) { - logout(); - throw new Error('Authorization error; please try signing in again at the Login page'); - } else { - throw new Error('Network response was not ok with status ' + response.status); } - } - return response.json(); - }) - .then(data => { - setSharedShoppingListTitles(data); - setSharedListsAreLoading(false); - }) - .catch(error => { - setSharedListsError(error.toString()); - setSharedListsAreLoading(false); - }); + return response.json(); + }) + .then(data => { + setSharedShoppingListTitles(data); + setSharedListsAreLoading(false); + }) + .catch(error => { + setSharedListsError(error.toString()); + setSharedListsAreLoading(false); + }); + } }, [isAuthenticated, logout]); const handleDelete = (listId) => { From 8ba7e65eabb4ce2022718edc8900d76deb9a54b4 Mon Sep 17 00:00:00 2001 From: unknown Date: Sun, 29 Sep 2024 14:48:42 -0400 Subject: [PATCH 4/7] Save successful checkpoint for Intellisense with TypeScript for Issue #59 --- .../fetchGroceryItems/fetchGroceryItems.ts | 39 ++++++++++++------- .../src/functions/fetchGroceryItems/index.ts | 2 +- Frontend/shared/src/functions/index.ts | 2 +- .../src/hooks/AuthContext/AuthContext.tsx | 10 ++++- .../shared/src/hooks/AuthContext/index.d.ts | 6 ++- .../shared/src/hooks/AuthContext/index.ts | 2 +- Frontend/shared/src/index.ts | 2 +- Frontend/shared/tsconfig.json | 1 + Frontend/speedcart-react/jsconfig.json | 9 ----- .../speedcart-react/src/{App.js => App.tsx} | 4 +- ...utton.js => AddShoppingListItemButton.tsx} | 0 .../{index.js => index.ts} | 0 .../{CustomCheckbox.js => CustomCheckbox.tsx} | 5 ++- .../CustomCheckbox/{index.js => index.ts} | 0 .../Footer/{Footer.js => Footer.tsx} | 0 .../components/Footer/{index.js => index.ts} | 0 ...ntityValue.js => IntegerQuantityValue.tsx} | 0 .../{index.js => index.ts} | 0 .../{Navigation.js => Navigation.tsx} | 0 .../Navigation/{index.js => index.ts} | 0 .../{SaveButton.js => SaveButton.tsx} | 0 .../SaveButton/{index.js => index.ts} | 0 ...oppingListItem.js => ShoppingListItem.tsx} | 0 .../ShoppingListItem/{index.js => index.ts} | 0 .../SiteLogo/{SiteLogo.js => SiteLogo.tsx} | 0 .../SiteLogo/{index.js => index.ts} | 0 .../{SitePolicies.js => SitePolicies.tsx} | 0 .../SitePolicies/{index.js => index.ts} | 0 .../{StatusModal.js => StatusModal.tsx} | 2 +- .../StatusModal/{index.js => index.ts} | 0 ...sitionSection.js => TransitionSection.tsx} | 0 .../TransitionSection/{index.js => index.ts} | 0 .../speedcart-react/src/declarations.d.ts | 28 +++++++++++++ .../src/{index.js => index.tsx} | 0 .../Dashboard/{Dashboard.js => Dashboard.tsx} | 2 +- .../pages/Dashboard/{index.js => index.ts} | 0 .../src/pages/Home/{Home.js => Home.tsx} | 2 +- .../src/pages/Home/{index.js => index.ts} | 0 .../src/pages/Login/{Login.js => Login.tsx} | 4 +- .../src/pages/Login/{index.js => index.ts} | 0 ...NewShoppingList.js => NewShoppingList.tsx} | 8 ++-- .../NewShoppingList/{index.js => index.ts} | 0 ...ngListDetail.js => ShoppingListDetail.tsx} | 2 +- .../ShoppingListDetail/{index.js => index.ts} | 0 ...pingListShare.js => ShoppingListShare.tsx} | 2 +- .../ShoppingListShare/{index.js => index.ts} | 0 Frontend/speedcart-react/tsconfig.json | 29 ++++++++++++++ 47 files changed, 114 insertions(+), 47 deletions(-) delete mode 100644 Frontend/speedcart-react/jsconfig.json rename Frontend/speedcart-react/src/{App.js => App.tsx} (94%) rename Frontend/speedcart-react/src/components/AddShoppingListItemButton/{AddShoppingListItemButton.js => AddShoppingListItemButton.tsx} (100%) rename Frontend/speedcart-react/src/components/AddShoppingListItemButton/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/CustomCheckbox/{CustomCheckbox.js => CustomCheckbox.tsx} (63%) rename Frontend/speedcart-react/src/components/CustomCheckbox/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/Footer/{Footer.js => Footer.tsx} (100%) rename Frontend/speedcart-react/src/components/Footer/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/IntegerQuantityValue/{IntegerQuantityValue.js => IntegerQuantityValue.tsx} (100%) rename Frontend/speedcart-react/src/components/IntegerQuantityValue/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/Navigation/{Navigation.js => Navigation.tsx} (100%) rename Frontend/speedcart-react/src/components/Navigation/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/SaveButton/{SaveButton.js => SaveButton.tsx} (100%) rename Frontend/speedcart-react/src/components/SaveButton/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/ShoppingListItem/{ShoppingListItem.js => ShoppingListItem.tsx} (100%) rename Frontend/speedcart-react/src/components/ShoppingListItem/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/SiteLogo/{SiteLogo.js => SiteLogo.tsx} (100%) rename Frontend/speedcart-react/src/components/SiteLogo/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/SitePolicies/{SitePolicies.js => SitePolicies.tsx} (100%) rename Frontend/speedcart-react/src/components/SitePolicies/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/StatusModal/{StatusModal.js => StatusModal.tsx} (97%) rename Frontend/speedcart-react/src/components/StatusModal/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/components/TransitionSection/{TransitionSection.js => TransitionSection.tsx} (100%) rename Frontend/speedcart-react/src/components/TransitionSection/{index.js => index.ts} (100%) create mode 100644 Frontend/speedcart-react/src/declarations.d.ts rename Frontend/speedcart-react/src/{index.js => index.tsx} (100%) rename Frontend/speedcart-react/src/pages/Dashboard/{Dashboard.js => Dashboard.tsx} (99%) rename Frontend/speedcart-react/src/pages/Dashboard/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/pages/Home/{Home.js => Home.tsx} (99%) rename Frontend/speedcart-react/src/pages/Home/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/pages/Login/{Login.js => Login.tsx} (95%) rename Frontend/speedcart-react/src/pages/Login/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/pages/NewShoppingList/{NewShoppingList.js => NewShoppingList.tsx} (96%) rename Frontend/speedcart-react/src/pages/NewShoppingList/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/pages/ShoppingListDetail/{ShoppingListDetail.js => ShoppingListDetail.tsx} (99%) rename Frontend/speedcart-react/src/pages/ShoppingListDetail/{index.js => index.ts} (100%) rename Frontend/speedcart-react/src/pages/ShoppingListShare/{ShoppingListShare.js => ShoppingListShare.tsx} (98%) rename Frontend/speedcart-react/src/pages/ShoppingListShare/{index.js => index.ts} (100%) create mode 100644 Frontend/speedcart-react/tsconfig.json diff --git a/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts b/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts index d080288..a4e5182 100644 --- a/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts +++ b/Frontend/shared/src/functions/fetchGroceryItems/fetchGroceryItems.ts @@ -1,26 +1,35 @@ import { BASE_URL } from '@constants'; -export const fetchGroceryItems = async (listId: string) => { +// Define the structure of a grocery item +export interface GroceryItem { + id: string; + name: string; + quantity: number; + price: number; + // Add other fields as needed +} + +// Define the expected response structure +interface GroceryItemsResponse { + items: GroceryItem[]; + total: number; + // Add any additional fields returned by the API +} + +export const fetchGroceryItems = async (listId: string): Promise => { const url = `${BASE_URL}/grocery-items/${listId}`; const response = await fetch(url, { - method: 'GET', - headers: { - 'Content-Type': 'application/json', - // Add any authorization headers if needed - }, - credentials: "include" + method: 'GET', + headers: { + 'Content-Type': 'application/json', + }, + credentials: 'include', }); if (!response.ok) { throw new Error(`Failed to fetch grocery items for shopping list with ID ${listId}`); } - // Clone the response before reading it as text - //const clonedResponse = response.clone(); - // Log the response body as text (debugging use only) - //console.log('fetchGroceryItems response:', await clonedResponse.text()); - - // Return JSON response - return response.json(); -}; \ No newline at end of file + return response.json() as Promise; +}; diff --git a/Frontend/shared/src/functions/fetchGroceryItems/index.ts b/Frontend/shared/src/functions/fetchGroceryItems/index.ts index 812dd9b..231bec8 100644 --- a/Frontend/shared/src/functions/fetchGroceryItems/index.ts +++ b/Frontend/shared/src/functions/fetchGroceryItems/index.ts @@ -1 +1 @@ -export { fetchGroceryItems } from './fetchGroceryItems'; \ No newline at end of file +export { fetchGroceryItems, GroceryItem } from './fetchGroceryItems'; \ No newline at end of file diff --git a/Frontend/shared/src/functions/index.ts b/Frontend/shared/src/functions/index.ts index 6720d27..fb32dc2 100644 --- a/Frontend/shared/src/functions/index.ts +++ b/Frontend/shared/src/functions/index.ts @@ -1,6 +1,6 @@ export { fetchOwnedShoppingLists } from './fetchOwnedShoppingLists'; export { fetchSharedShoppingLists } from './fetchSharedShoppingLists'; -export { fetchGroceryItems } from './fetchGroceryItems'; +export { fetchGroceryItems, GroceryItem } from './fetchGroceryItems'; export { fetchShoppingList } from './fetchShoppingList'; export { createGroceryItem } from './createGroceryItem'; export { createShoppingList } from './createShoppingList'; diff --git a/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx b/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx index 8b74a61..0cf963a 100644 --- a/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx +++ b/Frontend/shared/src/hooks/AuthContext/AuthContext.tsx @@ -4,7 +4,7 @@ import { googleLogout } from "@react-oauth/google"; import { BASE_URL } from '@constants'; // Create an interface for AuthContext -interface AuthContextType { +export interface AuthContextType { isAuthenticated: boolean; userPicture: string | null; login: (token: string) => void; @@ -115,4 +115,10 @@ export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({ children }; // Create a custom hook to use the AuthContext -export const useAuth: any = () => useContext(AuthContext); \ No newline at end of file +export const useAuth = (): AuthContextType => { + const context: AuthContextType = useContext(AuthContext); + if (!context) { + throw new Error("useAuth must be used within an AuthProvider"); + } + return context; +}; \ No newline at end of file diff --git a/Frontend/shared/src/hooks/AuthContext/index.d.ts b/Frontend/shared/src/hooks/AuthContext/index.d.ts index f1efde3..c16e11f 100644 --- a/Frontend/shared/src/hooks/AuthContext/index.d.ts +++ b/Frontend/shared/src/hooks/AuthContext/index.d.ts @@ -1,4 +1,6 @@ +import React from 'react'; +import {AuthContextType} from './AuthContext'; declare module 'AuthContext' { export const AuthProvider: React.FC<{ children: React.ReactNode }>; - export const useAuth: any; -}; \ No newline at end of file + export const useAuth: AuthContextType; +} \ No newline at end of file diff --git a/Frontend/shared/src/hooks/AuthContext/index.ts b/Frontend/shared/src/hooks/AuthContext/index.ts index 016830a..1e62884 100644 --- a/Frontend/shared/src/hooks/AuthContext/index.ts +++ b/Frontend/shared/src/hooks/AuthContext/index.ts @@ -1 +1 @@ -export { AuthProvider, useAuth } from "./AuthContext.js"; +export { AuthProvider, useAuth, AuthContextType } from "./AuthContext"; diff --git a/Frontend/shared/src/index.ts b/Frontend/shared/src/index.ts index 87fb5ae..db35154 100644 --- a/Frontend/shared/src/index.ts +++ b/Frontend/shared/src/index.ts @@ -4,4 +4,4 @@ export * from "./hooks"; export * from './constants/BaseUrl'; // Function exports (purely functional code; no UI content) export * from "./functions"; -export {default as GroceryItem} from './types/GroceryItem'; \ No newline at end of file +//export {default as GroceryItem} from './types/GroceryItem'; \ No newline at end of file diff --git a/Frontend/shared/tsconfig.json b/Frontend/shared/tsconfig.json index f7757ac..b1d6781 100644 --- a/Frontend/shared/tsconfig.json +++ b/Frontend/shared/tsconfig.json @@ -12,6 +12,7 @@ "outDir": "./dist", "rootDir": "./src", "strict": true, + "declaration": true, "strictNullChecks": false, "moduleResolution": "node", "esModuleInterop": true, diff --git a/Frontend/speedcart-react/jsconfig.json b/Frontend/speedcart-react/jsconfig.json deleted file mode 100644 index 950880b..0000000 --- a/Frontend/speedcart-react/jsconfig.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "compilerOptions": { - "baseUrl": ".", - "paths": { - "shared/*": ["../shared/src/*"] - } - }, - "include": ["src/**/*"] -} \ No newline at end of file diff --git a/Frontend/speedcart-react/src/App.js b/Frontend/speedcart-react/src/App.tsx similarity index 94% rename from Frontend/speedcart-react/src/App.js rename to Frontend/speedcart-react/src/App.tsx index bc5ef45..8f12f5d 100644 --- a/Frontend/speedcart-react/src/App.js +++ b/Frontend/speedcart-react/src/App.tsx @@ -6,7 +6,7 @@ import Footer from '@components/Footer'; import Modal from '@components/Modal'; import SitePolicies from '@components/SitePolicies'; -import { AppRoute } from '@constants/routes.ts'; +import { AppRoute } from '@constants/routes'; import Home from '@pages/Home'; import ShoppingListShare from '@pages/ShoppingListShare'; @@ -28,7 +28,7 @@ function App() { }, []); const handleSitePoliciesAccept = () => { - localStorage.setItem('acceptedSitePolicies', true); + localStorage.setItem('acceptedSitePolicies', 'true'); setShowSitePolicies(false); }; diff --git a/Frontend/speedcart-react/src/components/AddShoppingListItemButton/AddShoppingListItemButton.js b/Frontend/speedcart-react/src/components/AddShoppingListItemButton/AddShoppingListItemButton.tsx similarity index 100% rename from Frontend/speedcart-react/src/components/AddShoppingListItemButton/AddShoppingListItemButton.js rename to Frontend/speedcart-react/src/components/AddShoppingListItemButton/AddShoppingListItemButton.tsx diff --git a/Frontend/speedcart-react/src/components/AddShoppingListItemButton/index.js b/Frontend/speedcart-react/src/components/AddShoppingListItemButton/index.ts similarity index 100% rename from Frontend/speedcart-react/src/components/AddShoppingListItemButton/index.js rename to Frontend/speedcart-react/src/components/AddShoppingListItemButton/index.ts diff --git a/Frontend/speedcart-react/src/components/CustomCheckbox/CustomCheckbox.js b/Frontend/speedcart-react/src/components/CustomCheckbox/CustomCheckbox.tsx similarity index 63% rename from Frontend/speedcart-react/src/components/CustomCheckbox/CustomCheckbox.js rename to Frontend/speedcart-react/src/components/CustomCheckbox/CustomCheckbox.tsx index 8428331..146225f 100644 --- a/Frontend/speedcart-react/src/components/CustomCheckbox/CustomCheckbox.js +++ b/Frontend/speedcart-react/src/components/CustomCheckbox/CustomCheckbox.tsx @@ -1,15 +1,16 @@ import React from 'react'; import styles from './CustomCheckbox.module.css'; -const CustomCheckbox = ({ checked = false, onChange, children, disabled = false }) => { +const CustomCheckbox = ({ name = '', className = '', checked = false, onChange = null, disabled = false, children}) => { return ( -