diff --git a/packages/worksheet/package.json b/packages/worksheet/package.json index 7f48351a..23d11a1e 100644 --- a/packages/worksheet/package.json +++ b/packages/worksheet/package.json @@ -14,6 +14,7 @@ "@testing-library/user-event": "^12.8.3", "axios": "^0.24.0", "expo-font": "^10.0.3", + "firebase": "^9.9.0", "i18next": "^21.6.7", "jwt-decode": "^3.1.2", "moment": "^2.29.1", @@ -40,8 +41,7 @@ "workbox-range-requests": "^5.1.4", "workbox-routing": "^5.1.4", "workbox-strategies": "^5.1.4", - "workbox-streams": "^5.1.4", - "firebase": "^9.9.0" + "workbox-streams": "^5.1.4" }, "homepage": "modules/worksheet", "scripts": { @@ -90,10 +90,11 @@ "@storybook/preset-create-react-app": "^4.0.1", "@storybook/react": "^6.4.19", "@storybook/testing-library": "^0.0.9", + "@types/react-native": "^0.69.5", "craco-module-federation": "^1.1.0", "external-remotes-plugin": "^1.0.0", "prettier": "^2.5.1", "typescript": "^4.7.4", "webpack": "^5.69.1" } -} \ No newline at end of file +} diff --git a/packages/worksheet/src/components/Actionsheet/CommentActionsheet.js b/packages/worksheet/src/components/Actionsheet/CommentActionsheet.tsx similarity index 94% rename from packages/worksheet/src/components/Actionsheet/CommentActionsheet.js rename to packages/worksheet/src/components/Actionsheet/CommentActionsheet.tsx index 4adc8e59..d6d4f951 100644 --- a/packages/worksheet/src/components/Actionsheet/CommentActionsheet.js +++ b/packages/worksheet/src/components/Actionsheet/CommentActionsheet.tsx @@ -1,3 +1,5 @@ +// Lib +import React from "react"; import { IconByName, commentRegistryService, @@ -7,7 +9,6 @@ import { Subtitle, H2, } from "@shiksha/common-lib"; -import colorTheme from "../../colorTheme"; import { Actionsheet, HStack, @@ -21,9 +22,11 @@ import { InputRightAddon, ScrollView, } from "native-base"; -import React from "react"; import { useTranslation } from "react-i18next"; import moment from "moment"; + +// Utils +import colorTheme from "../../colorTheme"; const colors = overrideColorTheme(colorTheme); export default function Comment({ @@ -31,21 +34,21 @@ export default function Comment({ showModuleComments, worksheet, comments, - setCommets, + setComments, }) { const { t } = useTranslation(); - const [comment, setCommet] = React.useState(""); - const [error, setError] = React.useState(); + const [comment, setComment] = React.useState(""); + const [error, setError] = React.useState(null); const firstName = localStorage.getItem("firstName"); const lastName = localStorage.getItem("lastName"); const handleInput = (event) => { const value = event.target.value; - setCommet(value); + setComment(value); if (!value) { setError(t("ENTER_COMMENT")); } else { - setError(); + setError(null); } }; const handleSubmit = async () => { @@ -58,7 +61,7 @@ export default function Comment({ comment, }; const { osid } = await commentRegistryService.create(newData); - setCommets([ + setComments([ ...comments, { ...newData, @@ -66,7 +69,7 @@ export default function Comment({ userData: { firstName, lastName, createdAt: moment() }, }, ]); - setCommet(""); + setComment(""); } else { setError(t("ENTER_COMMENT")); } @@ -83,6 +86,7 @@ export default function Comment({

{t("Comments")}

setShowModuleComments(false)} diff --git a/packages/worksheet/src/components/Actionsheet/CreateWorksheet/InputFormActionsheet.js b/packages/worksheet/src/components/Actionsheet/CreateWorksheet/InputFormActionsheet.tsx similarity index 97% rename from packages/worksheet/src/components/Actionsheet/CreateWorksheet/InputFormActionsheet.js rename to packages/worksheet/src/components/Actionsheet/CreateWorksheet/InputFormActionsheet.tsx index a271bcc2..f571a285 100644 --- a/packages/worksheet/src/components/Actionsheet/CreateWorksheet/InputFormActionsheet.js +++ b/packages/worksheet/src/components/Actionsheet/CreateWorksheet/InputFormActionsheet.tsx @@ -54,6 +54,7 @@ export default function InputForm({ px="5" flex="1" variant="outline" + // @ts-ignore onPress={handleSubmit} > {t("Skip")} @@ -63,6 +64,7 @@ export default function InputForm({ _text={{ color: "worksheet.white" }} px="5" flex="1" + // @ts-ignore onPress={handleSubmit} > {t("Save")} diff --git a/packages/worksheet/src/components/Actionsheet/QuestionActionsheet.js b/packages/worksheet/src/components/Actionsheet/QuestionActionsheet.tsx similarity index 98% rename from packages/worksheet/src/components/Actionsheet/QuestionActionsheet.js rename to packages/worksheet/src/components/Actionsheet/QuestionActionsheet.tsx index 9a8faaf1..0a2c81b8 100644 --- a/packages/worksheet/src/components/Actionsheet/QuestionActionsheet.js +++ b/packages/worksheet/src/components/Actionsheet/QuestionActionsheet.tsx @@ -39,6 +39,7 @@ export default function Question({

{t("Question")}

 + {/* @ts-ignore*/} { - const newSort = { ["name"]: obejct }; - const telemetryData = telemetryFactory.interact({ - appName, - type: "Worksheet-Sort", - sortType: newSort, - }); - capture("INTERACT", telemetryData); - setSortObject(newSort); - }; - - const handalClose = () => { + const handleClose = () => { setSortData(sortObject); setShowModal(false); }; - + const handleSort = (object) => { + setSortObject(sortSheet(object, appName)); + }; return ( diff --git a/packages/worksheet/src/components/Actionsheet/WorksheetActionsheet.js b/packages/worksheet/src/components/Actionsheet/WorksheetActionsheet.tsx similarity index 72% rename from packages/worksheet/src/components/Actionsheet/WorksheetActionsheet.js rename to packages/worksheet/src/components/Actionsheet/WorksheetActionsheet.tsx index 07933b39..a3512e8e 100644 --- a/packages/worksheet/src/components/Actionsheet/WorksheetActionsheet.js +++ b/packages/worksheet/src/components/Actionsheet/WorksheetActionsheet.tsx @@ -1,3 +1,4 @@ +// Lib import { BodyMedium, Caption, @@ -17,17 +18,15 @@ import { } from "native-base"; import React from "react"; import { useTranslation } from "react-i18next"; + +// Components +import AvatarGroup from "components/AvatarGroup"; + +// Utils import colorTheme from "../../colorTheme"; const colors = overrideColorTheme(colorTheme); - -const AttributeData = [ - { icon: "SurveyLineIcon", label: "SUBJECT", attribute: "subject" }, - { icon: "BarChart2LineIcon", label: "LEVEL", attribute: "level" }, - { icon: "QuestionLineIcon", label: "QUESTIONS", attribute: "questions" }, - { icon: "AccountBoxFillIcon", label: "GRADE", attribute: "grade" }, - { icon: "ArticleLineIcon", label: "TOPIC", attribute: "topic" }, - { icon: "Download2LineIcon", label: "DOWNLOADS", attribute: "downloads" }, -]; +import { avatarObjProps } from "constants/avatarsData/avatarsData"; +import { AttributeData } from "constants/attributeData/attributeData"; export default function Worksheet({ worksheetConfig, @@ -49,6 +48,7 @@ export default function Worksheet({

{worksheet?.name ? worksheet?.name : ""}

 + {/* @ts-ignore */} handleCommentModuleOpen ? handleCommentModuleOpen() @@ -95,31 +96,8 @@ export default function Worksheet({ } > - - - AJ - - - TE - - - + + {commentCount} {t("COMMENTS")} diff --git a/packages/worksheet/src/components/AvatarGroup.tsx b/packages/worksheet/src/components/AvatarGroup.tsx new file mode 100644 index 00000000..b1f7c926 --- /dev/null +++ b/packages/worksheet/src/components/AvatarGroup.tsx @@ -0,0 +1,39 @@ +// Lib +import * as React from "react"; +import { Avatar } from "native-base"; + +// Interface +export interface IAvatarGroup { + avatarList: Array<{ + size: string; + bg: string; + source: { + uri: string; + }; + text: string; + }>; +} + +// Generates a list of avatars on the basis of passed props +const AvatarGroup: React.FC = ({ avatarList }) => { + return ( + + {avatarList.map((avt, idx) => ( + + {avt.text} + + ))} + + ); +}; +export default AvatarGroup; diff --git a/packages/worksheet/src/constants/attributeData/attributeData.ts b/packages/worksheet/src/constants/attributeData/attributeData.ts new file mode 100644 index 00000000..26673474 --- /dev/null +++ b/packages/worksheet/src/constants/attributeData/attributeData.ts @@ -0,0 +1,9 @@ +// Contains information about various types of attributes +export const AttributeData = [ + { icon: "SurveyLineIcon", label: "SUBJECT", attribute: "subject" }, + { icon: "BarChart2LineIcon", label: "LEVEL", attribute: "level" }, + { icon: "QuestionLineIcon", label: "QUESTIONS", attribute: "questions" }, + { icon: "AccountBoxFillIcon", label: "GRADE", attribute: "grade" }, + { icon: "ArticleLineIcon", label: "TOPIC", attribute: "topic" }, + { icon: "Download2LineIcon", label: "DOWNLOADS", attribute: "downloads" }, +]; diff --git a/packages/worksheet/src/constants/avatarsData/avatarsData.ts b/packages/worksheet/src/constants/avatarsData/avatarsData.ts new file mode 100644 index 00000000..4b63bf44 --- /dev/null +++ b/packages/worksheet/src/constants/avatarsData/avatarsData.ts @@ -0,0 +1,19 @@ +// Contains a list of very commonly used list of avatar objects +export const avatarObjProps = [ + { + size: "xs", + bg: "green.500", + source: { + uri: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80", + }, + text: "AJ", + }, + { + size: "xs", + bg: "cyan.500", + source: { + uri: "https://images.unsplash.com/photo-1603415526960-f7e0328c63b1?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80", + }, + text: "TE", + }, +]; diff --git a/packages/worksheet/src/utils/functions/SortSheet.ts b/packages/worksheet/src/utils/functions/SortSheet.ts new file mode 100644 index 00000000..3c854f23 --- /dev/null +++ b/packages/worksheet/src/utils/functions/SortSheet.ts @@ -0,0 +1,21 @@ +// Lib +import { capture, telemetryFactory } from "@shiksha/common-lib"; + +// Interface +export interface ISortSheet { + (object: any, appName: string): Object; +} + +// Sorts the given sheet +const sortSheet: ISortSheet = (object, appName) => { + const newSort = { ["name"]: object }; + const telemetryData = telemetryFactory.interact({ + appName, + type: "Worksheet-Sort", + sortType: newSort, + }); + capture("INTERACT", telemetryData); + return newSort; +}; + +export default sortSheet; diff --git a/yarn.lock b/yarn.lock index fe5f8d0e..6958153e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5352,6 +5352,13 @@ dependencies: "@types/react" "*" +"@types/react-native@^0.69.5": + version "0.69.5" + resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.69.5.tgz#7709fdbff031a5ecf1956705e6c4a07cdfe6867c" + integrity sha512-mSUCuGUsW2kJlZiu4GmdYVDKZX/52iyC9rm6dxAmflJj1b7kSO/CMSDy5WbcfS8QerxTqbYGTrIwHD0GnXHzbQ== + dependencies: + "@types/react" "*" + "@types/react-syntax-highlighter@11.0.5": version "11.0.5" resolved "https://registry.npmjs.org/@types/react-syntax-highlighter/-/react-syntax-highlighter-11.0.5.tgz"