From 06091c575e40d3220a8faa0f85f94d0984d4534a Mon Sep 17 00:00:00 2001 From: paritshivani Date: Fri, 15 Mar 2024 10:08:02 +0530 Subject: [PATCH] Side menu, language menu, faqPage --- .github/workflows/build-test.yml | 4 +- module-template/public/index.html | 2 +- .../common-lib/src/components/SearchLayout.js | 5 +- packages/nulp_elite/src/App.js | 11 +- packages/nulp_elite/src/pages/Contents.js | 102 ++++++++++++--- packages/nulp_elite/src/pages/Courses.js | 100 +++++--------- packages/nulp_elite/src/pages/FAQData.json | 106 +++++++++++++++ packages/nulp_elite/src/pages/FAQPage.js | 35 +++++ packages/nulp_elite/src/pages/Frmework.js | 2 +- packages/nulp_elite/src/pages/Profile.js | 123 +++++++++++++----- packages/nulp_elite/src/pages/User.js | 2 +- .../nulp_elite/src/pages/UserPrefPopup.js | 2 +- 12 files changed, 366 insertions(+), 128 deletions(-) create mode 100644 packages/nulp_elite/src/pages/FAQData.json create mode 100644 packages/nulp_elite/src/pages/FAQPage.js diff --git a/.github/workflows/build-test.yml b/.github/workflows/build-test.yml index 9f56293a..a7d02b06 100644 --- a/.github/workflows/build-test.yml +++ b/.github/workflows/build-test.yml @@ -27,8 +27,8 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile - # - name: Run prettier test - # run: yarn format:check + - name: Run prettier test + run: yarn format:check # - name: Run the tests and generate coverage report # run: yarn test diff --git a/module-template/public/index.html b/module-template/public/index.html index 1d568a43..0ee0a51b 100644 --- a/module-template/public/index.html +++ b/module-template/public/index.html @@ -44,7 +44,7 @@ work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> - Shiksha + NULP diff --git a/packages/common-lib/src/components/SearchLayout.js b/packages/common-lib/src/components/SearchLayout.js index 7e94d42f..351edf7f 100644 --- a/packages/common-lib/src/components/SearchLayout.js +++ b/packages/common-lib/src/components/SearchLayout.js @@ -68,8 +68,9 @@ export default function SearchLayout({ placeholder={ searchPlaceholder ? searchPlaceholder - : `Type ${minStringLenght ? 'min ' + minStringLenght : ''} - to search ` + :'Search Here' + // : `Type ${minStringLenght ? 'min ' + minStringLenght : ''}to search ` + } /> diff --git a/packages/nulp_elite/src/App.js b/packages/nulp_elite/src/App.js index 09b66fba..ae11d4cb 100644 --- a/packages/nulp_elite/src/App.js +++ b/packages/nulp_elite/src/App.js @@ -15,6 +15,7 @@ import Registration from "pages/Registration"; import UserPrefData from "pages/UserPrefData"; import { ChakraProvider } from "@chakra-ui/react"; import Profile from "pages/Profile"; +import FAQPage from "pages/FAQPage" function App() { const [search, setSearch] = React.useState(true); @@ -56,8 +57,9 @@ function App() { { moduleName: "nulp_elite", path: "/user", - component: User, - + component: User + },{ + moduleName: "nulp_elite", path: "/registration", component: Registration, }, @@ -66,6 +68,11 @@ function App() { path: "/userPrefData", component: UserPrefData, }, + { + moduleName: "nulp_elite", + path: "/help", + component: FAQPage, + } ]; // return( diff --git a/packages/nulp_elite/src/pages/Contents.js b/packages/nulp_elite/src/pages/Contents.js index 976a056d..117ab92a 100644 --- a/packages/nulp_elite/src/pages/Contents.js +++ b/packages/nulp_elite/src/pages/Contents.js @@ -4,7 +4,8 @@ import { contentService } from "@shiksha/common-lib"; import URLSConfig from "../configs/urlConfig.json"; import { Layout,IconByName,SearchLayout,FilterButton,overrideColorTheme } from "@shiksha/common-lib"; import { NativeBaseProvider,Box, Stack, VStack,Text, HStack, Button, extendTheme, - Actionsheet,ScrollView,Heading } from "native-base"; + Actionsheet,ScrollView,Heading ,useDisclose, Menu ,Image} from "native-base"; + import { Link , useParams} from "react-router-dom"; const Contents = () => { @@ -83,24 +84,91 @@ const Contents = () => { return ( - - - ), - }} + _header={ + { + rightIcon: ( + + + + ), + customeComponent: ( + + + + + + { + return ; + + }}> + Help + Logout + + + + + + + + + + {/* */} + + { + return ; + // }}> + + }}> + English + Hindi + + + {/* */} + + + {/* */} + + {/* + + */} + + + ), + // title: "User Name", + // // isEnableSearchBtn: true, + // subHeading: "Hello", + // iconComponent: ( + + // ), + } + + } subHeader={ @@ -118,7 +186,7 @@ const Contents = () => { } - _subHeader={{ bg: "rgb(248, 117, 88)" }} + _subHeader={{ size: "20px" }} _footer={{ menues: [ { @@ -132,7 +200,7 @@ const Contents = () => { route: "/all", }, { - title: "AccountCircleLineIcon", + title: "Connections", icon: "TeamLineIcon", route: "/home", }, diff --git a/packages/nulp_elite/src/pages/Courses.js b/packages/nulp_elite/src/pages/Courses.js index 6968af2f..94b843fb 100644 --- a/packages/nulp_elite/src/pages/Courses.js +++ b/packages/nulp_elite/src/pages/Courses.js @@ -1,9 +1,10 @@ // Courses.js import React from "react"; -import { NativeBaseProvider,Box, Stack, VStack,Text, HStack, Button, Image,extendTheme,H4,H1,BodyLarge,Avatar, - Actionsheet,ScrollView,Heading,useDisclose, Menu, Pressable } from "native-base"; -import { Layout,IconByName,SearchLayout,FilterButton,overrideColorTheme } from "@shiksha/common-lib"; +import { Box, VStack,Text, HStack, Button, Image, + Heading,useDisclose, Menu } from "native-base"; +import { Layout,IconByName,SearchLayout } from "@shiksha/common-lib"; import { Link , useParams} from "react-router-dom"; +import { useNavigate } from "react-router-dom"; const Courses = () => { const [search, setSearch] = React.useState(true); @@ -17,13 +18,12 @@ const Courses = () => { onOpen, onClose } = useDisclose(); - const logout = () => { - alert("logout"); - }; + const navigate = useNavigate(); - const openHelp = () => { - alert("openHelp") - }; + const redirectTo = async (path) => { + // Perform logout logic here if path is logout + window.location.href = path; + } return ( { - - { - return + + { + return ; + }}> - Arial - Nunito Sans - Roboto - Poppins - SF Pro - Helvetica - Sofia - Cookie + redirectTo("/help")}>Help + redirectTo("/logoff")}>Logout + - - - {/* */} + - { - return - Language - ; + { + return ; }}> English Hindi - - {/* */} - - - {/* */} - - {/* - - */} - + - ), - // title: "User Name", - // // isEnableSearchBtn: true, - // subHeading: "Hello", - // iconComponent: ( - - // ), - } - // - // - // - // - - // - // - // - + ), + } } subHeader={ @@ -152,7 +112,7 @@ const Courses = () => { route: "/all", }, { - title: "AccountCircleLineIcon", + title: "Connections", icon: "TeamLineIcon", route: "/home", }, diff --git a/packages/nulp_elite/src/pages/FAQData.json b/packages/nulp_elite/src/pages/FAQData.json new file mode 100644 index 00000000..29fd3980 --- /dev/null +++ b/packages/nulp_elite/src/pages/FAQData.json @@ -0,0 +1,106 @@ +{ + "categories": [ + { + "name": "Login", + "videos": [], + "faqs": [ + { + "topic": "I want to register on DIKSHA", + "description": "To sign up on DIKSHA:\n
    \n
  • Go to Explore DIKSHA
    • \n
  • Select whether you are a teacher or a student
    • \n
  • Update your location details
    • \n
  • Click on the profile icon
    • \n
  • Click Login
    • \n
  • Click Register here on the login screen
    • \n
  • For details on how to register refer https://diksha.gov.in/help/getting-started/sign-in/sign-up.html
    • \n
" + }, + { + "topic": "I want to login on DIKSHA through my State portal", + "description": "

To login to DIKSHA through your State portal:

\n
    \n
  • Go to Explore DIKSHA 
    • \n
  • Select that you are a Teacher
    • \n
  • Select your location 
    • \n
  • Click the Profile icon
    • \n
  • Click Login
    • \n
  • Select Login with State system
    • \n
  • Select your State
    • \n
  • You will be redirected to your State portal
    • \n
  • Enter the User name and Password as given to you by your State in the Login screen 
    • \n
  • Click Submit
    • \n
  • For details to log in through the State portal, refer Sign Up
    • \n
" + } + ] + }, + { + "name": "Profile", + "videos": [], + "faqs": [ + { + "topic": "I forgot my password", + "description": "

To reset your password, follow these steps and recover your account:

\n
    \n
  • Click Forgot Password
    • \n
  • Enter the email address or mobile number and user name that you provided while registering on DIKSHA
    • \n

    • \n
  • You will receive an OTP on your registered email or mobile number
    • \n

    • \n
  • Enter the OTP to reset your password and recover your account
    • \n
  • For details to reset your password, refer Recover password
    • \n
" + }, + { + "topic": "I want to edit my profile details", + "description": "You can edit the following details in your Profile:\n
    \n
  • Personal details such as name, State, and district
    • \n
  • Contact details such as a mobile number and email address
    • \n
  • Other details such as board, medium, subject, and class
    • \nFor details on how to edit profile details, refer \nUser profile\n\n" + } + ] + }, + { + "name": "Course & certificates", + "videos": [], + "faqs": [ + { + "topic": "I want to download my certificate", + "description": "

    All courses do not offer a certificate. If you have completed a course that offers a certificate, go to your profile page, you will see the download icon next to the course name. 

    \n

    If you are unable to download the certificate on the mobile app,

    \n
      \n
    • check if you have the latest version of the DIKSHA app. If not, update the app version from the Play store
      • \n
    • click on the refresh button in the Profiles tab in the Courses attended section
      • \n
    • In case you are still unable to download the certificate, write to us with:
        \n
      • Name of the course
        • \n
      • Your DIKSHA ID
        • \n
      • Screenshot of the profile page wherein the course details are displayed
        • \n
      \n
      • \n
    " + }, + { + "topic": "I want to join a course", + "description": "

    To enrol for a course, you must log in on DIKSHA. 

    \n

    Navigate to the Courses section and search for the course. For details on joining a course and enrolling for a batch, refer

    \n" + }, + { + "topic": " I want my course certificate soon after I complete my course ", + "description": "A State authority decides when to issue the certificate for the course. Few course certificates are issued within 7 days after you complete the course. But, some course certificates will be issued after the duration of the batch ends. Contact your State or course administrator to find out when your certificate will be issued. You will get a notification as soon as your certificate is issued." + }, + { + "topic": "I want to check my course progress ", + "description": "Your course completion (in %) is shown on the top right corner of your course page. " + }, + { + "topic": "I want to check if a course provides a certificate", + "description": "The course card page indicates if the course provides a certificate. A message This is a certificate course is displayed on the course details screen.\n" + }, + { + "topic": "I want to receive a notification after my certificate is issued", + "description": "You will get a notification on your registered email address or phone number after the certificate is issued. " + }, + { + "topic": "I want to change my name on the certificate issued to me", + "description": "The name on your certificate is the same as that on your profile page. Correct the name on your profile page and contact your State authority. Ask the State authority to send a service request with the required details to the DIKSHA support team to re-issue your certificate. It will take approximately 24 hours or one working day to re-issue the certificate, after receiving the request. " + }, + { + "topic": "I have completed my course, but the progress does not show as 100% completed", + "description": "The system may take a few hours to sync the progress update, and hence, there may be a delay in showing that you have completed the course. Request you to check after a day. " + }, + { + "topic": "I want to contribute content to DIKSHA", + "description": "To contribute content to DIKSHA, go to the Vidyadaan portal" + }, + { + "topic": "I cannot find my course", + "description": "To search for your course, navigate to the Courses section. Use the course filters to narrow down the search results or type the course name in the search bar and press enter." + }, + { + "topic": "My profile does not reflect my course progress correctly", + "description": "To update your course progress in your profile, go to My learnings. Click on the Course. After the course opens, go to the kebab menu (three vertical dots on the right)> click Sync progress now. Wait for a few minutes. Your profile should now reflect your correct course progress" + } + ] + } + ], + "constants": { + "charactersLeft": "characters left", + "explainMsg": "Could you explain the problem?", + "faqMsg": "Frequently asked questions", + "faqTitle": "Faq(s)", + "help": "Help", + "helpMsg": "Did this answer help you?", + "initiateEmailButton": "Initiate email", + "knowMoreMsg": "What more would you like to know?", + "noMsg": "No", + "reportIssue": "Report an issue", + "reportIssueMsg": "Report other issue", + "resolveMsg": "Get help with finding content, technical issues and more. Browse through the topics to find FAQs, help videos and more.", + "selectCategoryTitle": "Select category", + "sorryMsg": "Sorry about that!", + "submitButton": "Submit feedback", + "tellMoreMsg": "Tell us more about the problem you faced", + "thanksForFeedbackMsg": "Thanks for your feedback. We may not be able to respond to every suggestion sent to us, but your feedback is valuable. It helps make {{app_name}} better for everyone.", + "thanksMsg": "Thank you for your response!", + "triggerEmailMsg": "After you add details in the text box and tap the Initiate email button, we will trigger an email on your behalf. You can add further details and/or attach files there.", + "typeHere": "Type Here...", + "videoTitle": "Video(s)", + "yesMsg": "Yes" + } +} \ No newline at end of file diff --git a/packages/nulp_elite/src/pages/FAQPage.js b/packages/nulp_elite/src/pages/FAQPage.js new file mode 100644 index 00000000..547639e1 --- /dev/null +++ b/packages/nulp_elite/src/pages/FAQPage.js @@ -0,0 +1,35 @@ +import React from 'react'; +import { View, Heading, Text, Box, h6, AccordionButton, AccordionPanel, AccordionIcon } from 'native-base'; +import data from './FAQData.json'; // Import your data JSON file + +const FAQPage = () => { + return ( + + {/* Loop through categories */} + {data.categories.map((category, index) => ( + + + {/* Render category name */} + + {category.name} + + + + {/* Render dropdown for FAQs */} + {category.faqs.map((faq, faqIndex) => ( + +
    {faq.topic}
    +
    + {/* Render description (with HTML parsing) */} + {/* {faq.description} */} +     + ))} +     + ))} +     + ); + }; + +export default FAQPage; diff --git a/packages/nulp_elite/src/pages/Frmework.js b/packages/nulp_elite/src/pages/Frmework.js index 52b6597a..ff6a87ea 100644 --- a/packages/nulp_elite/src/pages/Frmework.js +++ b/packages/nulp_elite/src/pages/Frmework.js @@ -30,7 +30,7 @@ const Framework = () => { setIsLoading(false); } try { - const url = `https://nulp.niua.org/api/framework/v1/read/nulp?categories=board,gradeLevel,medium,class,subject`; + const url = `http://localhost:3000/api/framework/v1/read/nulp?categories=board,gradeLevel,medium,class,subject`; const response = await frameworkService.getSelectedFrameworkCategories( url, diff --git a/packages/nulp_elite/src/pages/Profile.js b/packages/nulp_elite/src/pages/Profile.js index 1158fa29..841ebd5d 100644 --- a/packages/nulp_elite/src/pages/Profile.js +++ b/packages/nulp_elite/src/pages/Profile.js @@ -1,32 +1,99 @@ // Profile.js -import React from 'react'; -import { Box, Heading, Text, Button } from '@chakra-ui/react'; + +import React, { useState, useEffect } from "react"; +// import { Box, Heading, Text, Button } from '@chakra-ui/react'; +import { Layout,IconByName,SearchLayout,FilterButton,overrideColorTheme } from "@shiksha/common-lib"; +import { NativeBaseProvider,Box, Stack, VStack,Text, HStack, Button, extendTheme, + Actionsheet,ScrollView,Heading ,useDisclose, Menu ,Image} from "native-base"; +import { Link , useParams} from "react-router-dom"; const Profile = () => { + const [search, setSearch] = React.useState(true); + const [searchState, setSearchState] = React.useState(false); + return ( - - - // { - // title: "User Name", - // // isEnableSearchBtn: true, - // subHeading: "Hello", - // iconComponent: ( - // - // - // - // ), - // } - } + _header={ + { + rightIcon: ( + + + + ), + customeComponent: ( + + + + + { + return ; + + }}> + Help + Logout + + + + + + + + + {/* */} + + { + return ; + // }}> + + }}> + English + Hindi + + + {/* */} + + + {/* */} + + {/* + + */} + + + ), + // title: "User Name", + // // isEnableSearchBtn: true, + // subHeading: "Hello", + // iconComponent: ( + + // ), + } + + } subHeader={ { route: "/all", }, { - title: "AccountCircleLineIcon", + title: "Connections", icon: "TeamLineIcon", route: "/home", }, @@ -84,13 +151,7 @@ const Profile = () => { Log Out - - - } /> - } /> - } /> - } /> - + ); diff --git a/packages/nulp_elite/src/pages/User.js b/packages/nulp_elite/src/pages/User.js index d6df6411..64bc3c7a 100644 --- a/packages/nulp_elite/src/pages/User.js +++ b/packages/nulp_elite/src/pages/User.js @@ -40,7 +40,7 @@ const Contents = () => { const headers = { "Content-Type": "application/json", }; - const url = `https://nulp.niua.org/learner/user/v3/update`; + const url = `http://localhost:3000/learner/user/v3/update`; const response = await userService.getUserData(url, headers); console.log(data?.result?.response?.rootOrg?.rootOrgId); setData(data?.result?.response?.rootOrg?.rootOrgId); diff --git a/packages/nulp_elite/src/pages/UserPrefPopup.js b/packages/nulp_elite/src/pages/UserPrefPopup.js index a4905834..bd7a7bf0 100644 --- a/packages/nulp_elite/src/pages/UserPrefPopup.js +++ b/packages/nulp_elite/src/pages/UserPrefPopup.js @@ -49,7 +49,7 @@ const UserPrefPopup = () => { const headers = { "Content-Type": "application/json", }; - const url = `https://nulp.niua.org/api/framework/v1/read/nulp`; + const url = `http://localhost:3000/api/framework/v1/read/nulp`; try { const response = await frameworkService.getFrameworkCategories( url,