addressed marketing site concerns

.github/workflows/deployDemo.yml

@@ -0,0 +1,60 @@
+name: Deploy Demo
+on:
+  push:
+    branches:
+      - feature/demo
+      - release
+jobs:
+  build-demo-and-push:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Set branch name
+        run: echo ::set-env name=BRANCH::$(echo "$GITHUB_REF")
+
+      - name: Set contextual vars
+        run: |
+          if [ "$BRANCH" = "refs/heads/release" ]; then
+            echo ::set-env name=BUCKET::optic-demo-website-production
+            echo ::set-env name=SITE_URL::https://demo.useoptic.com
+          elif [ "$BRANCH" = "refs/heads/feature/demo" ]; then
+            echo ::set-env name=BUCKET::optic-demo-website-staging
+            echo ::set-env name=SITE_URL::https://demo.o3c.info
+          fi
+
+      - name: Configure AWS Credentials
+        uses: aws-actions/configure-aws-credentials@c0243dfafd0e99b12caca0d56b6de8e7fb8d20db # https://github.com/aws-actions/configure-aws-credentials/commits/v1
+        with:
+          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
+          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+          aws-region: "us-east-1"
+      - uses: actions/setup-node@44c9c187283081e4e88b54b0efad9e9d468165a4 # https://github.com/actions/setup-node/commits/v1
+        with:
+          node-version: 12
+      - name: Checkout Optic Repository
+        uses: actions/checkout@28c7f3d2b5162b5ddd3dfd9a45aa55eaf396478b # https://github.com/actions/checkout/commits/v2
+        with:
+            ref: feature/demo
+            path: demoRepo
+            token: ${{ github.token }}
+      - name: Install Dependencies and Build Optic
+        run:  |
+          sudo apt-get update
+          sudo apt-get install apt-transport-https -y
+          echo "deb https://dl.bintray.com/sbt/debian /" | sudo tee -a /etc/apt/sources.list.d/sbt.list
+          curl -sL "https://keyserver.ubuntu.com/pks/lookup?op=get&search=0x2EE0EA64E40A89B84B2DF73499E82A75642AC823" | sudo apt-key add
+          sudo apt-get update
+          sudo apt-get install sbt -y
+          . ./sourceme.sh && optic_build
+        working-directory: ./demoRepo
+      - name: Build Demo Site
+        run: yarn build-demo
+        working-directory: ./demoRepo
+        env:
+          PUBLIC_URL: ${{ env.SITE_URL }}
+          CI: false # required since otherwise the warnings in react cause a fail to compile
+
+      # `--acl=public-read` is neceesary because the prod account is uploading the files to the staging bucket,
+      # which prevents the default bucket policy from applying to these objects
+      - name: Upload to S3
+        run: "aws s3 cp ./demoRepo/workspaces/ui/build/ s3://$BUCKET/ --recursive --sse=AES256 --acl=public-read"

workspaces/ui/src/entrypoints/demo-sessions.js

@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { useParams, useRouteMatch, useHistory } from 'react-router-dom';
 import { ApiSpecServiceLoader } from '../components/loaders/ApiLoader';
-import { DemoModal } from '../components/DemoModal';
 import {
   Provider as DebugSessionContextProvider,
   useMockSession,
@@ -23,8 +22,6 @@ import { trackEmitter } from "../Analytics"
 export default function DemoSessions(props) {
   const match = useRouteMatch();
   const { sessionId } = useParams();
-  const [showModal, setShowDemoModal] = useState(false);
-  const [actionsCompleted, setActions] = useState(0);
   const history = useHistory();
 
   const session = useMockSession({
@@ -90,18 +87,11 @@ export default function DemoSessions(props) {
   };
 
   // info boxes / guides for the demo
-  const { enqueueSnackbar, closeSnackbar } = useSnackbar();
+  const { enqueueSnackbar } = useSnackbar();
   const [message, setMessage] = useState("nothing")
   const [action, setAction] = useState(null)
   const [hasCommited, setHasCommited] = useState(false) 
 
-  // show demo modal after 3 Minutes
-  setInterval(() => {
-    closeSnackbar()
-    setShowDemoModal(true);
-  }, 180000) // 60 seconds/minute * 3 minutes *  1000 ms/second = 180,000
-
-
   // path specific info boxes
   useEffect(() => {
     /*if (props.location.pathname.includes("diffs/example-session/paths")) {
@@ -233,7 +223,7 @@ export default function DemoSessions(props) {
             diffServiceFactory={diffServiceFactory}
           >
             <ApiRoutes getDefaultRoute={(options) => options.diffsRoot} />
-            { (actionsCompleted >= 2 || showModal) && <DemoModal onCancel={() => {setActions(0); setShowDemoModal(false);}} />}
+
           </ApiSpecServiceLoader>
         </DebugSessionContextProvider>
       </BaseUrlContext>

workspaces/ui/src/theme.js

@@ -11,6 +11,7 @@ export const AddedGreen = '#17c8a3';
 export const AddedDarkGreen = '#1b6d5c';
 export const ChangedYellow = '#c8b768';
 export const RemovedRed = '#c86363';
+export const OpticBlue = '#1B2958';
 
 export const methodColors = {
   OPTIONS: '#686868',
@@ -51,4 +52,14 @@ export const appTheme = createMuiTheme({
     // Use the system font instead of the default Roboto font.
     fontFamily: ['Ubuntu', 'Inter'],
   },
+  overrides: {
+    MuiSnackbarContent: {
+      root: {
+        '&[class*="variantInfo"]': {
+          backgroundColor: OpticBlue,
+          fontWeight: 600
+        },
+      }
+    },
+  }
 });