Merge pull request #662 from rowyio/rc

v2.4.0

package.json

@@ -1,6 +1,6 @@
 {
- "name": "Rowy",
- "version": "2.3.2",
+ "name": "rowy",
+ "version": "2.4.0",
  "homepage": "https://rowy.io",
  "repository": {
  "type": "git",
@@ -15,10 +15,10 @@
  "@hookform/resolvers": "^2.8.5",
  "@mdi/js": "^6.5.95",
  "@monaco-editor/react": "^4.3.1",
- "@mui/icons-material": "^5.4.1",
- "@mui/lab": "^5.0.0-alpha.68",
- "@mui/material": "^5.4.1",
- "@mui/styles": "^5.4.1",
+ "@mui/icons-material": "^5.4.4",
+ "@mui/lab": "^5.0.0-alpha.71",
+ "@mui/material": "^5.4.4",
+ "@mui/styles": "^5.4.4",
  "@rowy/form-builder": "^0.5.3",
  "@rowy/multiselect": "^0.2.3",
  "@tinymce/tinymce-react": "^3.12.6",
@@ -43,6 +43,7 @@
  "notistack": "^2.0.2",
  "pb-util": "^1.0.1",
  "query-string": "^6.8.3",
+ "quicktype-core": "^6.0.70",
  "react": "^17.0.2",
  "react-beautiful-dnd": "^13.0.0",
  "react-color-palette": "^6.1.0",

src/App.tsx

@@ -12,6 +12,7 @@ import ErrorBoundary from "@src/components/ErrorBoundary";
 import Loading from "@src/components/Loading";
 import Navigation from "@src/components/Navigation";
 import Logo from "@src/assets/Logo";
+import RowyRunModal from "@src/components/RowyRunModal";
 
 import SwrProvider from "@src/contexts/SwrContext";
 import ConfirmationProvider from "@src/components/ConfirmationDialog/Provider";
@@ -24,7 +25,6 @@ import routes from "@src/constants/routes";
 import AuthPage from "@src/pages/Auth";
 import SignOutPage from "@src/pages/Auth/SignOut";
 import SignUpPage from "@src/pages/Auth/SignUp";
-import DeployPage from "@src/pages/Deploy";
 import TestPage from "@src/pages/Test";
 import RowyRunTestPage from "@src/pages/RowyRunTest";
 import PageNotFound from "@src/pages/PageNotFound";
@@ -65,6 +65,7 @@ export default function App() {
  <ConfirmationProvider>
  <SnackLogProvider>
  <CustomBrowserRouter>
+ <RowyRunModal />
  <Suspense fallback={<Loading fullScreen />}>
  <Switch>
  <Route
@@ -97,11 +98,6 @@ export default function App() {
  path={routes.setup}
  render={() => <SetupPage />}
  />
- <Route
- exact
- path={routes.deploy}
- render={() => <DeployPage />}
- />
 
  <Route
  exact

src/assets/LogoRowyRun.tsx

@@ -0,0 +1,44 @@
+import { SVGProps } from "react";
+import { useTheme } from "@mui/material";
+
+export interface ILogoRowyRunProps extends SVGProps<SVGSVGElement> {
+ size?: number;
+}
+
+export default function LogoRowyRun({
+ size = 1.5,
+ ...props
+}: ILogoRowyRunProps) {
+ const theme = useTheme();
+
+ return (
+ <svg
+ width={Math.round(108 * size)}
+ height={Math.round(26 * size)}
+ viewBox="0 0 108 26"
+ xmlns="http://www.w3.org/2000/svg"
+ aria-labelledby="rowy-run-logo-title"
+ role="img"
+ {...props}
+ >
+ <title id="rowy-run-logo-title">Rowy Run</title>
+
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="M32 7.75a6.25 6.25 0 1 1 0 12.5 6.25 6.25 0 0 1 0-12.5Zm0 2a4.25 4.25 0 1 0 0 8.5 4.25 4.25 0 0 0 0-8.5ZM20 20V8h6v2h-4v10h-2Zm24 0 3-9 3 9h2l4-12 5 11.5-2 4.5h2l7-16h-2l-4 9-4-9h-4l-3 9-3-9h-2l-3 9-3-9h-2l4 12h2Z"
+ fill={theme.palette.text.primary}
+ />
+ <path
+ fill-rule="evenodd"
+ clip-rule="evenodd"
+ d="M0 8v10a3 3 0 1 0 6 0v-7h7a3 3 0 1 0 0-6H8a2.997 2.997 0 0 0-2.5 1.341A3 3 0 0 0 0 8Zm10-2H8a2 2 0 0 0-1.995 1.85L6 8v2h4V6Zm-5 4V8a2 2 0 0 0-1.85-1.995L3 6a2 2 0 0 0-1.995 1.85L1 8v2h4Zm0 1H1v4h4v-4Zm-4 5v2a2 2 0 0 0 1.85 1.994L3 20a2 2 0 0 0 1.995-1.85L5 18v-2H1ZM11.001 6H13l.15.005A2 2 0 0 1 15 8l-.005.15A2 2 0 0 1 13 10h-1.999V6Z"
+ fill={theme.palette.primary.main}
+ />
+ <path
+ d="M73.25 20h1.825v-8.375c.775-1.475 2.125-2.35 3.2-2.35.425 0 .925.075 1.35.225V7.775c-.275-.1-.725-.175-1.225-.175-1.25 0-2.65.85-3.325 2.175V7.85H73.25V20Zm17.65 0h1.85V7.85h-1.824L90.9 16.3c-.75 1.35-2.25 2.175-3.875 2.175-2.125 0-3.55-1.525-3.55-3.875V7.85H81.65v7c0 3.275 2 5.4 5 5.4 1.775 0 3.45-.825 4.25-2.175V20Zm7.007-12.15h-1.825V20h1.825v-8.475c.75-1.325 2.275-2.15 3.875-2.15 2.125 0 3.55 1.525 3.55 3.875V20h1.825v-7c0-3.275-2-5.4-5-5.4-1.775 0-3.45.825-4.25 2.15v-1.9Z"
+ fill={theme.palette.primary.main}
+ />
+ </svg>
+ );
+}

src/atoms/RowyRunModal.ts

@@ -0,0 +1,10 @@
+import { atom, useAtom } from "jotai";
+
+export const rowyRunModalAtom = atom({ open: false, feature: "", version: "" });
+
+export const useRowyRunModal = () => {
+ const [, setOpen] = useAtom(rowyRunModalAtom);
+
+ return (feature: string = "", version: string = "") =>
+ setOpen({ open: true, feature, version });
+};

src/components/CodeEditor/CodeEditorHelper.tsx

@@ -1,5 +1,9 @@
-import { Stack, Typography, Grid, Tooltip, Button } from "@mui/material";
-import InlineOpenInNewIcon from "@src/components/InlineOpenInNewIcon";
+import { Stack, Typography, Grid, Tooltip, IconButton } from "@mui/material";
+import SecretsIcon from "@mui/icons-material/VpnKeyOutlined";
+import FunctionsIcon from "@mui/icons-material/CloudOutlined";
+import DocsIcon from "@mui/icons-material/DescriptionOutlined";
+
+import { useAppContext } from "@src/contexts/AppContext";
 
 export interface ICodeEditorHelperProps {
  docLink: string;
@@ -13,6 +17,7 @@ export default function CodeEditorHelper({
  docLink,
  additionalVariables,
 }: ICodeEditorHelperProps) {
+ const { projectId } = useAppContext();
  const availableVariables = [
  {
  key: "row",
@@ -35,23 +40,29 @@ export default function CodeEditorHelper({
  description: `firebase Storage can be accessed through this, storage.bucket() returns default storage bucket of the firebase project.`,
  },
  {
- key: "utilFns",
- description: `utilFns provides a set of functions that are commonly used, such as easy access to GCP Secret Manager`,
+ key: "rowy",
+ description: `rowy provides a set of functions that are commonly used, such as easy access to GCP Secret Manager`,
  },
  ];
 
  return (
  <Stack
  direction="row"
- alignItems="baseline"
+ alignItems="flex-start"
+ justifyItems="space-between"
+ spacing={1}
  justifyContent="space-between"
  sx={{ my: 1 }}
  >
- <Typography variant="body2" color="textSecondary" sx={{ mr: 0.5 }}>
+ <Typography variant="body2" color="textSecondary">
  Available:
  </Typography>
 
- <Grid container spacing={1}>
+ <Grid
+ container
+ spacing={1}
+ style={{ flexGrow: 1, marginTop: -8, marginLeft: 0 }}
+ >
  {availableVariables.concat(additionalVariables ?? []).map((v) => (
  <Grid item key={v.key}>
  <Tooltip title={v.description}>
@@ -61,17 +72,48 @@ export default function CodeEditorHelper({
  ))}
  </Grid>
 
- <Button
- size="small"
- color="primary"
- target="_blank"
- rel="noopener noreferrer"
- href={docLink}
- style={{ flexShrink: 0 }}
+ <Stack
+ direction="row"
+ alignItems="center"
+ spacing={1}
+ style={{ marginTop: -4 }}
  >
- Examples & docs
- <InlineOpenInNewIcon />
- </Button>
+ <Tooltip title="Secret Manager&nbsp;↗">
+ <IconButton
+ size="small"
+ color="primary"
+ target="_blank"
+ rel="noopener noreferrer"
+ href={`https://console.cloud.google.com/security/secret-manager?project=${projectId}`}
+ >
+ <SecretsIcon fontSize="small" />
+ </IconButton>
+ </Tooltip>
+
+ <Tooltip title="Configure Cloud Function&nbsp;↗">
+ <IconButton
+ size="small"
+ color="primary"
+ target="_blank"
+ rel="noopener noreferrer"
+ href={`https://console.cloud.google.com/functions/list?project=${projectId}`}
+ >
+ <FunctionsIcon fontSize="small" />
+ </IconButton>
+ </Tooltip>
+
+ <Tooltip title="Examples & documentation&nbsp;↗">
+ <IconButton
+ size="small"
+ color="primary"
+ target="_blank"
+ rel="noopener noreferrer"
+ href={docLink}
+ >
+ <DocsIcon fontSize="small" />
+ </IconButton>
+ </Tooltip>
+ </Stack>
  </Stack>
  );
 }

src/components/CodeEditor/extensions.d.ts

@@ -24,7 +24,7 @@ type ExtensionContext = {
  requiredFields: string[];
  extensionBody: any;
  };
- utilFns: any;
+ RULES_UTILS: any;
 };
 
 // extension body definition