adds capabilities to toolbar app and config file

toolbar-app/.astro/content-assets.mjs

@@ -0,0 +1 @@
+export default new Map();

toolbar-app/.astro/content-modules.mjs

@@ -0,0 +1,4 @@
+
+export default new Map([
+["src/content/docs/index.mdoc", () => import("astro:content-layer-deferred-module?astro%3Acontent-layer-deferred-module=&fileName=src%2Fcontent%2Fdocs%2Findex.mdoc&astroContentModuleFlag=true")]]);
+

toolbar-app/.astro/content.d.ts

@@ -0,0 +1,183 @@
+declare module 'astro:content' {
+	interface Render {
+		'.mdoc': Promise<{
+			Content(props: Record<string, any>): import('astro').MarkdownInstance<{}>['Content'];
+			headings: import('astro').MarkdownHeading[];
+		}>;
+	}
+}
+
+declare module 'astro:content' {
+	interface Render {
+		'.mdx': Promise<{
+			Content: import('astro').MarkdownInstance<{}>['Content'];
+			headings: import('astro').MarkdownHeading[];
+			remarkPluginFrontmatter: Record<string, any>;
+			components: import('astro').MDXInstance<{}>['components'];
+		}>;
+	}
+}
+
+declare module 'astro:content' {
+	export interface RenderResult {
+		Content: import('astro/runtime/server/index.js').AstroComponentFactory;
+		headings: import('astro').MarkdownHeading[];
+		remarkPluginFrontmatter: Record<string, any>;
+	}
+	interface Render {
+		'.md': Promise<RenderResult>;
+	}
+
+	export interface RenderedContent {
+		html: string;
+		metadata?: {
+			imagePaths: Array<string>;
+			[key: string]: unknown;
+		};
+	}
+}
+
+declare module 'astro:content' {
+	type Flatten<T> = T extends { [K: string]: infer U } ? U : never;
+
+	export type CollectionKey = keyof AnyEntryMap;
+	export type CollectionEntry<C extends CollectionKey> = Flatten<AnyEntryMap[C]>;
+
+	export type ContentCollectionKey = keyof ContentEntryMap;
+	export type DataCollectionKey = keyof DataEntryMap;
+
+	type AllValuesOf<T> = T extends any ? T[keyof T] : never;
+	type ValidContentEntrySlug<C extends keyof ContentEntryMap> = AllValuesOf<
+		ContentEntryMap[C]
+	>['slug'];
+
+	/** @deprecated Use `getEntry` instead. */
+	export function getEntryBySlug<
+		C extends keyof ContentEntryMap,
+		E extends ValidContentEntrySlug<C> | (string & {}),
+	>(
+		collection: C,
+		// Note that this has to accept a regular string too, for SSR
+		entrySlug: E,
+	): E extends ValidContentEntrySlug<C>
+		? Promise<CollectionEntry<C>>
+		: Promise<CollectionEntry<C> | undefined>;
+
+	/** @deprecated Use `getEntry` instead. */
+	export function getDataEntryById<C extends keyof DataEntryMap, E extends keyof DataEntryMap[C]>(
+		collection: C,
+		entryId: E,
+	): Promise<CollectionEntry<C>>;
+
+	export function getCollection<C extends keyof AnyEntryMap, E extends CollectionEntry<C>>(
+		collection: C,
+		filter?: (entry: CollectionEntry<C>) => entry is E,
+	): Promise<E[]>;
+	export function getCollection<C extends keyof AnyEntryMap>(
+		collection: C,
+		filter?: (entry: CollectionEntry<C>) => unknown,
+	): Promise<CollectionEntry<C>[]>;
+
+	export function getEntry<
+		C extends keyof ContentEntryMap,
+		E extends ValidContentEntrySlug<C> | (string & {}),
+	>(entry: {
+		collection: C;
+		slug: E;
+	}): E extends ValidContentEntrySlug<C>
+		? Promise<CollectionEntry<C>>
+		: Promise<CollectionEntry<C> | undefined>;
+	export function getEntry<
+		C extends keyof DataEntryMap,
+		E extends keyof DataEntryMap[C] | (string & {}),
+	>(entry: {
+		collection: C;
+		id: E;
+	}): E extends keyof DataEntryMap[C]
+		? Promise<DataEntryMap[C][E]>
+		: Promise<CollectionEntry<C> | undefined>;
+	export function getEntry<
+		C extends keyof ContentEntryMap,
+		E extends ValidContentEntrySlug<C> | (string & {}),
+	>(
+		collection: C,
+		slug: E,
+	): E extends ValidContentEntrySlug<C>
+		? Promise<CollectionEntry<C>>
+		: Promise<CollectionEntry<C> | undefined>;
+	export function getEntry<
+		C extends keyof DataEntryMap,
+		E extends keyof DataEntryMap[C] | (string & {}),
+	>(
+		collection: C,
+		id: E,
+	): E extends keyof DataEntryMap[C]
+		? string extends keyof DataEntryMap[C]
+			? Promise<DataEntryMap[C][E]> | undefined
+			: Promise<DataEntryMap[C][E]>
+		: Promise<CollectionEntry<C> | undefined>;
+
+	/** Resolve an array of entry references from the same collection */
+	export function getEntries<C extends keyof ContentEntryMap>(
+		entries: {
+			collection: C;
+			slug: ValidContentEntrySlug<C>;
+		}[],
+	): Promise<CollectionEntry<C>[]>;
+	export function getEntries<C extends keyof DataEntryMap>(
+		entries: {
+			collection: C;
+			id: keyof DataEntryMap[C];
+		}[],
+	): Promise<CollectionEntry<C>[]>;
+
+	export function render<C extends keyof AnyEntryMap>(
+		entry: AnyEntryMap[C][string],
+	): Promise<RenderResult>;
+
+	export function reference<C extends keyof AnyEntryMap>(
+		collection: C,
+	): import('astro/zod').ZodEffects<
+		import('astro/zod').ZodString,
+		C extends keyof ContentEntryMap
+			? {
+					collection: C;
+					slug: ValidContentEntrySlug<C>;
+				}
+			: {
+					collection: C;
+					id: keyof DataEntryMap[C];
+				}
+	>;
+	// Allow generic `string` to avoid excessive type errors in the config
+	// if `dev` is not running to update as you edit.
+	// Invalid collection names will be caught at build time.
+	export function reference<C extends string>(
+		collection: C,
+	): import('astro/zod').ZodEffects<import('astro/zod').ZodString, never>;
+
+	type ReturnTypeOrOriginal<T> = T extends (...args: any[]) => infer R ? R : T;
+	type InferEntrySchema<C extends keyof AnyEntryMap> = import('astro/zod').infer<
+		ReturnTypeOrOriginal<Required<ContentConfig['collections'][C]>['schema']>
+	>;
+
+	type ContentEntryMap = {
+
+	};
+
+	type DataEntryMap = {
+		"docs": Record<string, {
+  id: string;
+  body?: string;
+  collection: "docs";
+  data: InferEntrySchema<"docs">;
+  rendered?: RenderedContent;
+  filePath?: string;
+}>;
+
+	};
+
+	type AnyEntryMap = ContentEntryMap & DataEntryMap;
+
+	export type ContentConfig = typeof import("../src/content.config.js");
+}

toolbar-app/.astro/settings.json

@@ -0,0 +1,5 @@
+{
+	"_variables": {
+		"lastUpdateCheck": 1742919742088
+	}
+}

toolbar-app/.astro/types.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="astro/client" />
+/// <reference path="content.d.ts" />

toolbar-app/vonage-toolbar/README.md

@@ -3,4 +3,4 @@
 In the preview, there will be a toolbar in the bottom middle of the page.
 Click the Vonage logo for the instructions.
 
-<img width="563" alt="image" src="https://github.com/user-attachments/assets/64a511dd-55c3-497c-9378-97c11465307c">
+![Screenshot of toolbar app. A dark gray rectangular interface element with rounded corners, displaying a list of six steps in white text, each preceded by a right-pointing triangle. Below the rectangle is a smaller dark gray rounded rectangle containing five white icons: an Astro logo, cursor arrow, three horizontal lines with a magnification glass, a V, and a gear icon. ](./toolbar.png)

toolbar-app/vonage-toolbar/app.ts

@@ -3,10 +3,12 @@ import { defineToolbarApp } from 'astro/toolbar';
 let tutorial: {
   files: string[];
   panels: string[];
+  capabilities: string[];
   version: string;
 } = {
   files: [],
   panels: [],
+  capabilities: [],
   version: '',
 };
 
@@ -44,11 +46,21 @@ export default defineToolbarApp({
       <ul id='file-list'></ul>
     </details>
     <details name='steps'>
-      <summary>Step 4: Enter version</summary>
+      <summary>Step 4: Select capabilities needed</summary>
+      Please select any capabilities used in the tutorial
+      <form id='capabilities'>
+        <div>
+          <input type="checkbox" id="voice" name="capabilities" value="voice" />
+          <label for="voice">Voice</label>
+        </div>
+      </form>
+    </details>
+    <details name='steps'>
+      <summary>Step 5: Enter version</summary>
       <input id='version' placeholder='0.0.0'/>
     </details>
     <details name='steps'>
-      <summary>Step 5: Finish up</summary>
+      <summary>Step 6: Finish up</summary>
       Click to start generating the tutorial: <button id="generate">generate</button>
       <p id="status"></p>
       <span id="complete">
@@ -116,6 +128,14 @@ export default defineToolbarApp({
           ).checked = true;
         });
       }
+
+      if (tutorial.capabilities.length !== 0) {
+        tutorial.capabilities.forEach((capability) => {
+          (
+            astroToolbarWindow?.querySelector(`#${capability}`) as HTMLInputElement
+          ).checked = true;
+        });
+      }
       versionInput.value = tutorial.version; 
     }
 
@@ -146,6 +166,21 @@ export default defineToolbarApp({
       saveTutorial();
     });
 
+    const capabilitiesForm = astroToolbarWindow?.querySelector('#capabilities');
+
+    capabilitiesForm?.addEventListener('change', (event) => {
+      console.log('capabilities change event');
+      tutorial.capabilities = [];
+      const capabilitiesChecked = astroToolbarWindow?.querySelectorAll(
+        'input[type="checkbox"][name="capabilities"]:checked'
+      );
+      capabilitiesChecked?.forEach((capability) => {
+        tutorial.capabilities.push(capability.id);
+      });
+      saveTutorial();
+    });
+
+
     function saveTutorial() {
       localStorage.setItem('tutorial', JSON.stringify(tutorial));
     }