h3n3/cadhub
1
0
Fork 0
Code Issues 35 Pull Requests Packages Projects Releases Wiki Activity

Replace redwood flash with toaster

Browse Source 
https://community.redwoodjs.com/t/redwood-flash-is-being-replaced-with-react-hot-toast-how-to-update-your-project-v0-27-0/1921
Resolves #326.
This commit is contained in:
Kurt Hutten
2021-06-06 06:12:26 +10:00
parent 7caf857c98
commit a0b588000a
17 changed files with 50 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
app/web/src/components/AdminParts/AdminParts.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { Link, routes } from '@redwoodjs/router'
import { QUERY } from 'src/components/AdminPartsCell'
@@ -21,10 +22,6 @@ const truncate = (text) => {
return output
}
const jsonTruncate = (obj) => {
return truncate(JSON.stringify(obj, null, 2))
}
const timeTag = (datetime) => {
return (
<time dateTime={datetime} title={datetime}>
@@ -38,10 +35,9 @@ const checkboxInputTag = (checked) => {
}
const AdminParts = ({ parts }) => {
const { addMessage } = useFlash()
const [deletePart] = useMutation(DELETE_PART_MUTATION, {
onCompleted: () => {
addMessage('Part deleted.', { classes: 'rw-flash-success' })
toast.success('Part deleted.')
},
// This refetches the query on the list page. Read more about other ways to
// update the cache over here:

8
app/web/src/components/EditSubjectAccessRequestCell/EditSubjectAccessRequestCell.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { navigate, routes } from '@redwoodjs/router'
import SubjectAccessRequestForm from 'src/components/SubjectAccessRequestForm'
@@ -33,15 +34,12 @@ const UPDATE_SUBJECT_ACCESS_REQUEST_MUTATION = gql`
export const Loading = () => <div>Loading...</div>
export const Success = ({ subjectAccessRequest }) => {
const { addMessage } = useFlash()
const [updateSubjectAccessRequest, { loading, error }] = useMutation(
UPDATE_SUBJECT_ACCESS_REQUEST_MUTATION,
{
onCompleted: () => {
navigate(routes.subjectAccessRequests())
addMessage('SubjectAccessRequest updated.', {
classes: 'rw-flash-success',
})
toast.success('SubjectAccessRequest updated.')
},
}
)

6
app/web/src/components/EditUserCell/EditUserCell.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { navigate, routes } from '@redwoodjs/router'
import UserProfile from 'src/components/UserProfile'
@@ -33,11 +34,10 @@ export const Empty = () => <div className="h-full">Empty</div>
export const Failure = ({ error }) => <div>Error: {error.message}</div>
export const Success = ({ user, refetch, variables: { isEditable } }) => {
const { addMessage } = useFlash()
const [updateUser, { loading, error }] = useMutation(UPDATE_USER_MUTATION, {
onCompleted: ({ updateUserByUserName }) => {
navigate(routes.user({ userName: updateUserByUserName.userName }))
addMessage('User updated.', { classes: 'rw-flash-success' })
toast.success('User updated.')
},
})

8
app/web/src/components/IdePartCell/IdePartCell.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { navigate, routes } from '@redwoodjs/router'
import IdeCascadeStudio from 'src/components/IdeCascadeStudio'
import { QUERY as UsersPartsQuery } from 'src/components/PartsOfUserCell'
@@ -46,11 +47,10 @@ export const Loading = () => <div>Loading...</div>
export const Empty = () => <div>Part not found</div>
export const Success = ({ part, refetch }) => {
const { addMessage } = useFlash()
const { user } = useUser()
const [updatePart, { loading, error }] = useMutation(UPDATE_PART_MUTATION, {
onCompleted: () => {
addMessage('Part updated.', { classes: 'rw-flash-success fixed w-screen z-10' })
toast.success('Part updated.')
},
})
const [forkPart] = useMutation(FORK_PART_MUTATION, {
@@ -67,7 +67,7 @@ export const Success = ({ part, refetch }) => {
partTitle: forkPart?.title,
})
)
addMessage('Part Forked.', { classes: 'rw-flash-success' })
toast.success('Part Forked.')
},
})

8
app/web/src/components/IdeToolbar/IdeToolbar.js
View File

@@ -4,7 +4,8 @@ import OutBound from 'src/components/OutBound'
import ReactGA from 'react-ga'
import { Link, routes, navigate } from '@redwoodjs/router'
import { useAuth } from '@redwoodjs/auth'
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import Button from 'src/components/Button'
import ImageUploader from 'src/components/ImageUploader'
@@ -43,7 +44,6 @@ const IdeToolbar = ({
}
})
const { addMessage } = useFlash()
const [forkPart] = useMutation(FORK_PART_MUTATION, {
refetchQueries: [
{
@@ -86,9 +86,7 @@ const IdeToolbar = ({
partTitle: data?.forkPart?.title,
})
)
addMessage(`Part created with title: ${data?.forkPart?.title}.`, {
classes: 'rw-flash-success',
})
toast.success(`Part created with title: ${data?.forkPart?.title}.`)
} else if (isAuthenticated) onSave()
else recordedLogin()
}

5
app/web/src/components/LoginModal/LoginModal.js
View File

@@ -6,13 +6,12 @@ import InputTextForm from 'src/components/InputTextForm'
import OutBound from 'src/components/OutBound'
import { Form, Submit } from '@redwoodjs/forms'
import { useAuth } from '@redwoodjs/auth'
import { useFlash } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { Link, routes } from '@redwoodjs/router'
import { subscribe } from 'src/helpers/subscribe'
const LoginModal = ({ open, onClose, shouldStartWithSignup = false }) => {
const { logIn, signUp } = useAuth()
const { addMessage } = useFlash()
const [tab, setTab] = useState(shouldStartWithSignup ? 0 : 1)
const onTabChange = (_, newValue) => {
@@ -26,7 +25,7 @@ const LoginModal = ({ open, onClose, shouldStartWithSignup = false }) => {
try {
setError('')
if (checkBox) {
subscribe({ email, addMessage })
subscribe({ email, addMessage: (msg) => toast.error(msg) })
}
await signUp({
email,

10
app/web/src/components/PartCell/PartCell.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { navigate, routes } from '@redwoodjs/router'
import { useAuth } from '@redwoodjs/auth'
@@ -113,7 +114,6 @@ export const Failure = ({ error }) => <div>Error: {error.message}</div>
export const Success = ({ userPart, variables: { isEditable }, refetch }) => {
const { currentUser } = useAuth()
const { addMessage } = useFlash()
const [updatePart, { loading, error }] = useMutation(UPDATE_PART_MUTATION, {
onCompleted: ({ updatePart }) => {
navigate(
@@ -122,7 +122,7 @@ export const Success = ({ userPart, variables: { isEditable }, refetch }) => {
partTitle: updatePart.title,
})
)
addMessage('Part updated.', { classes: 'rw-flash-success' })
toast.success('Part updated.')
},
})
const [createPart] = useMutation(CREATE_PART_MUTATION, {
@@ -133,7 +133,7 @@ export const Success = ({ userPart, variables: { isEditable }, refetch }) => {
partTitle: createPart?.title,
})
)
addMessage('Part Created.', { classes: 'rw-flash-success' })
toast.success('Part Created.')
},
})
const onSave = async (id, input) => {
@@ -147,7 +147,7 @@ export const Success = ({ userPart, variables: { isEditable }, refetch }) => {
const [deletePart] = useMutation(DELETE_PART_MUTATION, {
onCompleted: ({ deletePart }) => {
navigate(routes.home())
addMessage('Part deleted.', { classes: 'rw-flash-success' })
toast.success('Part deleted.')
},
})

8
app/web/src/components/SubjectAccessRequest/SubjectAccessRequest.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { Link, routes, navigate } from '@redwoodjs/router'
import { QUERY } from 'src/components/SubjectAccessRequestsCell'
@@ -32,15 +33,12 @@ const checkboxInputTag = (checked) => {
}
const SubjectAccessRequest = ({ subjectAccessRequest }) => {
const { addMessage } = useFlash()
const [deleteSubjectAccessRequest] = useMutation(
DELETE_SUBJECT_ACCESS_REQUEST_MUTATION,
{
onCompleted: () => {
navigate(routes.subjectAccessRequests())
addMessage('SubjectAccessRequest deleted.', {
classes: 'rw-flash-success',
})
toast.success('SubjectAccessRequest deleted.')
},
// This refetches the query on the list page. Read more about other ways to
// update the cache over here:

8
app/web/src/components/SubjectAccessRequests/SubjectAccessRequests.js
View File

@@ -1,4 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
import { Link, routes } from '@redwoodjs/router'
import { QUERY } from 'src/components/SubjectAccessRequestsCell'
@@ -38,14 +39,11 @@ const checkboxInputTag = (checked) => {
}
const SubjectAccessRequestsList = ({ subjectAccessRequests }) => {
const { addMessage } = useFlash()
const [deleteSubjectAccessRequest] = useMutation(
DELETE_SUBJECT_ACCESS_REQUEST_MUTATION,
{
onCompleted: () => {
addMessage('SubjectAccessRequest deleted.', {
classes: 'rw-flash-success',
})
toast.success('SubjectAccessRequest deleted.')
},
// This refetches the query on the list page. Read more about other ways to
// update the cache over here:

7
app/web/src/components/Users/Users.js
View File

@@ -1,5 +1,5 @@
import { useMutation, useFlash } from '@redwoodjs/web'
import { Link, routes } from '@redwoodjs/router'
import { useMutation } from '@redwoodjs/web'
import { toast } from '@redwoodjs/web/toast'
const DELETE_USER_MUTATION = gql`
mutation DeleteUserMutation($id: String!) {
@@ -36,10 +36,9 @@ const checkboxInputTag = (checked) => {
}
const UsersList = ({ users }) => {
const { addMessage } = useFlash()
const [deleteUser] = useMutation(DELETE_USER_MUTATION, {
onCompleted: () => {
addMessage('User deleted.', { classes: 'rw-flash-success' })
toast.success('User deleted.')
},
})