diff --git a/client/eslint.config.js b/client/eslint.config.js index 07a47438..452bbf12 100644 --- a/client/eslint.config.js +++ b/client/eslint.config.js @@ -8,48 +8,48 @@ import reactRefresh from 'eslint-plugin-react-refresh' import eslintConfigPrettier from 'eslint-config-prettier' export default [ - js.configs.recommended, - { - files: ['**/*.{js,jsx}'], - ignores: ['dist/**/*', 'old/**/*'], + js.configs.recommended, + { + files: ['**/*.{js,jsx}'], + ignores: ['dist/**/*', 'old/**/*'], - languageOptions: { - ecmaVersion: 2020, - globals: globals.browser, - parser: eslintParser, - parserOptions: { - babelrc: false, - configFile: false, - // your babel options - presets: ['@babel/preset-env'], - }, - }, - settings: { react: { version: '18.3' } }, - plugins: { - react, - require, - 'react-hooks': reactHooks, - 'react-refresh': reactRefresh, - }, - rules: { - ...js.configs.recommended.rules, - ...react.configs.recommended.rules, - ...react.configs['jsx-runtime'].rules, - ...reactHooks.configs.recommended.rules, - 'no-unused-vars': [ - 'warn', - { - vars: 'all', - args: 'after-used', - caughtErrors: 'all', - ignoreRestSiblings: false, - reportUsedIgnorePattern: false, - }, - ], - 'react/jsx-no-target-blank': 'off', - 'react/prop-types': 'off', - 'react-refresh/only-export-components': ['warn', { allowConstantExport: true }], - }, - }, - eslintConfigPrettier, + languageOptions: { + ecmaVersion: 2020, + globals: globals.browser, + parser: eslintParser, + parserOptions: { + babelrc: false, + configFile: false, + // your babel options + presets: ['@babel/preset-env'] + } + }, + settings: { react: { version: '18.3' } }, + plugins: { + react, + require, + 'react-hooks': reactHooks, + 'react-refresh': reactRefresh + }, + rules: { + ...js.configs.recommended.rules, + ...react.configs.recommended.rules, + ...react.configs['jsx-runtime'].rules, + ...reactHooks.configs.recommended.rules, + 'no-unused-vars': [ + 'warn', + { + vars: 'all', + args: 'after-used', + caughtErrors: 'all', + ignoreRestSiblings: false, + reportUsedIgnorePattern: false + } + ], + 'react/jsx-no-target-blank': 'off', + 'react/prop-types': 'off', + 'react-refresh/only-export-components': ['warn', { allowConstantExport: true }] + } + }, + eslintConfigPrettier ] diff --git a/client/prettier.config.js b/client/prettier.config.js index 2fde698c..594d1cb6 100644 --- a/client/prettier.config.js +++ b/client/prettier.config.js @@ -5,15 +5,15 @@ * @type {import("prettier").Config} */ const config = { - $schema: 'http://json.schemastore.org/prettierrc', - bracketSpacing: true, - printWidth: 500, - proseWrap: 'always', - semi: false, - singleQuote: true, - tabWidth: 4, - trailingComma: 'es5', - useTabs: true, + $schema: 'http://json.schemastore.org/prettierrc', + bracketSpacing: true, + printWidth: 500, + proseWrap: 'always', + semi: false, + singleQuote: true, + tabWidth: 4, + trailingComma: 'es5', + useTabs: true } export default config diff --git a/client/src/App.jsx b/client/src/App.jsx index 2f534416..ad8dac17 100644 --- a/client/src/App.jsx +++ b/client/src/App.jsx @@ -7,34 +7,34 @@ import { SnackbarProvider, ThemeProvider } from './providers' // import { GoogleOAuthProvider } from '@react-oauth/google' const MemoriesApp = () => { - // [System.Environment]::SetEnvironmentVariable("NODE_ENV","development","User") - const appEnviromnent = import.meta.env.MODE || 'development' + // [System.Environment]::SetEnvironmentVariable("NODE_ENV","development","User") + const appEnviromnent = import.meta.env.MODE || 'development' - console.log(`App Environment: ${appEnviromnent}\n`, import.meta.env) - return ( - - - - - - - {!(appEnviromnent === 'production') && } - - - ) + console.log(`App Environment: ${appEnviromnent}\n`, import.meta.env) + return ( + + + + + + + {!(appEnviromnent === 'production') && } + + + ) } const App = () => { - return ( - - - {/* */} - - - - {/* */} - - ) + return ( + + + {/* */} + + + + {/* */} + + ) } export default App diff --git a/client/src/actions/auth.js b/client/src/actions/auth.js index 8a3d23dc..b85bd24a 100644 --- a/client/src/actions/auth.js +++ b/client/src/actions/auth.js @@ -2,60 +2,60 @@ import { AUTH } from '../constants/actionTypes' import * as api from '../api' export const signin = (formData, history, snackBar) => async (dispatch) => { - try { - // log in the user ... - const { data } = await api.signIn(formData) - dispatch({ type: AUTH, data }) - snackBar('success', 'Logged in Successfully') - history('/') - } catch (error) { - snackBar('error', error.response.data.message) - } + try { + // log in the user ... + const { data } = await api.signIn(formData) + dispatch({ type: AUTH, data }) + snackBar('success', 'Logged in Successfully') + history('/') + } catch (error) { + snackBar('error', error.response.data.message) + } } export const googleSignIn = (formData, history, snackBar) => async (dispatch) => { - try { - await api.googleSignIn(formData.result) - dispatch({ type: AUTH, data: formData }) - history('/') - snackBar('success', 'Logged in Successfully') - } catch (error) { - snackBar('error', error.response.data.message) - } + try { + await api.googleSignIn(formData.result) + dispatch({ type: AUTH, data: formData }) + history('/') + snackBar('success', 'Logged in Successfully') + } catch (error) { + snackBar('error', error.response.data.message) + } } export const signup = (formData, history, snackBar) => async (dispatch) => { - try { - // sign up the user ... - const { data } = await api.signUp(formData) - dispatch({ type: AUTH, data }) - snackBar('success', 'Registration Successful ! Welcome to memories') - history('/') - } catch (error) { - snackBar('error', error.response.data.message) - } + try { + // sign up the user ... + const { data } = await api.signUp(formData) + dispatch({ type: AUTH, data }) + snackBar('success', 'Registration Successful ! Welcome to memories') + history('/') + } catch (error) { + snackBar('error', error.response.data.message) + } } export const forgotPassword = (formData, history, snackBar, setLoading) => async () => { - try { - await api.sendResetLink(formData) - snackBar('success', 'Reset Link sent to your Email. Now Reset Password') - setLoading(false) - history('/') - } catch (error) { - snackBar('error', error.response.data.message) - console.log(`error: ${error.response.data.error}`) - } - setLoading(false) + try { + await api.sendResetLink(formData) + snackBar('success', 'Reset Link sent to your Email. Now Reset Password') + setLoading(false) + history('/') + } catch (error) { + snackBar('error', error.response.data.message) + console.log(`error: ${error.response.data.error}`) + } + setLoading(false) } export const setNewPassword = (formData, history, snackBar, setLoading) => async () => { - try { - await api.setNewPassword(formData) - snackBar('success', 'Password was successfully reset. Now Log in') - setLoading(false) - history('/') - } catch (error) { - snackBar('error', error.response.data.message) - } - setLoading(false) + try { + await api.setNewPassword(formData) + snackBar('success', 'Password was successfully reset. Now Log in') + setLoading(false) + history('/') + } catch (error) { + snackBar('error', error.response.data.message) + } + setLoading(false) } diff --git a/client/src/actions/posts.js b/client/src/actions/posts.js index 5620e099..24a9d926 100644 --- a/client/src/actions/posts.js +++ b/client/src/actions/posts.js @@ -1,193 +1,193 @@ import { - // - FETCHING_RECOMMENDED_POSTS, - FETCH_RECOMMENDED, - FETCHED_RECOMMENDED_POSTS, - FETCH_ALL, - FETCH_BY_SEARCH, - USER_DETAILS, - CREATE, - UPDATE, - DELETE, - START_LOADING, - END_LOADING, - FETCH_POST, - CREATED_POST, - CREATING_POST, - DELETING_POST, - DELETED_POST, - FETCHING_COMMENTS, - FETCHED_COMMENTS, - FETCH_COMMENTS, + // + FETCHING_RECOMMENDED_POSTS, + FETCH_RECOMMENDED, + FETCHED_RECOMMENDED_POSTS, + FETCH_ALL, + FETCH_BY_SEARCH, + USER_DETAILS, + CREATE, + UPDATE, + DELETE, + START_LOADING, + END_LOADING, + FETCH_POST, + CREATED_POST, + CREATING_POST, + DELETING_POST, + DELETED_POST, + FETCHING_COMMENTS, + FETCHED_COMMENTS, + FETCH_COMMENTS } from '../constants/actionTypes' import * as api from '../api' const sanitize = ({ tags, search }) => { - return { - tags: tags.replace(/#/g, '%23').replace(/ /g, '%20'), - search: search?.replace(/#/g, '%23').replace(/ /g, '%20'), - } + return { + tags: tags.replace(/#/g, '%23').replace(/ /g, '%20'), + search: search?.replace(/#/g, '%23').replace(/ /g, '%20') + } } // Action Creators export const getPosts = (page, snackBar) => async (dispatch) => { - try { - dispatch({ type: START_LOADING }) - const { - data: { data, curretPage: currentPage, numberOfPages }, - } = await api.fetchPosts(page) - dispatch({ - type: FETCH_ALL, - payload: { data, currentPage: currentPage, numberOfPages }, - }) - dispatch({ type: END_LOADING }) - } catch (error) { - if (typeof error === 'object') { - snackBar('warning', `${error.message}: Please refresh after some time`) - dispatch({ type: END_LOADING }) - } else { - snackBar('error', error) - } - } + try { + dispatch({ type: START_LOADING }) + const { + data: { data, curretPage: currentPage, numberOfPages } + } = await api.fetchPosts(page) + dispatch({ + type: FETCH_ALL, + payload: { data, currentPage, numberOfPages } + }) + dispatch({ type: END_LOADING }) + } catch (error) { + if (typeof error === 'object') { + snackBar('warning', `${error.message}: Please refresh after some time`) + dispatch({ type: END_LOADING }) + } else { + snackBar('error', error) + } + } } export const getUserDetails = (userId, snackBar) => async (dispatch) => { - try { - dispatch({ type: START_LOADING }) - const { data } = await api.userDetails(userId) - dispatch({ type: USER_DETAILS, payload: { data: data } }) - dispatch({ type: END_LOADING }) - } catch (error) { - if (typeof error === 'object') { - snackBar('warning', `${error.message}: Please Try again`) - dispatch({ type: END_LOADING }) - } else { - snackBar('error', error) - } - } + try { + dispatch({ type: START_LOADING }) + const { data } = await api.userDetails(userId) + dispatch({ type: USER_DETAILS, payload: { data } }) + dispatch({ type: END_LOADING }) + } catch (error) { + if (typeof error === 'object') { + snackBar('warning', `${error.message}: Please Try again`) + dispatch({ type: END_LOADING }) + } else { + snackBar('error', error) + } + } } export const getUserPostsByType = (userId, page, type) => async (dispatch) => { - const upperType = type.toUpperCase() - const fetchingType = `FETCHING_${upperType}_POSTS` - const fetchType = `FETCH_${upperType}` - const fetchedType = `FETCHED_${upperType}_POSTS` + const upperType = type.toUpperCase() + const fetchingType = `FETCHING_${upperType}_POSTS` + const fetchType = `FETCH_${upperType}` + const fetchedType = `FETCHED_${upperType}_POSTS` - try { - dispatch({ type: fetchingType }) - const { - data: { data, numberOfPages }, - } = await api.fetchUserPostsByType(userId, page, type) - dispatch({ type: fetchType, payload: { data, numberOfPages } }) - dispatch({ type: fetchedType }) - } catch (error) { - console.log(error) - } + try { + dispatch({ type: fetchingType }) + const { + data: { data, numberOfPages } + } = await api.fetchUserPostsByType(userId, page, type) + dispatch({ type: fetchType, payload: { data, numberOfPages } }) + dispatch({ type: fetchedType }) + } catch (error) { + console.log(error) + } } export const getUserComments = (userId, page) => async (dispatch) => { - try { - dispatch({ type: FETCHING_COMMENTS }) - const { - data: { data, numberOfPages }, - } = await api.fetchUserComments(userId, page) + try { + dispatch({ type: FETCHING_COMMENTS }) + const { + data: { data, numberOfPages } + } = await api.fetchUserComments(userId, page) - dispatch({ - type: FETCH_COMMENTS, - payload: { comments: data, numberOfPages }, - }) - dispatch({ type: FETCHED_COMMENTS }) - } catch (error) { - console.log(error) - } + dispatch({ + type: FETCH_COMMENTS, + payload: { comments: data, numberOfPages } + }) + dispatch({ type: FETCHED_COMMENTS }) + } catch (error) { + console.log(error) + } } export const getPost = (id, history, snackBar) => async (dispatch) => { - try { - dispatch({ type: START_LOADING }) - const { data } = await api.fetchPost(id) - dispatch({ type: FETCH_POST, payload: { post: data } }) - dispatch({ type: END_LOADING }) - } catch (error) { - if (typeof error === 'object') { - snackBar('warning', `${error.message}: Please Try again`) - dispatch({ type: END_LOADING }) - } else { - snackBar('error', error.response.data) - history('/') - } - } + try { + dispatch({ type: START_LOADING }) + const { data } = await api.fetchPost(id) + dispatch({ type: FETCH_POST, payload: { post: data } }) + dispatch({ type: END_LOADING }) + } catch (error) { + if (typeof error === 'object') { + snackBar('warning', `${error.message}: Please Try again`) + dispatch({ type: END_LOADING }) + } else { + snackBar('error', error.response.data) + history('/') + } + } } export const getPostsBySearch = (searchQuery) => async (dispatch) => { - searchQuery = sanitize(searchQuery) - try { - dispatch({ type: START_LOADING }) - const { - data: { data }, - } = await api.fetchPostsBySearch(searchQuery) - dispatch({ type: FETCH_BY_SEARCH, payload: { data } }) - dispatch({ type: END_LOADING }) - } catch (error) { - console.log(error) - } + searchQuery = sanitize(searchQuery) + try { + dispatch({ type: START_LOADING }) + const { + data: { data } + } = await api.fetchPostsBySearch(searchQuery) + dispatch({ type: FETCH_BY_SEARCH, payload: { data } }) + dispatch({ type: END_LOADING }) + } catch (error) { + console.log(error) + } } export const getRecommendedPosts = (tags) => async (dispatch) => { - tags = sanitize({ tags }).tags - try { - dispatch({ type: FETCHING_RECOMMENDED_POSTS }) - const { - data: { data }, - } = await api.fetchPostsBySearch({ tags: tags }) - dispatch({ type: FETCH_RECOMMENDED, payload: { data } }) - dispatch({ type: FETCHED_RECOMMENDED_POSTS }) - } catch (error) { - console.log(error) - } + tags = sanitize({ tags }).tags + try { + dispatch({ type: FETCHING_RECOMMENDED_POSTS }) + const { + data: { data } + } = await api.fetchPostsBySearch({ tags }) + dispatch({ type: FETCH_RECOMMENDED, payload: { data } }) + dispatch({ type: FETCHED_RECOMMENDED_POSTS }) + } catch (error) { + console.log(error) + } } export const createPost = (post, history, snackBar, callBack) => async (dispatch) => { - try { - dispatch({ type: CREATING_POST }) - const { data } = await api.createPost(post) - dispatch({ type: CREATE, payload: data }) - history(`/posts/${data._id}`) - snackBar('success', 'Post created successfully') - dispatch({ type: CREATED_POST }) - } catch (error) { - if (typeof error === 'object') { - snackBar('warning', `${error.message}: Please Try again`) - dispatch({ type: END_LOADING }) - } else { - snackBar('error', error.response.data) - history('/') - } - dispatch({ type: CREATED_POST }) - } - callBack() + try { + dispatch({ type: CREATING_POST }) + const { data } = await api.createPost(post) + dispatch({ type: CREATE, payload: data }) + history(`/posts/${data._id}`) + snackBar('success', 'Post created successfully') + dispatch({ type: CREATED_POST }) + } catch (error) { + if (typeof error === 'object') { + snackBar('warning', `${error.message}: Please Try again`) + dispatch({ type: END_LOADING }) + } else { + snackBar('error', error.response.data) + history('/') + } + dispatch({ type: CREATED_POST }) + } + callBack() } export const updatePost = (id, post, snackBar, clear) => async (dispatch) => { - try { - await api.updatePost(id, post) - dispatch({ type: UPDATE, payload: post }) - if (snackBar) snackBar('info', 'Post updated successfully') - clear() - } catch (error) { - snackBar('error', error) - } + try { + await api.updatePost(id, post) + dispatch({ type: UPDATE, payload: post }) + if (snackBar) snackBar('info', 'Post updated successfully') + clear() + } catch (error) { + snackBar('error', error) + } } export const deletePost = (id, snackBar, callBack) => async (dispatch) => { - try { - dispatch({ type: DELETING_POST }) - await api.deletePost(id) - dispatch({ type: DELETE, payload: id }) - dispatch({ type: DELETED_POST }) - location.reload() - snackBar('info', 'Post deleted successfully') - } catch (error) { - snackBar('error', error) - } - callBack(false) + try { + dispatch({ type: DELETING_POST }) + await api.deletePost(id) + dispatch({ type: DELETE, payload: id }) + dispatch({ type: DELETED_POST }) + location.reload() + snackBar('info', 'Post deleted successfully') + } catch (error) { + snackBar('error', error) + } + callBack(false) } diff --git a/client/src/components/AccountMenu.jsx b/client/src/components/AccountMenu.jsx index 530f8810..e1a0bcd8 100644 --- a/client/src/components/AccountMenu.jsx +++ b/client/src/components/AccountMenu.jsx @@ -13,105 +13,105 @@ import Logout from '@mui/icons-material/Logout' import { ChevronRight, Computer } from '@mui/icons-material' const AccountMenu = () => { - const [anchorEl, setAnchorEl] = React.useState(null) - const open = Boolean(anchorEl) - const handleClick = (event) => { - setAnchorEl(event.currentTarget) - } - const handleClose = () => { - setAnchorEl(null) - } - return ( - - - - - M - - - - - - Profile - - - My account - - - - - - - Add another account - - - - - - Settings - - -
- - - - Theme -
- - - - - - - - - Logout - - - - ) + const [anchorEl, setAnchorEl] = React.useState(null) + const open = Boolean(anchorEl) + const handleClick = (event) => { + setAnchorEl(event.currentTarget) + } + const handleClose = () => { + setAnchorEl(null) + } + return ( + <> + + + + M + + + + + + Profile + + + My account + + + + + + + Add another account + + + + + + Settings + + +
+ + + + Theme +
+ + + + + + + + + Logout + + + + ) } export default AccountMenu diff --git a/client/src/components/AppRouter.jsx b/client/src/components/AppRouter.jsx index e76a74c5..316e7d3b 100644 --- a/client/src/components/AppRouter.jsx +++ b/client/src/components/AppRouter.jsx @@ -1,43 +1,43 @@ import { Routes, Route, useLocation, Navigate } from 'react-router-dom' import { lazy, Suspense } from 'react' + +import { AuthRoute, PrivateRoute } from '../routes' // import { Posts, LogIn, NotFound, SignUp, ForgotPassword, ResetPassword, Profile, Playground, Post, UpdateUser } from '../pages' // const Posts = lazy(() => import('../pages/Posts')) // const LogIn = lazy(() => import('../pages/LogIn')) const { Posts, LogIn, NotFound, SignUp, ForgotPassword, ResetPassword, Profile, Playground, Post, UpdateUser } = { - Posts: lazy(() => import('../pages/Posts')), - LogIn: lazy(() => import('../pages/LogIn')), - NotFound: lazy(() => import('../pages/NotFound')), - SignUp: lazy(() => import('../pages/SignUp')), - ForgotPassword: lazy(() => import('../pages/ForgotPassword')), - ResetPassword: lazy(() => import('../pages/ResetPassword')), - Profile: lazy(() => import('../pages/Profile')), - Playground: lazy(() => import('../pages/Playground')), - Post: lazy(() => import('../pages/Post')), - UpdateUser: lazy(() => import('../pages/UpdateUser')), + Posts: lazy(() => import('../pages/Posts')), + LogIn: lazy(() => import('../pages/LogIn')), + NotFound: lazy(() => import('../pages/NotFound')), + SignUp: lazy(() => import('../pages/SignUp')), + ForgotPassword: lazy(() => import('../pages/ForgotPassword')), + ResetPassword: lazy(() => import('../pages/ResetPassword')), + Profile: lazy(() => import('../pages/Profile')), + Playground: lazy(() => import('../pages/Playground')), + Post: lazy(() => import('../pages/Post')), + UpdateUser: lazy(() => import('../pages/UpdateUser')) } -import { AuthRoute, PrivateRoute } from '../routes' - const AppRouter = () => { - const location = useLocation() - return ( - Loading...}> - - } /> - } /> - } /> - } /> - } />} /> - } />} /> - } /> - } />} /> - } />} /> - } />} /> - } />} /> - } /> - - - ) + const location = useLocation() + return ( + Loading...}> + + } /> + } /> + } /> + } /> + } />} /> + } />} /> + } /> + } />} /> + } />} /> + } />} /> + } />} /> + } /> + + + ) } export default AppRouter diff --git a/client/src/components/Bottombar.jsx b/client/src/components/Bottombar.jsx index 1f18dc91..be3c37e8 100644 --- a/client/src/components/Bottombar.jsx +++ b/client/src/components/Bottombar.jsx @@ -2,39 +2,39 @@ import { Add } from '@mui/icons-material' import { Avatar, BottomNavigation, BottomNavigationAction } from '@mui/material' const Bottombar = () => { - return ( - - - - + return ( + + + + } - /> - - ) + /> + + ) } export default Bottombar diff --git a/client/src/components/Forms/CreateComment.jsx b/client/src/components/Forms/CreateComment.jsx index ae0f3585..f66b780e 100644 --- a/client/src/components/Forms/CreateComment.jsx +++ b/client/src/components/Forms/CreateComment.jsx @@ -1,5 +1,5 @@ const CreateComment = () => { - return
CreateComment
+ return
CreateComment
} export default CreateComment diff --git a/client/src/components/Forms/CreatePost.jsx b/client/src/components/Forms/CreatePost.jsx index 910969ef..4a3bc11a 100644 --- a/client/src/components/Forms/CreatePost.jsx +++ b/client/src/components/Forms/CreatePost.jsx @@ -1,59 +1,58 @@ -import { Box, Button, FormGroup, Paper, TextField, Typography } from '@mui/material' -import { FormControl } from '@mui/material' +import { Box, Button, FormGroup, Paper, TextField, Typography, FormControl } from '@mui/material' // import { useState } from 'react' // import { MuiChipsInput } from 'mui-chips-input' const CreatePost = () => { - // const [chips, setChips] = useState([]) - // const handleChange = (newChips) => { - // setChips(newChips) - // } - return ( - -
- Create a Post - - - - - - - - - - {/* */} - {/* } MenuProps={MenuProps}> {names.map((name) => ( {name} ))} */} - - - - -
- - ) + + + + + + + ) } export default CreatePost diff --git a/client/src/components/Forms/ForgotPassword.jsx b/client/src/components/Forms/ForgotPassword.jsx index 4c451b0e..df9b51c3 100644 --- a/client/src/components/Forms/ForgotPassword.jsx +++ b/client/src/components/Forms/ForgotPassword.jsx @@ -1,5 +1,5 @@ const ForgotPassword = () => { - return
ForgotPassword
+ return
ForgotPassword
} export default ForgotPassword diff --git a/client/src/components/Forms/LogIn.jsx b/client/src/components/Forms/LogIn.jsx index 29677c8a..ace932a8 100644 --- a/client/src/components/Forms/LogIn.jsx +++ b/client/src/components/Forms/LogIn.jsx @@ -4,72 +4,72 @@ import { useState } from 'react' import { Link } from 'react-router-dom' const LogIn = () => { - const [checked, setChecked] = useState(true) - return ( - -
- - - - WELCOME BACK - - - - - - - - - - - - - - - - - + const [checked, setChecked] = useState(true) + return ( + + + + + + WELCOME BACK + + + + + + + + + + + + + + + + + - - - - - - - ) + + + +
+ + + ) } export default LogIn diff --git a/client/src/components/Forms/ResetPassword.jsx b/client/src/components/Forms/ResetPassword.jsx index ecbdd3b9..a3a75e2b 100644 --- a/client/src/components/Forms/ResetPassword.jsx +++ b/client/src/components/Forms/ResetPassword.jsx @@ -1,5 +1,5 @@ const ResetPassword = () => { - return
ResetPassword
+ return
ResetPassword
} export default ResetPassword diff --git a/client/src/components/Forms/Search.jsx b/client/src/components/Forms/Search.jsx index ef385103..984ca45c 100644 --- a/client/src/components/Forms/Search.jsx +++ b/client/src/components/Forms/Search.jsx @@ -4,75 +4,75 @@ import { useState } from 'react' const ITEM_HEIGHT = 48 const ITEM_PADDING_TOP = 8 const MenuProps = { - PaperProps: { - style: { - maxHeight: ITEM_HEIGHT * 4.5 + ITEM_PADDING_TOP, - width: 250, - }, - }, + PaperProps: { + style: { + maxHeight: ITEM_HEIGHT * 4.5 + ITEM_PADDING_TOP, + width: 250 + } + } } const names = ['Oliver Hansen', 'Van Henry', 'April Tucker', 'Ralph Hubbard', 'Omar Alexander', 'Carlos Abbott', 'Miriam Wagner', 'Bradley Wilkerson', 'Virginia Andrews', 'Kelly Snyder'] -function getStyles(name, personName, theme) { - return { - fontWeight: personName.indexOf(name) === -1 ? theme.typography.fontWeightRegular : theme.typography.fontWeightMedium, - } +function getStyles (name, personName, theme) { + return { + fontWeight: personName.indexOf(name) === -1 ? theme.typography.fontWeightRegular : theme.typography.fontWeightMedium + } } const Search = () => { - const theme = useTheme() - const [personName, setPersonName] = useState([]) - const handleChange = (event) => { - const { - target: { value }, - } = event - setPersonName( - // On autofill we get a stringified value. - typeof value === 'string' ? value.split(',') : value - ) - } + const theme = useTheme() + const [personName, setPersonName] = useState([]) + const handleChange = (event) => { + const { + target: { value } + } = event + setPersonName( + // On autofill we get a stringified value. + typeof value === 'string' ? value.split(',') : value + ) + } - return ( - -
{}} - > -
- - - - - Search Tags - - -
- -
- - ) + return ( + +
{}} + > +
+ + + + + Search Tags + + +
+ +
+ + ) } export default Search diff --git a/client/src/components/Forms/SignUp.jsx b/client/src/components/Forms/SignUp.jsx index 95b0e2c6..e5bf9292 100644 --- a/client/src/components/Forms/SignUp.jsx +++ b/client/src/components/Forms/SignUp.jsx @@ -3,59 +3,59 @@ import { Box, Button, ButtonGroup, FormGroup, Paper, TextField, Typography, Avat import { Link } from 'react-router-dom' const SignUp = () => { - return ( - -
- - - - JOIN US NOW - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - ) + return ( + +
+ + + + JOIN US NOW + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + ) } export default SignUp diff --git a/client/src/components/Forms/UpdateProfile.jsx b/client/src/components/Forms/UpdateProfile.jsx index be6ecc35..e478aa4e 100644 --- a/client/src/components/Forms/UpdateProfile.jsx +++ b/client/src/components/Forms/UpdateProfile.jsx @@ -1,5 +1,5 @@ const UpdateProfile = () => { - return
UpdateProfile
+ return
UpdateProfile
} export default UpdateProfile diff --git a/client/src/components/Navbar.jsx b/client/src/components/Navbar.jsx index ad1dfb6a..aacf70dd 100644 --- a/client/src/components/Navbar.jsx +++ b/client/src/components/Navbar.jsx @@ -9,84 +9,84 @@ import logo from '../images/memories.png' import SideBar from './Sidebar' const Navbar = () => { - const [open, setOpen] = useState(false) + const [open, setOpen] = useState(false) - const location = useLocation() - const inAuth = ['/login', '/signup', '/forgot-password', '/reset-password'].includes(location.pathname) - const { user } = useSelector((state) => state.authReducer) - // const user = {} - return ( - - - - - - - - - - - - logo - - + const location = useLocation() + const inAuth = ['/login', '/signup', '/forgot-password', '/reset-password'].includes(location.pathname) + const { user } = useSelector((state) => state.authReducer) + // const user = {} + return ( + + + + + + + + + + + + logo + + - {!user && !inAuth && ( - - - - - )} + {!user && !inAuth && ( + + + + + )} - {user && } - - - - - ) + {user && } + + + + + ) } export default Navbar diff --git a/client/src/components/PlaygroundFab.jsx b/client/src/components/PlaygroundFab.jsx index 6c472b39..a955b474 100644 --- a/client/src/components/PlaygroundFab.jsx +++ b/client/src/components/PlaygroundFab.jsx @@ -3,35 +3,37 @@ import { Box, Fab, Fade, SvgIcon } from '@mui/material' import { Link, useLocation } from 'react-router-dom' import { SiReact } from '@icons-pack/react-simple-icons' const PlaygroundFab = () => { - const { pathname } = useLocation() - const destination = pathname === '/playground' ? '/' : '/playground' - return ( - - - - {pathname === '/playground' ? ( - - ) : ( - - - - )} - - - - ) + const { pathname } = useLocation() + const destination = pathname === '/playground' ? '/' : '/playground' + return ( + + + + {pathname === '/playground' + ? ( + + ) + : ( + + + + )} + + + + ) } export default PlaygroundFab diff --git a/client/src/components/PostCard.jsx b/client/src/components/PostCard.jsx index 172795bb..63544e77 100644 --- a/client/src/components/PostCard.jsx +++ b/client/src/components/PostCard.jsx @@ -4,111 +4,111 @@ import { Delete, MoreVert, Person, Share, ThumbUpOutlined } from '@mui/icons-mat import { Card, CardActions, CardContent, CardMedia, Button, Typography, CardActionArea, CardHeader, Avatar, IconButton, Menu, MenuItem, ListItemText, ListItemIcon } from '@mui/material' const PostCard = () => { - const [anchorEl, setAnchorEl] = useState(null) - const [open, setOpen] = useState(false) - const handleClick = (event) => { - setAnchorEl(event.currentTarget) - setOpen(!open) - } - return ( - - - - + const [anchorEl, setAnchorEl] = useState(null) + const [open, setOpen] = useState(false) + const handleClick = (event) => { + setAnchorEl(event.currentTarget) + setOpen(!open) + } + return ( + + + + } - action={ - - - setOpen(false)} - MenuListProps={{ - 'aria-labelledby': 'basic-button', - }} - anchorOrigin={{ - vertical: 'bottom', - horizontal: 'right', - }} - transformOrigin={{ - vertical: 'top', - horizontal: 'right', - }} - > - {}}> - - - - - - - + action={ + + + setOpen(false)} + MenuListProps={{ + 'aria-labelledby': 'basic-button' + }} + anchorOrigin={{ + vertical: 'bottom', + horizontal: 'right' + }} + transformOrigin={{ + vertical: 'top', + horizontal: 'right' + }} + > + {}}> + + + + + + + } - title="Shrimp and Chorizo Paella" - subheader="September 14, 2016" - /> - - - - - Lorem, ipsum. - - - Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quos nobis necessitatibus dolores ab quod, - - - - - - - - - ) + title='Shrimp and Chorizo Paella' + subheader='September 14, 2016' + /> + + + + + Lorem, ipsum. + + + Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quos nobis necessitatibus dolores ab quod, + + + + + + + + + ) } export default PostCard diff --git a/client/src/components/ScrollToTop.jsx b/client/src/components/ScrollToTop.jsx index eceb8526..fdf29b12 100644 --- a/client/src/components/ScrollToTop.jsx +++ b/client/src/components/ScrollToTop.jsx @@ -4,25 +4,25 @@ import { KeyboardArrowUp } from '@mui/icons-material' // Floating Action Button to scroll to top const ScrollToTop = () => { - const [isVisible, setIsVisible] = useState(false) - const handleClick = () => window.scrollTo({ top: 0, behavior: 'smooth' }) - // get device height - useEffect(() => { - // Button is displayed after scrolling for 200 pixels - const toggleVisibility = () => setIsVisible(window.scrollY > 200) - window.addEventListener('scroll', toggleVisibility) - return () => window.removeEventListener('scroll', toggleVisibility) - }, []) + const [isVisible, setIsVisible] = useState(false) + const handleClick = () => window.scrollTo({ top: 0, behavior: 'smooth' }) + // get device height + useEffect(() => { + // Button is displayed after scrolling for 200 pixels + const toggleVisibility = () => setIsVisible(window.scrollY > 200) + window.addEventListener('scroll', toggleVisibility) + return () => window.removeEventListener('scroll', toggleVisibility) + }, []) - return ( - - - - - - - - ) + return ( + + + + + + + + ) } export default ScrollToTop diff --git a/client/src/components/Sidebar.jsx b/client/src/components/Sidebar.jsx index f49db376..328adfe7 100644 --- a/client/src/components/Sidebar.jsx +++ b/client/src/components/Sidebar.jsx @@ -6,119 +6,119 @@ import ThemeSwitch from './ThemeSwitch' import { useSelector } from 'react-redux' const SideBar = ({ open, setOpen }) => { - const toggleDrawer = (newOpen) => () => { - setOpen(newOpen) - } - const { user } = useSelector((state) => state.authReducer) + const toggleDrawer = (newOpen) => () => { + setOpen(newOpen) + } + const { user } = useSelector((state) => state.authReducer) - return ( - - - - - - - - - {!user && ( - <> - - - - - - - - - - - )} - {user && ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - )} - - {!user && ( - - - - - - - - - )} - - - ) + return ( + + + + + + + + + {!user && ( + <> + + + + + + + + + + + )} + {user && ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + )} + + {!user && ( + + + + + + + + + )} + + + ) } export default SideBar diff --git a/client/src/components/Snackbar.jsx b/client/src/components/Snackbar.jsx index caf7c3f6..e9762088 100644 --- a/client/src/components/Snackbar.jsx +++ b/client/src/components/Snackbar.jsx @@ -2,15 +2,15 @@ import { useSnackbar } from '../hooks' import { Alert, Snackbar as MUISnackbar } from '@mui/material' const Snackbar = () => { - const { snackBarProps } = useSnackbar() - const { message, onClose, open, alertSeverity } = snackBarProps - return ( - - - {message} - - - ) + const { snackBarProps } = useSnackbar() + const { message, onClose, open, alertSeverity } = snackBarProps + return ( + + + {message} + + + ) } export default Snackbar diff --git a/client/src/components/SuspenseFalback.jsx b/client/src/components/SuspenseFalback.jsx index f5ccb2e5..b2259ceb 100644 --- a/client/src/components/SuspenseFalback.jsx +++ b/client/src/components/SuspenseFalback.jsx @@ -1,7 +1,7 @@ import { Box } from '@mui/material' const SuspenseFalback = () => { - return Hello + return Hello } export default SuspenseFalback diff --git a/client/src/components/ThemeSwitch.jsx b/client/src/components/ThemeSwitch.jsx index 9dba8b25..a91c7b0f 100644 --- a/client/src/components/ThemeSwitch.jsx +++ b/client/src/components/ThemeSwitch.jsx @@ -4,79 +4,79 @@ import { useState } from 'react' import { useTheme } from '../hooks' const ThemeSwitch = () => { - const [open, setOpen] = useState(false) - const { switchTheme, Themes, mode } = useTheme() - const handleClose = () => setOpen(false) - const [anchorEl, setAnchorEl] = useState(null) + const [open, setOpen] = useState(false) + const { switchTheme, Themes, mode } = useTheme() + const handleClose = () => setOpen(false) + const [anchorEl, setAnchorEl] = useState(null) - const handleClick = (event) => { - setAnchorEl(event.currentTarget) - setOpen(!open) - } + const handleClick = (event) => { + setAnchorEl(event.currentTarget) + setOpen(!open) + } - return ( - <> - - - - - - - - ) + return ( + <> + + + + + + + + ) } export default ThemeSwitch diff --git a/client/src/components/index.js b/client/src/components/index.js index 185cf203..73efb387 100644 --- a/client/src/components/index.js +++ b/client/src/components/index.js @@ -9,12 +9,12 @@ export { default as Bottombar } from './Bottombar' export { default as SuspenseFallback } from './SuspenseFalback' export { default as PlaygroundFab } from './PlaygroundFab' export { - // - CreateComment as CreateCommentForm, - CreatePost as CreatePostForm, - ForgotPassword as ForgotPasswordForm, - LogIn as LogInForm, - ResetPassword as ResetPasswordForm, - Search as SearchForm, - SignUp as SignUpForm, + // + CreateComment as CreateCommentForm, + CreatePost as CreatePostForm, + ForgotPassword as ForgotPasswordForm, + LogIn as LogInForm, + ResetPassword as ResetPasswordForm, + Search as SearchForm, + SignUp as SignUpForm } from './Forms' diff --git a/client/src/data/comments.js b/client/src/data/comments.js index ba24936a..15f333cd 100644 --- a/client/src/data/comments.js +++ b/client/src/data/comments.js @@ -1,170 +1,170 @@ const creator1 = { - _id: '640826f38431da1e123456778', - name: 'John Doe', - email: 'johnDoe@email.com', - avatar: { - accessoriesType: 'Round', - clotheColor: 'PastelYellow', - clotheType: 'GraphicShirt', - eyeType: 'WinkWacky', - eyebrowType: 'DefaultNatural', - facialHairColor: 'BrownDark', - facialHairType: 'BeardMedium', - graphicType: 'Deer', - hairColor: 'Black', - hatColor: 'Gray02', - mouthType: 'Twinkle', - skinColor: 'Yellow', - topType: 'WinterHat3', - }, - __v: 0, + _id: '640826f38431da1e123456778', + name: 'John Doe', + email: 'johnDoe@email.com', + avatar: { + accessoriesType: 'Round', + clotheColor: 'PastelYellow', + clotheType: 'GraphicShirt', + eyeType: 'WinkWacky', + eyebrowType: 'DefaultNatural', + facialHairColor: 'BrownDark', + facialHairType: 'BeardMedium', + graphicType: 'Deer', + hairColor: 'Black', + hatColor: 'Gray02', + mouthType: 'Twinkle', + skinColor: 'Yellow', + topType: 'WinterHat3' + }, + __v: 0 } export const comments = [ - { - _id: '35fcb842-6bc4-4833-8baf-386efcd270af', - createdAt: '2023-06-28T22:41:04.897Z', - creator: creator1, - likes: [], - message: 'Aperiam asperiores asperiores nulla beatae unde deleniti similique eos.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '252f1bf5-94d0-47f0-b7e5-7d54339b123b', - createdAt: '2023-07-05T23:44:50.112Z', - creator: creator1, - likes: [], - message: 'Nobis dolor necessitatibus unde delectus blanditiis laudantium nostrum.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'db6d688e-5675-4a5e-a1b9-aa487d705533', - createdAt: '2022-11-18T14:14:54.056Z', - creator: creator1, - likes: [], - message: 'Quam assumenda blanditiis.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '23fb40b4-2fc6-48df-a6a2-b6014c425fad', - createdAt: '2023-08-02T13:57:06.790Z', - creator: creator1, - likes: [], - message: 'Aut soluta incidunt quasi et minus maiores pariatur.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '14256fad-29b7-43cf-9a26-b57299ec375c', - createdAt: '2023-02-11T11:25:59.717Z', - creator: creator1, - likes: [], - message: 'Eum molestiae dolores beatae nam.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'db840948-e418-4be0-94bf-003e52b90c89', - createdAt: '2023-06-16T04:53:53.451Z', - creator: creator1, - likes: [], - message: 'Aliquam ab sequi adipisci consectetur quis.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'b297f3f9-146f-4a80-b573-ba61b973cce4', - createdAt: '2022-09-03T17:13:20.279Z', - creator: creator1, - likes: [], - message: 'Magni modi quibusdam ab provident.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '5af4f936-3d2d-452c-a9fb-22883f00c5d7', - createdAt: '2022-10-12T16:56:31.227Z', - creator: creator1, - likes: [], - message: 'Perspiciatis officiis sit incidunt quas dignissimos cumque fugiat cupiditate facilis.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'ca6daa2b-32dd-48c0-988c-613377141d82', - createdAt: '2023-06-30T15:07:26.501Z', - creator: creator1, - likes: [], - message: 'Quos magnam sapiente occaecati aut voluptatum iusto voluptatum.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '994eb70f-4928-4207-91c5-c54ed39e2f0a', - createdAt: '2023-04-19T14:59:41.258Z', - creator: creator1, - likes: [], - message: 'Architecto ipsum sequi consectetur dolore officia minus.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'caeb3fc4-90d3-4ae9-8dae-8b3766e22d2d', - createdAt: '2023-03-17T13:09:19.624Z', - creator: creator1, - likes: [], - message: 'Aliquam voluptate officiis.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '1a1abfd0-1fbe-4b92-850d-3baf09ca673d', - createdAt: '2023-02-22T23:38:15.369Z', - creator: creator1, - likes: [], - message: 'At facilis error beatae at distinctio quos necessitatibus quia.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'e30b4a4e-a3ae-4898-ae54-60e898b1426f', - createdAt: '2023-07-13T01:21:56.148Z', - creator: creator1, - likes: [], - message: 'Illum repellendus minus tempore.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '8da95c55-c2be-4c36-94b5-c3c6fda10886', - createdAt: '2023-04-08T11:22:28.102Z', - creator: creator1, - likes: [], - message: 'Sequi consequuntur aperiam vel id ad.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: 'e40724b4-72a8-4c67-a170-b6595b9a5cd4', - createdAt: '2023-01-17T00:12:59.369Z', - creator: creator1, - likes: [], - message: 'Quia tempore necessitatibus vero laborum fugit odit facilis.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, - { - _id: '58afd2a6-b5bd-44e1-bdc7-ed79043d9217', - createdAt: '2023-07-24T03:21:35.443Z', - creator: creator1, - likes: [], - message: 'Commodi optio eum rem illum temporibus numquam debitis.', - post: '64beed3d7ba580756e0c5fac', - __v: 0, - }, + { + _id: '35fcb842-6bc4-4833-8baf-386efcd270af', + createdAt: '2023-06-28T22:41:04.897Z', + creator: creator1, + likes: [], + message: 'Aperiam asperiores asperiores nulla beatae unde deleniti similique eos.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '252f1bf5-94d0-47f0-b7e5-7d54339b123b', + createdAt: '2023-07-05T23:44:50.112Z', + creator: creator1, + likes: [], + message: 'Nobis dolor necessitatibus unde delectus blanditiis laudantium nostrum.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'db6d688e-5675-4a5e-a1b9-aa487d705533', + createdAt: '2022-11-18T14:14:54.056Z', + creator: creator1, + likes: [], + message: 'Quam assumenda blanditiis.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '23fb40b4-2fc6-48df-a6a2-b6014c425fad', + createdAt: '2023-08-02T13:57:06.790Z', + creator: creator1, + likes: [], + message: 'Aut soluta incidunt quasi et minus maiores pariatur.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '14256fad-29b7-43cf-9a26-b57299ec375c', + createdAt: '2023-02-11T11:25:59.717Z', + creator: creator1, + likes: [], + message: 'Eum molestiae dolores beatae nam.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'db840948-e418-4be0-94bf-003e52b90c89', + createdAt: '2023-06-16T04:53:53.451Z', + creator: creator1, + likes: [], + message: 'Aliquam ab sequi adipisci consectetur quis.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'b297f3f9-146f-4a80-b573-ba61b973cce4', + createdAt: '2022-09-03T17:13:20.279Z', + creator: creator1, + likes: [], + message: 'Magni modi quibusdam ab provident.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '5af4f936-3d2d-452c-a9fb-22883f00c5d7', + createdAt: '2022-10-12T16:56:31.227Z', + creator: creator1, + likes: [], + message: 'Perspiciatis officiis sit incidunt quas dignissimos cumque fugiat cupiditate facilis.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'ca6daa2b-32dd-48c0-988c-613377141d82', + createdAt: '2023-06-30T15:07:26.501Z', + creator: creator1, + likes: [], + message: 'Quos magnam sapiente occaecati aut voluptatum iusto voluptatum.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '994eb70f-4928-4207-91c5-c54ed39e2f0a', + createdAt: '2023-04-19T14:59:41.258Z', + creator: creator1, + likes: [], + message: 'Architecto ipsum sequi consectetur dolore officia minus.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'caeb3fc4-90d3-4ae9-8dae-8b3766e22d2d', + createdAt: '2023-03-17T13:09:19.624Z', + creator: creator1, + likes: [], + message: 'Aliquam voluptate officiis.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '1a1abfd0-1fbe-4b92-850d-3baf09ca673d', + createdAt: '2023-02-22T23:38:15.369Z', + creator: creator1, + likes: [], + message: 'At facilis error beatae at distinctio quos necessitatibus quia.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'e30b4a4e-a3ae-4898-ae54-60e898b1426f', + createdAt: '2023-07-13T01:21:56.148Z', + creator: creator1, + likes: [], + message: 'Illum repellendus minus tempore.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '8da95c55-c2be-4c36-94b5-c3c6fda10886', + createdAt: '2023-04-08T11:22:28.102Z', + creator: creator1, + likes: [], + message: 'Sequi consequuntur aperiam vel id ad.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: 'e40724b4-72a8-4c67-a170-b6595b9a5cd4', + createdAt: '2023-01-17T00:12:59.369Z', + creator: creator1, + likes: [], + message: 'Quia tempore necessitatibus vero laborum fugit odit facilis.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + }, + { + _id: '58afd2a6-b5bd-44e1-bdc7-ed79043d9217', + createdAt: '2023-07-24T03:21:35.443Z', + creator: creator1, + likes: [], + message: 'Commodi optio eum rem illum temporibus numquam debitis.', + post: '64beed3d7ba580756e0c5fac', + __v: 0 + } ] export const pages = 2 export const page1 = comments.slice(0, 9) diff --git a/client/src/hooks/index.js b/client/src/hooks/index.js index 73b6967c..9b792e74 100644 --- a/client/src/hooks/index.js +++ b/client/src/hooks/index.js @@ -11,11 +11,11 @@ export const useTheme = () => useContext(ThemeContext) * @returns Previous value in component state */ export const usePrevious = (value) => { - const ref = useRef() - useEffect(() => { - ref.current = value - }) - return ref.current + const ref = useRef() + useEffect(() => { + ref.current = value + }) + return ref.current } /** @@ -24,7 +24,7 @@ export const usePrevious = (value) => { * @returns a promise that is resolved after the time has passed */ const sleep = (ms) => { - return new Promise((resolve) => setTimeout(resolve, ms)) + return new Promise((resolve) => setTimeout(resolve, ms)) } /** @@ -33,28 +33,28 @@ const sleep = (ms) => { * @param {Number} idx current index (zero based) */ export const useSwipe = (swipeableViewsRef, idx) => { - const prevIdx = usePrevious(idx) - const swipeForward = useCallback(() => { - swipeableViewsRef.current.swipeForward() - }, [swipeableViewsRef]) + const prevIdx = usePrevious(idx) + const swipeForward = useCallback(() => { + swipeableViewsRef.current.swipeForward() + }, [swipeableViewsRef]) - const swipeBackward = useCallback(() => { - swipeableViewsRef.current.swipeBackward() - }, [swipeableViewsRef]) + const swipeBackward = useCallback(() => { + swipeableViewsRef.current.swipeBackward() + }, [swipeableViewsRef]) - useEffect(() => { - ;(async function () { - if (prevIdx < idx) { - for (let i = 0; i < idx - prevIdx; i++) { - swipeForward() - await sleep(300) - } - } else if (idx < prevIdx) { - for (let i = 0; i < prevIdx - idx; i++) { - swipeBackward() - await sleep(300) - } - } - })() - }, [idx, prevIdx, swipeBackward, swipeForward]) + useEffect(() => { + ;(async function () { + if (prevIdx < idx) { + for (let i = 0; i < idx - prevIdx; i++) { + swipeForward() + await sleep(300) + } + } else if (idx < prevIdx) { + for (let i = 0; i < prevIdx - idx; i++) { + swipeBackward() + await sleep(300) + } + } + })() + }, [idx, prevIdx, swipeBackward, swipeForward]) } diff --git a/client/src/main.jsx b/client/src/main.jsx index 012a5b32..cdcf2a0b 100644 --- a/client/src/main.jsx +++ b/client/src/main.jsx @@ -5,9 +5,9 @@ import './styles/index.css' import App from './App' createRoot(document.getElementById('root')).render( - - - + + + ) serviceWorkerUnregister() diff --git a/client/src/pages/ForgotPassword.jsx b/client/src/pages/ForgotPassword.jsx index 1ce00517..6b4819c7 100644 --- a/client/src/pages/ForgotPassword.jsx +++ b/client/src/pages/ForgotPassword.jsx @@ -1,5 +1,5 @@ const ForgotPassword = () => { - return
ForgotPassword
+ return
ForgotPassword
} export default ForgotPassword diff --git a/client/src/pages/LogIn.jsx b/client/src/pages/LogIn.jsx index de6d21bf..703ad5a8 100644 --- a/client/src/pages/LogIn.jsx +++ b/client/src/pages/LogIn.jsx @@ -2,19 +2,19 @@ import { Container } from '@mui/material' import { LogInForm } from '../components' const LogIn = () => { - return ( - - - - ) + return ( + + + + ) } export default LogIn diff --git a/client/src/pages/NotFound.jsx b/client/src/pages/NotFound.jsx index 0b8dd695..c4842811 100644 --- a/client/src/pages/NotFound.jsx +++ b/client/src/pages/NotFound.jsx @@ -1,5 +1,5 @@ const NotFound = () => { - return
NotFound
+ return
NotFound
} export default NotFound diff --git a/client/src/pages/Playground.jsx b/client/src/pages/Playground.jsx index 6d6693df..8c7a742a 100644 --- a/client/src/pages/Playground.jsx +++ b/client/src/pages/Playground.jsx @@ -3,24 +3,24 @@ import { useSnackbar } from '../hooks' import { SuspenseFallback, ThemeSwitch } from '../components' const Playground = () => { - const { openSnackBar } = useSnackbar() - const handleClick = () => openSnackBar('success', 'This is a success message') - return ( - - - - Playground - - - - - - - - - ) + const { openSnackBar } = useSnackbar() + const handleClick = () => openSnackBar('success', 'This is a success message') + return ( + + + + Playground + + + + + + + + + ) } export default Playground diff --git a/client/src/pages/Post.jsx b/client/src/pages/Post.jsx index d1ac667f..fdd5d792 100644 --- a/client/src/pages/Post.jsx +++ b/client/src/pages/Post.jsx @@ -1,21 +1,21 @@ import { Container } from '@mui/material' import { CommentSection, PostSection } from '../sections' const Post = () => { - return ( - - - - - ) + return ( + + + + + ) } export default Post diff --git a/client/src/pages/Posts.jsx b/client/src/pages/Posts.jsx index a3814365..58f76041 100644 --- a/client/src/pages/Posts.jsx +++ b/client/src/pages/Posts.jsx @@ -2,28 +2,28 @@ import { Container, Grid2 as Grid } from '@mui/material' import { PostCard, SearchForm, CreatePostForm, Bottombar } from '../components' const Posts = () => { - return ( - - - - {[1, 2, 3, 4, 5, 6].map((post) => ( - - - - ))} - - - - - - - - - - - - - ) + return ( + + + + {[1, 2, 3, 4, 5, 6].map((post) => ( + + + + ))} + + + + + + + + + + + + + ) } export default Posts diff --git a/client/src/pages/Profile.jsx b/client/src/pages/Profile.jsx index ef7cde60..f2370a4b 100644 --- a/client/src/pages/Profile.jsx +++ b/client/src/pages/Profile.jsx @@ -1,5 +1,5 @@ const Profile = () => { - return
Profile
+ return
Profile
} export default Profile diff --git a/client/src/pages/ResetPassword.jsx b/client/src/pages/ResetPassword.jsx index 741cdcc0..f428ae00 100644 --- a/client/src/pages/ResetPassword.jsx +++ b/client/src/pages/ResetPassword.jsx @@ -1,5 +1,5 @@ const ResetPassword = () => { - return
ResetPassword
+ return
ResetPassword
} export default ResetPassword diff --git a/client/src/pages/SignUp.jsx b/client/src/pages/SignUp.jsx index 92bb8a9a..560ff974 100644 --- a/client/src/pages/SignUp.jsx +++ b/client/src/pages/SignUp.jsx @@ -2,19 +2,19 @@ import { Container } from '@mui/material' import { SignUpForm } from '../components' const SignUp = () => { - return ( - - - - ) + return ( + + + + ) } export default SignUp diff --git a/client/src/pages/UpdateUser.jsx b/client/src/pages/UpdateUser.jsx index 3110cf31..30628137 100644 --- a/client/src/pages/UpdateUser.jsx +++ b/client/src/pages/UpdateUser.jsx @@ -1,5 +1,5 @@ const UpdateUser = () => { - return
UpdateUser
+ return
UpdateUser
} export default UpdateUser diff --git a/client/src/providers/Snackbar.jsx b/client/src/providers/Snackbar.jsx index 86e6e144..aade59a2 100644 --- a/client/src/providers/Snackbar.jsx +++ b/client/src/providers/Snackbar.jsx @@ -2,27 +2,27 @@ import { useState } from 'react' import { SnackbarContext } from '../contexts' const SnackbarProvider = ({ children }) => { - const [message, setMessage] = useState('') - const [alertSeverity, setAlertSeverity] = useState('success') - const [open, setOpen] = useState(false) + const [message, setMessage] = useState('') + const [alertSeverity, setAlertSeverity] = useState('success') + const [open, setOpen] = useState(false) - const openSnackBar = (severity, message) => { - setAlertSeverity(severity) - setMessage(message) - setOpen(true) - } + const openSnackBar = (severity, message) => { + setAlertSeverity(severity) + setMessage(message) + setOpen(true) + } - const value = { - openSnackBar, - snackBarProps: { - open, - alertSeverity, - message, - onClose: () => setOpen(false), - }, - } + const value = { + openSnackBar, + snackBarProps: { + open, + alertSeverity, + message, + onClose: () => setOpen(false) + } + } - return {children} + return {children} } export default SnackbarProvider diff --git a/client/src/providers/Theme.jsx b/client/src/providers/Theme.jsx index e607bed2..0ccbfff1 100644 --- a/client/src/providers/Theme.jsx +++ b/client/src/providers/Theme.jsx @@ -4,36 +4,36 @@ import { useEffect, useState } from 'react' import { Light, Dark, System } from '../styles/themes' const ThemeProvider = ({ children }) => { - const [theme, setTheme] = useState(System) - const Themes = { - LIGHT: 'LIGHT', - DARK: 'DARK', - SYSTEM: 'SYSTEM', - } - const savedTheme = localStorage.getItem('theme') || Themes.SYSTEM - const [mode, setMode] = useState(savedTheme) - useEffect(() => { - localStorage.setItem('theme', mode) - switch (mode) { - case Themes.DARK: - setTheme(Dark) - break - case Themes.SYSTEM: - setTheme(System) - break - default: - setTheme(Light) - } - }, [mode, Themes.DARK, Themes.SYSTEM]) + const [theme, setTheme] = useState(System) + const Themes = { + LIGHT: 'LIGHT', + DARK: 'DARK', + SYSTEM: 'SYSTEM' + } + const savedTheme = localStorage.getItem('theme') || Themes.SYSTEM + const [mode, setMode] = useState(savedTheme) + useEffect(() => { + localStorage.setItem('theme', mode) + switch (mode) { + case Themes.DARK: + setTheme(Dark) + break + case Themes.SYSTEM: + setTheme(System) + break + default: + setTheme(Light) + } + }, [mode, Themes.DARK, Themes.SYSTEM]) - const switchTheme = (mode) => setMode(mode) + const switchTheme = (mode) => setMode(mode) - const values = { switchTheme, Themes, mode } - return ( - - {children} - - ) + const values = { switchTheme, Themes, mode } + return ( + + {children} + + ) } export default ThemeProvider diff --git a/client/src/reducers/auth/auth.js b/client/src/reducers/auth/auth.js index 476df514..372f9d80 100644 --- a/client/src/reducers/auth/auth.js +++ b/client/src/reducers/auth/auth.js @@ -2,15 +2,15 @@ import { googleLogout } from '@react-oauth/google' import { AUTH, LOGOUT } from '../constants/actionTypes' export default (state = { authData: null }, action) => { - switch (action.type) { - case AUTH: - localStorage.setItem('profile', JSON.stringify({ ...action?.data })) - return { ...state, authData: action?.data } - case LOGOUT: - googleLogout() - localStorage.clear() - return { ...state, authData: null } - default: - return state - } + switch (action.type) { + case AUTH: + localStorage.setItem('profile', JSON.stringify({ ...action?.data })) + return { ...state, authData: action?.data } + case LOGOUT: + googleLogout() + localStorage.clear() + return { ...state, authData: null } + default: + return state + } } diff --git a/client/src/reducers/auth/index.js b/client/src/reducers/auth/index.js index 7e523a99..63ff8b62 100644 --- a/client/src/reducers/auth/index.js +++ b/client/src/reducers/auth/index.js @@ -3,19 +3,19 @@ import * as api from '../../api' import { googleLogout } from '@react-oauth/google' const initialState = { - loading: false, - user: localStorage.getItem('user') ? JSON.parse(localStorage.getItem('user')) : null, - error: null, + loading: false, + user: localStorage.getItem('user') ? JSON.parse(localStorage.getItem('user')) : null, + error: null } // Reusable function for API calls const handleApiCall = async (apiFunc, formData, thunkAPI) => { - try { - const response = await apiFunc(formData) - return response.data || response - } catch (error) { - return thunkAPI.rejectWithValue(error.response?.data?.message || error.message) - } + try { + const response = await apiFunc(formData) + return response.data || response + } catch (error) { + return thunkAPI.rejectWithValue(error.response?.data?.message || error.message) + } } export const signUp = createAsyncThunk('auth/signup', (formData, thunkAPI) => handleApiCall(api.signUp, formData, thunkAPI)) @@ -25,8 +25,8 @@ export const logIn = createAsyncThunk('auth/login', (formData, thunkAPI) => hand export const googleSignIn = createAsyncThunk('auth/googleSignIn', (formData, thunkAPI) => handleApiCall(api.googleSignIn, formData.result, thunkAPI)) export const logOut = createAsyncThunk('auth/logout', () => { - googleLogout() - localStorage.removeItem('user') + googleLogout() + localStorage.removeItem('user') }) export const forgetPassword = createAsyncThunk('auth/forgotPassword', (formData, thunkAPI) => handleApiCall(api.sendResetLink, formData, thunkAPI)) @@ -34,71 +34,71 @@ export const forgetPassword = createAsyncThunk('auth/forgotPassword', (formData, export const resetPassword = createAsyncThunk('auth/resetPassword', (formData, thunkAPI) => handleApiCall(api.setNewPassword, formData, thunkAPI)) export const slice = createSlice({ - name: 'auth', - initialState, - extraReducers: (builder) => { - builder - .addCase(signUp.pending, (state) => { - state.loading = true - }) - .addCase(signUp.fulfilled, (state, action) => { - state.loading = false - state.user = action.payload - state.error = null - }) - .addCase(signUp.rejected, (state, action) => { - state.loading = false - state.user = null - state.error = action.payload - }) - .addCase(logIn.pending, (state) => { - state.loading = true - }) - .addCase(logIn.fulfilled, (state, action) => { - state.loading = false - state.user = action.payload - state.error = null - }) - .addCase(logIn.rejected, (state, action) => { - state.loading = false - state.user = null - state.error = action.payload - }) - .addCase(googleSignIn.pending, (state) => { - state.loading = true - }) - .addCase(googleSignIn.fulfilled, (state, action) => { - state.loading = false - state.user = action.payload - state.error = null - }) - .addCase(googleSignIn.rejected, (state, action) => { - state.loading = false - state.user = null - state.error = action.payload - }) - .addCase(logOut.fulfilled, (state) => { - state.loading = false - state.user = null - state.error = null - }) - .addCase(forgetPassword.fulfilled, (state) => { - state.loading = false - state.error = null - }) - .addCase(resetPassword.pending, (state) => { - state.loading = true - }) - .addCase(resetPassword.fulfilled, (state) => { - state.loading = false + name: 'auth', + initialState, + extraReducers: (builder) => { + builder + .addCase(signUp.pending, (state) => { + state.loading = true + }) + .addCase(signUp.fulfilled, (state, action) => { + state.loading = false + state.user = action.payload + state.error = null + }) + .addCase(signUp.rejected, (state, action) => { + state.loading = false + state.user = null + state.error = action.payload + }) + .addCase(logIn.pending, (state) => { + state.loading = true + }) + .addCase(logIn.fulfilled, (state, action) => { + state.loading = false + state.user = action.payload + state.error = null + }) + .addCase(logIn.rejected, (state, action) => { + state.loading = false + state.user = null + state.error = action.payload + }) + .addCase(googleSignIn.pending, (state) => { + state.loading = true + }) + .addCase(googleSignIn.fulfilled, (state, action) => { + state.loading = false + state.user = action.payload + state.error = null + }) + .addCase(googleSignIn.rejected, (state, action) => { + state.loading = false + state.user = null + state.error = action.payload + }) + .addCase(logOut.fulfilled, (state) => { + state.loading = false + state.user = null + state.error = null + }) + .addCase(forgetPassword.fulfilled, (state) => { + state.loading = false + state.error = null + }) + .addCase(resetPassword.pending, (state) => { + state.loading = true + }) + .addCase(resetPassword.fulfilled, (state) => { + state.loading = false - state.error = null - }) - .addCase(resetPassword.rejected, (state, action) => { - state.loading = false - state.error = action.payload - }) - }, + state.error = null + }) + .addCase(resetPassword.rejected, (state, action) => { + state.loading = false + state.error = action.payload + }) + } }) export default slice.reducer diff --git a/client/src/reducers/post/index.js b/client/src/reducers/post/index.js index 3aca879a..e772f465 100644 --- a/client/src/reducers/post/index.js +++ b/client/src/reducers/post/index.js @@ -1,45 +1,45 @@ import { createAsyncThunk, createSlice } from '@reduxjs/toolkit' import * as api from '../../api' const initialState = { - loading: false, - posts: [], - post: null, - numberOfPages: null, - error: null, + loading: false, + posts: [], + post: null, + numberOfPages: null, + error: null } export const getPosts = createAsyncThunk( - 'post/getPosts', // prefix - async (formData, thunkAPI) => { - try { - const { data } = await api.fetchPosts(formData) - return data - } catch (error) { - return thunkAPI.rejectWithValue(error.message) - } - } + 'post/getPosts', // prefix + async (formData, thunkAPI) => { + try { + const { data } = await api.fetchPosts(formData) + return data + } catch (error) { + return thunkAPI.rejectWithValue(error.message) + } + } ) export const slice = createSlice({ - name: 'post', - initialState, - extraReducers: (builder) => { - builder - .addCase(getPosts.pending, (state) => { - state.loading = true - }) - .addCase(getPosts.fulfilled, (state, action) => { - state.loading = false - state.posts = action.payload.data - state.numberOfPages = action.payload.numberOfPages - state.error = null - }) - .addCase(getPosts.rejected, (state, action) => { - state.loading = false - state.posts = [] - state.error = action.payload - }) - }, + name: 'post', + initialState, + extraReducers: (builder) => { + builder + .addCase(getPosts.pending, (state) => { + state.loading = true + }) + .addCase(getPosts.fulfilled, (state, action) => { + state.loading = false + state.posts = action.payload.data + state.numberOfPages = action.payload.numberOfPages + state.error = null + }) + .addCase(getPosts.rejected, (state, action) => { + state.loading = false + state.posts = [] + state.error = action.payload + }) + } }) export default slice.reducer diff --git a/client/src/reducers/post/posts.js b/client/src/reducers/post/posts.js index 4569b914..12c110ad 100644 --- a/client/src/reducers/post/posts.js +++ b/client/src/reducers/post/posts.js @@ -1,158 +1,158 @@ import { - // - FETCH_RECOMMENDED, - FETCHING_RECOMMENDED_POSTS, - FETCHED_RECOMMENDED_POSTS, - FETCH_ALL, - FETCH_CREATED, - FETCHING_CREATED_POSTS, - FETCHED_CREATED_POSTS, - FETCHING_LIKED_POSTS, - FETCHED_LIKED_POSTS, - FETCH_LIKED, - CREATE, - UPDATE, - FETCH_POST, - DELETE, - DELETE_COMMENT, - FETCH_BY_SEARCH, - START_LOADING, - END_LOADING, - COMMENT, - USER_DETAILS, - FETCHING_PRIVATE_POSTS, - FETCHED_PRIVATE_POSTS, - FETCH_PRIVATE, - FETCHING_COMMENTS, - FETCH_COMMENTS, - FETCHED_COMMENTS, - CREATE_COMMENT, - CREATING_POST, - CREATED_POST, - DELETING_POST, - DELETED_POST, + // + FETCH_RECOMMENDED, + FETCHING_RECOMMENDED_POSTS, + FETCHED_RECOMMENDED_POSTS, + FETCH_ALL, + FETCH_CREATED, + FETCHING_CREATED_POSTS, + FETCHED_CREATED_POSTS, + FETCHING_LIKED_POSTS, + FETCHED_LIKED_POSTS, + FETCH_LIKED, + CREATE, + UPDATE, + FETCH_POST, + DELETE, + DELETE_COMMENT, + FETCH_BY_SEARCH, + START_LOADING, + END_LOADING, + COMMENT, + USER_DETAILS, + FETCHING_PRIVATE_POSTS, + FETCHED_PRIVATE_POSTS, + FETCH_PRIVATE, + FETCHING_COMMENTS, + FETCH_COMMENTS, + FETCHED_COMMENTS, + CREATE_COMMENT, + CREATING_POST, + CREATED_POST, + DELETING_POST, + DELETED_POST } from '../constants/actionTypes' export default ( - state = { - isFetchingCreatedPosts: true, - isFetchingLikedPosts: true, - isFetchingPrivatePosts: true, - isFetchingRecommendedPosts: true, - isFetchingComments: true, - isCreatingPost: false, - isDeletingPost: false, - isLoading: true, - posts: [], - data: {}, - likedPosts: [], - createdPosts: [], - recommendedPosts: [], - privatePosts: [], - comments: [], - userComments: [], - }, - action + state = { + isFetchingCreatedPosts: true, + isFetchingLikedPosts: true, + isFetchingPrivatePosts: true, + isFetchingRecommendedPosts: true, + isFetchingComments: true, + isCreatingPost: false, + isDeletingPost: false, + isLoading: true, + posts: [], + data: {}, + likedPosts: [], + createdPosts: [], + recommendedPosts: [], + privatePosts: [], + comments: [], + userComments: [] + }, + action ) => { - switch (action.type) { - case FETCHING_CREATED_POSTS: - return { ...state, isFetchingCreatedPosts: true } - case FETCHING_LIKED_POSTS: - return { ...state, isFetchingLikedPosts: true } - case FETCHING_PRIVATE_POSTS: - return { ...state, isFetchingPrivatePosts: true } - case FETCHING_RECOMMENDED_POSTS: - return { ...state, isFetchingRecommendedPosts: true } - case FETCHING_COMMENTS: - return { ...state, isFetchingComments: true } - case START_LOADING: - return { ...state, isLoading: true } - case FETCH_COMMENTS: - return { - ...state, - comments: action.payload.comments ? [] : action.payload, - commentsNumberOfPages: action.payload.numberOfPages, - userComments: action.payload.comments, - } - case FETCH_ALL: - return { - ...state, - posts: action.payload.data, - currentPage: action.payload.currentPage, - numberOfPages: action.payload.numberOfPages, - } - case FETCH_BY_SEARCH: - return { ...state, posts: action.payload.data } - case USER_DETAILS: - return { ...state, data: action.payload.data } - case FETCH_LIKED: - return { - ...state, - likedPosts: action.payload.data, - likedNumberOfPages: action.payload.numberOfPages, - } - case FETCH_CREATED: - return { - ...state, - createdPosts: action.payload.data, - createdNumberOfPages: action.payload.numberOfPages, - } - case FETCH_PRIVATE: - return { - ...state, - privatePosts: action.payload.data, - privateNumberOfPages: action.payload.numberOfPages, - } - case FETCH_RECOMMENDED: - return { ...state, recommendedPosts: action.payload.data } - case CREATE_COMMENT: - return { ...state, comments: [...state.comments, action.payload] } - case CREATE: - return { ...state, posts: [...state.posts, action.payload] } - case FETCH_POST: - return { ...state, post: action.payload.post } - case UPDATE: - return { - ...state, - posts: state.posts.map((post) => (post._id === action.payload._id ? action.payload : post)), - } - case DELETE: - return { - ...state, - posts: state.posts.filter((post) => (post._id !== action.payload._id ? action.payload : post)), - } - case DELETE_COMMENT: - return { - ...state, - comments: state.comments.filter((comment) => comment._id !== action.payload), - } - case COMMENT: - return { - ...state, - posts: state.posts.map((post) => (post._id === Number(action.payload._id) ? action.payload : post)), - } - case END_LOADING: - return { ...state, isLoading: false } - case FETCHED_RECOMMENDED_POSTS: - return { ...state, isFetchingRecommendedPosts: false } - case FETCHED_PRIVATE_POSTS: - return { ...state, isFetchingPrivatePosts: false } - case FETCHED_LIKED_POSTS: - return { ...state, isFetchingLikedPosts: false } - case FETCHED_CREATED_POSTS: - return { ...state, isFetchingCreatedPosts: false } - case FETCHED_COMMENTS: - return { ...state, isFetchingComments: false } - case CREATING_POST: - return { ...state, isCreatingPost: true } - case CREATED_POST: - return { ...state, isCreatingPost: false } - case DELETING_POST: - return { ...state, isDeletingPost: true } - case DELETED_POST: - return { ...state, isDeletingPost: false } + switch (action.type) { + case FETCHING_CREATED_POSTS: + return { ...state, isFetchingCreatedPosts: true } + case FETCHING_LIKED_POSTS: + return { ...state, isFetchingLikedPosts: true } + case FETCHING_PRIVATE_POSTS: + return { ...state, isFetchingPrivatePosts: true } + case FETCHING_RECOMMENDED_POSTS: + return { ...state, isFetchingRecommendedPosts: true } + case FETCHING_COMMENTS: + return { ...state, isFetchingComments: true } + case START_LOADING: + return { ...state, isLoading: true } + case FETCH_COMMENTS: + return { + ...state, + comments: action.payload.comments ? [] : action.payload, + commentsNumberOfPages: action.payload.numberOfPages, + userComments: action.payload.comments + } + case FETCH_ALL: + return { + ...state, + posts: action.payload.data, + currentPage: action.payload.currentPage, + numberOfPages: action.payload.numberOfPages + } + case FETCH_BY_SEARCH: + return { ...state, posts: action.payload.data } + case USER_DETAILS: + return { ...state, data: action.payload.data } + case FETCH_LIKED: + return { + ...state, + likedPosts: action.payload.data, + likedNumberOfPages: action.payload.numberOfPages + } + case FETCH_CREATED: + return { + ...state, + createdPosts: action.payload.data, + createdNumberOfPages: action.payload.numberOfPages + } + case FETCH_PRIVATE: + return { + ...state, + privatePosts: action.payload.data, + privateNumberOfPages: action.payload.numberOfPages + } + case FETCH_RECOMMENDED: + return { ...state, recommendedPosts: action.payload.data } + case CREATE_COMMENT: + return { ...state, comments: [...state.comments, action.payload] } + case CREATE: + return { ...state, posts: [...state.posts, action.payload] } + case FETCH_POST: + return { ...state, post: action.payload.post } + case UPDATE: + return { + ...state, + posts: state.posts.map((post) => (post._id === action.payload._id ? action.payload : post)) + } + case DELETE: + return { + ...state, + posts: state.posts.filter((post) => (post._id !== action.payload._id ? action.payload : post)) + } + case DELETE_COMMENT: + return { + ...state, + comments: state.comments.filter((comment) => comment._id !== action.payload) + } + case COMMENT: + return { + ...state, + posts: state.posts.map((post) => (post._id === Number(action.payload._id) ? action.payload : post)) + } + case END_LOADING: + return { ...state, isLoading: false } + case FETCHED_RECOMMENDED_POSTS: + return { ...state, isFetchingRecommendedPosts: false } + case FETCHED_PRIVATE_POSTS: + return { ...state, isFetchingPrivatePosts: false } + case FETCHED_LIKED_POSTS: + return { ...state, isFetchingLikedPosts: false } + case FETCHED_CREATED_POSTS: + return { ...state, isFetchingCreatedPosts: false } + case FETCHED_COMMENTS: + return { ...state, isFetchingComments: false } + case CREATING_POST: + return { ...state, isCreatingPost: true } + case CREATED_POST: + return { ...state, isCreatingPost: false } + case DELETING_POST: + return { ...state, isDeletingPost: true } + case DELETED_POST: + return { ...state, isDeletingPost: false } - default: - return state - } + default: + return state + } } diff --git a/client/src/routes/Auth.jsx b/client/src/routes/Auth.jsx index 92024fc7..6a87190c 100644 --- a/client/src/routes/Auth.jsx +++ b/client/src/routes/Auth.jsx @@ -2,8 +2,8 @@ import { useSelector } from 'react-redux' import { Navigate } from 'react-router-dom' const Auth = ({ component }) => { - const { user } = useSelector((state) => state.authReducer) - return user ? : component + const { user } = useSelector((state) => state.authReducer) + return user ? : component } export default Auth diff --git a/client/src/routes/Private.jsx b/client/src/routes/Private.jsx index 82b4fe33..af83415e 100644 --- a/client/src/routes/Private.jsx +++ b/client/src/routes/Private.jsx @@ -2,8 +2,8 @@ import { useSelector } from 'react-redux' import { Navigate } from 'react-router-dom' const Private = ({ component }) => { - const { user } = useSelector((state) => state.authReducer) - return user ? component : + const { user } = useSelector((state) => state.authReducer) + return user ? component : } export default Private diff --git a/client/src/sections/Comments.jsx b/client/src/sections/Comments.jsx index 3851b4ea..6dd5ec0c 100644 --- a/client/src/sections/Comments.jsx +++ b/client/src/sections/Comments.jsx @@ -1,11 +1,11 @@ import { Paper, Typography } from '@mui/material' const Comments = () => { - return ( - - Comments - - ) + return ( + + Comments + + ) } export default Comments diff --git a/client/src/sections/Post.jsx b/client/src/sections/Post.jsx index f55a82a3..bad42cc7 100644 --- a/client/src/sections/Post.jsx +++ b/client/src/sections/Post.jsx @@ -2,90 +2,90 @@ import { Comment, Person, Share, ThumbUpAltSharp } from '@mui/icons-material' import { Avatar, Box, Card, CardActions, CardContent, CardMedia, Divider, IconButton, ListItemText, Paper, Typography } from '@mui/material' const Post = () => { - return ( - - - - - - - - - - - - - @ 12:00 PM yesterday - - - - - - Post Title - + return ( + + + + + + + + + + + + + @ 12:00 PM yesterday + + + + + + Post Title + - - - Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque tempore distinctio nobis et numquam accusantium minus iusto laboriosam enim eveniet. Esse cupiditate culpa quaerat animi harum, nam enim illo odit! - - - - - - - 20 - - - - 20 - - - - 20 - - - - - - ) + + + Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque tempore distinctio nobis et numquam accusantium minus iusto laboriosam enim eveniet. Esse cupiditate culpa quaerat animi harum, nam enim illo odit! + + + + + + + 20 + + + + 20 + + + + 20 + + + + + + ) } export default Post diff --git a/client/src/service-worker.js b/client/src/service-worker.js index bce887fe..cfd696d0 100644 --- a/client/src/service-worker.js +++ b/client/src/service-worker.js @@ -24,38 +24,38 @@ precacheAndRoute(self.__WB_MANIFEST) // https://developers.google.com/web/fundamentals/architecture/app-shell const fileExtensionRegexp = /[^/?]+\.[^/]+$/ registerRoute( - // Return false to exempt requests from being fulfilled by index.html. - ({ request, url }) => { - if (request.mode !== 'navigate' || url.pathname.startsWith('/_') || !fileExtensionRegexp.test(url.pathname)) { - return false - } else { - return true - } - }, - createHandlerBoundToURL(import.meta.env.PUBLIC_URL + '/index.html') + // Return false to exempt requests from being fulfilled by index.html. + ({ request, url }) => { + if (request.mode !== 'navigate' || url.pathname.startsWith('/_') || !fileExtensionRegexp.test(url.pathname)) { + return false + } else { + return true + } + }, + createHandlerBoundToURL(import.meta.env.PUBLIC_URL + '/index.html') ) // An example runtime caching route for requests that aren't handled by the // precache, in this case same-origin .png requests like those from in public/ registerRoute( - // Add in any other file extensions or routing criteria as needed. - ({ url }) => url.origin === self.location.origin && url.pathname.endsWith('.png'), // Customize this strategy as needed, e.g., by changing to CacheFirst. - new StaleWhileRevalidate({ - cacheName: 'images', - plugins: [ - // Ensure that once this runtime cache reaches a maximum size the - // least-recently used images are removed. - new ExpirationPlugin({ maxEntries: 50 }), - ], - }) + // Add in any other file extensions or routing criteria as needed. + ({ url }) => url.origin === self.location.origin && url.pathname.endsWith('.png'), // Customize this strategy as needed, e.g., by changing to CacheFirst. + new StaleWhileRevalidate({ + cacheName: 'images', + plugins: [ + // Ensure that once this runtime cache reaches a maximum size the + // least-recently used images are removed. + new ExpirationPlugin({ maxEntries: 50 }) + ] + }) ) // This allows the web app to trigger skipWaiting via // registration.waiting.postMessage({type: 'SKIP_WAITING'}) self.addEventListener('message', (event) => { - if (event.data && event.data.type === 'SKIP_WAITING') { - self.skipWaiting() - } + if (event.data && event.data.type === 'SKIP_WAITING') { + self.skipWaiting() + } }) // Any other custom service worker logic can go here. diff --git a/client/src/serviceWorkerRegistration.js b/client/src/serviceWorkerRegistration.js index 518aabd3..19eb34cf 100644 --- a/client/src/serviceWorkerRegistration.js +++ b/client/src/serviceWorkerRegistration.js @@ -11,116 +11,117 @@ // opt-in, read https://cra.link/PWA const isLocalhost = Boolean( - // - window.location.hostname === 'localhost' || // + // + window.location.hostname === 'localhost' || // window.location.hostname === '[::1]' || // window.location.hostname.match( - // - /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ + // + /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ ) ) const registerValidSW = (swUrl, config) => { - navigator.serviceWorker - .register(swUrl) - .then((registration) => { - registration.onupdatefound = () => { - const installingWorker = registration.installing - if (installingWorker === null) { - return - } - installingWorker.onstatechange = () => { - if (installingWorker.state === 'installed') { - if (navigator.serviceWorker.controller) { - // At this point, the updated precached content has been fetched, - // but the previous service worker will still serve the older - // content until all client tabs are closed. - console.log('New content is available and will be used when all tabs for this page are closed. See https://cra.link/PWA.') + navigator.serviceWorker + .register(swUrl) + .then((registration) => { + registration.onupdatefound = () => { + const installingWorker = registration.installing + if (installingWorker === null) { + return + } + installingWorker.onstatechange = () => { + if (installingWorker.state === 'installed') { + if (navigator.serviceWorker.controller) { + // At this point, the updated precached content has been fetched, + // but the previous service worker will still serve the older + // content until all client tabs are closed. + console.log('New content is available and will be used when all tabs for this page are closed. See https://cra.link/PWA.') - // Execute callback - if (config?.onUpdate) { - config.onUpdate(registration) - } - } else { - // At this point, everything has been precached. - // It's the perfect time to display a - // "Content is cached for offline use." message. - console.log('Content is cached for offline use.') + // Execute callback + if (config?.onUpdate) { + config.onUpdate(registration) + } + } else { + // At this point, everything has been precached. + // It's the perfect time to display a + // "Content is cached for offline use." message. + console.log('Content is cached for offline use.') - // Execute callback - if (config?.onSuccess) { - config.onSuccess(registration) - } - } - } - } - } - }) - .catch((error) => { - console.error('Error during service worker registration:', error) - }) + // Execute callback + if (config?.onSuccess) { + config.onSuccess(registration) + } + } + } + } + } + }) + .catch((error) => { + console.error('Error during service worker registration:', error) + }) } // Check if the service worker can be found. If it can't reload the page. const checkValidServiceWorker = (swUrl, config) => { - fetch(swUrl, { headers: { 'Service-Worker': 'script' } }) - .then((response) => { - // Ensure service worker exists, and that we really are getting a JS file. - const contentType = response.headers.get('content-type') - if ( - // - response.status === 404 || // + fetch(swUrl, { headers: { 'Service-Worker': 'script' } }) + .then((response) => { + // Ensure service worker exists, and that we really are getting a JS file. + const contentType = response.headers.get('content-type') + if ( + // + response.status === 404 || // (contentType !== null && contentType.indexOf('javascript') === -1) - ) { - // No service worker found. Probably a different app. Reload the page. - navigator.serviceWorker.ready.then((registration) => { - registration.unregister().then(() => { - window.location.reload() - }) - }) - } else { - // Service worker found. Proceed as normal. - registerValidSW(swUrl, config) - } - }) - .catch(() => { - console.log('No internet connection found. App is running in offline mode.') - }) + ) { + // No service worker found. Probably a different app. Reload the page. + navigator.serviceWorker.ready.then((registration) => { + registration.unregister().then(() => { + window.location.reload() + }) + }) + } else { + // Service worker found. Proceed as normal. + registerValidSW(swUrl, config) + } + }) + .catch(() => { + console.log('No internet connection found. App is running in offline mode.') + }) } export const register = (config) => { - if (import.meta.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { - // The URL constructor is available in all browsers that support SW. - const publicUrl = new URL(import.meta.env.PUBLIC_URL, window.location.href) - if (publicUrl.origin !== window.location.origin) { - // Our service worker won't work if PUBLIC_URL is on a different origin - // from what our page is served on. This might happen if a CDN is used to - // serve assets; see https://github.com/facebook/create-react-app/issues/2374 - return - } + if (import.meta.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { + // The URL constructor is available in all browsers that support SW. + const publicUrl = new URL(import.meta.env.PUBLIC_URL, window.location.href) + if (publicUrl.origin !== window.location.origin) { + // Our service worker won't work if PUBLIC_URL is on a different origin + // from what our page is served on. This might happen if a CDN is used to + // serve assets; see https://github.com/facebook/create-react-app/issues/2374 + return + } - window.addEventListener('load', () => { - const swUrl = `${import.meta.env.PUBLIC_URL}/service-worker.js` - if (isLocalhost) { - // This is running on localhost. Let's check if a service worker still exists or not. - checkValidServiceWorker(swUrl, config) + window.addEventListener('load', () => { + const swUrl = `${import.meta.env.PUBLIC_URL}/service-worker.js` + if (isLocalhost) { + // This is running on localhost. Let's check if a service worker still exists or not. + checkValidServiceWorker(swUrl, config) - // Add some additional logging to localhost, pointing developers to the - // service worker/PWA documentation. - navigator.serviceWorker.ready.then(() => { - console.log('This web app is being served cache-first by a service ' + 'worker. To learn more, visit https://cra.link/PWA') - }) - } else { - // Is not localhost. Just register service worker - registerValidSW(swUrl, config) - } - }) - } + // Add some additional logging to localhost, pointing developers to the + // service worker/PWA documentation. + navigator.serviceWorker.ready.then(() => { + console.log('This web app is being served cache-first by a service ' + 'worker. To learn more, visit https://cra.link/PWA') + }) + } else { + // Is not localhost. Just register service worker + registerValidSW(swUrl, config) + } + }) + } } export const unregister = () => { - if ('serviceWorker' in navigator) - navigator.serviceWorker.ready // - .then((registration) => registration.unregister()) - .catch((error) => console.error(error.message)) + if ('serviceWorker' in navigator) { + navigator.serviceWorker.ready // + .then((registration) => registration.unregister()) + .catch((error) => console.error(error.message)) + } } diff --git a/client/src/store/index.js b/client/src/store/index.js index 21f2d0f0..69b52c22 100644 --- a/client/src/store/index.js +++ b/client/src/store/index.js @@ -3,9 +3,9 @@ import authReducer from '../reducers/auth' import postReducer from '../reducers/post' const reducer = combineReducers({ - authReducer, - postReducer, - // add more reducers here + authReducer, + postReducer + // add more reducers here }) export const store = configureStore({ reducer }) diff --git a/client/src/styles/themes.js b/client/src/styles/themes.js index 17b3a06c..38ce491e 100644 --- a/client/src/styles/themes.js +++ b/client/src/styles/themes.js @@ -1,54 +1,54 @@ import { createTheme } from '@mui/material' const Light = createTheme({ - breakpoints: {}, - palette: { - mode: 'light', - primary: { - main: '#3f51b5', - }, - secondary: { - main: '#f50057', - }, - background: { - paper: '#ffffff', - default: '#f5f5f5', - }, - components: { - // MuiContainer: { - // styleOverrides: { - // root: { - // backgroundColor: '#ffffff', - // }, - // }, - // }, - }, - }, + breakpoints: {}, + palette: { + mode: 'light', + primary: { + main: '#3f51b5' + }, + secondary: { + main: '#f50057' + }, + background: { + paper: '#ffffff', + default: '#f5f5f5' + }, + components: { + // MuiContainer: { + // styleOverrides: { + // root: { + // backgroundColor: '#ffffff', + // }, + // }, + // }, + } + } }) const Dark = createTheme({ - palette: { - mode: 'dark', - primary: { - main: '#5f57ff', - }, - secondary: { - main: '#ffffff', - }, - background: { - paper: '#000000', - default: '#0d1017', - }, - }, - components: { - // MuiContainer: { - // styleOverrides: { - // root: { - // backgroundColor: '#000000', - // }, - // }, - // }, - }, + palette: { + mode: 'dark', + primary: { + main: '#5f57ff' + }, + secondary: { + main: '#ffffff' + }, + background: { + paper: '#000000', + default: '#0d1017' + } + }, + components: { + // MuiContainer: { + // styleOverrides: { + // root: { + // backgroundColor: '#000000', + // }, + // }, + // }, + } }) const System = createTheme({ colorSchemes: { dark: true } }) diff --git a/client/vite.config.js b/client/vite.config.js index c57b0af3..605a6be0 100644 --- a/client/vite.config.js +++ b/client/vite.config.js @@ -4,11 +4,11 @@ import path from 'path' // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], - resolve: { - alias: { - '~': path.resolve(__dirname, 'node_modules'), - '@': path.resolve(__dirname, 'src'), - }, - }, + plugins: [react()], + resolve: { + alias: { + '~': path.resolve(__dirname, 'node_modules'), + '@': path.resolve(__dirname, 'src') + } + } })