Merge pull request #631 from rowyio/rc

v2.3.0

Author: shamsmosowi

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Rowy",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "homepage": "https://rowy.io",
   "repository": {
     "type": "git",
@@ -12,14 +12,14 @@
     "@date-io/date-fns": "1.x",
     "@emotion/react": "^11.4.0",
     "@emotion/styled": "^11.3.0",
-    "@hookform/resolvers": "^2.8.1",
+    "@hookform/resolvers": "^2.8.5",
     "@mdi/js": "^6.5.95",
     "@monaco-editor/react": "^4.3.1",
     "@mui/icons-material": "^5.2.0",
     "@mui/lab": "^5.0.0-alpha.58",
     "@mui/material": "^5.2.2",
     "@mui/styles": "^5.2.2",
-    "@rowy/form-builder": "^0.4.2",
+    "@rowy/form-builder": "^0.5.2",
     "@rowy/multiselect": "^0.2.3",
     "@tinymce/tinymce-react": "^3.12.6",
     "algoliasearch": "^4.8.6",
@@ -33,12 +33,13 @@
     "file-saver": "^2.0.5",
     "firebase": "8.6.8",
     "hotkeys-js": "^3.7.2",
-    "jotai": "^1.4.2",
+    "jotai": "^1.5.3",
     "json-stable-stringify-without-jsonify": "^1.0.1",
     "json2csv": "^5.0.6",
     "jszip": "^3.6.0",
     "jwt-decode": "^3.1.2",
     "lodash": "^4.17.21",
+    "match-sorter": "^6.3.1",
     "notistack": "^2.0.2",
     "pb-util": "^1.0.1",
     "query-string": "^6.8.3",
@@ -54,17 +55,18 @@
     "react-element-scroll-hook": "^1.1.0",
     "react-firebaseui": "^5.0.2",
     "react-helmet": "^6.1.0",
-    "react-hook-form": "^7.16.1",
+    "react-hook-form": "^7.21.2",
     "react-image": "^4.0.3",
-    "react-joyride": "^2.3.0",
     "react-json-view": "^1.19.1",
+    "react-markdown": "^8.0.0",
     "react-router-dom": "^5.0.1",
     "react-router-hash-link": "^2.4.3",
     "react-scripts": "^4.0.3",
     "react-usestateref": "^1.0.5",
+    "remark-gfm": "^3.0.1",
     "serve": "^11.3.2",
     "swr": "^1.0.1",
-    "tinymce": "^5.9.2",
+    "tinymce": "^5.10.0",
     "typescript": "^4.4.2",
     "use-algolia": "^1.4.1",
     "use-debounce": "^3.3.0",
@@ -115,14 +117,17 @@
     "@types/react-router-hash-link": "^2.4.1",
     "@types/use-persisted-state": "^0.3.0",
     "craco-alias": "^3.0.1",
-    "firebase-tools": "^8.12.1",
+    "firebase-tools": "^10.1.0",
     "husky": "^4.2.5",
     "monaco-editor": "^0.21.2",
     "playwright": "^1.5.2",
     "prettier": "^2.2.1",
     "pretty-quick": "^3.0.0",
     "raw-loader": "^4.0.2"
   },
+  "resolutions": {
+    "react-hook-form": "^7.21.2"
+  },
   "husky": {
     "hooks": {
       "pre-commit": "pretty-quick --staged"

src/assets/service-account.mp4

@@ -0,0 +1,40 @@
+import { useAtom } from "jotai";
+import { atomWithReset, useResetAtom, useUpdateAtom } from "jotai/utils";
+
+export type SelectedCell = {
+  rowIndex: number;
+  colIndex: number;
+};
+
+export type anchorEl = HTMLElement;
+
+const selectedCellAtom = atomWithReset<SelectedCell | null>(null);
+const anchorEleAtom = atomWithReset<HTMLElement | null>(null);
+
+export function useSetAnchorEle() {
+  const setAnchorEle = useUpdateAtom(anchorEleAtom);
+  return { setAnchorEle };
+}
+
+export function useSetSelectedCell() {
+  const setSelectedCell = useUpdateAtom(selectedCellAtom);
+  return { setSelectedCell };
+}
+
+export function useContextMenuAtom() {
+  const [anchorEle] = useAtom(anchorEleAtom);
+  const [selectedCell] = useAtom(selectedCellAtom);
+  const resetAnchorEle = useResetAtom(anchorEleAtom);
+  const resetSelectedCell = useResetAtom(selectedCellAtom);
+
+  const resetContextMenu = async () => {
+    await resetAnchorEle();
+    await resetSelectedCell();
+  };
+
+  return {
+    anchorEle,
+    selectedCell,
+    resetContextMenu,
+  };
+}

src/atoms/ContextMenu.ts

@@ -0,0 +1,5 @@
+import { atomWithHash } from "jotai/utils";
+
+export const modalAtom = atomWithHash<
+  "cloudLogs" | "extensions" | "webhooks" | "export" | ""
+>("modal", "");

src/atoms/Table.ts

@@ -12,7 +12,7 @@ type ExtensionContext = {
   ref: FirebaseFirestore.DocumentReference;
   storage: firebasestorage.Storage;
   db: FirebaseFirestore.Firestore;
-  auth: adminauth.BaseAuth;
+  auth: firebaseauth.BaseAuth;
   change: any;
   triggerType: Triggers;
   fieldTypes: any;

src/components/CodeEditor/extensions.d.ts

@@ -2,7 +2,7 @@
 
 /* eslint-disable @typescript-eslint/ban-types */
 
-export namespace admin.auth {
+declare namespace firebaseauth {
   /**
    * Interface representing a user's metadata.
    */

src/components/CodeEditor/firebaseAuth.d.ts

@@ -0,0 +1,32 @@
+/**
+ * utility functions
+ */
+declare namespace rowy {
+  /**
+   * uploads a file to the cloud storage from a url
+   */
+  function url2storage(
+    url: string,
+    storagePath: string,
+    fileName?: string
+  ): Promise<{
+    downloadURL: string;
+    name: string;
+    type: string;
+    lastModifiedTS: Date;
+  }>;
+
+  /**
+   * Gets the secret defined in Google Cloud Secret
+   */
+  async function getSecret(name: string, v?: string): Promise<string | null>;
+
+  async function getServiceAccountUser(): Promise<{
+    email: string;
+    emailVerified: boolean;
+    displayName: string;
+    photoURL: string;
+    uid: string;
+    timestamp: number;
+  }>;
+}

src/components/CodeEditor/rowy.d.ts

@@ -16,6 +16,7 @@ import firestoreDefs from "!!raw-loader!./firestore.d.ts";
 import firebaseAuthDefs from "!!raw-loader!./firebaseAuth.d.ts";
 import firebaseStorageDefs from "!!raw-loader!./firebaseStorage.d.ts";
 import utilsDefs from "!!raw-loader!./utils.d.ts";
+import rowyUtilsDefs from "!!raw-loader!./rowy.d.ts";
 import extensionsDefs from "!!raw-loader!./extensions.d.ts";
 
 export interface IUseMonacoCustomizationsProps {
@@ -96,6 +97,7 @@ export default function useMonacoCustomizations({
         utilsDefs,
         "ts:filename/utils.d.ts"
       );
+      monaco.languages.typescript.javascriptDefaults.addExtraLib(rowyUtilsDefs);
     } catch (error) {
       console.error(
         "An error occurred during initialization of Monaco: ",
@@ -174,7 +176,7 @@ export default function useMonacoCustomizations({
           "const ref: FirebaseFirestore.DocumentReference;",
           "const storage: firebasestorage.Storage;",
           "const db: FirebaseFirestore.Firestore;",
-          "const auth: adminauth.BaseAuth;",
+          "const auth: firebaseauth.BaseAuth;",
           "declare class row {",
           "    /**",
           "     * Returns the row fields",

src/components/CodeEditor/useMonacoCustomizations.ts

@@ -31,7 +31,10 @@ export default function Confirmation({
   return (
     <Dialog
       open={open}
-      onClose={handleClose}
+      onClose={(_, reason) => {
+        if (reason === "backdropClick" || reason === "escapeKeyDown") return;
+        else handleClose();
+      }}
       maxWidth={maxWidth}
       TransitionComponent={SlideTransitionMui}
       style={{ cursor: "default" }}

src/components/ConfirmationDialog/Dialog.tsx

@@ -10,6 +10,7 @@ import {
 } from "@mui/material";
 import GoIcon from "@src/assets/icons/Go";
 
+import RenderedMarkdown from "@src/components/RenderedMarkdown";
 import { Table } from "@src/contexts/ProjectContext";
 
 export interface ITableCardProps extends Table {
@@ -26,36 +27,38 @@ export default function TableCard({
 }: ITableCardProps) {
   return (
     <Card style={{ height: "100%", display: "flex", flexDirection: "column" }}>
-      <CardActionArea
-        sx={{
-          flexGrow: 1,
-          display: "flex",
-          alignItems: "flex-start",
-          justifyContent: "flex-start",
-          borderRadius: 2,
-        }}
-        component={Link}
-        to={link}
-      >
-        <CardContent>
+      <CardActionArea component={Link} to={link}>
+        <CardContent style={{ paddingBottom: 0 }}>
           <Typography variant="overline" component="p">
             {section}
           </Typography>
           <Typography variant="h6" component="h3" gutterBottom>
             {name}
           </Typography>
-          <Typography
-            color="textSecondary"
-            sx={{
-              minHeight: (theme) =>
-                (theme.typography.body2.lineHeight as number) * 2 + "em",
-            }}
-          >
-            {description}
-          </Typography>
         </CardContent>
       </CardActionArea>
 
+      <CardContent style={{ flexGrow: 1, paddingTop: 0 }}>
+        <Typography
+          color="textSecondary"
+          sx={{
+            minHeight: (theme) =>
+              (theme.typography.body2.lineHeight as number) * 2 + "em",
+            display: "flex",
+            flexDirection: "column",
+            gap: 1,
+          }}
+          component="div"
+        >
+          {description && (
+            <RenderedMarkdown
+              children={description}
+              //restrictionPreset="singleLine"
+            />
+          )}
+        </Typography>
+      </CardContent>
+
       <CardActions>
         <Button
           variant="text"