Mirrors/rowy
1
0
Fork 0
mirror of https://github.com/rowyio/rowy.git synced 2025-12-28 16:06:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

update deploy & setup copy

Browse Source
This commit is contained in:
Sidney Alcantara
2021-09-28 14:30:01 +10:00
parent 05369bda5f
commit 6ae425071e
8 changed files with 126 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/service-account.mp4 Normal file
View File

Binary file not shown.

22
src/components/Setup/Step0Welcome.tsx
View File

@@ -1,7 +1,6 @@
import { ISetupStepBodyProps } from "pages/Setup";
import { FormControlLabel, Checkbox, Typography, Link } from "@mui/material";
import OpenInNewIcon from "components/InlineOpenInNewIcon";
import { useAppContext } from "contexts/AppContext";
import { EXTERNAL_LINKS } from "constants/externalLinks";
@@ -38,30 +37,15 @@ export default function Step0Welcome({
}
label={
<>
<Typography sx={{ mt: 1.25, mb: 0.5 }}>
I agree to the terms and conditions
</Typography>
I agree to the{" "}
<Link
href={EXTERNAL_LINKS.terms}
target="_blank"
rel="noopener noreferrer"
display="block"
variant="body2"
color="text.secondary"
color="text.primary"
>
Read the simple English version
<OpenInNewIcon />
</Link>
<Link
href={EXTERNAL_LINKS.terms}
target="_blank"
rel="noopener noreferrer"
display="block"
variant="body2"
color="text.secondary"
>
Read the full terms and conditions
<OpenInNewIcon />
terms and conditions
</Link>
</>
}

2
src/components/Setup/Step1RowyRun.tsx
View File

@@ -102,7 +102,7 @@ export default function Step1RowyRun({
title={
isValidRowyRunUrl
? `Rowy Run is set up at: ${rowyRunUrl}`
: "Deploy Rowy Run to your Google Cloud Platform project."
: "Deploy Rowy Run to your Google Cloud project."
}
>
{!isValidRowyRunUrl && (

85
src/components/Setup/Step2ServiceAccount.tsx
View File

@@ -5,7 +5,6 @@ import { Typography, Link, Stack } from "@mui/material";
import LoadingButton from "@mui/lab/LoadingButton";
import OpenInNewIcon from "@mui/icons-material/OpenInNew";
import InlineOpenInNewIcon from "components/InlineOpenInNewIcon";
import InfoIcon from "@mui/icons-material/InfoOutlined";
import SetupItem from "./SetupItem";
@@ -13,6 +12,8 @@ import { name } from "@root/package.json";
import { useAppContext } from "contexts/AppContext";
import { rowyRun } from "utils/rowyRun";
import { runRoutes } from "constants/runRoutes";
import { WIKI_LINKS } from "constants/externalLinks";
import screenRecording from "assets/service-account.mp4";
export default function Step2ServiceAccount({
rowyRunUrl,
@@ -56,57 +57,48 @@ export default function Step2ServiceAccount({
return (
<>
<Typography variant="inherit" paragraph>
{name} Run uses the{" "}
<Link
href="https://firebase.google.com/docs/admin/setup"
target="_blank"
rel="noopener noreferrer"
>
Firebase Admin SDK
</Link>{" "}
and{" "}
<Link
href="https://github.com/googleapis/google-cloud-node"
target="_blank"
rel="noopener noreferrer"
>
Google Cloud SDKs
</Link>{" "}
to make changes to your Firestore database, authenticated with a{" "}
<Typography variant="inherit">
{name} Run uses a{" "}
<Link
href="https://firebase.google.com/support/guides/service-accounts"
target="_blank"
rel="noopener noreferrer"
color="text.primary"
>
service account
</Link>{" "}
to access your project. It operates exclusively on your GCP project, so
we never have access to any of your data.{" "}
<Link
href={WIKI_LINKS.rowyRun}
target="_blank"
rel="noopener noreferrer"
color="text.secondary"
>
Learn more
<InlineOpenInNewIcon />
</Link>
.
</Typography>
<Typography variant="inherit" style={{ marginTop: 0 }}>
Rowy Run operates exclusively on your GCP project and we will never have
access to your service account or any of your data.
</Typography>
<SetupItem
status={hasAllRoles ? "complete" : "incomplete"}
title={
hasAllRoles
? "Rowy Run has access to a service account with all the required IAM roles:"
: "Set up a service account with the following IAM roles:"
? "Rowy Run has access to a service account with all the required roles."
: "Set up a service account with the following roles:"
}
>
<ul>
<li>Service Account User – required to deploy Cloud Functions</li>
<li>Firebase Authentication Admin</li>
<li>Firestore Service Agent</li>
</ul>
{!hasAllRoles && (
<>
<ul>
<li>Service Account User</li>
<li>Firebase Authentication Admin</li>
<li>Firestore Service Agent</li>
</ul>
<Stack direction="row" spacing={1}>
<LoadingButton
loading={!region}
// loading={!region}
href={`https://console.cloud.google.com/run/deploy/${region}/rowy-run?project=${projectId}`}
target="_blank"
rel="noopener noreferrer"
@@ -130,24 +122,19 @@ export default function Step2ServiceAccount({
</Typography>
)}
<Stack direction="row" spacing={1}>
<InfoIcon aria-label="Info" color="action" sx={{ mt: -0.25 }} />
<Typography variant="body2">
On the Google Cloud Console page, click the Security tab to set
the service account for Rowy Run.
</Typography>
</Stack>
<Typography variant="inherit">
Follow the steps in the screen recording below:
</Typography>
<video
src={screenRecording}
controls
muted
playsInline
style={{ width: "100%" }}
/>
</>
)}
<Link
href="https://cloud.google.com/iam/docs/understanding-roles"
target="_blank"
rel="noopener noreferrer"
>
Learn about IAM roles
<InlineOpenInNewIcon />
</Link>
</SetupItem>
</>
);

7
src/components/Setup/Step3ProjectOwner.tsx
View File

@@ -62,10 +62,9 @@ export default function Step3ProjectOwner({
return (
<>
<Typography variant="inherit">
The project owner requires the admin and owner roles to have full access
to manage this project. The default project owner is the Google Cloud
account used to deploy Rowy Run:{" "}
<b style={{ userSelect: "all" }}>{email}</b>
The project owner requires full access to manage this project. The
default project owner is the Google Cloud account used to deploy Rowy
Run: <b style={{ userSelect: "all" }}>{email}</b>
</Typography>
<SetupItem

3
src/constants/externalLinks.ts
View File

@@ -23,6 +23,9 @@ export const EXTERNAL_LINKS = {
};
const WIKI_PATHS = {
firebaseProject: "/setup/firebase-project",
rowyRun: "/rowy-run",
updating: "/Updating",
derivatives: "/field-types/derivative",
defaultValues: "/Default-Values",

98
src/pages/Deploy.tsx
View File

@@ -1,8 +1,18 @@
import { useState } from "react";
import { useLocation } from "react-router-dom";
import queryString from "query-string";
import { useMediaQuery, Stack, Typography, Link } from "@mui/material";
import InlineOpenInNewIcon from "components/InlineOpenInNewIcon";
import {
useMediaQuery,
Stack,
Typography,
Link,
FormControl,
FormLabel,
FormGroup,
FormControlLabel,
Checkbox,
} from "@mui/material";
import MarketingBanner from "components/Auth/MarketingBanner";
import AuthLayout from "components/Auth/AuthLayout";
@@ -21,6 +31,10 @@ export default function DeployPage() {
const isMobile = useMediaQuery((theme: any) => theme.breakpoints.down("md"));
const [confirmProject, setConfirmProject] = useState(false);
const [confirmFirestore, setConfirmFirestore] = useState(false);
const [confirmAuth, setConfirmAuth] = useState(false);
return (
<Stack direction="row">
<MarketingBanner />
@@ -33,41 +47,81 @@ export default function DeployPage() {
title="Get Started"
description={
<>
<Typography variant="inherit" paragraph>
Set up {name} on your Google Cloud Platform project with this
one-click deploy button.
</Typography>
<FormControl component="fieldset" variant="standard">
<FormLabel
component="legend"
sx={{ fontWeight: "medium", color: "text.primary" }}
>
Make sure you have the following:
</FormLabel>
<FormGroup style={{ textAlign: "left" }}>
<FormControlLabel
control={
<Checkbox
checked={confirmProject}
onChange={(e) => setConfirmProject(e.target.checked)}
/>
}
label="A Google Cloud or Firebase project"
/>
<FormControlLabel
control={
<Checkbox
checked={confirmFirestore}
onChange={(e) => setConfirmFirestore(e.target.checked)}
/>
}
label="Firestore enabled"
/>
<FormControlLabel
control={
<Checkbox
checked={confirmAuth}
onChange={(e) => setConfirmAuth(e.target.checked)}
/>
}
label="Firebase Authentication with the Google sign-in method enabled"
/>
</FormGroup>
</FormControl>
<Typography variant="inherit">
You must have a project set up on Google Cloud Platform or
Firebase.
<br />
<Typography sx={{ mt: 3 }}>
Don’t have a project? Follow our{" "}
<Link
href={"https://firebase.google.com/docs/web/setup#create-project"}
href={WIKI_LINKS.firebaseProject}
target="_blank"
rel="noopener noreferrer"
color="text.primary"
>
Learn how to create one
<InlineOpenInNewIcon />
</Link>
step-by-step guide
</Link>{" "}
to get started.
</Typography>
</>
}
>
<a
href={EXTERNAL_LINKS.rowyRunDeploy}
target="_blank"
rel="noopener noreferrer"
>
{confirmProject && confirmFirestore && confirmAuth ? (
<a
href={EXTERNAL_LINKS.rowyRunDeploy}
target="_blank"
rel="noopener noreferrer"
>
<img
src="https://deploy.cloud.run/button.svg"
alt="Run on Google Cloud"
style={{ display: "block" }}
width={183}
height={32}
/>
</a>
) : (
<img
src="https://deploy.cloud.run/button.svg"
alt="Run on Google Cloud"
style={{ display: "block" }}
style={{ display: "block", filter: "grayscale(1)", opacity: 0.6 }}
width={183}
height={32}
/>
</a>
)}
<Typography
variant="caption"

4
types/custom.ts
View File

@@ -2,3 +2,7 @@ declare module "*.css" {
const content: any;
export default content;
}
declare module "*.mp4" {
const content: any;
export default content;
}