mock data

package.json

@@ -5,5 +5,8 @@
     "skiff-pages-drive",
     "skiff-calendar"
   ],
-  "packageManager": "[email protected]"
+  "packageManager": "[email protected]",
+  "scripts": {
+    "build:lib": "yarn workspace skiff-libs run build"
+  }
 }

skiff-mail-web/README.md

@@ -1,24 +1,14 @@
 # Skemail Web App
 
-
 ## Introduction
+
 The Skemail frontend uses the [Next.js](https://nextjs.org/docs) framework, which build on top of React and adds features like [file-based routing](https://nextjs.org/docs/routing/introduction), a [built-in API](https://nextjs.org/docs/routing/introduction), [server-side rendering](https://nextjs.org/docs/basic-features/data-fetching/get-server-side-props), and many others.
 
 ## Dev Setup
-First, copy the `.env.example` file into a `.env` file so the app has the proper env vars setup.
-
-```bash
-cp apps/skemail-web/.env.example apps/skemail-web/.env
-```
-
-If you followed the instructions in the root [README.md](../../README.md) (the `make` commands), the `skemail-web` container should be running at http://localhost:4200.
-
-You can also run the app locally if you're running into issues with the Docker container.
 
 ```bash
-docker stop skemail-web
 yarn
-cd apps/skemail-web
+cd skiff-mail-web
 yarn dev
 ```
 
@@ -28,4 +18,4 @@ Within a React component, use a hook in [graphql.tsx](generated/graphql.tsx) to
 
 If you're in a `.ts` file or working on server-side code, import the [ApolloClient](apollo/client.ts) directly and use `client.query` or `client.mutate`.
 
-To add a new query or mutation, add it to the [queries.graphql](graphql/queries.graphql) or [mutations.graphql](graphql/mutations.graphql) file and run `make skemail-web/codegen` at the root.
+To add a new query or mutation, add it to the [queries.graphql](graphql/queries.graphql) or [mutations.graphql](graphql/mutations.graphql) file and run `make skiff-mail-web/codegen` at the root.

skiff-mail-web/__mocks__/mockApiResponse.ts

@@ -0,0 +1,158 @@
+export const MOCK_MAILBOX_REQUEST = {
+  data: {
+    mailbox: {
+      threads: [
+        {
+          threadID: '80d21e74-635e-4a4b-8197-5d59cddcede4',
+          attributes: {
+            read: false,
+            systemLabels: ['INBOX'],
+            userLabels: [
+              {
+                labelID: 'cef00e47-32c7-464e-9c62-e4006a473de4',
+                color: 'blue',
+                labelName: '[email protected]',
+                variant: 'ALIAS',
+                __typename: 'UserLabel'
+              }
+            ],
+            __typename: 'ThreadAttributes'
+          },
+          emails: [
+            {
+              id: '7e678159-e787-4702-bb7f-5b853a8131c3',
+              attachmentMetadata: [],
+              createdAt: 1688763712253,
+              from: {
+                name: 'Skiff Team',
+                address: '[email protected]',
+                blocked: false,
+                __typename: 'AddressObject'
+              },
+              to: [
+                {
+                  name: null,
+                  address: '[email protected]',
+                  blocked: null,
+                  __typename: 'AddressObject'
+                }
+              ],
+              cc: [],
+              bcc: [],
+              replyTo: null,
+              encryptedSessionKey: {
+                encryptedSessionKey:
+                  'dXMTOAulXP57tvrlCkPxZgxSelgcW4ZctIjoKfTADCvLcNGqurPUIRi6thRsfXLIPyz3iworuRLBdJrK7FFoCAfvHlsf5emX3cBDgyHL+gKcDnGe',
+                encryptedBy: {
+                  key: 'cqo/LISTMKXxpWvt6Mdgqhw6cO8mSnEg+8DwFHvM6yA='
+                },
+                __typename: 'EncryptedSessionKeyOutput'
+              },
+              decryptedSubject: 'Welcome to Skiff Mail',
+              decryptedAttachments: [],
+              decryptedTextSnippet:
+                'Skiff Mail is end-to-end encrypted email that protects your inbox and gives you the power to communi',
+              decryptedText:
+                'Skiff Mail is end-to-end encrypted email that protects your inbox and gives you the power to communicate freely.',
+              encryptedSubject: {
+                encryptedData:
+                  'LgUwLjIuMAUwLjEuMBNza2VtYWlsLm1haWxTdWJqZWN0DDJEor98rhkM3G3WOgDIRNumWOOY0iLT4Qsp1n143gGZ3B2f4pIAqyWI4DE8xaYF5IOWSmQ=',
+                __typename: 'EncryptedDataOutput'
+              },
+              encryptedTextSnippet: {
+                encryptedData:
+                  'KwUwLjIuMAUwLjEuMBBza2VtYWlsLm1haWxUZXh0DJ3qds7GLZxJSR+VcwC2ApvYpkgSoZemVU4EjqPJ93Gb6UnwJxnTVd3+n87+bzX8ePkKScd1mcMsiWJRkIVf2kbqTrSWuazkqlvzQuE/i9CCFzlVgPZjg64ubZHhy9gdCfnbV5tMhS2Hd+jth7/0hhfMdGG0D2hZxxQaUYnHMwtjh//y',
+                __typename: 'EncryptedDataOutput'
+              },
+              scheduleSendAt: 1688763712247,
+              encryptedRawMimeUrl: null,
+              __typename: 'Email'
+            }
+          ],
+          emailsUpdatedAt: 1688763712393,
+          sentLabelUpdatedAt: null,
+          __typename: 'UserThread'
+        },
+        {
+          threadID: '6e62341b-3568-4770-b76d-dff0404fcf03',
+          attributes: {
+            read: false,
+            systemLabels: ['INBOX'],
+            userLabels: [
+              {
+                labelID: 'cef00e47-32c7-464e-9c62-e4006a473de4',
+                color: 'blue',
+                labelName: '[email protected]',
+                variant: 'ALIAS',
+                __typename: 'UserLabel'
+              }
+            ],
+            __typename: 'ThreadAttributes'
+          },
+          emails: [
+            {
+              id: 'ec41730e-8163-49b4-999b-ffae53921abc',
+              attachmentMetadata: [],
+              createdAt: 1688763712133,
+              from: {
+                name: 'Skiff Team',
+                address: '[email protected]',
+                blocked: false,
+                __typename: 'AddressObject'
+              },
+              to: [
+                {
+                  name: null,
+                  address: '[email protected]',
+                  blocked: null,
+                  __typename: 'AddressObject'
+                }
+              ],
+              cc: [],
+              bcc: [],
+              replyTo: null,
+              encryptedSessionKey: {
+                encryptedSessionKey:
+                  'keFs0IZ3UXKSMsuXBHKgnzsSCDWlG1IbNH33w2xCzLj58ai8g5WdOdfl30oKp7qHlKnYxi06W70uyNlHXGG8fmmM/DkLXQj0jB6WZNmyQ5p9eibp',
+                encryptedBy: {
+                  key: 'cqo/LISTMKXxpWvt6Mdgqhw6cO8mSnEg+8DwFHvM6yA='
+                },
+                __typename: 'EncryptedSessionKeyOutput'
+              },
+              decryptedSubject: 'Download the mobile and desktop apps',
+              decryptedAttachments: [],
+              decryptedTextSnippet:
+                'Skiff Mail is end-to-end encrypted email that protects your inbox and gives you the power to communi',
+              decryptedText:
+                'Skiff Mail is end-to-end encrypted email that protects your inbox and gives you the power to communicate freely.',
+              decryptedTextAsHtml:
+                'Skiff Mail is end-to-end encrypted email that protects your inbox and gives you the power to communicate freely.',
+              encryptedSubject: {
+                encryptedData:
+                  'LgUwLjIuMAUwLjEuMBNza2VtYWlsLm1haWxTdWJqZWN0DADSLHl8mVg610zgOgCV7ySHQbcY3EhxibuvkFZVaRbKHmB36bi+s/XW9gHIvty8PCo1athC30YVfDJeMqZgPZ5SKSQ=',
+                __typename: 'EncryptedDataOutput'
+              },
+              encryptedTextSnippet: {
+                encryptedData:
+                  'KwUwLjIuMAUwLjEuMBBza2VtYWlsLm1haWxUZXh0DGzuiFkKiU0XhbiYtQAlxLv7GZ6q4v6FUffnat+eCn1iFVfS7cjtrXtXENE4WcLfATDC5keHiZyPWHGEoY6heYuHhLRVapTDhbySqMTW1/nRiD9eyoJ07t5TY5DwSryCEwUOOjqHFKiJD9wc1RqeIXJ7bAoHDnXcXRrIMEkVbGuaiXQM',
+                __typename: 'EncryptedDataOutput'
+              },
+              scheduleSendAt: 1688763712126,
+              encryptedRawMimeUrl: null,
+              __typename: 'Email'
+            }
+          ],
+          emailsUpdatedAt: 1688763712250,
+          sentLabelUpdatedAt: null,
+          __typename: 'UserThread'
+        }
+      ],
+      pageInfo: {
+        hasNextPage: false,
+        cursor: null,
+        __typename: 'MailboxPageInfo'
+      },
+      __typename: 'Mailbox'
+    }
+  }
+};

skiff-mail-web/apollo/client.ts

@@ -98,7 +98,7 @@ const retryLink = new RetryLink();
 const client = new ApolloClient({
   link: from([authLink, retryLink, cloudflareChallengeRedirectLink, link]),
   cache,
-  name: 'skemail-web',
+  name: 'skiff-mail-web',
   version: process.env.NEXT_PUBLIC_GIT_HASH
 });
 

skiff-mail-web/components/mailbox/Mailbox.tsx

@@ -82,6 +82,7 @@ import { MAIL_LIST_CONTAINER_ID } from './consts';
 import { fadeInAnimation } from './Mailbox.styles';
 import { animateMailListHeader, MAIL_LIST_HEADER_ID, MailboxHeader, MOBILE_HEADER_HEIGHT } from './MailboxHeader';
 import useGatedMailboxData from './useGatedMailboxData';
+import { MOCK_MAILBOX_REQUEST } from '__mocks__/mockApiResponse';
 
 const ActivationPaneToggle = dynamic(() => import('./ActivationPane/ActivationPaneToggle'), { ssr: false });
 const LoadingMailbox = dynamic(() => import('./LoadingMailbox'), { ssr: false });
@@ -384,7 +385,7 @@ export const Mailbox = () => {
   const isScheduleSend = label === SystemLabels.ScheduleSend;
   const isImported = label === SystemLabels.Imported;
   const isAutoOpenLabel = isInbox || isSent || isScheduleSend;
-  const threads = isDrafts ? draftThreads : data?.mailbox?.threads ?? [];
+  const threads = isDrafts ? draftThreads : MOCK_MAILBOX_REQUEST.data.mailbox?.threads ?? [];
 
   const mostRecentThreadID = !!threads.length ? threads[0]?.threadID : undefined;
   const prevMostRecentThreadID = usePrevious(mostRecentThreadID);

skiff-mail-web/package.json

@@ -1,7 +1,6 @@
 {
-  "name": "skemail-web",
+  "name": "skiff-mail-web",
   "version": "0.1.0",
-  "private": true,
   "packageManager": "[email protected]",
   "scripts": {
     "analyze": "OPEN_ANALYZE=true yarn build",