louiscklaw/lettersoup-online
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

``update Refactor navigation URLs by replacing hardcoded LESSON_LINK with Paths.LESSON_LINK across App, RouteConfig, and multiple components; remove redundant LESSON_LINK from constants``

Browse Source
This commit is contained in:
louiscklaw
2025-05-16 22:00:04 +08:00
parent 69b2ef59e5
commit 8d746f3aa9
10 changed files with 43 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
002_source/ionic_mobile/src/App.tsx
View File

@@ -1,4 +1,4 @@
import { DEBUG, DEBUG_LINK, LESSON_LINK, QUIZ_MAIN_MENU_LINK, RECORD_LINK, SETTING_LINK } from './constants';
import { DEBUG, DEBUG_LINK, QUIZ_MAIN_MENU_LINK, RECORD_LINK, SETTING_LINK } from './constants';
/* Core CSS required for Ionic components to work properly */
import '@ionic/react/css/core.css';
@@ -48,6 +48,7 @@ import ContextMeta from './contexts';
import { useAppStateContext } from './contexts/AppState';
import { useMyIonQuizContext } from './contexts/MyIonQuiz';
import { RouteConfig } from './RouteConfig';
import { Paths } from './Paths';
let active_color = 'tomato';
let inactive_color = 'gray';
@@ -99,8 +100,8 @@ const TabButtons: React.FC = () => {
<IonTabBar slot="bottom">
<IonTabButton
tab="lesson"
onClick={() => goSwitchPage(LESSON_LINK)}
style={{ color: tab_active == LESSON_LINK ? active_color : inactive_color }}
onClick={() => goSwitchPage(Paths.LESSON_LINK)}
style={{ color: tab_active == Paths.LESSON_LINK ? active_color : inactive_color }}
>
<IonIcon aria-hidden="true" icon={bookOutline} size="large" />
</IonTabButton>

2
002_source/ionic_mobile/src/Paths.tsx
View File

@@ -1,4 +1,6 @@
const Paths = {
LESSON_LINK: '/lesson',
//
AuthHome: `/auth/home`,
AuthLogin: `/auth/login`,
AuthSignUp: `/auth/signup`,

39
002_source/ionic_mobile/src/RouteConfig.tsx
View File

@@ -3,7 +3,6 @@ import {
CONNECTIVE_REVISION_LINK,
DEBUG_LINK,
FAVORITE_LINK,
LESSON_LINK,
LESSON_WORD_PAGE_LINK,
LISTENING_PRACTICE_LINK,
MATCHING_FRENZY_LINK,
@@ -70,11 +69,11 @@ function RouteConfig() {
<MyAchievementPage />
</Route>
{/* */}
<Route exact path={`${LESSON_LINK}/a/:act_category`}>
<Route exact path={`${Paths.LESSON_LINK}/a/:act_category`}>
<Lesson />
</Route>
{/* */}
<Route exact path={LESSON_LINK}>
<Route exact path={Paths.LESSON_LINK}>
<Lesson />
</Route>
{/* */}
@@ -184,17 +183,29 @@ function RouteConfig() {
</Route>
{/* protected page */}
<AuthGuard>
<Route exact path={Paths.StudentInfo}>
<Route exact path="/">
<Redirect to={Paths.LESSON_LINK} />
</Route>
<Route exact path={DEBUG_LINK}>
<DebugPage />
</Route>
<Route exact path={Paths.StudentInfo}>
<AuthGuard>
<StudentInfo />
</Route>
<Route exact path={Paths.StudentMenu}>
</AuthGuard>
</Route>
<Route exact path={Paths.StudentMenu}>
<AuthGuard>
<StudentMenu />
</Route>
<Route exact path={Paths.AuthorizedTest}>
</AuthGuard>
</Route>
<Route exact path={Paths.AuthorizedTest}>
<AuthGuard>
<AuthorizedTest />
</Route>
</AuthGuard>
</AuthGuard>
</Route>
{/* TODO: remove below */}
<Route exact path="/tab1">
@@ -212,12 +223,6 @@ function RouteConfig() {
<Route path="/page/:name" exact={true}>
<Page />
</Route>
<Route exact path={DEBUG_LINK}>
<DebugPage />
</Route>
<Route exact path="/">
<Redirect to={LESSON_LINK} />
</Route>
</>
);
}

4
002_source/ionic_mobile/src/components/SettingContainer/index.tsx
View File

@@ -1,6 +1,6 @@
import { IonButton, IonIcon, useIonRouter } from '@ionic/react';
import { arrowBack } from 'ionicons/icons';
import { LESSON_LINK, VERSIONS } from '../../constants';
import { VERSIONS } from '../../constants';
import SettingSvg from './image.svg';
import { Paths } from '../../Paths';
import { pb } from '../../lib/pb';
@@ -52,7 +52,7 @@ const SettingContainer: React.FC<ContainerProps> = ({ name }) => {
<IonButton onClick={handleUserProfileClick}>User Profile</IonButton>
<IonButton
onClick={() => {
router.push(LESSON_LINK, undefined, 'replace');
router.push(Paths.LESSON_LINK, undefined, 'replace');
}}
style={{ marginTop: '1rem' }}
>

4
002_source/ionic_mobile/src/constants.tsx
View File

@@ -25,7 +25,8 @@ const MATCHING_FRENZY_LINK = '/matching_frenzy';
const FAVORITE_LINK = '/fav';
const LESSON_WORD_PAGE_LINK = '/lesson_word_page';
const CONNECTIVE_REVISION_LINK = '/connective_revision';
const LESSON_LINK = '/lesson';
// TODO: remove me
// const LESSON_LINK_mdel = '/lesson';
const QUIZ_MAIN_MENU_LINK = '/quizzes_main_menu';
const RECORD_LINK = '/record';
const SETTING_LINK = '/setting';
@@ -119,7 +120,6 @@ export {
//
HELLOWORLD,
HELLOWORLD_MP3,
LESSON_LINK,
LESSON_WORD_PAGE_LINK,
LISTENING_PRACTICE_LINK,
LISTENING_PRACTICE_TIME_SPENT,

6
002_source/ionic_mobile/src/contexts/AppState.tsx
View File

@@ -1,14 +1,14 @@
import React, { createContext, ReactNode, useContext, useEffect, useState } from 'react';
import RemoveFavoritePrompt from '../components/RemoveFavoritePrompt';
import { LESSON_LINK } from '../constants';
import { Paths } from '../Paths';
const AppStateContext = createContext<AppStateContextProps | undefined>(undefined);
export const AppStateProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
const [my_context, setMyContext] = useState<string>('initial value');
const [tab_active, setTabActive] = useState<string>(LESSON_LINK);
const [tab_active, setTabActive] = useState<string>(Paths.LESSON_LINK);
const [show_confirm_user_exit, useShowConfirmUserExit] = useState<boolean>(false);
const [url_push_after_user_confirm, setURLPushAfterUserConfirm] = useState<string>(LESSON_LINK);
const [url_push_after_user_confirm, setURLPushAfterUserConfirm] = useState<string>(Paths.LESSON_LINK);
const [matching_frenzy_in_progress, setMatchingFrenzyInProgress] = useState<boolean>(false);
const [connective_revision_in_progress, setConnectiveRevisionInProgress] = useState<boolean>(false);

22
002_source/ionic_mobile/src/hooks/useListAllLessonTypes.tsx
View File

@@ -5,26 +5,10 @@ import { LessonsType } from '../types/LessonsTypes';
const useListAllLessonTypes = () => {
const { user, pb } = usePocketBase();
return useQuery({
queryKey: [
'useListAllLessonTypes',
'feeds',
'all',
user?.id || '',
//
],
queryKey: ['useListAllLessonTypes', 'feeds', 'all', user?.id || ''],
staleTime: 60 * 1000,
queryFn: async ({
queryKey,
}: {
queryKey: [
'useListAllLessonTypes',
'feeds',
'all',
string | null,
//
];
}) => {
console.log('calling useListAllLessonTypes');
queryFn: async ({ queryKey }: { queryKey: ['useListAllLessonTypes', 'feeds', 'all', string | null] }) => {
// console.log('calling useListAllLessonTypes');
return await pb.collection('LessonsTypes').getFullList<LessonsType>({
// TODO: sort by field -> pos
sort: 'id',

2
002_source/ionic_mobile/src/pages/Lesson/ConnectivesPage/index.tsx
View File

@@ -16,9 +16,7 @@ import Markdown from 'react-markdown';
import { useParams } from 'react-router';
import { useGlobalAudioPlayer } from 'react-use-audio-player';
import remarkGfm from 'remark-gfm';
import { LoadingScreen } from '../../../components/LoadingScreen';
import RemoveFavoritePrompt from '../../../components/RemoveFavoritePrompt';
import { LESSON_LINK } from '../../../constants';
import { useMyIonFavorite } from '../../../contexts/MyIonFavorite';
import ILesson from '../../../interfaces/ILesson';
import { listLessonContent } from '../../../public_data/listLessonContent';

5
002_source/ionic_mobile/src/pages/Lesson/WordPage/index.tsx
View File

@@ -15,7 +15,7 @@ import { useParams } from 'react-router';
import { useGlobalAudioPlayer } from 'react-use-audio-player';
import remarkGfm from 'remark-gfm';
import { LoadingScreen } from '../../../components/LoadingScreen';
import { LESSON_LINK, POCKETBASE_URL } from '../../../constants';
import { POCKETBASE_URL } from '../../../constants';
import { useMyIonFavorite } from '../../../contexts/MyIonFavorite';
//
import ILesson from '../../../interfaces/ILesson';
@@ -25,6 +25,7 @@ import { getFavLessonVocabularyLink, getLessonVocabularyLinkString } from '../..
import { AudioControls } from './AudioControls';
import useGetVocabularyRoute from '../../../hooks/useGetVocabularyRoute';
import { Vocabulary } from '../../../types/Vocabularies';
import { Paths } from '../../../Paths';
const WordPage: React.FC = () => {
const [loading, setLoading] = useState<boolean>(true);
@@ -109,7 +110,7 @@ const WordPage: React.FC = () => {
fill="clear"
color={'dark'}
onClick={() => {
router.push(`${LESSON_LINK}/a/Vocabulary`);
router.push(`${Paths.LESSON_LINK}/a/Vocabulary`);
}}
>
<IonIcon size="large" icon={arrowBackCircleOutline} />

4
002_source/ionic_mobile/src/pages/auth/StudentInfo/index.tsx
View File

@@ -14,7 +14,7 @@ import styles from './style.module.scss';
import { useParams } from 'react-router';
import { Wave } from '../../../components/Wave';
import { Paths } from '../../../Paths';
import { useEffect, useState } from 'react';
import React, { useEffect, useState } from 'react';
import { getUserMetaById } from '../../../db/UserMetas/GetById';
import { useTranslation } from 'react-i18next';
import { DBUserMeta } from '../../../db/UserMetas/type';
@@ -151,4 +151,4 @@ function StudentInfo(): React.JSX.Element {
);
}
export default StudentInfo;
export default React.memo(StudentInfo);