refactor: use useAppDispatch, useAppSelector hooks

This commit is contained in:
enes 2024-10-08 17:08:43 +02:00
parent 6c5ed3a69c
commit d610c79cad
11 changed files with 33 additions and 43 deletions

View File

@ -1,5 +1,5 @@
import { useEffect } from 'react'
import { useSelector } from 'react-redux'
import { useAppSelector } from './hooks/store'
import { Navigate, Route, Routes } from 'react-router-dom'
import { AuthController } from './controllers'
import { MainLayout } from './layouts/Main'
@ -10,11 +10,10 @@ import {
publicRoutes,
recursiveRouteRenderer
} from './routes'
import { State } from './store/rootReducer'
import './App.scss'
const App = () => {
const authState = useSelector((state: State) => state.auth)
const authState = useAppSelector((state) => state.auth)
useEffect(() => {
if (window.location.hostname === '0.0.0.0') {

View File

@ -9,8 +9,7 @@ import {
} from '@mui/material'
import { useEffect, useState } from 'react'
import { useSelector } from 'react-redux'
import { State } from '../../store/rootReducer'
import { useAppSelector } from '../../hooks/store'
import Username from '../username'
import { Link, useNavigate } from 'react-router-dom'
@ -37,9 +36,9 @@ export const AppBar = () => {
const [userAvatar, setUserAvatar] = useState('')
const [anchorElUser, setAnchorElUser] = useState<null | HTMLElement>(null)
const authState = useSelector((state: State) => state.auth)
const metadataState = useSelector((state: State) => state.metadata)
const userRobotImage = useSelector((state: State) => state.userRobotImage)
const authState = useAppSelector((state) => state.auth)
const metadataState = useAppSelector((state) => state.metadata)
const userRobotImage = useAppSelector((state) => state.userRobotImage)
useEffect(() => {
if (metadataState) {

View File

@ -20,8 +20,7 @@ import {
faFileCircleExclamation
} from '@fortawesome/free-solid-svg-icons'
import { getExtensionIconLabel } from '../getExtensionIconLabel'
import { useSelector } from 'react-redux'
import { State } from '../../store/rootReducer'
import { useAppSelector } from '../../hooks/store'
import { DisplaySigner } from '../DisplaySigner'
import { Meta } from '../../types'
import { extractFileExtensions } from '../../utils/file'
@ -45,7 +44,7 @@ export const UsersDetails = ({ meta }: UsersDetailsProps) => {
signedStatus,
isValid
} = useSigitMeta(meta)
const { usersPubkey } = useSelector((state: State) => state.auth)
const { usersPubkey } = useAppSelector((state) => state.auth)
const userCanSign =
typeof usersPubkey !== 'undefined' &&
signers.includes(hexToNpub(usersPubkey))

View File

@ -1,6 +1,5 @@
import { Typography } from '@mui/material'
import { useSelector } from 'react-redux'
import { State } from '../store/rootReducer'
import { useAppSelector } from '../hooks/store'
import styles from './username.module.scss'
import { AvatarIconButton } from './UserAvatarIconButton'
@ -16,7 +15,7 @@ type Props = {
* Clicking will open the menu.
*/
const Username = ({ username, avatarContent, handleClick }: Props) => {
const hexKey = useSelector((state: State) => state.auth.usersPubkey)
const hexKey = useAppSelector((state) => state.auth.usersPubkey)
return (
<div className={styles.container}>

View File

@ -8,14 +8,13 @@ import { useEffect, useRef, useState } from 'react'
import { DndProvider, useDrag, useDrop } from 'react-dnd'
import { MultiBackend } from 'react-dnd-multi-backend'
import { HTML5toTouch } from 'rdndmb-html5-to-touch'
import { useSelector } from 'react-redux'
import { useAppSelector } from '../../hooks/store'
import { useLocation, useNavigate } from 'react-router-dom'
import { toast } from 'react-toastify'
import { LoadingSpinner } from '../../components/LoadingSpinner'
import { UserAvatar } from '../../components/UserAvatar'
import { MetadataController, NostrController } from '../../controllers'
import { appPrivateRoutes } from '../../routes'
import { State } from '../../store/rootReducer'
import {
CreateSignatureEventContent,
Meta,
@ -98,7 +97,7 @@ export const CreatePage = () => {
const signers = users.filter((u) => u.role === UserRole.signer)
const viewers = users.filter((u) => u.role === UserRole.viewer)
const usersPubkey = useSelector((state: State) => state.auth.usersPubkey)
const usersPubkey = useAppSelector((state) => state.auth.usersPubkey)
const nostrController = NostrController.getInstance()

View File

@ -3,14 +3,13 @@ import { launch as launchNostrLoginDialog } from 'nostr-login'
import { Button, Divider, TextField } from '@mui/material'
import { getPublicKey, nip19 } from 'nostr-tools'
import { useEffect, useState } from 'react'
import { useDispatch } from 'react-redux'
import { useAppDispatch } from '../../hooks/store'
import { useNavigate, useSearchParams } from 'react-router-dom'
import { toast } from 'react-toastify'
import { LoadingSpinner } from '../../components/LoadingSpinner'
import { AuthController } from '../../controllers'
import { updateKeyPair, updateLoginMethod } from '../../store/actions'
import { LoginMethod } from '../../store/auth/types'
import { Dispatch } from '../../store/store'
import { hexToBytes } from '@noble/hashes/utils'
import styles from './styles.module.scss'
@ -18,7 +17,7 @@ import styles from './styles.module.scss'
export const Nostr = () => {
const [searchParams] = useSearchParams()
const dispatch: Dispatch = useDispatch()
const dispatch = useAppDispatch()
const navigate = useNavigate()
const authController = new AuthController()

View File

@ -3,13 +3,12 @@ import EditIcon from '@mui/icons-material/Edit'
import { Box, IconButton, SxProps, Theme, Typography } from '@mui/material'
import { Event, VerifiedEvent, kinds, nip19 } from 'nostr-tools'
import { useEffect, useMemo, useState } from 'react'
import { useSelector } from 'react-redux'
import { useAppSelector } from '../../hooks/store'
import { Link, useNavigate, useParams } from 'react-router-dom'
import { toast } from 'react-toastify'
import { LoadingSpinner } from '../../components/LoadingSpinner'
import { MetadataController } from '../../controllers'
import { getProfileSettingsRoute } from '../../routes'
import { State } from '../../store/rootReducer'
import { NostrJoiningBlock, ProfileMetadata } from '../../types'
import {
getNostrJoiningBlockNumber,
@ -33,9 +32,9 @@ export const ProfilePage = () => {
const [nostrJoiningBlock, setNostrJoiningBlock] =
useState<NostrJoiningBlock | null>(null)
const [profileMetadata, setProfileMetadata] = useState<ProfileMetadata>()
const metadataState = useSelector((state: State) => state.metadata)
const { usersPubkey } = useSelector((state: State) => state.auth)
const userRobotImage = useSelector((state: State) => state.userRobotImage)
const metadataState = useAppSelector((state) => state.metadata)
const { usersPubkey } = useAppSelector((state) => state.auth)
const userRobotImage = useAppSelector((state) => state.userRobotImage)
const [isUsersOwnProfile, setIsUsersOwnProfile] = useState(false)

View File

@ -7,10 +7,9 @@ import List from '@mui/material/List'
import ListItemIcon from '@mui/material/ListItemIcon'
import ListItemText from '@mui/material/ListItemText'
import ListSubheader from '@mui/material/ListSubheader'
import { useSelector } from 'react-redux'
import { useAppSelector } from '../../hooks/store'
import { Link } from 'react-router-dom'
import { appPrivateRoutes, getProfileSettingsRoute } from '../../routes'
import { State } from '../../store/rootReducer'
import { Container } from '../../components/Container'
import { Footer } from '../../components/Footer/Footer'
import ExtensionIcon from '@mui/icons-material/Extension'
@ -18,7 +17,7 @@ import { LoginMethod } from '../../store/auth/types'
export const SettingsPage = () => {
const theme = useTheme()
const { usersPubkey, loginMethod } = useSelector((state: State) => state.auth)
const { usersPubkey, loginMethod } = useAppSelector((state) => state.auth)
const listItem = (label: string, disabled = false) => {
return (
<>

View File

@ -18,8 +18,8 @@ import { toast } from 'react-toastify'
import { MetadataController, NostrController } from '../../../controllers'
import { NostrJoiningBlock, ProfileMetadata } from '../../../types'
import styles from './style.module.scss'
import { useDispatch, useSelector } from 'react-redux'
import { State } from '../../../store/rootReducer'
import { useAppDispatch, useAppSelector } from '../../../hooks/store'
import { LoadingButton } from '@mui/lab'
import { Dispatch } from '../../../store/store'
import { setMetadataEvent } from '../../../store/actions'
@ -41,7 +41,7 @@ export const ProfileSettingsPage = () => {
const { npub } = useParams()
const dispatch: Dispatch = useDispatch()
const dispatch: Dispatch = useAppDispatch()
const metadataController = MetadataController.getInstance()
const nostrController = NostrController.getInstance()
@ -51,12 +51,12 @@ export const ProfileSettingsPage = () => {
useState<NostrJoiningBlock | null>(null)
const [profileMetadata, setProfileMetadata] = useState<ProfileMetadata>()
const [savingProfileMetadata, setSavingProfileMetadata] = useState(false)
const metadataState = useSelector((state: State) => state.metadata)
const keys = useSelector((state: State) => state.auth?.keyPair)
const { usersPubkey, loginMethod, nostrLoginAuthMethod } = useSelector(
(state: State) => state.auth
const metadataState = useAppSelector((state) => state.metadata)
const keys = useAppSelector((state) => state.auth?.keyPair)
const { usersPubkey, loginMethod, nostrLoginAuthMethod } = useAppSelector(
(state) => state.auth
)
const userRobotImage = useSelector((state: State) => state.userRobotImage)
const userRobotImage = useAppSelector((state) => state.userRobotImage)
const [isUsersOwnProfile, setIsUsersOwnProfile] = useState(false)

View File

@ -6,13 +6,12 @@ import _ from 'lodash'
import { MuiFileInput } from 'mui-file-input'
import { Event, verifyEvent } from 'nostr-tools'
import { useCallback, useEffect, useState } from 'react'
import { useSelector } from 'react-redux'
import { useAppSelector } from '../../hooks/store'
import { useLocation, useNavigate, useParams } from 'react-router-dom'
import { toast } from 'react-toastify'
import { LoadingSpinner } from '../../components/LoadingSpinner'
import { NostrController } from '../../controllers'
import { appPublicRoutes } from '../../routes'
import { State } from '../../store/rootReducer'
import { CreateSignatureEventContent, Meta, SignedEvent } from '../../types'
import {
decryptArrayBuffer,
@ -54,7 +53,7 @@ import {
SigitFile
} from '../../utils/file.ts'
import { ARRAY_BUFFER, DEFLATE } from '../../utils/const.ts'
import { useAppSelector } from '../../hooks/store.ts'
enum SignedStatus {
Fully_Signed,
User_Is_Next_Signer,
@ -129,7 +128,7 @@ export const SignPage = () => {
// This state variable indicates whether the logged-in user is a signer, a creator, or neither.
const [isSignerOrCreator, setIsSignerOrCreator] = useState(false)
const usersPubkey = useSelector((state: State) => state.auth.usersPubkey)
const usersPubkey = useAppSelector((state) => state.auth.usersPubkey)
const nostrController = NostrController.getInstance()
const [currentUserMarks, setCurrentUserMarks] = useState<CurrentUserMark[]>(

View File

@ -27,8 +27,7 @@ import {
groupMarksByFileNamePage,
inPx
} from '../../utils/pdf.ts'
import { State } from '../../store/rootReducer.ts'
import { useSelector } from 'react-redux'
import { useAppSelector } from '../../hooks/store'
import { getLastSignersSig } from '../../utils/sign.ts'
import { saveAs } from 'file-saver'
import { Container } from '../../components/Container'
@ -153,7 +152,7 @@ const SlimPdfView = ({
export const VerifyPage = () => {
const location = useLocation()
const usersPubkey = useSelector((state: State) => state.auth.usersPubkey)
const usersPubkey = useAppSelector((state) => state.auth.usersPubkey)
const nostrController = NostrController.getInstance()