Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Bugfixes for Guest/Unverified Users #143

Merged
merged 7 commits into from
Feb 12, 2021
Merged

Bugfixes for Guest/Unverified Users #143

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
9f20826
Made it so you can't see the button to edit/delete recipes
m1771vw Feb 2, 2021
9c1298c
Added guest role to recipe detail to see recipe details. Disabled edi…
m1771vw Feb 3, 2021
8eac34a
Clicking on new recipe will open modal form is you aren't logged in yet
m1771vw Feb 9, 2021
ea84e79
Added login form to pop up if not logged in for recipe review
m1771vw Feb 10, 2021
2815f5d
Merge branch 'stage' into chore/unverified-bugfixes
m1771vw Feb 11, 2021
98b75ed
Merge branch 'stage' into chore/unverified-bugfixes
m1771vw Feb 11, 2021
ee2331f
Fixed typo and got rid of modal stuff in create recipe review
m1771vw Feb 12, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/components/Recipe/RecipeCard.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

46 changes: 24 additions & 22 deletions src/components/Recipe/RecipeDetails.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,14 @@ import RecipeReview from './Review/RecipeReview'
import { useHistory, useParams, Link, useRouteMatch } from 'react-router-dom'
import { roundToHalfOrWhole } from 'helper/math'
import CreateRecipeReview from './Review/CreateRecipeReview'
import { useAuth } from 'context/AuthContext'

const RecipeDetails = (props) => {
const history = useHistory()
const { url } = useRouteMatch()
const { id } = useParams()
const [, deleteRecipe] = useMutation(DELETE_RECIPES)

const { barista: userBarista } = useAuth()
const deleteRecipePressed = async () => {
await deleteRecipe({ id })
history.push(`/recipe`)
Expand Down Expand Up @@ -50,7 +51,6 @@ const RecipeDetails = (props) => {
recipe_reviews,
recipe_reviews_aggregate,
} = data.recipes_by_pk

return (
<div className='min-h-screen bg-gray-100'>
<main className='py-10'>
Expand All @@ -73,27 +73,31 @@ const RecipeDetails = (props) => {
<div>
<h1 className='text-2xl font-bold text-gray-900'>{name}</h1>
<p className='text-sm font-medium text-gray-500'>
Created by {barista?.display_name} on{' '}
Created by {barista?.display_name} on
<time dateTime={date_added}>{date_added.substring(0, 10)}</time>
</p>
</div>
</div>
<div className='mt-6 flex flex-col-reverse justify-stretch space-y-4 space-y-reverse sm:flex-row-reverse sm:justify-end sm:space-x-reverse sm:space-y-0 sm:space-x-3 md:mt-0 md:flex-row md:space-x-3'>
<button
onClick={deleteRecipePressed}
type='button'
className='inline-flex items-center justify-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blue-500'
>
Delete Recipe
</button>
<Link
to={`${url}/edit`}
type='button'
className='inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blue-500'
>
Edit Recipe
</Link>
</div>
{userBarista?.id === barista?.id ? (
<div className='mt-6 flex flex-col-reverse justify-stretch space-y-4 space-y-reverse sm:flex-row-reverse sm:justify-end sm:space-x-reverse sm:space-y-0 sm:space-x-3 md:mt-0 md:flex-row md:space-x-3'>
<button
onClick={deleteRecipePressed}
type='button'
className='inline-flex items-center justify-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blue-500'
>
Delete Recipe
</button>
<Link
to={`${url}/edit`}
type='button'
className='inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-blue-500'
>
Edit Recipe
</Link>
</div>
) : (
''
)}
</div>

<div className='mt-8 max-w-3xl mx-auto grid grid-cols-1 gap-6 sm:px-6 lg:max-w-7xl lg:grid-flow-col-dense lg:grid-cols-3'>
Expand All @@ -108,9 +112,7 @@ const RecipeDetails = (props) => {
>
Recipe Details
</h2>
<p className='mt-1 max-w-2xl text-sm text-gray-500'>
Personal details and application.
</p>
<p className='mt-1 max-w-2xl text-sm text-gray-500'></p>
</div>
<div className='border-t border-gray-200 px-4 py-5 sm:px-6'>
<dl className='grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2'>
Expand Down
55 changes: 2 additions & 53 deletions src/components/Recipe/Review/CreateRecipeReview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,14 @@ const CreateRecipeReview = ({ id }) => {
})
const { barista } = useAuth()
const [, insertRecipeReview] = useMutation(INSERT_RECIPE_REVIEW_ONE)

const onChangeGenerator = (attr) => (e) => {
setState({
...state,
[attr]: e.target.value,
})
}

const submitReview = async (e) => {
e.preventDefault()
const submitReview = async () => {
await insertRecipeReview({
object: {
barista_id: barista.id,
Expand Down Expand Up @@ -69,28 +67,13 @@ const CreateRecipeReview = ({ id }) => {
/>

<div className='mt-3 flex items-center justify-between'>
{/* <div className='group inline-flex items-start text-sm space-x-2 text-gray-500 hover:text-gray-900'>
<svg
className='flex-shrink-0 h-5 w-5 text-gray-400 group-hover:text-gray-500'
xmlns='http://www.w3.org/2000/svg'
viewBox='0 0 20 20'
fill='currentColor'
aria-hidden='true'
>
<path
fillRule='evenodd'
d='M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z'
clipRule='evenodd'
/>
</svg>
<span>Some HTML is okay.</span>
</div> */}
<button
onClick={submitReview}
className='inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500'
>
Add Review
</button>
)}
</div>
</form>
</div>
Expand All @@ -100,37 +83,3 @@ const CreateRecipeReview = ({ id }) => {
}

export default CreateRecipeReview
// <div>
// <div className='font-bold'>Create Review</div>
// <InputRow
// value={barista.display_name}
// readOnly={true}
// placeholder='Enter Barista'
// label='Barista'
// />
// <InputRow
// value={name}
// readOnly={true}
// placeholder='Enter Recipe'
// label='Recipe'
// />
// <InputRow
// value={state.rating}
// onChange={onChangeGenerator('rating')}
// placeholder='Enter Rating'
// label='Rating'
// />
// <InputRow
// value={state.comment}
// onChange={onChangeGenerator('comment')}
// placeholder='Enter Comment'
// label='Comment'
// />
// <button
// type='button'
// onClick={submitReview}
// className='mb-4 inline-flex items-center px-4 py-2 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-blue-600 hover:bg-blue-500 focus:outline-none focus:border-blue-700 focus:shadow-outline-blue active:bg-blue-700 transition ease-in-out duration-150'
// >
// submit review
// </button>
// </div>
45 changes: 29 additions & 16 deletions src/components/Recipe/Review/RecipeReview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,16 @@
import { useRouteMatch, Link } from 'react-router-dom'
import { DELETE_RECIPE_REVIEW } from 'queries'
import { useMutation } from 'urql'
import { useAuth } from 'context/AuthContext'

const RecipeReview = ({ recipe_reviews }) => {
const { url } = useRouteMatch()
const [, deleteReview] = useMutation(DELETE_RECIPE_REVIEW)
const deleteReviewPressed = async (id) => {
await deleteReview({ id })
}
const { barista: userBarista } = useAuth()

return (
<div>
<ul className='space-y-8'>
Expand Down Expand Up @@ -39,22 +42,32 @@ const RecipeReview = ({ recipe_reviews }) => {
<span className='text-gray-500 font-medium'>
{n.date_added.substring(0, 10)}
</span>
<span className='text-gray-500 font-medium'>&middot;</span>
<Link
to={`${url}/review/${n.id}/edit`}
type='button'
className='text-gray-900 font-medium'
>
Edit
</Link>
<span className='text-gray-500 font-medium'>&middot;</span>
<button
onClick={() => deleteReviewPressed(n.id)}
type='button'
className='text-gray-900 font-medium'
>
Delete
</button>
{userBarista?.id === n.barista?.id ? (
<div>
<span className='text-gray-500 font-medium'>
&middot;
</span>
<Link
to={`${url}/review/${n.id}/edit`}
type='button'
className='text-gray-900 font-medium'
>
Edit
</Link>
<span className='text-gray-500 font-medium'>
&middot;
</span>
<button
onClick={() => deleteReviewPressed(n.id)}
type='button'
className='text-gray-900 font-medium'
>
Delete
</button>
</div>
) : (
''
)}
</div>
</div>
</div>
Expand Down