Switch to daisyUI

.github/workflows/electron.yaml

@@ -32,7 +32,7 @@ jobs:
                   node-version: "21"
 
             - name: Install Dependencies
-              run: npm ci
+              run: npm ci --force
 
             - name: Build Vite App
               run: npm run vitebuildcli

.github/workflows/static.yml

@@ -36,7 +36,7 @@ jobs:
           node-version: 20
           cache: 'npm'
       - name: Install dependencies
-        run: npm ci
+        run: npm ci --force
       - name: Build
         run: npm run build && cp ./dist/index.html ./dist/404.html
       - name: Setup Pages

.prettierrc

@@ -0,0 +1,9 @@
+{
+    "trailingComma": "es5",
+    "tabWidth": 4,
+    "semi": true,
+    "singleQuote": false,
+    "useTabs": false,
+    "printWidth": 100,
+    "plugins": ["prettier-plugin-tailwindcss"]
+}

index.html

@@ -5,10 +5,9 @@
         <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
         <link rel="icon" href="/favicon.ico" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
-        <meta name="theme-color" content="#F8F5F0" />
+        <meta name="theme-color" content="#fcfcfc" />
         <meta name="iSpeakerReact | yell0wsuit" content="" />
         <link rel="apple-touch-icon" href="/images/icons/ios/192.png" />
-        <link rel="manifest" href="/manifest.json" />
         <title>iSpeakerReact | yell0wsuit</title>
         <link href="/styles/style.css" rel="stylesheet" />
         <meta

package.json

@@ -3,7 +3,7 @@
     "author": "yell0wsuit",
     "description": "An English-learning interactive tool written in React, designed to help learners practice speaking and listening",
     "private": true,
-    "version": "2.4.1",
+    "version": "3.0.0",
     "type": "module",
     "main": "main.cjs",
     "license": "Apache-2.0",
@@ -21,31 +21,30 @@
         "appxarm": "vite build --mode electron && electron-forge package --arch=arm64 && cd ./out && electron-windows-store --input-directory ./iSpeakerReact-win32-arm64 --output-directory ./ispeakerreact-appx --package-version ${npm_package_version}.0 --package-name ispeakerreact  --assets ../public/images/icons/windows11 -m ./appxmanifest.xml"
     },
     "dependencies": {
-        "@dnd-kit/core": "^6.2.0",
-        "@dnd-kit/sortable": "^9.0.0",
-        "@react-spring/web": "^9.7.5",
-        "bootstrap": "^5.3.3",
+        "@dnd-kit/core": "^6.3.1",
+        "@dnd-kit/sortable": "^10.0.0",
+        "@vidstack/react": "^1.12.12",
         "cors": "^2.8.5",
         "dexie": "^4.0.10",
-        "electron-log": "^5.2.3",
+        "electron-log": "^5.2.4",
         "electron-squirrel-startup": "^1.0.1",
-        "express": "^4.21.1",
+        "express": "^4.21.2",
         "he": "^1.2.0",
-        "i18next": "^24.0.5",
-        "i18next-browser-languagedetector": "^8.0.0",
+        "i18next": "^24.2.0",
+        "i18next-browser-languagedetector": "^8.0.2",
         "i18next-http-backend": "^3.0.1",
         "lodash": "^4.17.21",
         "masonry-layout": "^4.2.2",
-        "mime": "^4.0.4",
+        "mime": "^4.0.6",
         "nprogress": "^0.2.0",
-        "react": "^18.3.1",
-        "react-bootstrap": "^2.10.6",
-        "react-bootstrap-icons": "^1.11.4",
-        "react-dom": "^18.3.1",
+        "react": "^19.0.0",
+        "react-dom": "^19.0.0",
         "react-flip-toolkit": "^7.2.4",
-        "react-i18next": "^15.1.3",
+        "react-i18next": "^15.2.0",
+        "react-icons": "^5.4.0",
         "react-loading-skeleton": "^3.5.0",
-        "react-router-dom": "^7.0.2"
+        "react-router-dom": "^7.0.2",
+        "sonner": "^1.7.1"
     },
     "devDependencies": {
         "@electron-forge/cli": "^7.6.0",
@@ -57,20 +56,28 @@
         "@electron-forge/plugin-auto-unpack-natives": "^7.6.0",
         "@electron-forge/plugin-fuses": "^7.6.0",
         "@electron/fuses": "^1.8.0",
-        "@eslint/js": "^9.16.0",
-        "@types/react": "^18.3.12",
-        "@types/react-dom": "^18.3.1",
+        "@eslint/js": "^9.17.0",
+        "@tailwindcss/typography": "^0.5.15",
+        "@types/react": "^19.0.2",
+        "@types/react-dom": "^19.0.2",
         "@vitejs/plugin-react": "^4.3.4",
+        "autoprefixer": "^10.4.20",
         "concurrently": "^9.1.0",
         "cross-env": "^7.0.3",
+        "daisyui": "^4.12.22",
         "electron": "^33.2.1",
-        "eslint": "^9.16.0",
+        "eslint": "^9.17.0",
         "eslint-plugin-react": "^7.37.2",
-        "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+        "eslint-plugin-react-hooks": "^5.1.0",
         "eslint-plugin-react-refresh": "^0.4.16",
-        "globals": "^15.13.0",
+        "globals": "^15.14.0",
+        "postcss": "^8.4.49",
+        "prettier": "^3.4.2",
+        "prettier-plugin-tailwindcss": "^0.6.9",
         "rollup-plugin-visualizer": "^5.12.0",
-        "vite": "^6.0.2",
+        "tailwindcss": "^3.4.17",
+        "vite": "^6.0.4",
+        "vite-plugin-pwa": "^0.21.1",
         "wait-on": "^8.0.1"
     },
     "optionalDependencies": {

postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

public/locales/en.json

@@ -37,7 +37,8 @@
         "textClearSuccess": "Text cleared successfully.",
         "textClearFailed": "Error clearing text. Reason: ",
         "audioPlayFailed": "Unable to play audio due to a network issue. Please check your connection and reload the page.",
-        "loadingError": "Error while loading the data. Please try refreshing the page."
+        "loadingError": "Error while loading the data. Please try refreshing the page.",
+        "reviewUpdated": "Review updated successfully."
     },
     "buttonConversationExam": {
         "watchBtn": "Watch",
@@ -57,6 +58,7 @@
         "taskCard": "Task",
         "watchCard": "Watch the video",
         "studyCard": "Study",
+        "studyExpandBtn": "Transcription and key languages",
         "imageFullSizeModal": "Full size view",
         "practiceConversationText": [
             "Practice writing your own conversation.",
@@ -90,6 +92,7 @@
     },
     "exercise_page": {
         "exerciseSubheading": "Select an exercise to get started.",
+        "modalInfoHeader": "Exercise info",
         "dictationHeading": "Dictation",
         "matchUpHeading": "Match-up",
         "reorderingHeading": "Reordering",
@@ -111,7 +114,7 @@
         "homophonesExercise": "Homophones",
         "questionNo": "Question",
         "timer": "Time:",
-        "dropLayer": "Drop here...",
+        "dropLayer": "Drop here…",
         "dragThisItem": "Drag this",
         "snapCorrect": "Correct",
         "snapIncorrect": "Incorrect",
@@ -121,8 +124,10 @@
             "quitBtn": "Quit",
             "restartBtn": "Restart quiz",
             "backBtn": "Back to exercise list",
+            "instructionBtn": "Instructions",
             "collapseBtn": "Collapse instructions",
-            "expandBtn": "View instructions"
+            "expandBtn": "See instructions",
+            "playAudioBtn": "Play audio"
         },
         "exerciseInfo": {
             "dictationWord": "Test your listening and spelling with word dictations",
@@ -322,6 +327,8 @@
     "conversationPage": {
         "selectType": "Select a conversation type to get started",
         "topicHeading": "Topic: ",
+        "conversationModalInfo": "Conversation info",
+        "expandInfoBtn": "See conversation info",
         "discussionAndOpinion": {
             "heading": "Discussion and opinion",
             "agreeingTitle": "Agreeing",
@@ -531,6 +538,8 @@
     "examPage": {
         "selectType": "Select an exam task to get started.",
         "taskInfo": "Task info",
+        "examModalInfo": "Exam info",
+        "expandInfoBtn": "See exam info",
         "groupTask": {
             "heading": "Group tasks",
             "discussingOpinions": {
@@ -703,7 +712,9 @@
                 "listenHeading1": "Asking for personal information",
                 "listenHeading2": "Giving personal information",
                 "listenHeading3": "Talking about future plans",
-                "practiceQuestion": ["Answer the same questions from the video, giving information about yourself."],
+                "practiceQuestion": [
+                    "Answer the same questions from the video, giving information about yourself."
+                ],
                 "tipDos": [
                     "Use language you know is correct.",
                     "Think of a different way of expressing your idea if you’ve forgotten a word.",
@@ -866,7 +877,9 @@
                 "listenHeading3": "Talking about your skills and work experience",
                 "listenHeading4": "Talking about your hopes for the future",
                 "listenHeading5": "Questions to ask an employer",
-                "practiceQuestion": ["Role-play a job interview, talking about your own skills and experience."],
+                "practiceQuestion": [
+                    "Role-play a job interview, talking about your own skills and experience."
+                ],
                 "tipDos": [
                     "Maintain eye contact when possible.",
                     "Listen carefully to each question and ask for clarification if you aren’t sure what something means.",
@@ -892,6 +905,8 @@
         "checkUpdateBtn": "Check for updates",
         "checkUpdateMSBtn": "Check for updates in Microsoft Store",
         "openGitHubAlertLink": "Open GitHub",
+        "changeSaved": "Changes saved",
+        "noDataToDelete": "No data to delete",
         "exerciseSettings": {
             "timerHeading": "Exercise timer",
             "timerOption": "Enable timer",
@@ -919,19 +934,20 @@
         },
         "videoDownloadSettings": {
             "videoDownloadHeading": "Video downloads",
-            "videoDownloadOption": "Download video files",
+            "videoDownloadOption": "Download video files…",
             "videoPageHeading": "Download video files for offline watching",
             "backToSettingsBtn": "Back to settings",
             "instructionCardHeading": "Instructions",
             "steps": [
                 "<1>Step {{number}}</1>: Click on the “Download” link to download the video file you want to watch offline.",
                 "<1>Step {{number}}</1>: Click on the “Open download folder” button, and move the file(s) you have downloaded into there.",
-                "<1>Step {{number}}</1>: Click on the “Back to settings” button (or any page), and then go back to this page. This is to refresh the state of the file downloaded status.",
+                "<1>Step {{number}}</1>: Click on the “Refresh download status” to refresh the state of the file downloaded status.",
                 "<1>Step {{number}}</1>: Click on the “Verify” button, and wait until the verification process is finished."
             ],
             "warningHeading": "Warning!",
             "warningBody": "Do not manually extract, rename the file(s), or modify the zip file’s content. Doing so will make the verification process fail.",
             "openDownloadBtn": "Open download folder",
+            "refreshDownloadStateBtn": "Refresh download status",
             "downloadTable": {
                 "nameHeading": "Name",
                 "fileSizeTotalHeading": "Total file size",
@@ -969,11 +985,11 @@
         },
         "resetSettings": {
             "resetHeading": "Reset settings",
-            "resetSettingsData": "Reset iSpeakerReact’s settings and review data",
-            "resetSettingsDataModalMessage": "Are you sure you want to reset iSpeakerReact’s settings and review data? This action cannot be undone.",
-            "deleteRecordingData": "Delete saved recordings",
-            "deleteRecordingDataModalMessage": "Are you sure you want to delete saved recordings? This action cannot be undone.",
-            "resetModalHeading": "Confirm...",
+            "resetSettingsData": "Reset settings and review data",
+            "resetSettingsDataModalMessage": "Are you sure you want to reset settings and review data? This action cannot be undone.",
+            "deleteRecordingData": "Delete saved texts and recordings",
+            "deleteRecordingDataModalMessage": "Are you sure you want to delete saved texts and recordings? This action cannot be undone.",
+            "resetModalHeading": "Confirm…",
             "resetConfirmBtn": "Confirm"
         }
     }