"yarn build" finally working

frontend/pages/403.js

@@ -1,3 +1,4 @@
+import { React } from "react";
 import FourOThree from "../src/components/FourOThree";
 
 const Page403 = () => {

frontend/pages/404.js

@@ -1,5 +1,4 @@
-
-import { jsx } from "@emotion/react";
+import { React } from "react";
 import FourOFour from "../src/components/FourOFour";
 
 const Page404 = () => {

frontend/pages/_document.js

@@ -1,6 +1,4 @@
-
-import { jsx } from "@emotion/react";
-
+import { React } from "react";
 import Document, { Html, Head, Main, NextScript } from "next/document";
 
 export default class MyDocument extends Document {

frontend/pages/api/hello.ts

@@ -1,13 +0,0 @@
-// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-import type { NextApiRequest, NextApiResponse } from 'next'
-
-type Data = {
-  name: string
-}
-
-export default function handler(
-  req: NextApiRequest,
-  res: NextApiResponse<Data>
-) {
-  res.status(200).json({ name: 'John Doe' })
-}

frontend/pages/index.jsx

@@ -17,7 +17,7 @@ import {
 import { Grid, GridItem } from "@chakra-ui/react";
 import { useUser, useAnalytics, useModals, useRouter } from "../src/core/hooks";
 import { openPopupWidget, InlineWidget } from "react-calendly";
-import TrustedBadge from "../src/components/TrustedBadge"
+import TrustedBadge from "../src/components/TrustedBadge";
 import { getLayout } from "../src/layouts";
 
 const TEXT_PROPS = {

frontend/pages/pricing.js

@@ -30,7 +30,7 @@ function PriceWrapper({ children }) {
   );
 }
 
-const Pricing = (props) => {
+const Pricing = () => {
   return (
     <Box py={12} minH="100vh">
       <VStack spacing={2} textAlign="center">
@@ -225,20 +225,6 @@ export async function getStaticProps() {
       "https://s3.amazonaws.com/static.simiotics.com/landing/aviator-2.svg",
   };
 
-//   const assetPreload = Object.keys(assets).map((key) => {
-//     return {
-//       rel: "preload",
-//       href: assets[key],
-//       as: "image",
-//     };
-//   });
-//   const preconnects = [
-//     { rel: "preconnect", href: "https://s3.amazonaws.com" },
-//     { rel: "preconnect", href: "https://assets.calendly.com/" },
-//   ];
-
-//   const preloads = assetPreload.concat(preconnects);
-
   return {
     props: { metaTags },
   };

frontend/pages/subscriptions.js

@@ -15,7 +15,6 @@ import {
   ModalOverlay,
   ModalContent,
 } from "@chakra-ui/react";
-import { headingStyle } from "./index";
 import NewSubscription from "../src/components/NewSubscription";
 import { AiOutlinePlusCircle } from "react-icons/ai";
 
@@ -26,6 +25,18 @@ const Subscriptions = () => {
 
   document.title = `My Subscriptions`;
 
+  // TODO(zomglings): This should be imported from some common location. For now, copied from
+  // pages/account/security.js. It was attempting to get imported from "./index", but is not defined
+  // there.
+  const headingStyle = {
+    as: "h2",
+    pt: 2,
+    mb: 4,
+    borderBottom: "solid",
+    borderColor: "primary.50",
+    borderBottomWidth: "2px",
+  };
+
   const newSubscriptionClicked = (isForFree) => {
     setIsAddingFreeSubscription(isForFree);
     onOpen();

frontend/src/components/AccountNavbar.js

@@ -1,6 +1,5 @@
-import { jsx } from "@emotion/react";
 import { useUser, useRouter } from "../core/hooks";
-import { useEffect, Fragment, useState } from "react";
+import { React, useEffect, Fragment, useState } from "react";
 import { Heading, Center, Spinner, Link, Button } from "@chakra-ui/react";
 import RouterLink from "next/link";
 const ACCOUNT_SCREEN_WIDGETS = {

frontend/src/components/AppNavbar.js

@@ -21,9 +21,7 @@ import {
 } from "@chakra-ui/react";
 import {
   HamburgerIcon,
-  PlusSquareIcon,
   QuestionOutlineIcon,
-  BellIcon,
   ArrowLeftIcon,
   ArrowRightIcon,
 } from "@chakra-ui/icons";

frontend/src/components/ChangePassword.jsx

@@ -1,5 +1,4 @@
-import { jsx } from "@emotion/react";
-import { useState, useEffect } from "react";
+import { React, useState, useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { useChangePassword, useRouter } from "../core/hooks";
 import {

frontend/src/components/ContentBlock.js

@@ -1,66 +0,0 @@
-import { jsx } from "@emotion/react";
-import { GridItem } from "@chakra-ui/react";
-import { Heading, Text, Image } from "@chakra-ui/react";
-import { Fragment } from "react";
-
-const Block = (content) => {
-  const TitleRef = content.PrevTitle
-    ? `#${content.PrevTitle}-${content.title}`
-    : `#${content.title}`;
-
-  var HeaderStyle = content.PrevTitle
-    ? { as: "h2", fontSize: "3xl" }
-    : { as: "h1", fontSize: "4xl" };
-
-  return (
-    <Fragment>
-      {content.title && (
-        <GridItem colSpan="12" px="8.3%" py={1} textAlign="center">
-          <Heading
-            id={TitleRef}
-            pt={16}
-            pb={4}
-            fontWeight="200"
-            {...HeaderStyle}
-          >
-            {content.title}
-          </Heading>
-        </GridItem>
-      )}
-      {content.body.map((element, idx) => {
-        if ("text" in element) {
-          return (
-            <GridItem key={idx} colSpan="10" px="8.3%" py={1}>
-              {element.text.map((paragraph, idx) => {
-                return (
-                  <Text key={idx} py={2} fontSize="xl">
-                    {paragraph}
-                  </Text>
-                );
-              })}
-            </GridItem>
-          );
-        }
-        if ("image" in element) {
-          return (
-            <GridItem key={idx} colSpan="10" py={1} justifySelf="center">
-              <Image
-                justifySelf="center"
-                key={idx}
-                maxHeight="48rem"
-                src={element.image.path}
-                alt={element.image.annotation}
-              />
-            </GridItem>
-          );
-        }
-        if ("title" in element) {
-          element.PrevTitle = content.title;
-          return <Block key={idx} {...element} />;
-        }
-        return "";
-      })}
-    </Fragment>
-  );
-};
-export default Block;

frontend/src/components/CopyButton.jsx

@@ -1,5 +1,4 @@
-import { Fragment } from "react";
-import { jsx } from "@emotion/react";
+import { Fragment, React } from "react";
 import {
   useClipboard,
   IconButton,

frontend/src/components/CopyEntryButton.js

@@ -1,94 +0,0 @@
-import { jsx } from "@emotion/react";
-import {
-  Button,
-  Menu,
-  MenuButton,
-  MenuList,
-  MenuItem,
-  MenuGroup,
-  MenuDivider,
-} from "@chakra-ui/react";
-import {
-  useJournalEntry,
-  useJournals,
-  useRouter,
-  useToast,
-} from "../core/hooks";
-import { EntryService } from "../core/services";
-import { useQueryCache } from "react-query";
-
-const CopyEntryButton = ({ id, journalId }) => {
-  const router = useRouter();
-  const cache = useQueryCache();
-  const { appScope } = router.params;
-  const { data: entryToCopy, isLoading: sourceIsLoading } = useJournalEntry(
-    journalId,
-    id,
-    appScope
-  );
-  const toast = useToast();
-  const { journalsCache } = useJournals();
-  const copyEntry = async (targetJournalId) => {
-    try {
-      const newEntry = { ...entryToCopy };
-      newEntry.title = "Copy of " + newEntry.title;
-      await EntryService.create(targetJournalId)(newEntry).then((response) => {
-        journalsCache.refetch();
-        setTimeout(
-          () => cache.refetchQueries(["journal-entries", { journalId }]),
-          500
-        );
-        if (response.status === 200) {
-          toast("Copied!", "success");
-        }
-      });
-    } catch (e) {
-      console.error(
-        "Error copying entry. Please email engineering@bugout.dev if you encounter this issue.",
-        e
-      );
-    }
-  };
-
-  if (journalsCache.isLoading || sourceIsLoading) return "";
-
-  return (
-    <Menu>
-      <MenuButton
-        as={Button}
-        size="xs"
-        variant="link"
-        colorScheme="primary"
-        ml={1}
-      >
-        Copy
-      </MenuButton>
-      <MenuList maxH="sm" overflow="scroll">
-        <MenuGroup title="Destination:">
-          <MenuItem value={journalId} onClick={() => copyEntry(journalId)}>
-            {
-              journalsCache?.data?.data?.journals?.filter(
-                (journal) => journal.id === journalId
-              )[0]?.name
-            }
-          </MenuItem>
-          <MenuDivider />
-          {journalsCache?.data?.data?.journals?.map((journal) => {
-            if (journal.id === journalId) return "";
-            return (
-              <MenuItem
-                key={`option-${journal.id}`}
-                value={journal.id}
-                onClick={() => copyEntry(journal.id)}
-              >
-                {journal.name}
-              </MenuItem>
-            );
-          })}
-        </MenuGroup>
-      </MenuList>
-    </Menu>
-  );
-};
-
-export default CopyEntryButton;

frontend/src/components/Tags.js

@@ -0,0 +1,31 @@
+import React from "react";
+import { Tag, TagLabel, Flex } from "@chakra-ui/react";
+const Tags = ({ tags }) => {
+  const displayTags = tags?.filter(
+    (tag) =>
+      tag.startsWith("from") ||
+      tag.startsWith("client") ||
+      tag.startsWith("network") ||
+      tag.startsWith("to") ||
+      tag.startsWith("source") ||
+      tag.startsWith("node")
+  );
+  return (
+    <Flex alignSelf="flex-start">
+      <Flex flexWrap="wrap" pl={2} pr={2} spacing={2} alignItems="center">
+        {displayTags?.map((tag, index) => (
+          <Tag
+            variant="subtle"
+            colorScheme="primary"
+            key={`${tag}-${index}`}
+            zIndex={1}
+          >
+            <TagLabel>{tag}</TagLabel>
+          </Tag>
+        ))}
+      </Flex>
+    </Flex>
+  );
+};
+
+export default Tags;

frontend/src/core/hooks/index.js

@@ -1,32 +1,15 @@
-export { default as hookCommon } from "./hookCommon";
+export { queryCacheProps as hookCommon } from "./hookCommon";
 export { default as useAnalytics } from "./useAnalytics";
 export { default as useAuthResultHandler } from "./useAuthResultHandler";
 export { default as useChangePassword } from "./useChangePassword";
 export { default as useClientID } from "./useClientID";
 export { default as useCodeVerification } from "./useCodeVerification";
-export { default as useCreateEntry } from "./useCreateEntry";
-export { default as useCreateJournal } from "./useCreateJournal";
-export { default as useDeleteEntry } from "./useDeleteEntry";
-export { default as useDeleteJournal } from "./useDeleteJournal";
-export { default as useEntriesSearch } from "./useEntriesSearch";
 export { default as useForgotPassword } from "./useForgotPassword";
-export { default as useGroup } from "./useGroup";
-export { default as useGroups } from "./useGroups";
-export { default as useHumbug } from "./useHumbug";
-export { default as useHumbugTokens } from "./useHumbugTokens";
-export { default as useHumbugs } from "./useHumbugs";
 export { default as useInviteAccept } from "./useInviteAccept";
-export { default as useJournal } from "./useJournal";
-export { default as useJournalEntries } from "./useJournalEntries";
 export { default as useJournalEntry } from "./useJournalEntry";
-export { default as useJournalPermissions } from "./useJournalPermissions";
-export { default as useJournalStats } from "./useJournalStats";
-export { default as useJournals } from "./useJournals";
-export { default as useJournalsScopes } from "./useJournalsScopes";
 export { default as useLogin } from "./useLogin";
 export { default as useLogout } from "./useLogout";
 export { default as useModals } from "./useModals";
-export { default as usePreferences } from "./usePreferences";
 export { default as usePresignedURL } from "./usePresignedURL";
 export { default as useQuery } from "./useQuery";
 export { default as useResetPassword } from "./useResetPassword";
@@ -36,7 +19,4 @@ export { default as useStorage } from "./useStorage";
 export { default as useStripe } from "./useStripe";
 export { default as useSubscriptions } from "./useSubscriptions";
 export { default as useToast } from "./useToast";
-export { default as useTokens } from "./useTokens";
-export { default as useUpdateEntry } from "./useUpdateEntry";
-export { default as useUpdateTag } from "./useUpdateTag";
 export { default as useUser } from "./useUser";

frontend/src/core/hooks/useForgotPassword.js

@@ -0,0 +1,26 @@
+import { useEffect } from "react";
+import { useMutation } from "react-query";
+import { AuthService } from "../../core/services";
+import { useAuthResultHandler } from "./";
+import { useToast } from ".";
+
+const useForgotPassword = () => {
+  const toast = useToast();
+  const [forgotPassword, { isLoading, error, data }] = useMutation(
+    AuthService.forgotPassword
+  );
+  useAuthResultHandler(
+    data,
+    error,
+    "Please check your inbox for verification URL."
+  );
+  useEffect(() => {
+    if (error?.response?.data?.detail) {
+      toast(error.response.data.detail, "error");
+    }
+  }, [error, toast, data]);
+
+  return { forgotPassword, isLoading, data };
+};
+
+export default useForgotPassword;

frontend/src/core/hooks/useInviteAccept.js

@@ -0,0 +1,24 @@
+import { InvitesService } from "../services";
+import { useToast } from ".";
+
+const useInviteAccept = () => {
+  const toast = useToast();
+
+  const inviteAccept = (invite_code) => {
+    InvitesService.accept(invite_code)
+      .then(
+        () => toast("You were successfully added to the team", "success"),
+        (reason) => {
+          toast(reason, "error");
+        }
+      )
+      .finally(window.sessionStorage.clear("invite_code"))
+      .catch((error) => {
+        console.error("Error during sending an invite link:", error);
+      });
+  };
+
+  return { inviteAccept };
+};
+
+export default useInviteAccept;

frontend/src/core/hooks/useJournalEntry.js

@@ -0,0 +1,28 @@
+import { useQuery } from "react-query";
+import { JournalService } from "../services";
+import { queryCacheProps } from "./hookCommon";
+import { useToast } from ".";
+
+const useJournalEntry = (journalId, entryId, journalScope) => {
+  const toast = useToast();
+  const getEntry = async (query, key) => {
+    const endpoint =
+      journalScope === "personal"
+        ? JournalService.getEntry
+        : JournalService.getPublicEntry;
+    const data = await endpoint(key, { journalId, entryId });
+
+    const entry = data.data;
+    return entry;
+  };
+
+  const { data, isLoading, isFetchedAfterMount, refetch, isError, error } =
+    useQuery(["journal-entry", { journalId, entryId }], getEntry, {
+      ...queryCacheProps,
+      onError: (error) => toast(error, "error"),
+    });
+
+  return { data, isFetchedAfterMount, isLoading, refetch, isError, error };
+};
+
+export default useJournalEntry;