From 5382211699071db505a3b3621dc96ed80cfa7423 Mon Sep 17 00:00:00 2001 From: Oleksii Novoseltsev <87183226+onorisma@users.noreply.github.com> Date: Sat, 13 Apr 2024 14:58:58 +0400 Subject: [PATCH 01/11] Typescript configuration + base migraion --- package-lock.json | 198 +++++++++++++++++- package.json | 7 +- src/@types/index.d.ts | 2 + src/api/{fullList.js => fullList.ts} | 2 +- ...tDateValues.js => getCurrentDateValues.ts} | 0 src/api/{index.js => index.ts} | 0 src/api/{schedule.js => schedule.ts} | 6 +- src/app/{App.js => App.tsx} | 2 +- src/app/{app.style.js => app.style.ts} | 0 .../{dayOptions.js => dayOptions.ts} | 2 +- src/common/constants/{modes.js => modes.ts} | 2 +- src/common/constants/{routes.js => routes.ts} | 0 .../{scheduleParams.js => scheduleParams.ts} | 0 .../{selectOptions.js => selectOptions.ts} | 0 .../{subjectTypes.js => subjectTypes.ts} | 0 src/common/constants/{theme.js => theme.ts} | 2 +- src/common/context/groupContext.js | 15 -- src/common/context/groupContext.tsx | 23 ++ src/common/context/lecturerContext.js | 17 -- src/common/context/lecturerContext.tsx | 26 +++ ...tsContext.js => preloadedListsContext.tsx} | 19 +- ...ionsContext.js => sliceOptionsContext.tsx} | 0 .../{themeContext.js => themeContext.tsx} | 28 ++- src/common/context/weekContext.js | 17 -- src/common/context/weekContext.tsx | 27 +++ src/common/styles/{styles.js => styles.ts} | 6 +- src/common/utils/apiTransformers.js | 14 -- src/common/utils/apiTransformers.ts | 14 ++ ...uleMatrix.js => generateScheduleMatrix.ts} | 8 +- ...tiveTimePoint.js => getActiveTimePoint.ts} | 2 +- .../{getApiFunction.js => getApiFunction.ts} | 8 +- .../utils/{getModeSize.js => getModeSize.ts} | 4 +- src/common/utils/getValueFromTheme.js | 3 - src/common/utils/getValueFromTheme.ts | 3 + src/common/utils/parsedLocalStorage.js | 13 -- src/common/utils/parsedLocalStorage.ts | 13 ++ src/common/utils/unique.js | 7 - src/common/utils/unique.ts | 7 + ...tDateParams.js => useCurrentDateParams.ts} | 2 +- .../{useCurrentMode.js => useCurrentMode.ts} | 2 +- .../scheduleDayToggler/scheduleDayToggler.jsx | 2 +- src/{index.style.js => index.style.ts} | 0 src/{index.js => index.tsx} | 0 src/mock.js | 12 -- tsconfig.json | 29 +++ 45 files changed, 405 insertions(+), 139 deletions(-) create mode 100644 src/@types/index.d.ts rename src/api/{fullList.js => fullList.ts} (81%) rename src/api/{getCurrentDateValues.js => getCurrentDateValues.ts} (100%) rename src/api/{index.js => index.ts} (100%) rename src/api/{schedule.js => schedule.ts} (62%) rename src/app/{App.js => App.tsx} (96%) rename src/app/{app.style.js => app.style.ts} (100%) rename src/common/constants/{dayOptions.js => dayOptions.ts} (90%) rename src/common/constants/{modes.js => modes.ts} (93%) rename src/common/constants/{routes.js => routes.ts} (100%) rename src/common/constants/{scheduleParams.js => scheduleParams.ts} (100%) rename src/common/constants/{selectOptions.js => selectOptions.ts} (100%) rename src/common/constants/{subjectTypes.js => subjectTypes.ts} (100%) rename src/common/constants/{theme.js => theme.ts} (99%) delete mode 100644 src/common/context/groupContext.js create mode 100644 src/common/context/groupContext.tsx delete mode 100644 src/common/context/lecturerContext.js create mode 100644 src/common/context/lecturerContext.tsx rename src/common/context/{preloadedListsContext.js => preloadedListsContext.tsx} (53%) rename src/common/context/{sliceOptionsContext.js => sliceOptionsContext.tsx} (100%) rename src/common/context/{themeContext.js => themeContext.tsx} (56%) delete mode 100644 src/common/context/weekContext.js create mode 100644 src/common/context/weekContext.tsx rename src/common/styles/{styles.js => styles.ts} (86%) delete mode 100644 src/common/utils/apiTransformers.js create mode 100644 src/common/utils/apiTransformers.ts rename src/common/utils/{generateScheduleMatrix.js => generateScheduleMatrix.ts} (78%) rename src/common/utils/{getActiveTimePoint.js => getActiveTimePoint.ts} (88%) rename src/common/utils/{getApiFunction.js => getApiFunction.ts} (68%) rename src/common/utils/{getModeSize.js => getModeSize.ts} (64%) delete mode 100644 src/common/utils/getValueFromTheme.js create mode 100644 src/common/utils/getValueFromTheme.ts delete mode 100644 src/common/utils/parsedLocalStorage.js create mode 100644 src/common/utils/parsedLocalStorage.ts delete mode 100644 src/common/utils/unique.js create mode 100644 src/common/utils/unique.ts rename src/common/utils/{useCurrentDateParams.js => useCurrentDateParams.ts} (83%) rename src/common/utils/{useCurrentMode.js => useCurrentMode.ts} (92%) rename src/{index.style.js => index.style.ts} (100%) rename src/{index.js => index.tsx} (100%) delete mode 100644 src/mock.js create mode 100644 tsconfig.json diff --git a/package-lock.json b/package-lock.json index d212d6a..eac46bf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5,12 +5,16 @@ "requires": true, "packages": { "": { + "name": "schedule.kpi.ua", "version": "0.1.0", "dependencies": { "@material-ui/core": "^4.12.4", "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^12.1.5", "@testing-library/user-event": "^14.4.3", + "@types/material-ui": "^0.21.17", + "@types/styled-components": "^5.1.34", + "@types/styled-system": "^5.1.22", "axios": "^0.27.2", "clsx": "^1.2.0", "moment": "^2.29.4", @@ -27,7 +31,9 @@ "web-vitals": "^3.0.2" }, "devDependencies": { - "gh-pages": "^4.0.0" + "@types/react-router-dom": "^5.3.3", + "gh-pages": "^4.0.0", + "typescript": "^4.9.5" } }, "node_modules/@adobe/css-tools": { @@ -4322,6 +4328,15 @@ "@types/node": "*" } }, + "node_modules/@types/create-react-class": { + "version": "15.6.8", + "resolved": "https://registry.npmjs.org/@types/create-react-class/-/create-react-class-15.6.8.tgz", + "integrity": "sha512-s5HocgHXvN4Phoypsz8+4TLFreWRUrMcq9MHgwVleqNNR5EipSrFN49LCU/N7j8nIiQoRExY9n79LBrTDdsE1Q==", + "dependencies": { + "@types/prop-types": "*", + "@types/react": "*" + } + }, "node_modules/@types/eslint": { "version": "8.40.1", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.40.1.tgz", @@ -4375,6 +4390,21 @@ "@types/node": "*" } }, + "node_modules/@types/history": { + "version": "4.7.11", + "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz", + "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==", + "dev": true + }, + "node_modules/@types/hoist-non-react-statics": { + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz", + "integrity": "sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==", + "dependencies": { + "@types/react": "*", + "hoist-non-react-statics": "^3.3.0" + } + }, "node_modules/@types/html-minifier-terser": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz", @@ -4452,6 +4482,15 @@ "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==" }, + "node_modules/@types/material-ui": { + "version": "0.21.17", + "resolved": "https://registry.npmjs.org/@types/material-ui/-/material-ui-0.21.17.tgz", + "integrity": "sha512-3iyPhFkqI856UBWRxaO7ZZDpOtWM3XPl5gdKKkVBPn3TqNBdgDuFFhHx8BFLL85o5oYy5Y/SX5s0bs7a2VdLTw==", + "dependencies": { + "@types/react": "*", + "@types/react-addons-linked-state-mixin": "*" + } + }, "node_modules/@types/mime": { "version": "1.3.2", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz", @@ -4512,6 +4551,15 @@ "csstype": "^3.0.2" } }, + "node_modules/@types/react-addons-linked-state-mixin": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/@types/react-addons-linked-state-mixin/-/react-addons-linked-state-mixin-0.14.27.tgz", + "integrity": "sha512-yVxzQcKDiq32uziGQ/ka586qSFxz2ePYZ3dTCp4JHJKk/E6M0LP0R28ft3oFAnTGJRFBAB3if3pkP8w57Y04IA==", + "dependencies": { + "@types/create-react-class": "*", + "@types/react": "*" + } + }, "node_modules/@types/react-dom": { "version": "17.0.20", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.20.tgz", @@ -4520,6 +4568,27 @@ "@types/react": "^17" } }, + "node_modules/@types/react-router": { + "version": "5.1.20", + "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", + "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==", + "dev": true, + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*" + } + }, + "node_modules/@types/react-router-dom": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz", + "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==", + "dev": true, + "dependencies": { + "@types/history": "^4.7.11", + "@types/react": "*", + "@types/react-router": "*" + } + }, "node_modules/@types/react-transition-group": { "version": "4.4.6", "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.6.tgz", @@ -4595,6 +4664,34 @@ "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz", "integrity": "sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==" }, + "node_modules/@types/styled-components": { + "version": "5.1.34", + "resolved": "https://registry.npmjs.org/@types/styled-components/-/styled-components-5.1.34.tgz", + "integrity": "sha512-mmiVvwpYklFIv9E8qfxuPyIt/OuyIrn6gMOAMOFUO3WJfSrSE+sGUoa4PiZj77Ut7bKZpaa6o1fBKS/4TOEvnA==", + "dependencies": { + "@types/hoist-non-react-statics": "*", + "@types/react": "*", + "csstype": "^3.0.2" + } + }, + "node_modules/@types/styled-components/node_modules/csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + }, + "node_modules/@types/styled-system": { + "version": "5.1.22", + "resolved": "https://registry.npmjs.org/@types/styled-system/-/styled-system-5.1.22.tgz", + "integrity": "sha512-NbRp37zWcrf/+Qf2NumdyZfhSx1dzJ50zgfKvnezYJx1HTRUMVYY8jtWvK1eoIAa6F5sXwHLhE8oXNu15ThBAA==", + "dependencies": { + "csstype": "^3.0.2" + } + }, + "node_modules/@types/styled-system/node_modules/csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + }, "node_modules/@types/testing-library__jest-dom": { "version": "5.14.6", "resolved": "https://registry.npmjs.org/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.6.tgz", @@ -18349,7 +18446,6 @@ "version": "4.9.5", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", - "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -22571,6 +22667,15 @@ "@types/node": "*" } }, + "@types/create-react-class": { + "version": "15.6.8", + "resolved": "https://registry.npmjs.org/@types/create-react-class/-/create-react-class-15.6.8.tgz", + "integrity": "sha512-s5HocgHXvN4Phoypsz8+4TLFreWRUrMcq9MHgwVleqNNR5EipSrFN49LCU/N7j8nIiQoRExY9n79LBrTDdsE1Q==", + "requires": { + "@types/prop-types": "*", + "@types/react": "*" + } + }, "@types/eslint": { "version": "8.40.1", "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.40.1.tgz", @@ -22624,6 +22729,21 @@ "@types/node": "*" } }, + "@types/history": { + "version": "4.7.11", + "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz", + "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==", + "dev": true + }, + "@types/hoist-non-react-statics": { + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz", + "integrity": "sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==", + "requires": { + "@types/react": "*", + "hoist-non-react-statics": "^3.3.0" + } + }, "@types/html-minifier-terser": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz", @@ -22694,6 +22814,15 @@ "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==" }, + "@types/material-ui": { + "version": "0.21.17", + "resolved": "https://registry.npmjs.org/@types/material-ui/-/material-ui-0.21.17.tgz", + "integrity": "sha512-3iyPhFkqI856UBWRxaO7ZZDpOtWM3XPl5gdKKkVBPn3TqNBdgDuFFhHx8BFLL85o5oYy5Y/SX5s0bs7a2VdLTw==", + "requires": { + "@types/react": "*", + "@types/react-addons-linked-state-mixin": "*" + } + }, "@types/mime": { "version": "1.3.2", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz", @@ -22761,6 +22890,15 @@ } } }, + "@types/react-addons-linked-state-mixin": { + "version": "0.14.27", + "resolved": "https://registry.npmjs.org/@types/react-addons-linked-state-mixin/-/react-addons-linked-state-mixin-0.14.27.tgz", + "integrity": "sha512-yVxzQcKDiq32uziGQ/ka586qSFxz2ePYZ3dTCp4JHJKk/E6M0LP0R28ft3oFAnTGJRFBAB3if3pkP8w57Y04IA==", + "requires": { + "@types/create-react-class": "*", + "@types/react": "*" + } + }, "@types/react-dom": { "version": "17.0.20", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.20.tgz", @@ -22769,6 +22907,27 @@ "@types/react": "^17" } }, + "@types/react-router": { + "version": "5.1.20", + "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz", + "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==", + "dev": true, + "requires": { + "@types/history": "^4.7.11", + "@types/react": "*" + } + }, + "@types/react-router-dom": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz", + "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==", + "dev": true, + "requires": { + "@types/history": "^4.7.11", + "@types/react": "*", + "@types/react-router": "*" + } + }, "@types/react-transition-group": { "version": "4.4.6", "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.6.tgz", @@ -22839,6 +22998,38 @@ "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz", "integrity": "sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==" }, + "@types/styled-components": { + "version": "5.1.34", + "resolved": "https://registry.npmjs.org/@types/styled-components/-/styled-components-5.1.34.tgz", + "integrity": "sha512-mmiVvwpYklFIv9E8qfxuPyIt/OuyIrn6gMOAMOFUO3WJfSrSE+sGUoa4PiZj77Ut7bKZpaa6o1fBKS/4TOEvnA==", + "requires": { + "@types/hoist-non-react-statics": "*", + "@types/react": "*", + "csstype": "^3.0.2" + }, + "dependencies": { + "csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + } + } + }, + "@types/styled-system": { + "version": "5.1.22", + "resolved": "https://registry.npmjs.org/@types/styled-system/-/styled-system-5.1.22.tgz", + "integrity": "sha512-NbRp37zWcrf/+Qf2NumdyZfhSx1dzJ50zgfKvnezYJx1HTRUMVYY8jtWvK1eoIAa6F5sXwHLhE8oXNu15ThBAA==", + "requires": { + "csstype": "^3.0.2" + }, + "dependencies": { + "csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" + } + } + }, "@types/testing-library__jest-dom": { "version": "5.14.6", "resolved": "https://registry.npmjs.org/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.6.tgz", @@ -32949,8 +33140,7 @@ "typescript": { "version": "4.9.5", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", - "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", - "peer": true + "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==" }, "unbox-primitive": { "version": "1.0.2", diff --git a/package.json b/package.json index 1eb78cb..0067091 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,9 @@ "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^12.1.5", "@testing-library/user-event": "^14.4.3", + "@types/material-ui": "^0.21.17", + "@types/styled-components": "^5.1.34", + "@types/styled-system": "^5.1.22", "axios": "^0.27.2", "clsx": "^1.2.0", "moment": "^2.29.4", @@ -48,6 +51,8 @@ ] }, "devDependencies": { - "gh-pages": "^4.0.0" + "@types/react-router-dom": "^5.3.3", + "gh-pages": "^4.0.0", + "typescript": "^4.9.5" } } diff --git a/src/@types/index.d.ts b/src/@types/index.d.ts new file mode 100644 index 0000000..4eb93a2 --- /dev/null +++ b/src/@types/index.d.ts @@ -0,0 +1,2 @@ +declare module 'react-select-virtualized'; +declare module '*.svg'; \ No newline at end of file diff --git a/src/api/fullList.js b/src/api/fullList.ts similarity index 81% rename from src/api/fullList.js rename to src/api/fullList.ts index 3c263fd..3d7f731 100644 --- a/src/api/fullList.js +++ b/src/api/fullList.ts @@ -7,7 +7,7 @@ export const getAllLecturers = () => { export const getAllGroups = () => { return Http.get("/schedule/groups").then(({ data }) => { return { - data: data.data.map((row) => ({ + data: data.data.map((row: {name: string, faculty: string, id: string}) => ({ name: `${row.name.trim()} (${row.faculty.trim()})`, id: row.id, })), diff --git a/src/api/getCurrentDateValues.js b/src/api/getCurrentDateValues.ts similarity index 100% rename from src/api/getCurrentDateValues.js rename to src/api/getCurrentDateValues.ts diff --git a/src/api/index.js b/src/api/index.ts similarity index 100% rename from src/api/index.js rename to src/api/index.ts diff --git a/src/api/schedule.js b/src/api/schedule.ts similarity index 62% rename from src/api/schedule.js rename to src/api/schedule.ts index 0d927ea..0973f4e 100644 --- a/src/api/schedule.js +++ b/src/api/schedule.ts @@ -1,16 +1,16 @@ import Http from './index'; -export const getScheduleByLecturer = lecturerId => { +export const getScheduleByLecturer = (lecturerId: string) => { return Http.get('/schedule/lecturer?lecturerId=' + lecturerId) .then(res => res.data); } -export const getScheduleByGroup = groupId => { +export const getScheduleByGroup = (groupId: string) => { return Http.get('/schedule/lessons?groupId=' + groupId) .then(res => res.data); } -export const getExamsByGroup = groupName => { +export const getExamsByGroup = (groupName: string) => { return Http.get('/exams/group?groupId=' + groupName) .then(res => res.data); } \ No newline at end of file diff --git a/src/app/App.js b/src/app/App.tsx similarity index 96% rename from src/app/App.js rename to src/app/App.tsx index 516e5a0..c774909 100644 --- a/src/app/App.js +++ b/src/app/App.tsx @@ -15,7 +15,7 @@ function App() { - + diff --git a/src/app/app.style.js b/src/app/app.style.ts similarity index 100% rename from src/app/app.style.js rename to src/app/app.style.ts diff --git a/src/common/constants/dayOptions.js b/src/common/constants/dayOptions.ts similarity index 90% rename from src/common/constants/dayOptions.js rename to src/common/constants/dayOptions.ts index 3c20fcc..af07bf6 100644 --- a/src/common/constants/dayOptions.js +++ b/src/common/constants/dayOptions.ts @@ -1,4 +1,4 @@ -import { MODES } from '../../common/constants/modes'; +import { MODES } from './modes'; export const DAY_OPTIONS = { [MODES.EXTRA_SMALL]: [ diff --git a/src/common/constants/modes.js b/src/common/constants/modes.ts similarity index 93% rename from src/common/constants/modes.js rename to src/common/constants/modes.ts index e5d85ae..567dd7b 100644 --- a/src/common/constants/modes.js +++ b/src/common/constants/modes.ts @@ -3,4 +3,4 @@ export const MODES = { SMALL: 'smallMode', MEDIUM: 'mediumMode', BIG: 'bigMode', -}; \ No newline at end of file +} as any; \ No newline at end of file diff --git a/src/common/constants/routes.js b/src/common/constants/routes.ts similarity index 100% rename from src/common/constants/routes.js rename to src/common/constants/routes.ts diff --git a/src/common/constants/scheduleParams.js b/src/common/constants/scheduleParams.ts similarity index 100% rename from src/common/constants/scheduleParams.js rename to src/common/constants/scheduleParams.ts diff --git a/src/common/constants/selectOptions.js b/src/common/constants/selectOptions.ts similarity index 100% rename from src/common/constants/selectOptions.js rename to src/common/constants/selectOptions.ts diff --git a/src/common/constants/subjectTypes.js b/src/common/constants/subjectTypes.ts similarity index 100% rename from src/common/constants/subjectTypes.js rename to src/common/constants/subjectTypes.ts diff --git a/src/common/constants/theme.js b/src/common/constants/theme.ts similarity index 99% rename from src/common/constants/theme.js rename to src/common/constants/theme.ts index af5c4aa..5b99988 100644 --- a/src/common/constants/theme.js +++ b/src/common/constants/theme.ts @@ -23,4 +23,4 @@ export const theme = { currentDayContainer: 'linear-gradient(180deg, rgba(54, 54, 55, 0) 0%, rgba(54, 54, 55, 0.5) 10.73%, #363637 55%, rgba(54, 54, 55, 0.5) 89.9%, rgba(54, 54, 55, 0.29) 100%)', svgPrimaryFilter: 'invert(100%) sepia(0%) saturate(0%) hue-rotate(46deg) brightness(100%) contrast(103%)', } -}; \ No newline at end of file +} as any; \ No newline at end of file diff --git a/src/common/context/groupContext.js b/src/common/context/groupContext.js deleted file mode 100644 index d3607cc..0000000 --- a/src/common/context/groupContext.js +++ /dev/null @@ -1,15 +0,0 @@ -import { createContext, useContext, useState } from "react"; - -const GroupContext = createContext(null); - -export const useGroupContext = () => useContext(GroupContext); - -export const GroupContextProvider = ({ initialValue, children }) => { - const [group, setGroup] = useState(initialValue); - - const params = { setGroup, group }; - - return ( - {children} - ); -}; diff --git a/src/common/context/groupContext.tsx b/src/common/context/groupContext.tsx new file mode 100644 index 0000000..248a238 --- /dev/null +++ b/src/common/context/groupContext.tsx @@ -0,0 +1,23 @@ +import React, { createContext, useContext, useState } from "react"; + +interface Props { + initialValue?: any, + children: React.FC +} + +interface GroupContextType { + group: any; + setGroup: React.Dispatch; +}; + +const GroupContext = createContext( null); + +export const useGroupContext = () => useContext(GroupContext); + +export const GroupContextProvider: React.FC = ({ initialValue = null, children }) => { + const [group, setGroup] = useState(initialValue); + + const params: GroupContextType = { setGroup, group }; + + return {children} ; +}; diff --git a/src/common/context/lecturerContext.js b/src/common/context/lecturerContext.js deleted file mode 100644 index 3c5030f..0000000 --- a/src/common/context/lecturerContext.js +++ /dev/null @@ -1,17 +0,0 @@ -import { createContext, useContext, useState } from 'react'; - -const LecturerContext = createContext(null); - -export const useLecturerContext = () => useContext(LecturerContext); - -export const LecturerContextProvider = ({children}) => { - const [lecturer, setLecturer] = useState(null); - - const params = {setLecturer, lecturer}; - - return ( - - {children} - - ); -}; \ No newline at end of file diff --git a/src/common/context/lecturerContext.tsx b/src/common/context/lecturerContext.tsx new file mode 100644 index 0000000..0134cee --- /dev/null +++ b/src/common/context/lecturerContext.tsx @@ -0,0 +1,26 @@ +import React, { createContext, useContext, useState } from 'react'; + +interface Props { + children: React.ReactNode +} + +interface LecturerContextType { + lecturer: any, + setLecturer: React.Dispatch +} + +const LecturerContext = createContext(null); + +export const useLecturerContext = () => useContext(LecturerContext); + +export const LecturerContextProvider: React.FC = ({children}) => { + const [lecturer, setLecturer] = useState(null); + + const params = {setLecturer, lecturer}; + + return ( + + {children} + + ); +}; \ No newline at end of file diff --git a/src/common/context/preloadedListsContext.js b/src/common/context/preloadedListsContext.tsx similarity index 53% rename from src/common/context/preloadedListsContext.js rename to src/common/context/preloadedListsContext.tsx index bca5c06..614fc70 100644 --- a/src/common/context/preloadedListsContext.js +++ b/src/common/context/preloadedListsContext.tsx @@ -1,12 +1,21 @@ -import { createContext, useContext, useEffect, useState } from 'react'; -import { getAllGroups, getAllLecturers } from '../../api/fullList'; +import React, { createContext, useContext, useEffect, useState } from 'react'; +import { getAllGroups, getAllLecturers } from '@/api/fullList'; -const PreloadedListsContext = createContext(null); +interface Props { + children: React.ReactNode, +} + +interface ContextType { + groups: any[], + lecturers: any[], +} + +const PreloadedListsContext = createContext(null); export const usePreloadedListContext = () => useContext(PreloadedListsContext); // TODO add exams here -export const PreloadedListsContextProvider = ({children}) => { - const [lists, setLists] = useState({ +export const PreloadedListsContextProvider: React.FC = ({children}) => { + const [lists, setLists] = useState({ groups: [], lecturers: [], }); diff --git a/src/common/context/sliceOptionsContext.js b/src/common/context/sliceOptionsContext.tsx similarity index 100% rename from src/common/context/sliceOptionsContext.js rename to src/common/context/sliceOptionsContext.tsx diff --git a/src/common/context/themeContext.js b/src/common/context/themeContext.tsx similarity index 56% rename from src/common/context/themeContext.js rename to src/common/context/themeContext.tsx index 74fdcbf..2e2bf35 100644 --- a/src/common/context/themeContext.js +++ b/src/common/context/themeContext.tsx @@ -1,14 +1,23 @@ import { ThemeProvider } from 'styled-components'; -import { createContext, useContext, useEffect, useState } from 'react'; -import { theme } from '../../common/constants/theme'; +import React, { createContext, useContext, useEffect, useState } from 'react'; +import { theme } from '@/common/constants/theme'; import { getLocalStorageItem, setLocalStorageItem } from '../utils/parsedLocalStorage'; -const ThemeSelectorContext = createContext(null); +interface Props { + children: React.ReactNode, + initialValue?: 'light' | 'dark' +} + +interface ContextType { + changeTheme: (isLightTheme: boolean) => void, +} + +const ThemeSelectorContext = createContext(null); export const useThemeSelectorContext = () => useContext(ThemeSelectorContext); -const ThemeContextProvider = ({ children }) => { - const [currentTheme, setTheme] = useState('light'); +const ThemeContextProvider: React.FC = ({ children, initialValue = 'light' }) => { + const [currentTheme, setTheme] = useState(initialValue); useEffect(() => { const localStorageTheme = getLocalStorageItem("theme") const prefersLight = window.matchMedia('(prefers-color-scheme: light)').matches; @@ -20,14 +29,19 @@ const ThemeContextProvider = ({ children }) => { } }, []) - const changeTheme = isLightTheme => { + const changeTheme = (isLightTheme: boolean) => { const newTheme = isLightTheme ? 'light' : 'dark' setTheme(newTheme); setLocalStorageItem("theme", newTheme) } + + const props = { + changeTheme + } + return ( - + {children} diff --git a/src/common/context/weekContext.js b/src/common/context/weekContext.js deleted file mode 100644 index 646fce6..0000000 --- a/src/common/context/weekContext.js +++ /dev/null @@ -1,17 +0,0 @@ -import { createContext, useContext, useState } from 'react'; - -const WeekContext = createContext(null); - -export const useWeekContext = () => useContext(WeekContext); - -export const WeekContextProvider = ({initialValue, children}) => { - const [currentWeek, setCurrentWeek] = useState(initialValue); - - const params = {setCurrentWeek, currentWeek}; - - return ( - - {children} - - ); -}; \ No newline at end of file diff --git a/src/common/context/weekContext.tsx b/src/common/context/weekContext.tsx new file mode 100644 index 0000000..cc55010 --- /dev/null +++ b/src/common/context/weekContext.tsx @@ -0,0 +1,27 @@ +import React, { createContext, useContext, useState } from 'react'; + +interface Props { + initialValue: any, + children: React.ReactNode, +} + +interface ContextProps { + setCurrentWeek: React.Dispatch, + currentWeek: any, +} + +const WeekContext = createContext(null); + +export const useWeekContext = () => useContext(WeekContext); + +export const WeekContextProvider: React.FC = ({initialValue, children}) => { + const [currentWeek, setCurrentWeek] = useState(initialValue); + + const params = {setCurrentWeek, currentWeek}; + + return ( + + {children} + + ); +}; \ No newline at end of file diff --git a/src/common/styles/styles.js b/src/common/styles/styles.ts similarity index 86% rename from src/common/styles/styles.js rename to src/common/styles/styles.ts index c181954..0c3e33c 100644 --- a/src/common/styles/styles.js +++ b/src/common/styles/styles.ts @@ -1,8 +1,8 @@ import styled, { css } from 'styled-components'; import { flexbox, space } from 'styled-system'; -import { MODES } from '../constants/modes'; +import { MODES } from '@/common/constants/modes'; import { getModeSize } from '../utils/getModeSize'; -import { getValueFromTheme } from '../../common/utils/getValueFromTheme'; +import { getValueFromTheme } from '@/common/utils/getValueFromTheme'; import { Link } from 'react-router-dom'; export const Flex = styled.div` @@ -11,7 +11,7 @@ export const Flex = styled.div` ${flexbox}; // Support for gap in flexbox - gap: ${(props) => props.gap}; + gap: ${(props: {gap: number}) => props.gap}; `; export const Pictogram = styled.img` diff --git a/src/common/utils/apiTransformers.js b/src/common/utils/apiTransformers.js deleted file mode 100644 index fe69968..0000000 --- a/src/common/utils/apiTransformers.js +++ /dev/null @@ -1,14 +0,0 @@ -import { unique } from "./unique"; - -export const prepareList = (list) => { - return unique( - list.map((item) => ({ - label: item.name, - value: item.id, - })) - .filter(item => item.label !== "" && item.value !== "") - .sort((a, b) => { - return a.label.localeCompare(b.label, "uk") - }), - (item => item.label)); -}; diff --git a/src/common/utils/apiTransformers.ts b/src/common/utils/apiTransformers.ts new file mode 100644 index 0000000..f1e4264 --- /dev/null +++ b/src/common/utils/apiTransformers.ts @@ -0,0 +1,14 @@ +import { unique } from "./unique"; + +export const prepareList = (list: {label: string, value: string, name: string, id: string}[]) => { + return unique( + list.map((item: {name: string, id: string}) => ({ + label: item.name, + value: item.id, + })) + .filter((item: {label: string, value: string}) => item.label !== "" && item.value !== "") + .sort((a, b) => { + return a.label.localeCompare(b.label, "uk") + }), + (item => item.label)); +}; diff --git a/src/common/utils/generateScheduleMatrix.js b/src/common/utils/generateScheduleMatrix.ts similarity index 78% rename from src/common/utils/generateScheduleMatrix.js rename to src/common/utils/generateScheduleMatrix.ts index 4f094f5..fecbcd0 100644 --- a/src/common/utils/generateScheduleMatrix.js +++ b/src/common/utils/generateScheduleMatrix.ts @@ -1,8 +1,10 @@ -import { DAYS, TIME_POINTS } from '../../common/constants/scheduleParams'; -import { getActiveTimePoint } from '../../common/utils/getActiveTimePoint'; +import { DAYS, TIME_POINTS } from '@/common/constants/scheduleParams'; +import { getActiveTimePoint } from '@/common/utils/getActiveTimePoint'; import moment from 'moment'; -export const generateScheduleMatrix = weekSchedule => { +type WeekSchedule = Array<{day: any, pairs: any[]}> + +export const generateScheduleMatrix = (weekSchedule: WeekSchedule) => { const scheduleMatrix = new Array(TIME_POINTS.length).fill(null).map(() => new Array(DAYS.length).fill(null)); const activePair = getActiveTimePoint(); const currentDay = moment().day() - 1; diff --git a/src/common/utils/getActiveTimePoint.js b/src/common/utils/getActiveTimePoint.ts similarity index 88% rename from src/common/utils/getActiveTimePoint.js rename to src/common/utils/getActiveTimePoint.ts index 936e9b9..89a4212 100644 --- a/src/common/utils/getActiveTimePoint.js +++ b/src/common/utils/getActiveTimePoint.ts @@ -1,5 +1,5 @@ import moment from 'moment'; -import { TIME_POINTS } from '../../common/constants/scheduleParams'; +import { TIME_POINTS } from '@/common/constants/scheduleParams'; export const getActiveTimePoint = () => { const PAIR_DURATION_IN_MINUTES = 95; diff --git a/src/common/utils/getApiFunction.js b/src/common/utils/getApiFunction.ts similarity index 68% rename from src/common/utils/getApiFunction.js rename to src/common/utils/getApiFunction.ts index acdcbf8..cd6d5f2 100644 --- a/src/common/utils/getApiFunction.js +++ b/src/common/utils/getApiFunction.ts @@ -1,8 +1,8 @@ import { routes } from '../constants/routes'; -import { getScheduleByGroup, getScheduleByLecturer, getExamsByGroup } from '../../api/schedule'; -import { getAllGroups, getAllLecturers } from '../../api/fullList'; +import { getScheduleByGroup, getScheduleByLecturer, getExamsByGroup } from '@/api/schedule'; +import { getAllGroups, getAllLecturers } from '@/api/fullList'; -export const getScheduleApiFunction = route => { +export const getScheduleApiFunction = (route: string) => { const functions = { [routes.GROUP]: getScheduleByGroup, [routes.SESSION]: getExamsByGroup, @@ -12,7 +12,7 @@ export const getScheduleApiFunction = route => { return functions[route]; } -export const getListApiFunction = route => { +export const getListApiFunction = (route: string) => { const functions = { [routes.GROUP]: getAllGroups, [routes.SESSION]: getAllGroups, diff --git a/src/common/utils/getModeSize.js b/src/common/utils/getModeSize.ts similarity index 64% rename from src/common/utils/getModeSize.js rename to src/common/utils/getModeSize.ts index a0bdccd..5ffee0c 100644 --- a/src/common/utils/getModeSize.js +++ b/src/common/utils/getModeSize.ts @@ -1,6 +1,6 @@ -import {MODES} from "../constants/modes"; +import {MODES} from "@/common/constants/modes"; -export const getModeSize = MODE => { +export const getModeSize = (MODE: string) => { const MODE_SIZES = { [MODES.BIG]: '1441px', [MODES.MEDIUM]: '1440px', diff --git a/src/common/utils/getValueFromTheme.js b/src/common/utils/getValueFromTheme.js deleted file mode 100644 index cbb27d3..0000000 --- a/src/common/utils/getValueFromTheme.js +++ /dev/null @@ -1,3 +0,0 @@ -export const getValueFromTheme = key => props => { - return props.theme[key]; -}; \ No newline at end of file diff --git a/src/common/utils/getValueFromTheme.ts b/src/common/utils/getValueFromTheme.ts new file mode 100644 index 0000000..9694b6d --- /dev/null +++ b/src/common/utils/getValueFromTheme.ts @@ -0,0 +1,3 @@ +export const getValueFromTheme = (key: string) => (props: {theme: any}) => { + return props.theme[key]; +}; \ No newline at end of file diff --git a/src/common/utils/parsedLocalStorage.js b/src/common/utils/parsedLocalStorage.js deleted file mode 100644 index c683087..0000000 --- a/src/common/utils/parsedLocalStorage.js +++ /dev/null @@ -1,13 +0,0 @@ -export const setLocalStorageItem = (key, value) => { - localStorage.setItem(key, JSON.stringify(value)) -} - -export const getLocalStorageItem = (key) => { - try { - return JSON.parse(localStorage.getItem(key)) - } - catch { - // No `key` local storage item, so return undefined - return undefined - } -} diff --git a/src/common/utils/parsedLocalStorage.ts b/src/common/utils/parsedLocalStorage.ts new file mode 100644 index 0000000..aebf52b --- /dev/null +++ b/src/common/utils/parsedLocalStorage.ts @@ -0,0 +1,13 @@ +export const setLocalStorageItem = (key: string, value: any) => { + localStorage.setItem(key, JSON.stringify(value)) +} + +export const getLocalStorageItem = (key: string) => { + try { + return JSON.parse(localStorage.getItem(key) as any) + } + catch { + // No `key` local storage item, so return undefined + return undefined + } +} diff --git a/src/common/utils/unique.js b/src/common/utils/unique.js deleted file mode 100644 index 054d9f4..0000000 --- a/src/common/utils/unique.js +++ /dev/null @@ -1,7 +0,0 @@ -export const unique = (array, getComparingItem = (item) => item) => { - const uniqueFilter = (value, index, self) => { - return self.map(e => getComparingItem(e)).indexOf(getComparingItem(value)) === index; - } - - return [...array.filter(uniqueFilter)]; -} \ No newline at end of file diff --git a/src/common/utils/unique.ts b/src/common/utils/unique.ts new file mode 100644 index 0000000..6bc7fda --- /dev/null +++ b/src/common/utils/unique.ts @@ -0,0 +1,7 @@ +export const unique = (array: any[], getComparingItem = (item: any) => item) => { + const uniqueFilter = (value: string, index: number, self: any) => { + return self.map((e: any) => getComparingItem(e)).indexOf(getComparingItem(value)) === index; + } + + return [...array.filter(uniqueFilter)]; +} \ No newline at end of file diff --git a/src/common/utils/useCurrentDateParams.js b/src/common/utils/useCurrentDateParams.ts similarity index 83% rename from src/common/utils/useCurrentDateParams.js rename to src/common/utils/useCurrentDateParams.ts index 46dbdd9..d8d9f6e 100644 --- a/src/common/utils/useCurrentDateParams.js +++ b/src/common/utils/useCurrentDateParams.ts @@ -1,5 +1,5 @@ import { useEffect, useState } from 'react'; -import { getCurrentDateValues } from '../../api/getCurrentDateValues'; +import { getCurrentDateValues } from '@/api/getCurrentDateValues'; export const useCurrentDateParams = () => { const [dateParams, setDateParams] = useState({currentWeek: null, currentDay: null, currentLesson: null}); diff --git a/src/common/utils/useCurrentMode.js b/src/common/utils/useCurrentMode.ts similarity index 92% rename from src/common/utils/useCurrentMode.js rename to src/common/utils/useCurrentMode.ts index e0dad02..d58cb20 100644 --- a/src/common/utils/useCurrentMode.js +++ b/src/common/utils/useCurrentMode.ts @@ -1,4 +1,4 @@ -import {MODES} from "../constants/modes"; +import {MODES} from "@/common/constants/modes"; import {getModeSize} from "./getModeSize"; import { useEffect, useState } from 'react'; diff --git a/src/containers/scheduleDayToggler/scheduleDayToggler.jsx b/src/containers/scheduleDayToggler/scheduleDayToggler.jsx index e82783a..97cc2a6 100644 --- a/src/containers/scheduleDayToggler/scheduleDayToggler.jsx +++ b/src/containers/scheduleDayToggler/scheduleDayToggler.jsx @@ -1,5 +1,5 @@ import OptionMultipleToggler from '../../components/optionMultipleToggler'; -import { MODES } from '../../common/constants/modes'; +import { MODES } from 'src/common/constants/modes'; import { useCurrentMode } from '../../common/utils/useCurrentMode'; import { DAY_OPTIONS } from '../../common/constants/dayOptions'; import { ScheduleDayTogglerContainer } from './scheduleDayToggler.style'; diff --git a/src/index.style.js b/src/index.style.ts similarity index 100% rename from src/index.style.js rename to src/index.style.ts diff --git a/src/index.js b/src/index.tsx similarity index 100% rename from src/index.js rename to src/index.tsx diff --git a/src/mock.js b/src/mock.js deleted file mode 100644 index 77fe66a..0000000 --- a/src/mock.js +++ /dev/null @@ -1,12 +0,0 @@ -export const mockdata = { - groupCode: 'IT-92', - scheduleFirstWeek: [], - scheduleSecondWeek: [], -}; - -export const groups = [ - {value: 'ІК-91', label: 'ІК-91'}, - {value: 'ІК-92', label: 'ІК-92'}, - {value: 'ІК-93', label: 'ІК-93'}, - {value: 'ІА-91', label: 'ІА-91'} -]; diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..630c7e2 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,29 @@ +{ + "$schema": "https://json.schemastore.org/tsconfig", + "display": "Create React App", + "_version": "2.0.0", + + "compilerOptions": { + "lib": ["dom", "dom.iterable", "esnext"], + "module": "esnext", + "moduleResolution": "node", + "target": "es2015", + "baseUrl": "./src", + "paths": { + "@/*": ["*"] + }, + "allowJs": true, + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "isolatedModules": true, + "jsx": "react", + "noEmit": true, + "noFallthroughCasesInSwitch": true, + "resolveJsonModule": true, + "skipLibCheck": true, + "strict": true + }, + + "include": ["src/**/*.ts", "src/**/*.tsx"], + "exclude": ["node_modules"] +} From c58b60744ff6029b4bb5517591dccbaf199d0316 Mon Sep 17 00:00:00 2001 From: Andrew Gubskiy Date: Tue, 30 Apr 2024 13:23:04 +0300 Subject: [PATCH 02/11] Update workflow.yml --- .github/workflows/workflow.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/workflow.yml b/.github/workflows/workflow.yml index 0710f7e..704adc8 100644 --- a/.github/workflows/workflow.yml +++ b/.github/workflows/workflow.yml @@ -4,6 +4,7 @@ on: push: branches: - master + - typescript-migration jobs: build-and-deploy: From 3092485ec6d6156133373abb5a062faaff38cb04 Mon Sep 17 00:00:00 2001 From: Oleksii Novoseltsev <87183226+onorisma@users.noreply.github.com> Date: Tue, 21 May 2024 11:26:34 +0300 Subject: [PATCH 03/11] Components migration --- src/common/constants/subjectTypes.ts | 2 +- src/common/context/lecturerContext.tsx | 6 +- src/common/styles/styles.ts | 4 +- src/common/utils/apiTransformers.ts | 2 +- ...ySearch.style.js => entitySearch.style.ts} | 2 +- .../{entitySearch.jsx => entitySearch.tsx} | 55 ++++++++++--------- .../entitySearch/{index.js => index.ts} | 0 src/components/examComponent/exam.style.js | 17 +----- .../examComponent/{exam.jsx => exam.tsx} | 23 ++++++-- .../examComponent/{index.js => index.ts} | 0 .../{index.js => index.ts} | 0 ...tyle.js => optionMultipleToggler.style.ts} | 4 +- ...eToggler.jsx => optionMultipleToggler.tsx} | 12 +++- .../{index.js => index.ts} | 0 ....style.js => scheduleItemContent.style.ts} | 4 +- ...temContent.jsx => scheduleItemContent.tsx} | 33 +++++++---- .../scheduleTypeTab/{index.js => index.ts} | 0 ...cheduleTypeTab.jsx => scheduleTypeTab.tsx} | 10 ++-- 18 files changed, 95 insertions(+), 79 deletions(-) rename src/components/entitySearch/{entitySearch.style.js => entitySearch.style.ts} (71%) rename src/components/entitySearch/{entitySearch.jsx => entitySearch.tsx} (56%) rename src/components/entitySearch/{index.js => index.ts} (100%) rename src/components/examComponent/{exam.jsx => exam.tsx} (76%) rename src/components/examComponent/{index.js => index.ts} (100%) rename src/components/optionMultipleToggler/{index.js => index.ts} (100%) rename src/components/optionMultipleToggler/{optionMultipleToggler.style.js => optionMultipleToggler.style.ts} (86%) rename src/components/optionMultipleToggler/{optionMultipleToggler.jsx => optionMultipleToggler.tsx} (71%) rename src/components/scheduleItemContent/{index.js => index.ts} (100%) rename src/components/scheduleItemContent/{scheduleItemContent.style.js => scheduleItemContent.style.ts} (93%) rename src/components/scheduleItemContent/{scheduleItemContent.jsx => scheduleItemContent.tsx} (78%) rename src/components/scheduleTypeTab/{index.js => index.ts} (100%) rename src/components/scheduleTypeTab/{scheduleTypeTab.jsx => scheduleTypeTab.tsx} (77%) diff --git a/src/common/constants/subjectTypes.ts b/src/common/constants/subjectTypes.ts index 8b76f74..70a8bb6 100644 --- a/src/common/constants/subjectTypes.ts +++ b/src/common/constants/subjectTypes.ts @@ -1,4 +1,4 @@ -import { ScheduleItemTypeLab, ScheduleItemTypeLec, ScheduleItemTypePrac } from "../../components/scheduleItemContent/scheduleItemContent.style"; +import { ScheduleItemTypeLab, ScheduleItemTypeLec, ScheduleItemTypePrac } from "@/components/scheduleItemContent/scheduleItemContent.style"; export const SUBJECT_TYPES = { lec: { diff --git a/src/common/context/lecturerContext.tsx b/src/common/context/lecturerContext.tsx index 0134cee..ebac951 100644 --- a/src/common/context/lecturerContext.tsx +++ b/src/common/context/lecturerContext.tsx @@ -6,12 +6,12 @@ interface Props { interface LecturerContextType { lecturer: any, - setLecturer: React.Dispatch + setLecturer: React.Dispatch } const LecturerContext = createContext(null); -export const useLecturerContext = () => useContext(LecturerContext); +export const useLecturerContext = () => useContext(LecturerContext); export const LecturerContextProvider: React.FC = ({children}) => { const [lecturer, setLecturer] = useState(null); @@ -19,7 +19,7 @@ export const LecturerContextProvider: React.FC = ({children}) => { const params = {setLecturer, lecturer}; return ( - + {children} ); diff --git a/src/common/styles/styles.ts b/src/common/styles/styles.ts index 0c3e33c..80bd0ac 100644 --- a/src/common/styles/styles.ts +++ b/src/common/styles/styles.ts @@ -5,13 +5,13 @@ import { getModeSize } from '../utils/getModeSize'; import { getValueFromTheme } from '@/common/utils/getValueFromTheme'; import { Link } from 'react-router-dom'; -export const Flex = styled.div` +export const Flex = styled.div<{gap?: number}>` display: flex; ${space}; ${flexbox}; // Support for gap in flexbox - gap: ${(props: {gap: number}) => props.gap}; + gap: ${(props) => props.gap}; `; export const Pictogram = styled.img` diff --git a/src/common/utils/apiTransformers.ts b/src/common/utils/apiTransformers.ts index f1e4264..b68142e 100644 --- a/src/common/utils/apiTransformers.ts +++ b/src/common/utils/apiTransformers.ts @@ -1,6 +1,6 @@ import { unique } from "./unique"; -export const prepareList = (list: {label: string, value: string, name: string, id: string}[]) => { +export const prepareList = (list: {label: string, value: string, name: string, id: string}[]): {label: string, value: string}[] => { return unique( list.map((item: {name: string, id: string}) => ({ label: item.name, diff --git a/src/components/entitySearch/entitySearch.style.js b/src/components/entitySearch/entitySearch.style.ts similarity index 71% rename from src/components/entitySearch/entitySearch.style.js rename to src/components/entitySearch/entitySearch.style.ts index 8673c4f..24aefa4 100644 --- a/src/components/entitySearch/entitySearch.style.js +++ b/src/components/entitySearch/entitySearch.style.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import { getValueFromTheme } from '../../common/utils/getValueFromTheme'; +import { getValueFromTheme } from '@/common/utils/getValueFromTheme'; export const Label = styled.label` display: flex; diff --git a/src/components/entitySearch/entitySearch.jsx b/src/components/entitySearch/entitySearch.tsx similarity index 56% rename from src/components/entitySearch/entitySearch.jsx rename to src/components/entitySearch/entitySearch.tsx index a5c161e..3430120 100644 --- a/src/components/entitySearch/entitySearch.jsx +++ b/src/components/entitySearch/entitySearch.tsx @@ -3,46 +3,47 @@ import { Select } from "react-select-virtualized"; import { Label } from "./entitySearch.style"; -import { useLecturerContext } from "../../common/context/lecturerContext"; +import { useLecturerContext } from "@/common/context/lecturerContext"; import { useHistory, useLocation } from "react-router-dom"; -import { usePreloadedListContext } from "../../common/context/preloadedListsContext"; -import { useGroupContext } from "../../common/context/groupContext"; +import { usePreloadedListContext } from "@/common/context/preloadedListsContext"; +import { useGroupContext } from "@/common/context/groupContext"; import { useTheme } from "styled-components"; -import { prepareList } from "../../common/utils/apiTransformers"; -import { routes } from "../../common/constants/routes"; +import { prepareList } from "@/common/utils/apiTransformers"; +import { routes } from "@/common/constants/routes"; -import { getSelectCustomStyle } from "../../common/constants/selectOptions"; +import { getSelectCustomStyle } from "@/common/constants/selectOptions"; import "./entitySearch.scss"; -import { getLocalStorageItem, setLocalStorageItem } from "../../common/utils/parsedLocalStorage"; +import { getLocalStorageItem, setLocalStorageItem } from "@/common/utils/parsedLocalStorage"; const useQuery = () => { const { search } = useLocation(); return React.useMemo(() => new URLSearchParams(search), [search]); }; -const EntitySearch = () => { +const EntitySearch: React.FC = () => { const theme = useTheme(); const location = useLocation(); const history = useHistory(); - const [options, setOptions] = useState([]); - const { lecturer, setLecturer } = useLecturerContext(); - const { group, setGroup } = useGroupContext(); + const [options, setOptions] = useState<{label: string, value: string}[]>([]); + const lecturerContextValue = useLecturerContext(); + + const groupContextValue = useGroupContext(); const lists = usePreloadedListContext(); const isLecturer = location.pathname.includes(routes.LECTURER); - const list = isLecturer ? lists.lecturers : lists.groups; + const list = isLecturer ? lists?.lecturers : lists?.groups; const query = useQuery(); useEffect(() => { if (isLecturer) { - setGroup(null); + groupContextValue?.setGroup(null); } else { - setLecturer(null); + lecturerContextValue?.setLecturer(null); } - }, [isLecturer, setGroup, setLecturer]); + }, [isLecturer]); useEffect(() => { if (isLecturer) { @@ -52,8 +53,8 @@ const EntitySearch = () => { lecturer = localStorageLecturerId history.replace("?lecturerId=" + localStorageLecturerId); } - setLecturer(lecturer); - setGroup(null); + lecturerContextValue?.setLecturer(lecturer); + groupContextValue?.setGroup(null); } else { let group = query.get("groupId"); const localStorageLecturerId = getLocalStorageItem("groupId") @@ -61,15 +62,15 @@ const EntitySearch = () => { group = localStorageLecturerId history.replace("?groupId=" + localStorageLecturerId); } - const groupObj = list.find((g) => g.id === group); - setGroup(groupObj); - setLecturer(null); + const groupObj = list?.find((g) => g.id === group); + groupContextValue?.setGroup(groupObj); + lecturerContextValue?.setLecturer(null); } - setOptions(prepareList(list)); - }, [list, history, isLecturer, query, setGroup, setLecturer]); + setOptions(prepareList(list || [])); + }, [list, history, isLecturer, query]); - const onOptionChange = (option) => { - isLecturer ? setLecturer(option.value) : setGroup({ id : option.value, name : option.label }); + const onOptionChange = (option: {value: string, label: string}) => { + isLecturer ? lecturerContextValue?.setLecturer(option.value) : groupContextValue?.setGroup({ id : option.value, name : option.label }); if (isLecturer) { history.push("?lecturerId=" + option.value); @@ -80,11 +81,11 @@ const EntitySearch = () => { } }; const initialValue = - options.find((item) => - isLecturer ? item.value === lecturer : item.value === group?.id + options.find((item: {value: string}) => + isLecturer ? item.value === lecturerContextValue?.lecturer : item.value === groupContextValue?.group?.id ) ?? null; return ( -