Merge branch 'main' into feat/add-deployment-magic

Cargo.toml

@@ -51,6 +51,7 @@ members = [
     "lib/telemetry-http-rs",
     "lib/telemetry-nats-rs",
     "lib/telemetry-rs",
+    "lib/telemetry-utils-rs",
     "lib/veritech-client",
     "lib/veritech-core",
     "lib/veritech-server",
@@ -121,7 +122,7 @@ num_cpus = "1.16.0"
 once_cell = "1.19.0"
 open = "5.1.2"
 opentelemetry = { version = "0.22.0", features = ["trace"] }
-opentelemetry-otlp = "0.15.0"
+opentelemetry-otlp = { version = "0.15.0", features = ["metrics", "trace"] }
 opentelemetry-semantic-conventions = "0.14.0"
 opentelemetry_sdk = { version = "0.22.1", features = ["rt-tokio"] }
 ouroboros = "0.18.3"

app/docs/package.json

@@ -13,8 +13,10 @@
     "@si/tsconfig": "workspace:*",
     "@types/node": "^18.15.11",
     "eslint": "^8.36.0",
+    "medium-zoom": "^1.1.0",
     "typescript": "^4.9.5",
-    "vitepress": "~1.0.2"
+    "vitepress": "~1.0.2",
+    "vitepress-plugin-lightbox": "^1.0.2"
   },
   "volta": {
     "extends": "../../package.json"

app/docs/src/.vitepress/config.ts

@@ -1,6 +1,7 @@
 import { defineConfig } from "vitepress";
 import dotenv from "dotenv";
 import path from "path";
+import lightbox from "vitepress-plugin-lightbox";
 
 dotenv.config();
 
@@ -12,6 +13,9 @@ export default defineConfig({
       light: "github-light",
       dark: "github-dark",
     },
+    config: (md) => {
+      md.use(lightbox, {});
+    }
   },
   head: [
     ['script', {}, `
@@ -70,6 +74,10 @@ export default defineConfig({
           {
             text: "AWS IAM Policy",
             link: "/how-tos/aws-iam",
+          },
+          {
+            text: "AWS VPC",
+            link: "/how-tos/aws-vpc",
           }
         ]
       },

app/docs/src/.vitepress/theme/Layout.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+import DefaultTheme from "vitepress/theme";
+import { onMounted } from "vue";
+import { useRouter } from "vitepress";
+import mediumZoom from "medium-zoom";
+
+const { Layout } = DefaultTheme;
+const router = useRouter();
+
+// Setup medium zoom with the desired options
+const setupMediumZoom = () => {
+  mediumZoom("[data-zoomable]", {
+    background: "transparent",
+  });
+};
+
+// Apply medium zoom on load
+onMounted(setupMediumZoom);
+
+// Subscribe to route changes to re-apply medium zoom effect
+router.onAfterRouteChanged = setupMediumZoom;
+</script>
+
+<template>
+  <Layout />
+</template>
+
+<style>
+.medium-zoom-overlay {
+  backdrop-filter: blur(5rem);
+}
+
+.medium-zoom-overlay,
+.medium-zoom-image--opened {
+  z-index: 999;
+}
+</style>

app/docs/src/.vitepress/theme/index.ts

@@ -0,0 +1,7 @@
+import DefaultTheme from "vitepress/theme";
+import Layout from "./Layout.vue";
+
+export default {
+  extends: DefaultTheme,
+  Layout,
+}

app/docs/src/changelog/index.md

@@ -11,6 +11,16 @@ All notable changes to System Initiative will be documented in this file.
 - `Fixed` for any bug fixes.
 - `Security` in case of vulnerabilities.
 
+## 2024-07-29
+
+New demo's this week:
+
+- Contribution workflow
+- Rebaser updates
+- Doc updates!
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/Sl9N1ORFLX8?si=tKVduMfzYPrOX42j" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+
 ## 2024-07-22
 
 New demo's this week:

app/docs/src/how-tos/aws-vpc.md

@@ -0,0 +1,179 @@
+---
+outline:
+  level: [2, 3, 4]
+---
+
+# How to manage an AWS VPC
+
+This how-to assumes:
+
+- Basic [familiarity with System Initiative](../tutorials/getting-started)
+- Are familiar with [AWS VPC](https://docs.aws.amazon.com/vpc/)
+
+It will teach you how to create a best practice AWS VPC and manage it with
+System Initiative.
+
+We will cover:
+
+- The creation of a highly available VPC that spans multiple availability zones.
+- A VPC configured with public and private subnets.
+- The networking required to allow outbound traffic for resources on the private
+  subnets.
+- The networking required for the communication with the internet.
+
+## Setup
+
+All activities in this how-to happen within a configured AWS Region and AWS
+Credential. Set the AWS Region to be `us-east-2`.
+
+Start in a change set named `VPC How-to`.
+
+## Walkthrough
+
+### What it will look like
+
+When you are through with this guide, you should have components that look like
+this in your diagram:
+
+![AWS VPC Diagram](./aws-vpc-howto-complete.png)
+
+### Create a VPC component
+
+Add a `VPC` to your `us-east-2` region frame.
+
+Set the component type to be `Configuration Frame (down)` and expand it to fill
+the region frame.
+
+Set the component name to be `How to VPC`.
+
+Set the `CidrBlock` to be  `10.0.0.0/16`
+
+Enable `EnableDnsHostnames` and `EnableDnsResolution`.
+
+### Create the Public Subnet Components
+
+This VPC will span multiple availability zones in our AWS Region. Add 3 `Subnet`
+components to your VPC frame and configure them as follows:
+
+| component name | `CidrBlock`   | `AvailabilityZone` |
+| -------------- | ------------- | ------------------ |
+| Public 1       | 10.0.128.0/20 | us-east-2a         |
+| Public 2       | 10.0.144.0/20 | us-east-2b         |
+| Public 3       | 10.0.160.0/20 | us-east-2c         |
+
+Enable `IsPublic` for each of the public subnet components.
+
+Set the component type for each of the public subnet components to be
+`Configuration Frame (down)`.
+
+### Create the Elastic IP and NAT Gateway Components
+
+To each of the `Public` subnet frames, add an `Elastic IP` component.
+
+Also add a `NAT Gateway` component to each of the `Public` subnet frames.
+
+Set name names of the component to be `NAT Gateway (1|2|3)` - the index should
+align with the subnet it is inside.
+
+Connect the `Alocation ID` output socket of the `Elastic IP` component to the
+`Allocation ID` input socket of the `NAT Gateway` component. The connections
+should be in the same subnet.
+
+### Create the Public Route Table Component
+
+Add a `Route Table` component to the VPC frame.
+
+Set the component type to be `Configuration Frame (down)`.
+
+Set the component name to be `Public Route Table`.
+
+Connect the `Subnet ID` output socket of the public subnet components to the
+`Subnet ID` input socket of the `Public Route Table` component.
+
+### Create a Route Component
+
+Add a `Route` component to the `Public Route Table` frame.
+
+Set the component name to be `Route to Internet`.
+
+Set `DestinationCidrBlock` to be `0.0.0.0/0`.
+
+### Create the Internet Gateway Component
+
+Add an `Internet Gateway` component to the VPC frame.
+
+Set the name to be `IGW`.
+
+Connect the `Gateway ID` output socket of the `IGW` component to the
+`Gateway ID` input socket of the `Route to Internet` component in the
+`Public Route Table` frame.
+
+### Create the Private Subnet Components
+
+Add 3 `Subnet` components to your VPC frame and configure them as follows:
+
+| component name | `CidrBlock`  | `AvailabilityZone` |
+| -------------- | ------------ | ------------------ |
+| Private 1      | 10.0.0.0/19  | us-east-2a         |
+| Private 2      | 10.0.32.0/19 | us-east-2b         |
+| Private 3      | 10.0.64.0/19 | us-east-2c         |
+
+Set the component type for each of the public subnet components to be
+`Configuration Frame (down)`.
+
+### Create the Private Route Table Components
+
+To each of the `Private` subnet frames, add a `Route Table` Component.
+
+Set the name to be `Private Route Table 1(2|3)` - the index should align with
+the subnet frame it is inside.
+
+Set the component type for each of the `Private Route Table` components to be
+`Configuration Frame (down)`.
+
+### Create theRoute Components
+
+Add a `Route` component to each of the `Private Route Table` frames.
+
+Set the component name to be `Route to Internet (1|2|3)` - the index should
+align with the route table frame it is inside.
+
+Set `DestinationCidrBlock` to be `0.0.0.0/0`.
+
+Connect the output socket `NAT Gateway ID` of `NAT Gateway 1` component to the
+`NAT Gateway ID` input socket of `Route to Internet 1` component.
+
+Connect the output socket `NAT Gateway ID` of `NAT Gateway 2` component to the
+`NAT Gateway ID` input socket of `Route to Internet 2` component.
+
+Connect the output socket `NAT Gateway ID` of `NAT Gateway 3` component to the
+`NAT Gateway ID` input socket of `Route to Internet 3` component.
+
+### Apply your Change Set
+
+Press `Escape` or click anywhere on the canvas background to select the
+Workspace.
+
+Click the `Apply Change Set` button to:
+
+- Create a VPC component
+- Create 6 Subnets
+- Create an Internet Gateway
+- Create 3 Elastic IPs and 3 NAT Gateways
+- Create 4 Route Tables and 4 Routes
+
+### Explore your resources
+
+Review the completed AWS resources by clicking the `Resource` sub-panel for each
+of your new resources.
+
+### Clean Up
+
+Create a new change set called `Clean up VPC How-to`
+
+Delete your `VPC How-to` VPC frame. All of the components inside will be marked
+for deletion.
+
+Click `Apply Change Set`.
+
+All your new resources should be deleted from your AWS account.

app/docs/src/how-tos/index.md

@@ -3,3 +3,4 @@
 How To Guides show you how to accomplish specific tasks with System Initiative. They assume knowledge of both System Initiative and the task they are teaching. They help you solve problems quickly by showing you relevant examples, and relying on your pre-existing knowledge.
 
 - [AWS IAM Policy](./aws-iam) - learn how to model AWS IAM Policies
+- [AWS VPC](./aws-vpc) - learn how to model an AWS VPC

app/web/cypress/e2e/workspace-management/workspace-dashboard.cy.ts

@@ -1,41 +1,41 @@
 // @ts-check
 ///<reference path="../global.d.ts"/>
 
+const SI_CYPRESS_MULTIPLIER = Cypress.env('VITE_SI_CYPRESS_MULTIPLIER') || import.meta.env.VITE_SI_CYPRESS_MULTIPLIER || 1;
 const AUTH0_USERNAME = Cypress.env('VITE_AUTH0_USERNAME') || import.meta.env.VITE_AUTH0_USERNAME;
 const AUTH0_PASSWORD = Cypress.env('VITE_AUTH0_PASSWORD') || import.meta.env.VITE_AUTH0_PASSWORD;
 const AUTH_PORTAL_URL = Cypress.env('VITE_AUTH_PORTAL_URL') || import.meta.env.VITE_AUTH_PORTAL_URL;
 const AUTH_API_URL = Cypress.env('VITE_AUTH_API_URL') || import.meta.env.VITE_AUTH_API_URL;
 const SI_WORKSPACE_ID = Cypress.env('VITE_SI_WORKSPACE_ID') || import.meta.env.VITE_SI_WORKSPACE_ID;
 const UUID = Cypress.env('VITE_UUID') || import.meta.env.VITE_UUID || "local";
 
-describe("workspace", () => {
-  beforeEach(() => {
-    cy.visit("/");
-  });
+Cypress._.times(SI_CYPRESS_MULTIPLIER, () => {
+  describe("workspace", () => {
+    beforeEach(() => {
+      cy.visit("/");
+    });
 
-  it("dashboard_redirect", () => {
+    it("dashboard_redirect", () => {
 
-    cy.loginToAuth0(AUTH0_USERNAME, AUTH0_PASSWORD);
+      cy.loginToAuth0(AUTH0_USERNAME, AUTH0_PASSWORD);
 
-    // Go to the Synthetic User's Dashboard
-    cy.visit(AUTH_PORTAL_URL + '/dashboard')
-    cy.sendPosthogEvent(Cypress.currentTest.titlePath.join("/"), "test_uuid", UUID);
+      // Go to the Synthetic User's Dashboard
+      cy.visit(AUTH_PORTAL_URL + '/dashboard')
+      cy.sendPosthogEvent(Cypress.currentTest.titlePath.join("/"), "test_uuid", UUID);
 
-    cy.wait(5000);
+      cy.wait(5000);
 
-    // Find the URL for the synthetic workspace and go there
-    cy.get('a[href="' + AUTH_API_URL + '/workspaces/' + SI_WORKSPACE_ID + '/go"]')
-       .should('be.visible')
-       .invoke('removeAttr', 'target')
-       .click();
-    cy.on('uncaught:exception', (e) => {
-      console.log(e);
-      return false;
-    });
+      // Find the URL for the synthetic workspace and go there
+      cy.get('a[href="' + AUTH_API_URL + '/workspaces/' + SI_WORKSPACE_ID + '/go"]')
+        .should('be.visible')
+        .invoke('removeAttr', 'target')
+        .click();
+      cy.on('uncaught:exception', (e) => {
+        console.log(e);
+        return false;
+      });
 
-    cy.wait(5000);
-
-    // Check that it loaded the workspace + prompted to create a new change set
-    cy.contains('Create change set', { timeout: 10000 }).should('be.visible');
+      cy.appModelPageLoaded();
+    });
   });
-});
+});