Merge pull request #97 from weaponsforge/dev

v1.0.5

.github/workflows/lint.yml

@@ -12,6 +12,18 @@ jobs:
   lint-client:
     name: Lint Client
     runs-on: ubuntu-latest
+    env:
+      NEXT_PUBLIC_BASE_PATH: ''
+      NEXT_PUBLIC_BASE_API_URL: ${{ secrets.NEXT_PUBLIC_BASE_API_URL_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_API_KEY: ${{ secrets.FIREBASE_WEB_API_KEY_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_AUTHDOMAIN: ${{ secrets.FIREBASE_WEB_AUTHDOMAIN_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_PROJECT_ID: ${{ secrets.FIREBASE_WEB_PROJECT_ID_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_STORAGE_BUCKET: ${{ secrets.FIREBASE_WEB_STORAGE_BUCKET_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_MESSAGING_SENDER_ID: ${{ secrets.FIREBASE_WEB_MESSAGING_SENDER_ID_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_APP_ID: ${{ secrets.FIREBASE_WEB_APP_ID_DEV }}
+      NEXT_PUBLIC_FIREBASE_WEB_MEASUREMENT_ID: ${{ secrets.FIREBASE_WEB_MEASUREMENT_ID_DEV }}
+      NEXT_PUBLIC_MEDIA_BG1: ${{ secrets.NEXT_PUBLIC_MEDIA_BG1 }}
+      NEXT_PUBLIC_RANDOM_JOKE_API: ${{ secrets.NEXT_PUBLIC_RANDOM_JOKE_API }}
     steps:
       - name: Checkout the repository
         uses: actions/checkout@v3
@@ -27,6 +39,11 @@ jobs:
           npm install
           npm run lint
 
+      - name: Dry-run NPM Export
+        run: |
+          cd client
+          npm run export
+
   lint-server:
     name: Lint Server
     runs-on: ubuntu-latest

client/package.json

@@ -22,15 +22,13 @@
     "@mui/icons-material": "^5.11.9",
     "@mui/material": "^5.11.10",
     "@mui/x-data-grid": "^5.17.25",
-    "@reduxjs/toolkit": "^1.9.3",
     "axios": "^1.3.4",
     "eslint": "8.34.0",
     "eslint-config-next": "13.2.1",
     "firebase": "^9.17.1",
     "next": "13.2.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-redux": "^8.0.5",
     "use-sync-v": "^2.0.1"
   }
 }

client/src/common/auth/protectedpage/index.js

@@ -1,6 +1,6 @@
 import { useEffect } from 'react'
 import { useRouter } from 'next/router'
-import { useAuth } from '@/lib/hooks/useAuth'
+import { useSyncV } from 'use-sync-v'
 
 import LoadingCover from '@/common/layout/loadingcover'
 
@@ -16,25 +16,23 @@ import LoadingCover from '@/common/layout/loadingcover'
 function ProtectedPage (Component) {
   function AuthListener (props) {
     const router = useRouter()
-    const { authLoading, authError, authUser } = useAuth()
+    const { authLoading, authUser, authError } = useSyncV('auth')
 
     useEffect(() => {
-      if (!authLoading && !authUser) {
+      if (!authLoading && authUser === null) {
         router.push('/login')
       }
     }, [authUser, authLoading, router])
 
-    const ItemComponent = () => {
+    return ((() => {
       if (authLoading) {
         return <LoadingCover />
       } else if (authUser) {
         return <Component {...props} />
       } else {
         return <LoadingCover authError={authError} />
       }
-    }
-
-    return (<ItemComponent />)
+    })())
   }
 
   return AuthListener

client/src/common/layout/header/index.js

@@ -1,6 +1,5 @@
 // REACT
 import { useState } from 'react'
-import { useDispatch } from 'react-redux'
 
 // NEXT
 import Link from 'next/link'
@@ -26,9 +25,10 @@ import Typography from '@mui/material/Typography'
 import PlayArrowIcon from '@mui/icons-material/PlayArrow'
 
 // LIB
-import { useAuth } from '@/lib/hooks/useAuth'
+import { authSignOut } from '@/lib/hooks/useInitAuth'
 import { setSyncLocalStorage, useSyncLocalStorage } from '@/lib/hooks/useSync'
 import { Avalon } from '@/lib/mui/theme'
+import { useSyncV } from 'use-sync-v'
 
 // VARIABLES
 const pages = ['about']
@@ -42,8 +42,8 @@ const settings = [
     route: '/',
   },
   {
-    name: 'Dashboard',
-    route: 'dashboard',
+    name: 'Contacts',
+    route: 'contacts',
   },
   {
     name: 'Logout',
@@ -57,8 +57,7 @@ function Header() {
   const [anchorElUser, setAnchorElUser] = useState(null)
   const activeTheme = useSyncLocalStorage('activeTheme')
   const animate = useSyncLocalStorage('animate')
-  const { authUser, authSignOut } = useAuth()
-  const dispatch = useDispatch()
+  const { authUser } = useSyncV('auth')
   const router = useRouter()
 
   class eventsHandler {
@@ -241,7 +240,7 @@ function Header() {
               >
                 {settings.map((setting, id) => {
                   return setting.name === 'Logout' ? (
-                    <MenuItem key={id} onClick={() => dispatch(authSignOut())}>
+                    <MenuItem key={id} onClick={() => authSignOut()}>
                       <Typography textAlign="center">{setting.name}</Typography>
                     </MenuItem>
                   ) : (

client/src/components/contacts/sidebar/contactForm/index.js

@@ -1,15 +1,14 @@
-import { useAuth } from '@/lib/hooks/useAuth'
 import { FirebaseFirestore } from '@/lib/utils/firebase/firestore'
 import { Avatar, Box, Button, TextField, Typography } from '@mui/material'
 import { useEffect, useState } from 'react'
 import { useSyncV } from 'use-sync-v'
 
 export const ContactFormComponent = () => {
-  const user = useAuth()
   const activeContact = useSyncV('ui.activeContact')
   const { editContact, createContact } = useSyncV('ui.phase')
   const [form, setForm] = useState(activeContact)
   const [isFormChanged, setIsFormChanged] = useState(false)
+  const user = useSyncV('auth')
 
   useEffect(() => {
     setForm(activeContact)
@@ -31,7 +30,7 @@ export const ContactFormComponent = () => {
   }
 
   const saveHandler = () => {
-    const user_uid = user.authUser.uid
+    const user_uid = user?.authUser?.uid ?? ''
 
     switch (true) {
     case editContact: {