Relocation: move app folder content to store folder

.github/workflows/build-and-test-prs.yml

@@ -25,7 +25,7 @@ jobs:
       - name: Use NodeJs
         uses: actions/setup-node@v3
         with:
-          node-version: "20.x"
+          node-version: '20.x'
 
       - name: Install dependencies
         run: yarn install --frozen-lockfile --non-interactive

components/cards/AccountActionsCard.tsx

@@ -3,8 +3,8 @@ import { getAuth, signOut } from 'firebase/auth';
 import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/router';
 import { useState } from 'react';
-import { useDeleteUserMutation } from '../../app/api';
 import { ErrorDisplay } from '../../constants/common';
+import { useDeleteUserMutation } from '../../store/api';
 import theme from '../../styles/theme';
 import ConfirmDialog from '../forms/ConfirmDialog';
 

components/crisp/utils/createCrispProfileData.test.ts

@@ -1,7 +1,7 @@
-import { Course, Session } from '../../../app/coursesSlice';
-import { PartnerAccess } from '../../../app/partnerAccessSlice';
-import { User } from '../../../app/userSlice';
 import { STORYBLOK_STORY_STATUS } from '../../../constants/enums';
+import { Course, Session } from '../../../store/coursesSlice';
+import { PartnerAccess } from '../../../store/partnerAccessSlice';
+import { User } from '../../../store/userSlice';
 import { createCrispProfileData } from './createCrispProfileData';
 
 const user = {

components/crisp/utils/createCrispProfileData.ts

@@ -1,6 +1,6 @@
-import { Course } from '../../../app/coursesSlice';
-import { PartnerAccesses } from '../../../app/partnerAccessSlice';
 import { PROGRESS_STATUS } from '../../../constants/enums';
+import { Course } from '../../../store/coursesSlice';
+import { PartnerAccesses } from '../../../store/partnerAccessSlice';
 
 export const getAcronym = (text: string) => {
   return `${text

components/forms/AboutYouSetAForm.tsx

@@ -4,7 +4,6 @@ import axios from 'axios';
 import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';
-import { useUpdateUserMutation } from '../../app/api';
 import { EMAIL_REMINDERS_FREQUENCY } from '../../constants/enums';
 import {
   ABOUT_YOU_SETA_ERROR,
@@ -17,6 +16,7 @@ import {
   SIGNUP_SURVEY_COMPLETED,
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
+import { useUpdateUserMutation } from '../../store/api';
 import { rowStyle, scaleTitleStyle, staticFieldLabelStyle } from '../../styles/common';
 import { hashString } from '../../utils/hashString';
 import { ScaleFieldItem } from '../../utils/interfaces';

components/forms/ApplyCodeForm.tsx

@@ -2,15 +2,15 @@ import LoadingButton from '@mui/lab/LoadingButton';
 import { Box, TextField, Typography } from '@mui/material';
 import { useTranslations } from 'next-intl';
 import { useEffect, useState } from 'react';
-import { useAssignPartnerAccessMutation } from '../../app/api';
-import { PartnerAccess } from '../../app/partnerAccessSlice';
 import { PARTNER_ACCESS_CODE_STATUS } from '../../constants/enums';
 import {
   ASSIGN_NEW_PARTNER_ACCESS_ERROR,
   ASSIGN_NEW_PARTNER_ACCESS_INVALID,
   ASSIGN_NEW_PARTNER_ACCESS_REQUEST,
   ASSIGN_NEW_PARTNER_ACCESS_SUCCESS,
 } from '../../constants/events';
+import { useAssignPartnerAccessMutation } from '../../store/api';
+import { PartnerAccess } from '../../store/partnerAccessSlice';
 
 import { useTypedSelector } from '../../hooks/store';
 import { getErrorMessage } from '../../utils/errorMessage';

components/forms/CreateAccessCodeForm.tsx

@@ -12,7 +12,6 @@ import {
 import { useTranslations } from 'next-intl';
 import * as React from 'react';
 import { useState } from 'react';
-import { useAddPartnerAccessMutation } from '../../app/api';
 import { BASE_URL } from '../../constants/common';
 import { PARTNER_ACCESS_FEATURES } from '../../constants/enums';
 import {
@@ -21,6 +20,7 @@ import {
   CREATE_PARTNER_ACCESS_SUCCESS,
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
+import { useAddPartnerAccessMutation } from '../../store/api';
 import { getErrorMessage } from '../../utils/errorMessage';
 import logEvent, { getEventUserData } from '../../utils/logEvent';
 import Link from '../common/Link';

components/forms/CreatePartnerAdminForm.tsx

@@ -3,13 +3,13 @@ import { Box, Button, MenuItem, TextField, Typography } from '@mui/material';
 import { useTranslations } from 'next-intl';
 import * as React from 'react';
 import { useState } from 'react';
-import { useAddPartnerAdminMutation, useGetPartnersQuery } from '../../app/api';
 import {
   CREATE_PARTNER_ADMIN_ERROR,
   CREATE_PARTNER_ADMIN_REQUEST,
   CREATE_PARTNER_ADMIN_SUCCESS,
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
+import { useAddPartnerAdminMutation, useGetPartnersQuery } from '../../store/api';
 import { getErrorMessage } from '../../utils/errorMessage';
 import logEvent, { getEventUserData } from '../../utils/logEvent';
 

components/forms/EmailRemindersSettingsForm.tsx

@@ -17,7 +17,6 @@ import {
 import Link from 'next/link';
 import { useRouter } from 'next/router';
 import { Dispatch, SetStateAction, useCallback, useEffect, useState } from 'react';
-import { useUpdateUserMutation } from '../../app/api';
 import { ErrorDisplay } from '../../constants/common';
 import { EMAIL_REMINDERS_FREQUENCY } from '../../constants/enums';
 import {
@@ -29,6 +28,7 @@ import {
   EMAIL_REMINDERS_UNSET_SUCCESS,
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
+import { useUpdateUserMutation } from '../../store/api';
 import { rowStyle } from '../../styles/common';
 import logEvent, { getEventUserData } from '../../utils/logEvent';
 

components/forms/EmailSettingsForm.tsx

@@ -4,9 +4,9 @@ import { Checkbox, FormControl, FormControlLabel, Typography } from '@mui/materi
 import { useTranslations } from 'next-intl';
 import Link from 'next/link';
 import { useCallback, useState } from 'react';
-import { useUpdateUserMutation } from '../../app/api';
 import { ErrorDisplay } from '../../constants/common';
 import { useTypedSelector } from '../../hooks/store';
+import { useUpdateUserMutation } from '../../store/api';
 
 const formControlStyle = {
   marginY: 3,

components/forms/LoginForm.tsx

@@ -4,8 +4,6 @@ import { getAuth, signInWithEmailAndPassword } from 'firebase/auth';
 import { useTranslations } from 'next-intl';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
-import { useCreateEventLogMutation } from '../../app/api';
-import { setAuthStateLoading } from '../../app/userSlice';
 import { EVENT_LOG_NAME } from '../../constants/enums';
 import {
   GET_LOGIN_USER_ERROR,
@@ -16,6 +14,8 @@ import {
   LOGIN_SUCCESS,
 } from '../../constants/events';
 import { useAppDispatch, useTypedSelector } from '../../hooks/store';
+import { useCreateEventLogMutation } from '../../store/api';
+import { setAuthStateLoading } from '../../store/userSlice';
 import logEvent from '../../utils/logEvent';
 import Link from '../common/Link';
 

components/forms/ProfileSettingsForm.tsx

@@ -4,10 +4,10 @@ import { Box, Link, TextField, Typography } from '@mui/material';
 import { getAuth, signOut } from 'firebase/auth';
 import { useTranslations } from 'next-intl';
 import { useState } from 'react';
-import { useUpdateUserMutation } from '../../app/api';
 import { ErrorDisplay } from '../../constants/common';
 import { UPDATE_USER_ALREADY_EXISTS } from '../../constants/errors';
 import { useTypedSelector } from '../../hooks/store';
+import { useUpdateUserMutation } from '../../store/api';
 import ConfirmDialog from './ConfirmDialog';
 
 const containerStyle = {

components/forms/RegisterForm.tsx

@@ -5,12 +5,6 @@ import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/router';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
-import {
-  useAddUserMutation,
-  useGetAutomaticAccessCodeFeatureForPartnerQuery,
-  useValidateCodeMutation,
-} from '../../app/api';
-import { setUserLoading } from '../../app/userSlice';
 import { LANGUAGES, PARTNER_ACCESS_CODE_STATUS } from '../../constants/enums';
 import {
   CREATE_USER_ALREADY_EXISTS,
@@ -29,6 +23,12 @@ import {
   VALIDATE_ACCESS_CODE_SUCCESS,
 } from '../../constants/events';
 import { useAppDispatch, useTypedSelector } from '../../hooks/store';
+import {
+  useAddUserMutation,
+  useGetAutomaticAccessCodeFeatureForPartnerQuery,
+  useValidateCodeMutation,
+} from '../../store/api';
+import { setUserLoading } from '../../store/userSlice';
 import theme from '../../styles/theme';
 import { getErrorMessage } from '../../utils/errorMessage';
 import hasAutomaticAccessFeature from '../../utils/hasAutomaticAccessCodeFeature';

components/forms/UpdatePartnerAdminForm.tsx

@@ -1,3 +1,4 @@
+import LoadingButton from '@mui/lab/LoadingButton';
 import {
   Autocomplete,
   Box,
@@ -9,15 +10,14 @@ import {
   TextField,
   Typography,
 } from '@mui/material';
-import { SyntheticEvent, useEffect, useState } from 'react';
-import { GetUserDto } from '../../app/userSlice';
-import LoadingButton from '@mui/lab/LoadingButton';
 import { useTranslations } from 'next-intl';
-import { api, useUpdatePartnerAdminMutation } from '../../app/api';
-import { useAppDispatch, useTypedSelector } from '../../hooks/store';
-import logEvent, { getEventUserData } from '../../utils/logEvent';
+import { SyntheticEvent, useEffect, useState } from 'react';
 import { UPDATE_PARTNER_ADMIN, UPDATE_PARTNER_ADMIN_ERROR } from '../../constants/events';
+import { useAppDispatch, useTypedSelector } from '../../hooks/store';
+import { api, useUpdatePartnerAdminMutation } from '../../store/api';
+import { GetUserDto } from '../../store/userSlice';
 import { getErrorMessage } from '../../utils/errorMessage';
+import logEvent, { getEventUserData } from '../../utils/logEvent';
 
 const UpdatePartnerAdminForm = () => {
   const userCreatedAt = useTypedSelector((state) => state.user.createdAt);

components/forms/UpdateTherapyAdminForm.tsx

@@ -14,10 +14,10 @@ import {
 } from '@mui/material';
 import { useTranslations } from 'next-intl';
 import { SyntheticEvent, useEffect, useState } from 'react';
-import { api, useUpdatePartnerAccessMutation } from '../../app/api';
-import { GetUserDto } from '../../app/userSlice';
 import { UPDATE_THERAPY_SESSIONS, UPDATE_THERAPY_SESSIONS_ERROR } from '../../constants/events';
 import { useAppDispatch, useTypedSelector } from '../../hooks/store';
+import { api, useUpdatePartnerAccessMutation } from '../../store/api';
+import { GetUserDto } from '../../store/userSlice';
 import { getErrorMessage } from '../../utils/errorMessage';
 import logEvent, { getEventUserData } from '../../utils/logEvent';
 

components/forms/WhatsappSubscribeForm.tsx

@@ -5,14 +5,14 @@ import { phone } from 'phone';
 import * as React from 'react';
 import { useState } from 'react';
 import 'react-international-phone/style.css';
-import { useSubscribeToWhatsappMutation } from '../../app/api';
 import { WHATSAPP_SUBSCRIPTION_STATUS } from '../../constants/enums';
 import {
   WHATSAPP_SUBSCRIBE_ERROR,
   WHATSAPP_SUBSCRIBE_REQUEST,
   WHATSAPP_SUBSCRIBE_SUCCESS,
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
+import { useSubscribeToWhatsappMutation } from '../../store/api';
 import { getErrorMessage } from '../../utils/errorMessage';
 import { TextNode } from '../../utils/helper-types/translations';
 import logEvent, { getEventUserData } from '../../utils/logEvent';

components/forms/WhatsappUnsubscribeForm.tsx

@@ -3,13 +3,13 @@ import { Box, Card, CardContent, Link, TextField, Typography } from '@mui/materi
 import { useTranslations } from 'next-intl';
 import * as React from 'react';
 import { useEffect, useState } from 'react';
-import { useUnsubscribeFromWhatsappMutation } from '../../app/api';
 import {
   WHATSAPP_UNSUBSCRIBE_ERROR,
   WHATSAPP_UNSUBSCRIBE_REQUEST,
   WHATSAPP_UNSUBSCRIBE_SUCCESS,
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
+import { useUnsubscribeFromWhatsappMutation } from '../../store/api';
 import { getErrorMessage } from '../../utils/errorMessage';
 import { TextNode } from '../../utils/helper-types/translations';
 import logEvent, { getEventUserData } from '../../utils/logEvent';

components/session/SessionCompleteButton.tsx

@@ -2,12 +2,12 @@ import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import { Button, Typography } from '@mui/material';
 import { useTranslations } from 'next-intl';
 import { useState } from 'react';
-import { useCompleteSessionMutation } from '../../app/api';
 import {
   SESSION_COMPLETE_ERROR,
   SESSION_COMPLETE_REQUEST,
   SESSION_COMPLETE_SUCCESS,
 } from '../../constants/events';
+import { useCompleteSessionMutation } from '../../store/api';
 import logEvent, { EventUserData } from '../../utils/logEvent';
 
 import { Dots } from '../common/Dots';

components/session/SessionProgressDisplay.tsx

@@ -2,9 +2,9 @@ import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import DonutLargeIcon from '@mui/icons-material/DonutLarge';
 import { Box } from '@mui/material';
 import { useEffect, useState } from 'react';
-import { Course } from '../../app/coursesSlice';
 import { PROGRESS_STATUS } from '../../constants/enums';
 import { useTypedSelector } from '../../hooks/store';
+import { Course } from '../../store/coursesSlice';
 
 interface SessionProgressDisplayProps {
   sessionId: number;

components/storyblok/StoryblokSessionIbaPage.tsx

@@ -8,8 +8,6 @@ import { useTranslations } from 'next-intl';
 import Head from 'next/head';
 import { useEffect, useState } from 'react';
 import { render } from 'storyblok-rich-text-react-renderer';
-import { useStartSessionMutation } from '../../app/api';
-import { Course, Session } from '../../app/coursesSlice';
 import { PROGRESS_STATUS } from '../../constants/enums';
 import {
   SESSION_STARTED_ERROR,
@@ -21,6 +19,8 @@ import {
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
 import illustrationPerson4Peach from '../../public/illustration_person4_peach.svg';
+import { useStartSessionMutation } from '../../store/api';
+import { Course, Session } from '../../store/coursesSlice';
 import { columnStyle } from '../../styles/common';
 import theme from '../../styles/theme';
 import hasAccessToPage from '../../utils/hasAccessToPage';

components/storyblok/StoryblokSessionPage.tsx

@@ -9,8 +9,6 @@ import { useTranslations } from 'next-intl';
 import Head from 'next/head';
 import { useEffect, useState } from 'react';
 import { render } from 'storyblok-rich-text-react-renderer';
-import { useStartSessionMutation } from '../../app/api';
-import { Course, Session } from '../../app/coursesSlice';
 import SessionContentCard from '../../components/cards/SessionContentCard';
 import Link from '../../components/common/Link';
 import CrispButton from '../../components/crisp/CrispButton';
@@ -29,6 +27,8 @@ import {
 } from '../../constants/events';
 import { useTypedSelector } from '../../hooks/store';
 import illustrationPerson4Peach from '../../public/illustration_person4_peach.svg';
+import { useStartSessionMutation } from '../../store/api';
+import { Course, Session } from '../../store/coursesSlice';
 import { columnStyle } from '../../styles/common';
 import theme from '../../styles/theme';
 import { courseIsLiveNow, courseIsLiveSoon } from '../../utils/courseLiveStatus';

components/storyblok/StoryblokWelcomePage.tsx

@@ -5,7 +5,6 @@ import Head from 'next/head';
 import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';
 import { render } from 'storyblok-rich-text-react-renderer';
-import { useGetAutomaticAccessCodeFeatureForPartnerQuery } from '../../app/api';
 import Link from '../../components/common/Link';
 import WelcomeCodeForm from '../../components/forms/WelcomeCodeForm';
 import PartnerHeader from '../../components/layout/PartnerHeader';
@@ -20,6 +19,7 @@ import { PartnerContent, getPartnerContent } from '../../constants/partners';
 import { useTypedSelector } from '../../hooks/store';
 import illustrationBloomHeadYellow from '../../public/illustration_bloom_head_yellow.svg';
 import welcomeToBloom from '../../public/welcome_to_bloom.svg';
+import { useGetAutomaticAccessCodeFeatureForPartnerQuery } from '../../store/api';
 import { rowStyle } from '../../styles/common';
 import hasAutomaticAccessFeature from '../../utils/hasAutomaticAccessCodeFeature';
 import logEvent, { getEventUserData } from '../../utils/logEvent';

config/simplybook.ts

@@ -1,4 +1,4 @@
-import { User } from '../app/userSlice';
+import { User } from '../store/userSlice';
 
 // Simplybook hardcodes additional field IDs
 const userIdFieldId =

docs/key-concepts.md

@@ -32,7 +32,7 @@ There are several user types with different features enabled - [guards](guards)
 
 ### State management - Redux Toolkit
 
-RTK is used to store state, mostly related to the user and populated by backend api calls. The `user/me` endpoint populates the `User`, `Courses`, `PartnerAccess` and `ParterAdmin` state on login or app refresh, to be used across the app to manage access and features displayed. State is also updated following actions/apis calls - we use [RTK Query](https://redux-toolkit.js.org/rtk-query/overview) to fetch and cache data into state, see `app/api.ts`. The state slices generally copy the [database schemas](https://github.com/chaynHQ/bloom-backend#database-models). Note the `Courses` slice does not act as a cache for storing retrieved storyblok courses, instead it stores the user's courses progress, i.e. the backend `CourseUser` table.
+RTK is used to store state, mostly related to the user and populated by backend api calls. The `user/me` endpoint populates the `User`, `Courses`, `PartnerAccess` and `ParterAdmin` state on login or app refresh, to be used across the app to manage access and features displayed. State is also updated following actions/apis calls - we use [RTK Query](https://redux-toolkit.js.org/rtk-query/overview) to fetch and cache data into state, see `store/api.ts`. The state slices generally copy the [database schemas](https://github.com/chaynHQ/bloom-backend#database-models). Note the `Courses` slice does not act as a cache for storing retrieved storyblok courses, instead it stores the user's courses progress, i.e. the backend `CourseUser` table.
 
 ### Internationalisation
 

hooks/store.ts

@@ -1,11 +1,11 @@
 import { useCallback } from 'react';
 import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
-import { api } from '../app/api';
-import { clearCoursesSlice } from '../app/coursesSlice';
-import { clearPartnerAccessesSlice } from '../app/partnerAccessSlice';
-import { clearPartnerAdminSlice } from '../app/partnerAdminSlice';
-import type { AppDispatch, AppState } from '../app/store';
-import { clearUserSlice } from '../app/userSlice';
+import { api } from '../store/api';
+import { clearCoursesSlice } from '../store/coursesSlice';
+import { clearPartnerAccessesSlice } from '../store/partnerAccessSlice';
+import { clearPartnerAdminSlice } from '../store/partnerAdminSlice';
+import type { AppDispatch, AppState } from '../store/store';
+import { clearUserSlice } from '../store/userSlice';
 
 export const useTypedSelector: TypedUseSelectorHook<AppState> = useSelector;
 export const useAppDispatch = () => useDispatch<AppDispatch>();

hooks/useLoadUser.ts

@@ -2,8 +2,6 @@
 
 import { getAuth, onIdTokenChanged, signOut } from 'firebase/auth';
 import { useEffect, useState } from 'react';
-import { useCreateEventLogMutation, useGetUserQuery } from '../app/api';
-import { setAuthStateLoading, setLoadError, setUserLoading, setUserToken } from '../app/userSlice';
 import { EVENT_LOG_NAME } from '../constants/enums';
 import {
   GET_AUTH_USER_ERROR,
@@ -14,6 +12,13 @@ import {
   LOGOUT_FORCED,
   LOGOUT_SUCCESS,
 } from '../constants/events';
+import { useCreateEventLogMutation, useGetUserQuery } from '../store/api';
+import {
+  setAuthStateLoading,
+  setLoadError,
+  setUserLoading,
+  setUserToken,
+} from '../store/userSlice';
 import { getErrorMessage } from '../utils/errorMessage';
 import logEvent, { getEventUserResponseData } from '../utils/logEvent';
 import { useAppDispatch, useStateUtils, useTypedSelector } from './store';

next-env.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/basic-features/typescript for more information.