sigmasternchen/threadule
1
0
Fork 0
mirror of https://github.com/sigmasternchen/threadule synced 2025-03-15 08:09:01 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixed problem with client state; added logout button

Browse source
This commit is contained in:
overflowerror 2021-08-15 18:20:58 +02:00
parent 534251626b
commit da771f6b9f
3 changed files with 30 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
frontend/src/auth/AuthProvider.tsx
View file

@ -9,7 +9,8 @@ type AuthState = {
user: User | null
login: (username: string, password: string) => Promise<User>
getClient: () => Client
logout: () => void
client: Client
}
const emptyAuthState = {
@ -19,7 +20,8 @@ const emptyAuthState = {
login: async () => {
throw "not implemented"
},
getClient: () => getClient()
logout: () => {},
client: getClient(),
}
const AuthContext = React.createContext<AuthState>(emptyAuthState)
@ -38,50 +40,59 @@ const initialSessionToken = localStorage.getItem(LOCAL_STORAGE_SESSION_TOKEN_KEY
const AuthProvider: FunctionComponent<AuthProviderProps> = ({children}) => {
const [loading, setLoading] = useState<boolean>(true)
const [client, setClient] = useState<Client>(getClient(initialSessionToken ? initialSessionToken : undefined))
const authenticationEndpoint = new AuthenticationEndpoint(client)
const [authState, setAuthState] = useState<AuthState>({
...emptyAuthState,
login: async (username: string, password: string): Promise<User> => {
let authenticationEndpoint = new AuthenticationEndpoint(authState.client)
const response = await authenticationEndpoint.login({
username: username,
password: password
})
// local new client
const tmpClient = getClient(response.token)
setClient(tmpClient)
localStorage.setItem(LOCAL_STORAGE_SESSION_TOKEN_KEY, response.token);
const client = getClient(response.token)
// local new authenticationEndpoint
const tmpAuthenticationEndpoint = new AuthenticationEndpoint(tmpClient)
const user = await tmpAuthenticationEndpoint.getUser()
authenticationEndpoint = new AuthenticationEndpoint(client)
const user = await authenticationEndpoint.getUser()
setAuthState({
...authState,
loggedIn: true,
user: user
user: user,
client: client
})
return user
},
getClient: () => {
return client
logout: () => {
localStorage.removeItem(LOCAL_STORAGE_SESSION_TOKEN_KEY)
setAuthState({
...authState,
loggedIn: false,
user: null,
client: getClient(),
})
// don't use DOM router
window.location.replace("/login")
}
})
useEffect(() => {
if (initialSessionToken) {
const client = getClient(initialSessionToken)
const authenticationEndpoint = new AuthenticationEndpoint(client)
authenticationEndpoint.getUser()
.then(user => {
setAuthState({
...authState,
loggedIn: true,
user: user
user: user,
client: client
})
setLoading(false)
})

5
frontend/src/components/MenuBar/index.tsx
View file

@ -9,7 +9,7 @@ type MenuBarProps = {
}
const MenuBar: FunctionComponent<MenuBarProps> = () => {
const { user } = useAuth()
const { user, logout } = useAuth()
const [anchorEl, setAnchorEl] = useState<HTMLElement|null>(null)
const open = Boolean(anchorEl);
@ -55,8 +55,7 @@ const MenuBar: FunctionComponent<MenuBarProps> = () => {
open={open}
onClose={handleClose}
>
<MenuItem onClick={handleClose}>Profile</MenuItem>
<MenuItem onClick={handleClose}>My account</MenuItem>
<MenuItem onClick={logout}>Logout</MenuItem>
</Menu>
</Toolbar>
</AppBar>

4
frontend/src/pages/Dashboard/index.tsx
View file

@ -23,8 +23,8 @@ const Dashboard: FunctionComponent<DashboardProps> = () => {
}
})
const {getClient} = useAuth()
const accountEndpoint = new AccountEndpoint(getClient())
const {client} = useAuth()
const accountEndpoint = new AccountEndpoint(client)
useEffect(() => {
accountEndpoint.getAll()