add basic page-by-page onboarding help

src/views/ProjectsView.vue

@@ -6,6 +6,8 @@
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light">Your Ideas</h1>
 
+    <OnboardingDialog ref="onboardingDialog" />
+
     <!-- Result Tabs -->
     <div class="text-center text-slate-500 border-b border-slate-300 mt-8">
       <ul class="flex flex-wrap justify-center gap-4 -mb-px">
@@ -261,10 +263,14 @@ import { Router } from "vue-router";
 import { NotificationIface } from "@/constants/app";
 import { accountsDB, db, retrieveSettingsForActiveAccount } from "@/db/index";
 import * as libsUtil from "@/libs/util";
+import EntityIcon from "@/components/EntityIcon.vue";
 import InfiniteScroll from "@/components/InfiniteScroll.vue";
 import QuickNav from "@/components/QuickNav.vue";
+import OnboardingDialog from "@/components/OnboardingDialog.vue";
 import ProjectIcon from "@/components/ProjectIcon.vue";
 import TopMessage from "@/components/TopMessage.vue";
+import UserNameDialog from "@/components/UserNameDialog.vue";
+import { Contact } from "@/db/tables/contacts";
 import {
   didInfo,
   getHeaders,
@@ -272,15 +278,14 @@ import {
   OfferSummaryRecord,
   PlanData,
 } from "@/libs/endorserServer";
-import EntityIcon from "@/components/EntityIcon.vue";
-import { Contact } from "@/db/tables/contacts";
-import UserNameDialog from "@/components/UserNameDialog.vue";
+import { OnboardPage } from "@/libs/util";
 
 @Component({
   components: {
     EntityIcon,
     InfiniteScroll,
     QuickNav,
+    OnboardingDialog,
     ProjectIcon,
     TopMessage,
     UserNameDialog,
@@ -325,6 +330,12 @@ export default class ProjectsView extends Vue {
       const allAccounts = await accountsDB.accounts.toArray();
       this.allMyDids = allAccounts.map((acc) => acc.did);
 
+      if (!settings.finishedOnboarding) {
+        (this.$refs.onboardingDialog as OnboardingDialog).open(
+          OnboardPage.Create,
+        );
+      }
+
       if (allAccounts.length === 0) {
         console.error("No accounts found.");
         this.errNote("You need an identifier to load your projects.");