Merge pull request #590 from rowyio/rc

v2.2.0

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Rowy",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "homepage": "https://rowy.io",
   "repository": {
     "type": "git",
@@ -13,32 +13,34 @@
     "@emotion/react": "^11.4.0",
     "@emotion/styled": "^11.3.0",
     "@hookform/resolvers": "^2.8.1",
-    "@mdi/js": "^6.2.95",
-    "@monaco-editor/react": "^4.1.0",
-    "@mui/icons-material": "^5.0.0",
-    "@mui/lab": "^5.0.0-alpha.50",
-    "@mui/material": "^5.0.0",
-    "@mui/styles": "^5.0.0",
-    "@rowy/form-builder": "^0.3.1",
+    "@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/multiselect": "^0.2.3",
     "@tinymce/tinymce-react": "^3.12.6",
     "algoliasearch": "^4.8.6",
     "ansi-to-react": "^6.1.5",
     "colord": "^2.7.0",
+    "compare-versions": "^4.1.1",
     "craco-swc": "^0.1.3",
     "csv-parse": "^4.15.3",
     "date-fns": "^2.19.0",
     "dompurify": "^2.2.6",
     "file-saver": "^2.0.5",
     "firebase": "8.6.8",
     "hotkeys-js": "^3.7.2",
-    "json-format": "^1.0.1",
+    "jotai": "^1.4.2",
+    "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",
-    "moment": "^2.29.1",
     "notistack": "^2.0.2",
+    "pb-util": "^1.0.1",
     "query-string": "^6.8.3",
     "react": "^17.0.2",
     "react-beautiful-dnd": "^13.0.0",
@@ -67,8 +69,7 @@
     "use-algolia": "^1.4.1",
     "use-debounce": "^3.3.0",
     "use-persisted-state": "^0.3.3",
-    "yarn": "^1.22.10",
-    "yup": "^0.32.9"
+    "yarn": "^1.22.10"
   },
   "scripts": {
     "upstream": "git fetch upstream;git merge upstream/main;git commit -m'merge upstream';git push",

src/App.tsx

@@ -6,34 +6,34 @@ import AdapterDateFns from "@mui/lab/AdapterDateFns";
 import { StyledEngineProvider } from "@mui/material/styles";
 import "./space-grotesk.css";
 
-import CustomBrowserRouter from "utils/CustomBrowserRouter";
-import PrivateRoute from "utils/PrivateRoute";
-import ErrorBoundary from "components/ErrorBoundary";
-import Loading from "components/Loading";
-import Navigation from "components/Navigation";
-import Logo from "assets/Logo";
+import CustomBrowserRouter from "@src/utils/CustomBrowserRouter";
+import PrivateRoute from "@src/utils/PrivateRoute";
+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 SwrProvider from "contexts/SwrContext";
-import ConfirmationProvider from "components/ConfirmationDialog/Provider";
-import { AppProvider } from "contexts/AppContext";
-import { ProjectContextProvider } from "contexts/ProjectContext";
-import { SnackbarProvider } from "contexts/SnackbarContext";
-import { SnackLogProvider } from "contexts/SnackLogContext";
-import routes from "constants/routes";
+import SwrProvider from "@src/contexts/SwrContext";
+import ConfirmationProvider from "@src/components/ConfirmationDialog/Provider";
+import { AppProvider } from "@src/contexts/AppContext";
+import { ProjectContextProvider } from "@src/contexts/ProjectContext";
+import { SnackbarProvider } from "@src/contexts/SnackbarContext";
+import { SnackLogProvider } from "@src/contexts/SnackLogContext";
+import routes from "@src/constants/routes";
 
-import AuthPage from "pages/Auth";
-import SignOutPage from "pages/Auth/SignOut";
-import SignUpPage from "pages/Auth/SignUp";
-import DeployPage from "pages/Deploy";
-import TestPage from "pages/Test";
-import RowyRunTestPage from "pages/RowyRunTest";
-import PageNotFound from "pages/PageNotFound";
+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";
 
-import Favicon from "assets/Favicon";
-import "analytics";
+import Favicon from "@src/assets/Favicon";
+import "@src/analytics";
 
 // prettier-ignore
-const AuthSetupGuidePage = lazy(() => import("pages/Auth/SetupGuide" /* webpackChunkName: "AuthSetupGuide" */));
+const AuthSetupGuidePage = lazy(() => import("@src/pages/Auth/SetupGuide" /* webpackChunkName: "AuthSetupGuide" */));
 // prettier-ignore
 const ImpersonatorAuthPage = lazy(() => import("./pages/Auth/ImpersonatorAuth" /* webpackChunkName: "ImpersonatorAuthPage" */));
 // prettier-ignore
@@ -51,7 +51,7 @@ const UserSettingsPage = lazy(() => import("./pages/Settings/UserSettings" /* we
 // prettier-ignore
 const UserManagementPage = lazy(() => import("./pages/Settings/UserManagement" /* webpackChunkName: "UserManagementPage" */));
 // prettier-ignore
-const SetupPage = lazy(() => import("pages/Setup" /* webpackChunkName: "SetupPage" */));
+const SetupPage = lazy(() => import("@src/pages/Setup" /* webpackChunkName: "SetupPage" */));
 
 export default function App() {
   return (

src/assets/BrandedBackground.tsx

@@ -4,8 +4,8 @@ import { use100vh } from "react-div-100vh";
 import { useTheme, alpha } from "@mui/material/styles";
 import { Box, BoxProps } from "@mui/material";
 
-import bgPattern from "assets/bg-pattern.svg";
-import bgPatternDark from "assets/bg-pattern-dark.svg";
+import bgPattern from "@src/assets/bg-pattern.svg";
+import bgPatternDark from "@src/assets/bg-pattern-dark.svg";
 
 export default function BrandedBackground() {
   const theme = useTheme();

src/assets/icons/ResizeBottomRight.tsx

@@ -0,0 +1,10 @@
+import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon";
+import { mdiResizeBottomRight } from "@mdi/js";
+
+export default function ResizeBottomRight(props: SvgIconProps) {
+  return (
+    <SvgIcon {...props}>
+      <path d={mdiResizeBottomRight} />
+    </SvgIcon>
+  );
+}

src/assets/icons/UpdatedAt.tsx

@@ -1,9 +1,10 @@
 import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon";
+import { mdiClockEditOutline } from "@mdi/js";
 
 export default function UpdatedAt(props: SvgIconProps) {
   return (
     <SvgIcon {...props}>
-      <path d="m19.06 14.88 2.05 2-6 6.07H13v-2.01l6.06-6.06ZM12 2a10 10 0 0 1 9.98 9.373 2.561 2.561 0 0 0-2.001.047A8 8 0 0 0 4 12a8.001 8.001 0 0 0 7 7.938v2.013C5.941 21.447 2 17.164 2 12 2 6.477 6.477 2 12 2Zm9.42 11.35 1.28 1.28c.21.21.21.56 0 .77l-1 .95-2.05-2 1-1a.55.55 0 0 1 .77 0ZM12.5 7v5.25l4.018 2.384-1.051 1.045L11 13V7h1.5Z" />
+      <path d={mdiClockEditOutline} />
     </SvgIcon>
   );
 }

src/assets/icons/Webhook.tsx

@@ -0,0 +1,10 @@
+import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon";
+import { mdiWebhook } from "@mdi/js";
+
+export default function Webhook(props: SvgIconProps) {
+  return (
+    <SvgIcon {...props}>
+      <path d={mdiWebhook} />
+    </SvgIcon>
+  );
+}

src/components/Auth/AuthLayout.tsx

@@ -7,11 +7,11 @@ import {
   LinkProps,
 } from "@mui/material";
 import { alpha } from "@mui/material/styles";
-import BrandedBackground, { Wrapper } from "assets/BrandedBackground";
-import Logo from "assets/Logo";
+import BrandedBackground, { Wrapper } from "@src/assets/BrandedBackground";
+import Logo from "@src/assets/Logo";
 
-import { useAppContext } from "contexts/AppContext";
-import { EXTERNAL_LINKS } from "constants/externalLinks";
+import { useAppContext } from "@src/contexts/AppContext";
+import { EXTERNAL_LINKS } from "@src/constants/externalLinks";
 
 export interface IAuthLayoutProps {
   hideLogo?: boolean;

src/components/Auth/FirebaseUi.tsx

@@ -11,7 +11,7 @@ import Skeleton from "@mui/material/Skeleton";
 
 import { auth, db } from "@src/firebase";
 import { defaultUiConfig, getSignInOptions } from "@src/firebase/firebaseui";
-import { PUBLIC_SETTINGS } from "config/dbPaths";
+import { PUBLIC_SETTINGS } from "@src/config/dbPaths";
 
 const useStyles = makeStyles((theme) =>
   createStyles({

src/components/Auth/MarketingBanner.tsx

@@ -1,10 +1,10 @@
 import { Stack, Paper, Typography, Button } from "@mui/material";
 import { alpha } from "@mui/material/styles";
-import DiscordIcon from "assets/icons/Discord";
+import DiscordIcon from "@src/assets/icons/Discord";
 import TwitterIcon from "@mui/icons-material/Twitter";
 
-import Logo from "assets/Logo";
-import { EXTERNAL_LINKS } from "constants/externalLinks";
+import Logo from "@src/assets/Logo";
+import { EXTERNAL_LINKS } from "@src/constants/externalLinks";
 
 export default function MarketingBanner() {
   return (

src/components/CircularProgressOptical.tsx

@@ -0,0 +1,19 @@
+import { CircularProgress, CircularProgressProps } from "@mui/material";
+
+export default function CircularProgressOptical({
+  size = 40,
+  ...props
+}: CircularProgressProps & { size?: number }) {
+  const DEFAULT_SIZE = 40;
+  const DEFAULT_THICKNESS = 3.6;
+  const linearThickness = (DEFAULT_SIZE / size) * DEFAULT_THICKNESS;
+  const opticalRatio = 1 - (1 - size / DEFAULT_SIZE) / 2;
+
+  return (
+    <CircularProgress
+      {...props}
+      size={size}
+      thickness={linearThickness * opticalRatio}
+    />
+  );
+}

src/components/CodeEditorHelper.tsx → src/components/CodeEditor/CodeEditorHelper.tsx

@@ -1,5 +1,5 @@
 import { Stack, Typography, Grid, Tooltip, Button } from "@mui/material";
-import InlineOpenInNewIcon from "components/InlineOpenInNewIcon";
+import InlineOpenInNewIcon from "@src/components/InlineOpenInNewIcon";
 
 export interface ICodeEditorHelperProps {
   docLink: string;
@@ -47,8 +47,8 @@ export default function CodeEditorHelper({
       justifyContent="space-between"
       sx={{ my: 1 }}
     >
-      <Typography variant="body2" color="textSecondary">
-        You can access:
+      <Typography variant="body2" color="textSecondary" sx={{ mr: 0.5 }}>
+        Available:
       </Typography>
 
       <Grid container spacing={1}>
@@ -63,6 +63,7 @@ export default function CodeEditorHelper({
 
       <Button
         size="small"
+        color="primary"
         target="_blank"
         rel="noopener noreferrer"
         href={docLink}