Merge pull request #484 from FiretableProject/develop

Develop
rowyio · Jul 27, 2021 · 4a5df78 · 4a5df78
2 parents 2daab78 + 30a540c
commit 4a5df78
Show file tree

Hide file tree

Showing 12 changed files with 1,069 additions and 703 deletions.
diff --git a/ft_actions/functions/package.json b/ft_actions/functions/package.json
@@ -14,8 +14,9 @@
   },
   "main": "lib/index.js",
   "dependencies": {
-    "firebase-admin": "^9.10.0",
-    "firebase-functions": "^3.14.1"
+    "firebase-admin": "^9.11.0",
+    "firebase-functions": "^3.14.1",
+    "lodash": "^4.17.21"
   },
   "devDependencies": {
     "firebase-tools": "^8.7.0",

diff --git a/ft_actions/functions/yarn.lock b/ft_actions/functions/yarn.lock
diff --git a/ft_actions/yarn.lock b/ft_actions/yarn.lock
@@ -0,0 +1,4 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
diff --git a/www/src/components/BuilderInstaller.tsx b/www/src/components/BuilderInstaller.tsx
@@ -0,0 +1,69 @@
+import useDoc from "hooks/useDoc";
+import Modal from "components/Modal";
+import { Box, Button, CircularProgress, Typography } from "@material-ui/core";
+import { IFormDialogProps } from "./Table/ColumnMenu/NewColumn";
+import OpenInNewIcon from "@material-ui/icons/OpenInNew";
+import CheckCircleIcon from "@material-ui/icons/CheckCircle";
+
+export interface IProjectSettings
+  extends Pick<IFormDialogProps, "handleClose"> {}
+
+export default function BuilderInstaller({ handleClose }: IProjectSettings) {
+  const [settingsState] = useDoc({
+    path: "_FIRETABLE_/settings",
+  });
+
+  if (settingsState.loading) return null;
+
+  const complete =
+    settingsState.doc.ftBuildStatus === "COMPLETE" ||
+    !!settingsState.doc.ftBuildUrl;
+  const building = settingsState.doc.ftBuildStatus === "BUILDING";
+  const waiting =
+    !settingsState.doc.ftBuildStatus && !settingsState.doc.ftBuildUrl;
+
+  return (
+    <Modal
+      onClose={handleClose}
+      title="One Click Builder Installer"
+      maxWidth="sm"
+      children={
+        <Box display="flex" flexDirection="column">
+          <Typography variant="body2">
+            You will be redirected to Google Cloud Shell to deploy Firetable
+            Function Builder to Cloud Run.
+          </Typography>
+          <br />
+
+          <Box
+            display="flex"
+            justifyContent="center"
+            alignItems="center"
+            flexDirection="column"
+          >
+            {complete && (
+              <>
+                <CheckCircleIcon />
+                <Typography variant="overline">Deploy Complete</Typography>
+              </>
+            )}
+            {building && (
+              <>
+                <CircularProgress size={25} />
+                <Typography variant="overline">Deploying...</Typography>
+              </>
+            )}
+            {waiting && (
+              <>
+                <CircularProgress size={25} />
+                <Typography variant="overline">
+                  Waiting for deploy...
+                </Typography>
+              </>
+            )}
+          </Box>
+        </Box>
+      }
+    />
+  );
+}
diff --git a/www/src/components/ProjectSettings/form.tsx b/www/src/components/ProjectSettings/form.tsx
@@ -4,6 +4,7 @@ import { authOptions } from "firebase/firebaseui";
 
 import { Link } from "@material-ui/core";
 import OpenInNewIcon from "@material-ui/icons/OpenInNew";
+import WIKI_LINKS from "constants/wikiLinks";
 
 export const projectSettingsForm = [
   {
@@ -44,12 +45,30 @@ export const projectSettingsForm = [
   {
     type: FieldType.contentHeader,
     name: "_contentHeading_cloudRun",
-    label: "Cloud Run Configuration",
+    label: "Functions Builder",
   },
   {
     type: FieldType.shortText,
     name: "ftBuildUrl",
     label: "Cloud Run Trigger URL",
     format: "url",
+    assistiveText: (
+      <>
+        Firetable requires a cloud run instance to build and deploy Firetable
+        cloud functions ,
+        <Link href={WIKI_LINKS.FtFunctions} target="_blank" rel="noopener">
+          more info
+          <OpenInNewIcon
+            aria-label="Open in new tab"
+            fontSize="small"
+            style={{ verticalAlign: "bottom", marginLeft: 4 }}
+          />
+        </Link>
+        .
+        <br />
+        To deploy the cloud run instance simply click the button bellow and
+        follow the cloud shell prompts.
+      </>
+    ) as any,
   },
 ];
diff --git a/www/src/components/ProjectSettings/index.tsx b/www/src/components/ProjectSettings/index.tsx
@@ -8,11 +8,17 @@ import { projectSettingsForm } from "./form";
 
 import useDoc, { DocActions } from "hooks/useDoc";
 import { IFormDialogProps } from "components/Table/ColumnMenu/NewColumn";
+import { Button } from "@material-ui/core";
 
 export interface IProjectSettings
-  extends Pick<IFormDialogProps, "handleClose"> {}
+  extends Pick<IFormDialogProps, "handleClose"> {
+  handleOpenBuilderInstaller: () => void;
+}
 
-export default function ProjectSettings({ handleClose }: IProjectSettings) {
+export default function ProjectSettings({
+  handleClose,
+  handleOpenBuilderInstaller,
+}: IProjectSettings) {
   const [settingsState, settingsDispatch] = useDoc({
     path: "_FIRETABLE_/settings",
   });
@@ -32,6 +38,17 @@ export default function ProjectSettings({ handleClose }: IProjectSettings) {
     });
   };
 
+  const onOpenBuilderInstaller = () => {
+    handleClose();
+    window.open(
+      "https://deploy.cloud.run/?git_repo=https://github.com/FiretableProject/FunctionsBuilder.git",
+      "_blank"
+    );
+    handleOpenBuilderInstaller();
+  };
+
+  const hasCloudRunConfig = !!settingsState.doc.ftBuildUrl;
+
   return (
     <FormDialog
       onClose={handleClose}
@@ -41,6 +58,11 @@ export default function ProjectSettings({ handleClose }: IProjectSettings) {
       values={{ ...settingsState.doc, ...publicSettingsState.doc }}
       onSubmit={handleSubmit}
       SubmitButtonProps={{ children: "Save" }}
+      formFooter={
+        hasCloudRunConfig ? null : (
+          <Button onClick={onOpenBuilderInstaller}>One click deploy</Button>
+        )
+      }
     />
   );
 }
diff --git a/www/src/components/Table/ColumnMenu/FieldSettings/index.tsx b/www/src/components/Table/ColumnMenu/FieldSettings/index.tsx
@@ -22,18 +22,11 @@ import FormControlLabel from "@material-ui/core/FormControlLabel";
 import Typography from "@material-ui/core/Typography";
 import Divider from "@material-ui/core/Divider";
 import Subheading from "components/Table/ColumnMenu/Subheading";
-import WIKI_LINKS from "constants/wikiLinks";
-
+import Button from "@material-ui/core/Button";
+import routes from "constants/routes";
 export default function FieldSettings(props: IMenuModalProps) {
-  const {
-    name,
-    fieldName,
-    type,
-    open,
-    config,
-    handleClose,
-    handleSave,
-  } = props;
+  const { name, fieldName, type, open, config, handleClose, handleSave } =
+    props;
 
   const [showRebuildPrompt, setShowRebuildPrompt] = useState(false);
   const [newConfig, setNewConfig] = useState(config ?? {});
@@ -156,8 +149,7 @@ export default function FieldSettings(props: IMenuModalProps) {
             if (showRebuildPrompt) {
               requestConfirmation({
                 title: "Deploy Changes",
-                body:
-                  "You have made changes that affect the behavior of the cloud function of this table, Would you like to redeploy it now?",
+                body: "You have made changes that affect the behavior of the cloud function of this table, Would you like to redeploy it now?",
                 confirm: "Deploy",
                 cancel: "Later",
                 handleConfirm: async () => {
@@ -167,11 +159,23 @@ export default function FieldSettings(props: IMenuModalProps) {
                   const ftBuildUrl = settingsDoc.get("ftBuildUrl");
                   if (!ftBuildUrl) {
                     snack.open({
-                      message: `Cloud Run trigger URL not configured. Configuration guide: ${WIKI_LINKS.cloudRunFtBuilder}`,
+                      message: `Firetable functions builder is not yet setup`,
                       variant: "error",
+                      action: (
+                        <Button
+                          variant="contained"
+                          component={"a"}
+                          target="_blank"
+                          href={routes.projectSettings}
+                          rel="noopener noreferrer"
+                        >
+                          Go to Settings
+                        </Button>
+                      ),
                     });
                   }
-                  const userTokenInfo = await appContext?.currentUser?.getIdTokenResult();
+                  const userTokenInfo =
+                    await appContext?.currentUser?.getIdTokenResult();
                   const userToken = userTokenInfo?.token;
                   try {
                     snackLog.requestSnackLog();

diff --git a/www/src/components/Table/TableHeader/Sparks.tsx b/www/src/components/Table/TableHeader/Sparks.tsx
@@ -11,13 +11,14 @@ import { DialogContentText, Chip } from "@material-ui/core";
 import Alert from "@material-ui/lab/Alert";
 import TableHeaderButton from "./TableHeaderButton";
 import SparkIcon from "@material-ui/icons/OfflineBolt";
+import Button from "@material-ui/core/Button";
 import Modal from "components/Modal";
 import { useFiretableContext } from "contexts/FiretableContext";
 import { useAppContext } from "contexts/AppContext";
 import { useSnackLogContext } from "contexts/SnackLogContext";
 import CodeEditor from "../editors/CodeEditor";
-import WIKI_LINKS from "constants/wikiLinks";
 
+import routes from "constants/routes";
 export default function SparksEditor() {
   const snack = useSnackContext();
   const { tableState, tableActions } = useFiretableContext();
@@ -57,8 +58,19 @@ export default function SparksEditor() {
         const ftBuildUrl = settingsDoc.get("ftBuildUrl");
         if (!ftBuildUrl) {
           snack.open({
-            message: `Cloud Run trigger URL not configured. Configuration guide: ${WIKI_LINKS.cloudRunFtBuilder}`,
+            message: `Firetable functions builder is not yet setup`,
             variant: "error",
+            action: (
+              <Button
+                variant="contained"
+                component={"a"}
+                target="_blank"
+                href={routes.projectSettings}
+                rel="noopener noreferrer"
+              >
+                Go to Settings
+              </Button>
+            ),
           });
         }
 

diff --git a/www/src/components/Table/TableHeader/TableLogs.tsx b/www/src/components/Table/TableHeader/TableLogs.tsx
@@ -23,6 +23,7 @@ import {
   Tab,
   IconButton,
   Link,
+  Button,
 } from "@material-ui/core";
 import Modal from "components/Modal";
 import { makeStyles } from "@material-ui/core/styles";
@@ -39,7 +40,7 @@ import Ansi from "ansi-to-react";
 import EmptyState from "components/EmptyState";
 
 import PropTypes from "prop-types";
-import WIKI_LINKS from "constants/wikiLinks";
+import routes from "constants/routes";
 
 function a11yProps(index) {
   return {
@@ -183,9 +184,8 @@ function LogPanel(props) {
 
   // useStateRef is necessary to resolve the state syncing issue
   // https://stackoverflow.com/a/63039797/12208834
-  const [liveStreaming, setLiveStreaming, liveStreamingStateRef] = useStateRef(
-    true
-  );
+  const [liveStreaming, setLiveStreaming, liveStreamingStateRef] =
+    useStateRef(true);
   const liveStreamingRef = useRef<any>();
   const isActive = value === index;
 
@@ -264,9 +264,8 @@ function SnackLog({ log, onClose, onOpenPanel }) {
   const status = log?.status;
   const classes = useStyles();
   const [expanded, setExpanded] = useState(false);
-  const [liveStreaming, setLiveStreaming, liveStreamingStateRef] = useStateRef(
-    true
-  );
+  const [liveStreaming, setLiveStreaming, liveStreamingStateRef] =
+    useStateRef(true);
   const liveStreamingRef = useRef<any>();
 
   const handleScroll = _throttle(() => {
@@ -490,16 +489,17 @@ export default function TableLogs() {
                   message="Need Configuration"
                   description={
                     <>
-                      Cloud Run trigger URL not configured.
-                      <Link
-                        href={WIKI_LINKS.cloudRunFtBuilder}
+                      <Typography>
+                        Function builder is not currently setup.{" "}
+                      </Typography>
+                      <Button
+                        component={"a"}
+                        href={routes.projectSettings}
                         target="_blank"
                         rel="noopener noreferrer"
-                        variant="body2"
-                        underline="always"
                       >
-                        Configuration guide
-                      </Link>
+                        Go to Settings
+                      </Button>
                     </>
                   }
                 />

diff --git a/www/src/constants/routes.ts b/www/src/constants/routes.ts
@@ -1,5 +1,6 @@
 export enum routes {
   home = "/",
+  projectSettings = "/?modal=settings",
   auth = "/auth",
   impersonatorAuth = "/impersonatorAuth",
   jwtAuth = "/jwtAuth",

diff --git a/www/src/constants/wikiLinks.ts b/www/src/constants/wikiLinks.ts
@@ -5,7 +5,7 @@ const WIKI_PATHS = {
   updatingFiretable: "/Updating-Firetable",
   derivatives: "/Derivatives",
   defaultValues: "/Default-Values",
-  cloudRunFtBuilder: "/Setting-up-cloud-Run-FT-Builder",
+  FtFunctions: "/FT-Functions",
   securityRules: "/Role-Based-Security-Rules",
   setUpAuth: "/Set-Up-Firebase-Authentication",
 };
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,4 @@
		# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
		# yarn lockfile v1