Pre-deployment

web/src/pages/AboutPage/AboutPage.js

@@ -0,0 +1,15 @@
+import { Link,routes } from '@redwoodjs/router'
+import BlogLayout from 'src/layouts/BlogLayout'
+
+const AboutPage = () => {
+  return (
+    <BlogLayout>
+      <p>
+        This site was created to demonstrate my mastery of Redwood: Look on my
+        works, ye mighty, and despair!
+      </p>
+    </BlogLayout>
+  )
+}
+
+export default AboutPage

web/src/pages/AboutPage/AboutPage.stories.js

@@ -0,0 +1,7 @@
+import AboutPage from './AboutPage'
+
+export const generated = () => {
+  return <AboutPage />
+}
+
+export default { title: 'Pages/AboutPage' }

web/src/pages/AboutPage/AboutPage.test.js

@@ -0,0 +1,11 @@
+import { render } from '@redwoodjs/testing'
+
+import AboutPage from './AboutPage'
+
+describe('AboutPage', () => {
+  it('renders successfully', () => {
+    expect(() => {
+      render(<AboutPage />)
+    }).not.toThrow()
+  })
+})

web/src/pages/BlogPostPage/BlogPostPage.js

@@ -0,0 +1,12 @@
+import BlogLayout from 'src/layouts/BlogLayout'
+import BlogPostCell from 'src/components/BlogPostCell'
+
+const BlogPostPage = ({ id }) => {
+  return (
+    <BlogLayout>
+      <BlogPostCell id={id} />
+    </BlogLayout>
+  )
+}
+
+export default BlogPostPage

web/src/pages/BlogPostPage/BlogPostPage.stories.js

@@ -0,0 +1,7 @@
+import BlogPostPage from './BlogPostPage'
+
+export const generated = () => {
+  return <BlogPostPage />
+}
+
+export default { title: 'Pages/BlogPostPage' }

web/src/pages/BlogPostPage/BlogPostPage.test.js

@@ -0,0 +1,11 @@
+import { render } from '@redwoodjs/testing'
+
+import BlogPostPage from './BlogPostPage'
+
+describe('BlogPostPage', () => {
+  it('renders successfully', () => {
+    expect(() => {
+      render(<BlogPostPage />)
+    }).not.toThrow()
+  })
+})

web/src/pages/ContactPage/ContactPage.js

@@ -0,0 +1,95 @@
+import {
+  Form,
+  TextField,
+  TextAreaField,
+  Submit,
+  FieldError,
+  Label,
+  FormError,
+} from '@redwoodjs/forms'
+import { Flash,useFlash,useMutation } from '@redwoodjs/web'
+import { useForm } from 'react-hook-form'
+import BlogLayout from 'src/layouts/BlogLayout'
+
+const CREATE_CONTACT = gql`
+  mutation CreateContactMutation($input: CreateContactInput!) {
+    createContact(input: $input) {
+      id
+    }
+  }
+`
+
+const ContactPage = () => {
+  const formMethods = useForm()
+  const { addMessage } = useFlash()
+
+  const [create,{ loading,error }] = useMutation(CREATE_CONTACT,{
+    onCompleted: () => {
+      addMessage('Thank you for your submission!',{
+        style: { backgroundColor: 'green',color: 'white',padding: '1rem' },
+      })
+      formMethods.reset()
+    },
+  })
+
+  const onSubmit = (data) => {
+    create({ variables: { input: data } })
+    console.log(data)
+  }
+
+  return (
+    <BlogLayout>
+      <Flash timeout={1000} />
+      <Form
+        onSubmit={onSubmit}
+        validation={{ mode: 'onBlur' }}
+        error={error}
+        formMethods={formMethods}
+      >
+        <FormError
+          error={error}
+          wrapperStyle={{ color: 'red',backgroundColor: 'lavenderblush' }}
+        />
+        <Label name="name" errorClassName="error">
+          Name
+        </Label>
+        <TextField
+          name="name"
+          validation={{ required: true }}
+          errorClassName="error"
+        />
+        <FieldError name="name" className="error" />
+
+        <Label name="name" errorClassName="error">
+          Email
+        </Label>
+        <TextField
+          name="email"
+          validation={{
+            required: true,
+            pattern: {
+              value: /[^@]+@[^.]+\..+/,
+              message: 'Please enter a valid email address',
+            },
+          }}
+          errorClassName="error"
+        />
+        <FieldError name="email" className="error" />
+
+        <Label name="name" errorClassName="error">
+          Message
+        </Label>
+        <TextAreaField
+          name="message"
+          validation={{ required: true }}
+          errorClassName="error"
+        />
+        <FieldError name="message" className="error" />
+
+        <Submit disabled={loading}>Save</Submit>
+      </Form>
+    </BlogLayout>
+  )
+}
+
+export default ContactPage

web/src/pages/ContactPage/ContactPage.stories.js

@@ -0,0 +1,7 @@
+import ContactPage from './ContactPage'
+
+export const generated = () => {
+  return <ContactPage />
+}
+
+export default { title: 'Pages/ContactPage' }

web/src/pages/ContactPage/ContactPage.test.js

@@ -0,0 +1,11 @@
+import { render } from '@redwoodjs/testing'
+
+import ContactPage from './ContactPage'
+
+describe('ContactPage', () => {
+  it('renders successfully', () => {
+    expect(() => {
+      render(<ContactPage />)
+    }).not.toThrow()
+  })
+})

web/src/pages/EditPostPage/EditPostPage.js

@@ -0,0 +1,12 @@
+import PostsLayout from 'src/layouts/PostsLayout'
+import EditPostCell from 'src/components/EditPostCell'
+
+const EditPostPage = ({ id }) => {
+  return (
+    <PostsLayout>
+      <EditPostCell id={id} />
+    </PostsLayout>
+  )
+}
+
+export default EditPostPage

web/src/pages/HomePage/HomePage.js

@@ -0,0 +1,12 @@
+import BlogLayout from 'src/layouts/BlogLayout'
+import BlogPostsCell from 'src/components/BlogPostsCell'
+
+const HomePage = () => {
+  return (
+    <BlogLayout>
+      <BlogPostsCell />
+    </BlogLayout>
+  )
+}
+
+export default HomePage

web/src/pages/HomePage/HomePage.stories.js

@@ -0,0 +1,7 @@
+import HomePage from './HomePage'
+
+export const generated = () => {
+  return <HomePage />
+}
+
+export default { title: 'Pages/HomePage' }

web/src/pages/HomePage/HomePage.test.js

@@ -0,0 +1,11 @@
+import { render } from '@redwoodjs/testing'
+
+import HomePage from './HomePage'
+
+describe('HomePage', () => {
+  it('renders successfully', () => {
+    expect(() => {
+      render(<HomePage />)
+    }).not.toThrow()
+  })
+})

web/src/pages/NewPostPage/NewPostPage.js

@@ -0,0 +1,12 @@
+import PostsLayout from 'src/layouts/PostsLayout'
+import NewPost from 'src/components/NewPost'
+
+const NewPostPage = () => {
+  return (
+    <PostsLayout>
+      <NewPost />
+    </PostsLayout>
+  )
+}
+
+export default NewPostPage

web/src/pages/PostPage/PostPage.js

@@ -0,0 +1,12 @@
+import PostsLayout from 'src/layouts/PostsLayout'
+import PostCell from 'src/components/PostCell'
+
+const PostPage = ({ id }) => {
+  return (
+    <PostsLayout>
+      <PostCell id={id} />
+    </PostsLayout>
+  )
+}
+
+export default PostPage

web/src/pages/PostsPage/PostsPage.js

@@ -0,0 +1,12 @@
+import PostsLayout from 'src/layouts/PostsLayout'
+import PostsCell from 'src/components/PostsCell'
+
+const PostsPage = () => {
+  return (
+    <PostsLayout>
+      <PostsCell />
+    </PostsLayout>
+  )
+}
+
+export default PostsPage