Dwayne Harris
5 years ago
35 changed files with 442 additions and 181 deletions
-
105package-lock.json
-
3package.json
-
59src/actions/authentication.ts
-
15src/actions/directory.ts
-
35src/actions/registration.ts
-
10src/api/errors.ts
-
4src/api/fetch.ts
-
2src/components/app/app.tsx
-
2src/components/create-group-step/create-group-step.tsx
-
10src/components/create-group-step/index.ts
-
22src/components/create-user-step/index.ts
-
4src/components/forms/password-field/password-field.tsx
-
22src/components/notification-container/notification-container.tsx
-
2src/components/page-header/index.tsx
-
46src/components/pages/login/index.ts
-
44src/components/pages/login/login.tsx
-
4src/components/pages/register-group/index.ts
-
4src/components/pages/register/index.ts
-
31src/components/pages/self/index.ts
-
37src/components/pages/self/self.tsx
-
16src/components/pages/test/index.ts
-
26src/components/pages/test/test.tsx
-
18src/components/user-info/index.ts
-
9src/constants/index.ts
-
8src/hooks/index.ts
-
6src/reducers/authentication.ts
-
15src/selectors/authentication.ts
-
6src/selectors/directory.ts
-
19src/selectors/entities.ts
-
3src/selectors/requests.ts
-
2src/store/schemas.ts
-
5src/types/entities.ts
-
20src/types/store.ts
-
7src/utils/index.ts
-
2webpack.config.ts
@ -1,22 +1,27 @@ |
|||
|
|||
import { Dispatch } from 'redux' |
|||
import { connect } from 'react-redux' |
|||
import { getAuthenticated, getAuthenticatedUserId, getChecked } from 'src/selectors/authentication' |
|||
import { getEntity } from 'src/selectors/entities' |
|||
import { unauthenticate } from 'src/actions/authentication' |
|||
import { getAuthenticated, getChecked, getAuthenticatedUser } from 'src/selectors/authentication' |
|||
import { AppState } from 'src/types' |
|||
|
|||
import Self from './self' |
|||
|
|||
const mapStateToProps = (state: AppState) => { |
|||
const userId = getAuthenticatedUserId(state) |
|||
const user = userId ? getEntity(state, 'users', userId) : undefined |
|||
const mapStateToProps = (state: AppState) => ({ |
|||
checked: getChecked(state), |
|||
authenticated: getAuthenticated(state), |
|||
user: getAuthenticatedUser(state), |
|||
}) |
|||
|
|||
return { |
|||
checked: getChecked(state), |
|||
authenticated: getAuthenticated(state), |
|||
user, |
|||
} |
|||
} |
|||
const mapDispatchToProps = (dispatch: Dispatch) => ({ |
|||
logout: async () => { |
|||
localStorage.clear() |
|||
dispatch(unauthenticate()) |
|||
|
|||
window.location.href = '/' |
|||
}, |
|||
}) |
|||
|
|||
export default connect( |
|||
mapStateToProps |
|||
mapStateToProps, |
|||
mapDispatchToProps |
|||
)(Self) |
|||
@ -1,16 +0,0 @@ |
|||
import { connect } from 'react-redux' |
|||
import { showNotification } from 'src/actions/notifications' |
|||
import { AppThunkDispatch, NotificationType } from 'src/types' |
|||
|
|||
import Test from './test' |
|||
|
|||
const mapDispatchToProps = (dispatch: AppThunkDispatch) => ({ |
|||
show: async (type: NotificationType, content: string) => { |
|||
dispatch(showNotification(type, content)) |
|||
}, |
|||
}) |
|||
|
|||
export default connect( |
|||
null, |
|||
mapDispatchToProps |
|||
)(Test) |
|||
@ -1,26 +0,0 @@ |
|||
import React, { FC } from 'react' |
|||
import { NotificationType } from 'src/types' |
|||
|
|||
import PageHeader from 'src/components/page-header' |
|||
|
|||
interface Props { |
|||
show: (type: NotificationType, content: string) => void |
|||
} |
|||
|
|||
const Test: FC<Props> = ({ show }) => ( |
|||
<div> |
|||
<PageHeader title="Test Page" /> |
|||
|
|||
<div className="main-content"> |
|||
<p> |
|||
<button className="button is-success" onClick={() => show('success', 'You did it!!!!!')}>Show Success</button> |
|||
<br /><br /> |
|||
<button className="button is-info" onClick={() => show('info', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.')}>Show Info</button> |
|||
<br /><br /> |
|||
<button className="button is-danger" onClick={() => show('error', 'Fuck')}>Show Error</button> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
) |
|||
|
|||
export default Test |
|||
@ -1,20 +1,14 @@ |
|||
import { connect } from 'react-redux' |
|||
|
|||
import { getAuthenticated, getAuthenticatedUserId } from 'src/selectors/authentication' |
|||
import { getEntity } from 'src/selectors/entities' |
|||
import { AppState, User } from 'src/types' |
|||
import { getAuthenticated, getAuthenticatedUser } from 'src/selectors/authentication' |
|||
import { AppState } from 'src/types' |
|||
|
|||
import UserInfo from './user-info' |
|||
|
|||
const mapStateToProps = (state: AppState) => { |
|||
const userId = getAuthenticatedUserId(state) |
|||
const user = userId ? getEntity<User>(state, 'users', userId) : undefined |
|||
|
|||
return { |
|||
authenticated: getAuthenticated(state), |
|||
user, |
|||
} |
|||
} |
|||
const mapStateToProps = (state: AppState) => ({ |
|||
authenticated: getAuthenticated(state), |
|||
user: getAuthenticatedUser(state), |
|||
}) |
|||
|
|||
export default connect( |
|||
mapStateToProps |
|||
|
|||
@ -0,0 +1,8 @@ |
|||
import { useEffect } from 'react' |
|||
import { History } from 'history' |
|||
|
|||
export const useAuthenticationCheck = (checked: boolean, authenticated: boolean, history: History) => { |
|||
useEffect(() => { |
|||
if (checked && !authenticated) history.push('/login') |
|||
}, [checked, authenticated]) |
|||
} |
|||
@ -1,5 +1,18 @@ |
|||
import { AppState } from '../types' |
|||
import { denormalize } from 'normalizr' |
|||
import { createSelector } from 'reselect' |
|||
|
|||
import { userSchema } from 'src/store/schemas' |
|||
import { getEntityStore } from './entities' |
|||
import { AppState, User } from 'src/types' |
|||
|
|||
export const getChecked = (state: AppState) => state.authentication.checked |
|||
export const getAuthenticated = (state: AppState) => state.authentication.authenticated |
|||
export const getAuthenticatedUserId = (state: AppState) => state.authentication.userId |
|||
|
|||
export const getAuthenticatedUser = createSelector( |
|||
[getEntityStore, getAuthenticatedUserId], |
|||
(entities, userId) => { |
|||
if (!userId) return |
|||
return denormalize(userId, userSchema, entities) as User |
|||
} |
|||
) |
|||
@ -1,10 +1,19 @@ |
|||
import { AppState, Entity, EntityTypes } from '../types' |
|||
import { denormalize } from 'normalizr' |
|||
import { userSchema, groupSchema } from 'src/store/schemas' |
|||
import { AppState, Entity, EntityType } from '../types' |
|||
|
|||
export const getEntityStore = (state: AppState) => state.entities |
|||
|
|||
export const getEntity = <T extends Entity = Entity>(state: AppState, type: EntityTypes, id: string) => { |
|||
const store = getEntityStore(state) |
|||
const collection = store[type] |
|||
export const getEntity = <T extends Entity = Entity>(state: AppState, type: EntityType, id?: string) => { |
|||
if (!id) return |
|||
const entities = getEntityStore(state) |
|||
|
|||
return collection ? collection[id] as T : undefined |
|||
switch (type) { |
|||
case EntityType.User: |
|||
return denormalize(id, userSchema, entities) as T |
|||
case EntityType.Group: |
|||
return denormalize(id, groupSchema, entities) as T |
|||
default: |
|||
return |
|||
} |
|||
} |
|||
@ -0,0 +1,3 @@ |
|||
import { AppState, RequestKey } from 'src/types' |
|||
|
|||
export const getIsFetching = (state: AppState, key: RequestKey) => state.requests[key] ? state.requests[key].fetching : false |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue