Everything except write

packages/services/api/src/modules/organization/module.graphql.ts

@@ -91,6 +91,7 @@ export default gql`
     me: Member!
     members: MemberConnection!
     inviteCode: String!
+    getStarted: OrganizationGetStarted!
   }
 
   type OrganizationConnection {
@@ -114,4 +115,13 @@ export default gql`
     selector: OrganizationSelector!
     organization: Organization!
   }
+
+  type OrganizationGetStarted {
+    creatingProject: Boolean!
+    publishingSchema: Boolean!
+    checkingSchema: Boolean!
+    invitingMembers: Boolean!
+    reportingOperations: Boolean!
+    enablingUsageBasedBreakingChanges: Boolean!
+  }
 `;

packages/services/api/src/modules/organization/resolvers.ts

@@ -194,6 +194,9 @@ export const resolvers: OrganizationModule.Resolvers = {
     members(organization, _, { injector }) {
       return injector.get(OrganizationManager).getOrganizationMembers({ organization: organization.id });
     },
+    getStarted(organization) {
+      return organization.getStarted;
+    },
   },
   OrganizationInvitationError: {
     __isTypeOf(obj) {

packages/services/api/src/shared/entities.ts

@@ -105,6 +105,14 @@ export interface Organization {
     operations: number;
     schemaPush: number;
   };
+  getStarted: {
+    creatingProject: boolean;
+    publishingSchema: boolean;
+    checkingSchema: boolean;
+    invitingMembers: boolean;
+    reportingOperations: boolean;
+    enablingUsageBasedBreakingChanges: boolean;
+  };
 }
 
 export interface OrganizationBilling {

packages/services/storage/migrations/actions/2022.07.11T10.09.41.get-started-wizard.sql

@@ -0,0 +1,9 @@
+-- Tracks feature discovery progress
+
+ALTER table public.organizations
+  ADD COLUMN get_started_creating_project BOOLEAN NOT NULL DEFAULT FALSE,
+  ADD COLUMN get_started_publishing_schema BOOLEAN NOT NULL DEFAULT FALSE,
+  ADD COLUMN get_started_checking_schema BOOLEAN NOT NULL DEFAULT FALSE,
+  ADD COLUMN get_started_inviting_members BOOLEAN NOT NULL DEFAULT FALSE,
+  ADD COLUMN get_started_reporting_operations BOOLEAN NOT NULL DEFAULT FALSE,
+  ADD COLUMN get_started_usage_breaking BOOLEAN NOT NULL DEFAULT FALSE;

packages/services/storage/migrations/actions/down/2022.07.11T10.09.41.get-started-wizard.sql

@@ -0,0 +1,7 @@
+ALTER TABLE public.commits
+  DROP COLUMN get_started_creating_project,
+  DROP COLUMN get_started_publishing_schema,
+  DROP COLUMN get_started_checking_schema,
+  DROP COLUMN get_started_inviting_members,
+  DROP COLUMN get_started_reporting_operations,
+  DROP COLUMN get_started_usage_breaking;

packages/services/storage/src/db/types.ts

@@ -72,6 +72,12 @@ export interface organization_member {
 export interface organizations {
   clean_id: string;
   created_at: Date;
+  get_started_checking_schema: boolean;
+  get_started_creating_project: boolean;
+  get_started_inviting_members: boolean;
+  get_started_publishing_schema: boolean;
+  get_started_reporting_operations: boolean;
+  get_started_usage_breaking: boolean;
   github_app_installation_id: string | null;
   id: string;
   invite_code: string;

packages/services/storage/src/index.ts

@@ -100,6 +100,14 @@ export async function createStorage(connection: string): Promise<Storage> {
       },
       billingPlan: organization.plan_name,
       type: (organization.type === 'PERSONAL' ? 'PERSONAL' : 'REGULAR') as OrganizationType,
+      getStarted: {
+        creatingProject: organization.get_started_creating_project,
+        publishingSchema: organization.get_started_publishing_schema,
+        checkingSchema: organization.get_started_checking_schema,
+        invitingMembers: organization.get_started_inviting_members,
+        reportingOperations: organization.get_started_reporting_operations,
+        enablingUsageBasedBreakingChanges: organization.get_started_usage_breaking,
+      },
     };
   }
 

packages/web/app/src/components/onboarding/wizard.tsx → packages/web/app/src/components/get-started/wizard.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { VscIssues, VscError } from 'react-icons/vsc';
-import clsx from 'clsx';
 import {
   useDisclosure,
   Drawer,
@@ -10,29 +9,28 @@ import {
   DrawerContent,
   DrawerCloseButton,
 } from '@chakra-ui/react';
+import clsx from 'clsx';
+import { gql, DocumentType } from 'urql';
 
-interface OnboardingTasks {
-  creatingProject: boolean;
-  publishingSchema: boolean;
-  checkingSchema: boolean;
-  invitingMembers: boolean;
-  reportingOperations: boolean;
-  enablingUsageBasedBreakingChanges: boolean;
-}
-
-export function OnboardingProgress() {
-  const tasks: OnboardingTasks = {
-    creatingProject: true,
-    publishingSchema: false,
-    checkingSchema: false,
-    invitingMembers: false,
-    reportingOperations: false,
-    enablingUsageBasedBreakingChanges: true,
-  };
+const GetStartedWizard_GetStartedProgress = gql(/* GraphQL */ `
+  fragment GetStartedWizard_GetStartedProgress on OrganizationGetStarted {
+    creatingProject
+    publishingSchema
+    checkingSchema
+    invitingMembers
+    reportingOperations
+    enablingUsageBasedBreakingChanges
+  }
+`);
 
+export function GetStartedProgress({ tasks }: { tasks: DocumentType<typeof GetStartedWizard_GetStartedProgress> }) {
   const { isOpen, onOpen, onClose } = useDisclosure();
   const triggerRef = React.useRef<HTMLButtonElement>(null);
 
+  if (!tasks) {
+    return null;
+  }
+
   const values = Object.values(tasks);
   const total = values.length;
   const completed = values.filter(t => t === true).length;
@@ -65,12 +63,12 @@ export function OnboardingProgress() {
           </div>
         </div>
       </button>
-      <OnboardingWizard isOpen={isOpen} onClose={onClose} triggerRef={triggerRef} tasks={tasks} />
+      <GetStartedWizard isOpen={isOpen} onClose={onClose} triggerRef={triggerRef} tasks={tasks} />
     </>
   );
 }
 
-function OnboardingWizard({
+function GetStartedWizard({
   isOpen,
   onClose,
   triggerRef,
@@ -79,7 +77,7 @@ function OnboardingWizard({
   isOpen: boolean;
   onClose(): void;
   triggerRef: React.RefObject<HTMLButtonElement>;
-  tasks: OnboardingTasks;
+  tasks: DocumentType<typeof GetStartedWizard_GetStartedProgress>;
 }) {
   return (
     <Drawer isOpen={isOpen} placement="right" onClose={onClose} finalFocusRef={triggerRef} size="md">

packages/web/app/src/components/v2/header.tsx

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import { useQuery } from 'urql';
 
 import { useUser } from '@/components/auth/AuthProvider';
-import { OnboardingProgress } from '@/components/onboarding/wizard';
+import { GetStartedProgress } from '@/components/get-started/wizard';
 import { Avatar, Button, DropdownMenu, HiveLink } from '@/components/v2';
 import {
   AlertTriangleIcon,
@@ -20,6 +20,7 @@ import {
 } from '@/components/v2/icon';
 import { CreateOrganizationModal } from '@/components/v2/modals';
 import { MeDocument, OrganizationsDocument, OrganizationsQuery, OrganizationType } from '@/graphql';
+import { useRouteSelector } from '@/lib/hooks/use-route-selector';
 import { ManagerRoleGuard } from '../auth/ManagerRoleGuard';
 
 type DropdownOrganization = OrganizationsQuery['organizations']['nodes'];
@@ -33,6 +34,7 @@ const OrganizationLink = (props: { children: string; href: string }): ReactEleme
 };
 
 export const Header = (): ReactElement => {
+  const router = useRouteSelector();
   const [meQuery] = useQuery({ query: MeDocument });
   const { user } = useUser();
   const [organizationsQuery] = useQuery({ query: OrganizationsDocument });
@@ -58,6 +60,9 @@ export const Header = (): ReactElement => {
     { personal: [], organizations: [] }
   );
 
+  const currentOrg =
+    typeof router.organizationId === 'string' ? organizations.find(org => org.cleanId === router.organizationId) : null;
+
   // Copied from tailwindcss website
   // https://github.com/tailwindlabs/tailwindcss.com/blob/94971856747c159b4896621c3308bcfa629bb736/src/components/Header.js#L149
   useEffect(() => {
@@ -87,7 +92,7 @@ export const Header = (): ReactElement => {
       <div className="container flex h-[84px] items-center justify-between">
         <HiveLink />
         <div className="flex flex-row gap-8">
-          <OnboardingProgress />
+          {currentOrg ? <GetStartedProgress tasks={currentOrg.getStarted} /> : null}
           <DropdownMenu>
             <DropdownMenu.Trigger asChild>
               <Button>

packages/web/app/src/graphql/fragments.graphql

@@ -7,6 +7,9 @@ fragment OrganizationFields on Organization {
   me {
     ...MemberFields
   }
+  getStarted {
+    ...GetStartedWizard_GetStartedProgress
+  }
 }
 
 fragment OrganizationEssentials on Organization {