@powerhousedao/academy 3.2.0-dev.2 → 3.2.0-dev.3

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 3.2.0-dev.3 (2025-06-24)
+
+### 🩹 Fixes
+
+- **connect, builder-tools:** disable external packages in dev mode ([e13243874](https://github.com/powerhouse-inc/powerhouse/commit/e13243874))
+
+### ❤️ Thank You
+
+- acaldas
+
 ## 3.2.0-dev.2 (2025-06-20)
 
 This was a version bump only for @powerhousedao/academy to align it with other projects, there were no code changes.

package/docs/academy/01-GetStarted/00-ExploreDemoPackage.mdx

@@ -0,0 +1,188 @@
+# Explore the demo package
+
+<details>
+<summary>How long will this tutorial take?</summary>
+
+We've designed this "Get Started" track to be as smooth as possible. The time it takes will vary based on your familiarity with modern web development tools.
+
+- **For Experienced Developers** (familiar with TypeScript, React, and CLIs), you can expect to complete the entire four-part tutorial in approximately **1 to 1.5 hours**.
+- **For Developers New to This Stack**, we recommend setting aside **3.5 to 4.5 hours**. This allows for time to understand not just the steps, but the core concepts behind them.
+
+This is just a guideline. The goal is to learn comfortably and build a solid foundation with Powerhouse!
+
+A more theoretical and advanced version of this tutorial can also be found in [Mastery Track - Document Model Creation](../MasteryTrack/DocumentModelCreation/WhatIsADocumentModel).
+</details>
+
+## Let's get started
+
+To give you a quick idea of how the Powerhouse ecosystem operates on document models and packages, why don't you try installing a package? 
+We will show you how to install the Powerhouse command-line tool `ph-cmd` and then use it to install a pre-built demo package with a document models, an editor and a drive-app.
+
+## Step 1: Install the Powerhouse CLI
+
+You will use the Powerhouse CLI to launch a local environment with a "To-do List Demo Package".
+This is also the package that you'll recreate during the tutorials and gets you familiar with Powerhouse.
+
+```bash
+pnpm install -g ph-cmd
+```
+
+Verify the installation:
+
+```bash
+ph-cmd --version
+```                                                   
+
+## Step 2: Install the to-do list demo package
+
+Now, use the `ph` command to install the demo package into a global project.
+
+```bash
+# Install the package
+ph install @powerhousedao/todo-demo-package
+```
+
+This command downloads and sets up the `@powerhousedao/todo-demo-package`, making its features available in your Powerhouse environment.
+
+<details>
+<summary>Expected CLI result</summary>
+
+```bash
+    installing dependencies 📦 ...
+     WARN  19 deprecated subdependencies found: @esbuild-kit/core-utils@3.3.2, @esbuild-kit/esm-loader@2.6.5, @npmcli/move-file@1.1.2, @paulmillr/qr@0.2.1, are-we-there-yet@3.0.1, gauge@4.0.4, glob@7.2.3, graphql-language-service-interface@2.10.2, graphql-language-service-parser@1.10.4, graphql-language-service-types@1.8.7, graphql-language-service-utils@2.7.1, inflight@1.0.6, multibase@4.0.6, multicodec@3.2.1, node-domexception@1.0.0, npmlog@6.0.2, rimraf@2.7.1, rimraf@3.0.2, sudo-prompt@8.2.5
+    Packages: +1
+    +
+    Progress: resolved 2277, reused 2106, downloaded 1, added 1, done
+     WARN  Issues with peer dependencies found
+    .
+    ├─┬ @powerhousedao/reactor-browser 3.1.0
+    │ └─┬ @powerhousedao/analytics-engine-browser 0.6.0
+    │   └── ✕ unmet peer @powerhousedao/analytics-engine-knex@0.5.1: found 0.6.0
+    ├─┬ @types/react-dom 19.1.6
+    │ └── ✕ unmet peer @types/react@^19.0.0: found 18.3.23
+    └─┬ react-native 0.80.0
+    ├── ✕ unmet peer @types/react@^19.1.0: found 18.3.23
+    ├── ✕ unmet peer react@^19.1.0: found 18.3.1
+    └─┬ @react-native/virtualized-lists 0.80.0
+        └── ✕ unmet peer @types/react@^19.0.0: found 18.3.23
+
+    dependencies:
+    + @powerhousedao/todo-demo-package 1.1.1
+
+    ╭ Warning ───────────────────────────────────────────────────────────────────────────────────────────────╮
+    │                                                                                                        │
+    │   Ignored build scripts: @acaldas/graphql-codegen-typescript-validation-schema, @apollo/protobufjs,    │
+    │   @datadog/pprof, @ipshipyard/node-datachannel, @parcel/watcher, @prisma/client, @prisma/engines,      │
+    │   @tailwindcss/oxide, bufferutil, esbuild, keccak, prisma, sqlite3, utf-8-validate.                    │
+    │   Run "pnpm approve-builds" to pick which dependencies should be allowed to run scripts.               │
+    │                                                                                                        │
+    ╰────────────────────────────────────────────────────────────────────────────────────────────────────────╯
+
+    Done in 6s using pnpm v10.9.0
+    Dependency installed successfully 🎉
+    ⚙️ Updating powerhouse config file...
+    Config file updated successfully 🎉
+```
+
+</details>
+
+
+You have now successfully installed `ph-cmd` and added your first package! 
+
+## Step 3: Run the connect app in studio mode
+To run the package locally in Connect Studio (our collaboration and contributor app), run:
+
+```bash
+ph connect
+```
+Click the returned localhost URL and you should see Connect Studio appear in your browser. 
+<figure className="image-container">
+  <img src={require("./images/Connect.png").default} alt="Connect Home" />
+  <figcaption>The Powerhouse Connect Studio interface.</figcaption>
+</figure>
+
+When you move to the settingswheel in the bottom right corner you'll get access to the **Package Manager**. 
+Here, you'll see that you've installed the `@powerhousedao/todo-demo-package`, which contains not only a **Document Model** and its accompanying editor but also a **Drive App** specific to the to-do document model. 
+
+<figure className="image-container">
+  <img src={require("./images/Packagemanager.png").default} alt="Package Manager" />
+  <figcaption>The Package Manager showing the installed todo-demo-package.</figcaption>
+</figure>
+
+## Step 4: Log in with Renown
+
+Renown is Powerhouse's **decentralized identity and reputation system** designed to address the challenge of trust within open organizations, where contributors often operate under pseudonyms. In traditional organizations, personal identity and reputation are key to establishing trust and accountability. Renown replicates this dynamic in the digital space, allowing contributors to earn experience and build reputation without revealing their real-world identities.
+
+:::tip
+When signing in with Renown, use an Ethereum or blockchain address that can function as your 'identity', as this address will accrue more experience and history over time.
+:::
+
+### Login flow
+"**Log in with Renown**" is a decentralized authentication flow that enables you to log into applications by signing a credential with your Ethereum wallet. Upon signing in, a Decentralized Identifier (DID) is created based on your Ethereum key. 
+
+<figure className="image-container">
+  <img src={require("./images/RenownLogin.png").default} alt="Renown Login" />
+  <figcaption>The Renown login screen, prompting for a signature from a wallet.</figcaption>
+</figure>
+
+### Generate a DID to sign operations in Connect
+This DID is then associated with a credential that authorizes a specific Connect instance to act on your behalf. That credential is stored securely on Ceramic, a decentralized data network. When you perform actions through the Powerhouse Connect interface, those operations are signed with the DID and transmitted to Switchboard, which serves as the verifier. 
+
+<figure className="image-container">
+  <img src={require("./images/ConnectAddress.png").default} alt="Connect Address for DID" />
+  <figcaption>A newly generated DID and address shown within the Connect interface.</figcaption>
+</figure>
+
+<figure className="image-container">
+  <img src={require("./images/LoginComplete.png").default} alt="Renown Login Complete" />
+  <figcaption>Confirmation of a successful login with Renown.</figcaption>
+</figure>
+
+### Verifying signatures
+**Switchboard**, our (remote & local) data processing engine, acts as a verifier in the Renown authentication flow. Switchboard checks the validity of the DID and credential, ensuring the operation request is legitimate. This flow is designed to offer a verifiable, cryptographically secure login system that replaces traditional password-based authentication with decentralized identity and signature-based trust.
+
+## Step 5: Create a to-do list and explore the document operations history
+
+<figure className="image-container">
+  <img src={require("./images/OperationsHistory.png").default} alt="Operations History" />
+  <figcaption>Example of the operations history for a document, showing all modifications made to it in a list. </figcaption>
+</figure>
+
+By leveraging this system, every operation or modification made to a document is cryptographically signed by the contributor's Renown identity. This ensures that each change is verifiable, traceable, and attributable to a specific pseudonymous user, providing a robust audit trail for all document activity. 
+
+A key feature you get with Connect is the **Operations History**. Every change to a document is stored as an individual operation, creating an immutable and replayable history. This provides complete auditability and transparency, as you can inspect each revision, its details, and any associated signatures. For example, you can see a chronological list of all modifications, along with who made them and when. This ensures every action is traceable and verifiable.
+Learn more about the [Operations History](../MasteryTrack/BuildingUserExperiences/DocumentTools/OperationHistory) and other document tools you get for free.
+
+
+### 5.1 Create a to-do list
+
+Now, move back to your local drive and create a to-do list. Add a few to-dos that are on your mind. You'll see a statistics widget that counts the open to-dos.
+
+### 5.2 Create a specific to-do drive app
+
+:::tip What is a 'drive' at Powerhouse?
+A **drive** is a folder to store and organize your documents in. Powerhouse offers the ability to build customized 'Drive Apps' for your documents. Think of a Drive App as a specialized lens—it offers **different ways to visualize, organize, and interact with** the data stored within a drive, making it more intuitive and efficient for specific use cases. To learn more, visit [Building A Drive App](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer)
+:::
+
+Since your previous to-do list was created inside a local drive with a general-purpose drive explorer, it didn't look particularly special.
+
+- Now let's create a new drive by clicking the new drive icon. In the **Drive App** field, select 'To-do Drive App'.  
+- Now move into the drive you've just created and create a new to-do list by clicking the button at the bottom of the page. 
+- Add a new set of random to-dos
+- After closing the document, look at the To-do Drive App interface. You'll see that it tracks your tasks and displays a progress bar.
+
+<figure className="image-container">
+  <img src={require("./images/TodoDriveApp.png").default} alt="Operations History" />
+  <figcaption>A list of todo's in the custom todo drive app. </figcaption>
+</figure>
+
+This is the power of Drive Apps. They offer a customized interface that works well with the different documents inside your drive. Read more about drive apps in the Mastery Track: [Drive Apps and Drive Explorers](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer).
+## Step 6: Export a document
+
+Export the document as a `.phd` (Powerhouse Document) file using the export button in the document toolbar at the top. In this toolbar, you will find all available functionality for your documents. The `.phd` file can be sent through any of your preferred channels to other users on your network. 
+
+### Up next 
+
+Now that you have explored a Powerhouse package and discovered its basic functionalities, it is time to start building your own. 
+Our next tutorial focuses on creating a simple to-do list document and will introduce you to the world of **Document Models**.
+

package/docs/academy/01-GetStarted/01-CreateNewPowerhouseProject.md

@@ -1,7 +1,7 @@
-# Create a ToDoList Document
+# Create a to-do list document
 
 ## Overview
-This tutorial guides you through creating a simplified version of a 'Powerhouse project' for a **ToDoList**.   
+This tutorial guides you through creating a simplified version of a 'Powerhouse project' for a **To-do List**.   
 A Powerhouse project primarily consists of a document model and its editor.   
 For this purpose, you'll be using Connect, our use-centric collaboration tool, locally, known as Connect in 'Studio mode'.
 
@@ -13,13 +13,13 @@ For this purpose, you'll be using Connect, our use-centric collaboration tool, l
 
 If you need help with installing the prerequisites you can visit our page [prerequisites](/academy/MasteryTrack/BuilderEnvironment/Prerequisites)
 
-## Quick Start
+## Quick start
 Create a new Powerhouse project with a single command:
 ```bash
 ph init
 ```
 <details>
-<summary> How to make use of different branches? </summary>
+<summary>How to use different branches</summary>
 
 When installing or using the Powerhouse CLI commands you are able to make use of the dev & staging branches.   
 These branches contain more experimental features then the latest stable release the PH CLI uses by default.   
@@ -40,7 +40,7 @@ They can be used to get access to a bugfix or features under development.
 Please be aware that these versions can contain bugs and experimental features that aren't fully tested.
 </details>
 
-## Before You Begin
+## Before you begin
 1. Open your terminal (either your system terminal or IDE's integrated terminal)
 2. Navigate to your desired project directory using:
 
@@ -52,12 +52,12 @@ In the terminal, you will be asked to enter the project name. Fill in the projec
    ```bash
     you@yourmachine:~/Powerhouse$ ph init
 
-    ? What is the project name? ‣ <yourprojectname>
+    ? What is the project name? ‣ <ToDoList>
     ```	
 
     Once the project is created, you will see the following output:
     ```bash
-    Initialized empty Git repository in /Users/yourmachine/<yourprojectname>/.git/
+    Initialized empty Git repository in /Users/yourmachine/<ToDoList>/.git/
     The installation is done! 
     ```
 
@@ -86,13 +86,11 @@ In the terminal, you will be asked to enter the project name. Fill in the projec
     If you local drive is not present navigate into Settings in the bottom left corner. Settings > Danger Zone > Clear Storage.    
     Clear the storage of your localhost application as it might has an old session cached.   
 
-:::tip
-A **drive** is a folder to store and organize your documents in. Powerhouse offers the ability to build customized 'Drive Apps' for your documents. Think of a Drive App as a specialized lens—it offers **different ways to visualize, organize, and interact with** the data stored within a drive, making it more intuitive and efficient for specific use cases. To learn more, visit [Building A Drive App](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer)
-:::
-
-Move into your local drive.   
+4. Move into your local drive.   
 Create a new document model by clicking the `DocumentModel` button, found in the 'New Document' section at the bottom of the page. 
 
 If you've followed the steps correctly, you'll have an empty document where you can define the **'Document Specifications'**.
 
+## Up next
+
 In the next tutorials, you will learn how to specify, add code and build an editor for your document model and export it to be used in your Powerhouse package. 

package/docs/academy/01-GetStarted/02-DefineToDoListDocumentModel.md

@@ -1,6 +1,6 @@
-# Define the ToDoList document specification 
+# Define the to-do list document specification 
 
-In this tutorial, you will learn how to define the specifications for a **ToDoList** document model within the Connect application using its GraphQL schema, and then export the resulting document model specification document for your Powerhouse project.
+In this tutorial, you will learn how to define the specifications for a **To-do List** document model within the Connect application using its GraphQL schema, and then export the resulting document model specification document for your Powerhouse project.
 If you don't have a document specification file created yet, have a look at the previous step of this tutorial to create a new document specification.
 
 Before you start, make sure you have the Connect application running locally with the command:
@@ -15,14 +15,14 @@ The Connect application will start and you will see the following output:
   ➜  press h + enter to show help
 ```
 
-## ToDoList Document Specification
+## To-do list document specification
 
 Likely you have called your project 'ToDoList'.   
 If you've used a different name, please create a new document specification named 'ToDoList'.   
 **Pay close attention to capitalization, as it influences our code.**  
 
 We'll continue with this project to teach you how to create a document model specification and later an editor for your document model. We use the **GraphQL Schema Definition Language** (SDL) to define the schema for the document model.   
-Below, you can see the SDL for the `ToDoList` document model.
+Below, you can see the SDL for the `To-do List` document model.
 
 :::info
 This schema defines the **data structure** of the document model and the types involved in its operations, which are detailed further as input types.
@@ -30,7 +30,7 @@ Documents in Powerhouse leverage **event sourcing principles**, where every stat
 :::
 
 <details>
-<summary>State Schema of our Simplified ToDoList</summary>
+<summary>State schema of our simplified To-do list</summary>
 
 ```graphql
 # The state of our ToDoList
@@ -50,7 +50,7 @@ type ToDoItem {
 
 
 <details>
-<summary>Operations Schema of our Simplified ToDoList</summary>
+<summary>Operations schema of our simplified to-do list</summary>
 ```graphql
 # Defines a GraphQL input type for adding a new to-do item
 input AddTodoItemInput {
@@ -72,7 +72,7 @@ input DeleteTodoItemInput {
 ```
 </details>
 
-## Define the Document Model Specification
+## Define the document model specification
 
 To be able to define the document model, you need to open the document model editor in Connect. 
 
@@ -106,6 +106,6 @@ Check below screenshot for the complete implementation:
 
 ![ToDoList Document Model](./images/DocumentModelOperations.png)
 
-### Up next: Reducers 
+### Up next: reducers 
 
 Up next, you'll learn how to implement the runtime logic and components that will use the `ToDoList` document model specification you've just created and exported. 

package/docs/academy/01-GetStarted/03-ImplementOperationReducers.md

@@ -1,15 +1,15 @@
-# Implement the Document Model
+# Implement the document model
 
-In this section, we will implement and test the operation reducers for the **ToDoList** document model. For this, you have to export the document model specification from the Connect application and import it into your Powerhouse project directory. 
+In this section, we will implement and test the operation reducers for the **To-do List** document model. For this, you have to export the document model specification from the Connect application and import it into your Powerhouse project directory. 
 
 To export the document model specification, follow the steps in the [Define ToDoList Document Model](/academy/GetStarted/DefineToDoListDocumentModel) section.
 
-## Understanding Reducers in Document Models
+## Understanding reducers in document models
 
 Reducers are a core concept in Powerhouse document models. They implement the state transition logic for each operation defined in your schema.
 
 :::info
-**Connection to Schema Definition Language (SDL)**: The reducers directly implement the operations you defined in your SDL. Remember how we defined `AddTodoItemInput`, `UpdateTodoItemInput`, and `DeleteTodoItemInput` in our schema?   
+**Connection to schema definition language (SDL)**: The reducers directly implement the operations you defined in your SDL. Remember how we defined `AddTodoItemInput`, `UpdateTodoItemInput`, and `DeleteTodoItemInput` in our schema?   
 The reducers provide the actual implementation of what happens when those operations are performed.
 :::
 
@@ -21,12 +21,12 @@ Either step will import the document model specification into your Powerhouse pr
 
 ![vscode image](./images/vscode.png)
 
-## In your Project Directory
+## In your project directory
 
 The next steps will take place in the VSCode editor. Make sure to have it open and the terminal window inside VSCode open as well. 
 
 
-To write the operation reducers of the **ToDoList** document model, you need to generate the document model code from the document model specification file you have exported into the Powerhouse project directory.
+To write the operation reducers of the **To-do List** document model, you need to generate the document model code from the document model specification file you have exported into the Powerhouse project directory.
 
 To do this, run the following command in the terminal:
 
@@ -40,7 +40,7 @@ Open the `to-do-list.ts` file and you should see the code that needs to be fille
 
 ![to-do-list ts file](./images/reducers.png)
 
-## Write the Operation Reducers
+## Write the operation reducers
 
 1. Copy and paste the code below into the `to-do-list.ts` file in the `reducers` folder.
 2. Save the file.
@@ -100,7 +100,7 @@ export const reducer: ToDoListToDoListOperations = {
 ```
 </details>
 
-## Write the Operation Reducers Tests
+## Write the operation reducers tests
 
 In order to make sure the operation reducers are working as expected, you need to write tests for them.
 
@@ -192,7 +192,7 @@ Output should be as follows:
    Duration  417ms (transform 79ms, setup 0ms, collect 174ms, tests 12ms, environment 0ms, prepare 158ms)
 ```
 
-If you got the same output, you have successfully implemented the operation reducers and tests for the **ToDoList** document model. Congratulations, you've successfully set up the backbone for a simple **ToDoList** document. 
+If you got the same output, you have successfully implemented the operation reducers and tests for the **To-do List** document model. Congratulations, you've successfully set up the backbone for a simple **To-do List** document. 
 
-## Up Next: ToDoListEditor
-In the next chapter of this introduction track you will learn how to implement an editor for your document model so you can see a simple user interface for the **ToDoList** document model in action.
+## Up next: To-do list editor
+In the next chapter of this introduction track you will learn how to implement an editor for your document model so you can see a simple user interface for the **To-do List** document model in action.

package/docs/academy/01-GetStarted/04-BuildToDoListEditor.md

@@ -1,13 +1,13 @@
-# Build a ToDoList Editor
+# Build a to-do list editor
 
-In this chapter we will continue with the interface or editor implementation of the **ToDoList** document model. This means you will create a simple user interface for the **ToDoList** document model which will be used inside the Connect app to create, update and delete your ToDoList items.
+In this chapter we will continue with the interface or editor implementation of the **To-do List** document model. This means you will create a simple user interface for the **To-do List** document model which will be used inside the Connect app to create, update and delete your ToDoList items.
 
 ## Generate the editor template
 
-Run the command below to generate the editor template for the **ToDoList** document model.   
-This command reads the **ToDoList** document model definition from the `document-models` folder and generates the editor template in the `editors/to-do-list` folder as `editor.tsx`.
+Run the command below to generate the editor template for the **To-do List** document model.   
+This command reads the **To-do List** document model definition from the `document-models` folder and generates the editor template in the `editors/to-do-list` folder as `editor.tsx`.
 
-Notice the `--editor` flag which specifies the **ToDoList** document model, and the `--document-types` flag defines the document type `powerhouse/todolist`.
+Notice the `--editor` flag which specifies the **To-do List** document model, and the `--document-types` flag defines the document type `powerhouse/todolist`.
 
 ```bash
 ph generate --editor ToDoList --document-types powerhouse/todolist
@@ -16,7 +16,7 @@ ph generate --editor ToDoList --document-types powerhouse/todolist
 Once complete, navigate to the `editors/to-do-list/editor.tsx` file and open it in your editor.
 
 
-### Editor Implementation Options
+### Editor implementation options
 
 When building your editor component within the Powerhouse ecosystem, you have several options for styling, allowing you to leverage your preferred methods:
 
@@ -27,7 +27,7 @@ When building your editor component within the Powerhouse ecosystem, you have se
 Connect Studio provides a dynamic local environment, by running `ph connect` to visualize your components instantly as you build them, regardless of the styling method you choose.    
 Manual build steps are typically only needed when publishing packages.
 
-## ToDoList Editor
+## To-do List editor
 
 Below is the complete code for the To-Do List editor. Paste this code in `editors/to-do-list/editor.tsx`.
 
@@ -191,25 +191,25 @@ export default function Editor(props: IProps) {
 ```
 </details>
 
-Now you can run the Connect app and see the **ToDoList** editor in action.
+Now you can run the Connect app and see the **To-do List** editor in action.
 
 ```bash
 ph connect
 ```
 
-In Connect, in the bottom right corner you'll find a new Document Model that you can create: **ToDoList**.    
-Click on it to create a new ToDoList document.
+In Connect, in the bottom right corner you'll find a new Document Model that you can create: **To-do List**.    
+Click on it to create a new To-do List document.
 
 :::info
 The editor will update dynamically, so you can play around with your editor styling while seeing your results appear in Connect Studio. 
 :::
 
 Congratulations!
-If you managed to follow this tutorial until this point, you have successfully implemented the **ToDoList** document model with its reducer operations and editor. 
+If you managed to follow this tutorial until this point, you have successfully implemented the **To-do List** document model with its reducer operations and editor. 
 
-### Up Next: Mastery Track
+### Up next: Mastery Track
 
-In the [Mastery Track chapther: Document Model Creation](/academy/MasteryTrack/DocumentModelCreation/WhatIsADocumentModel) we guide you through the theoretics of the previous steps while created a more advanced version of the ToDoList.
+In the [Mastery Track chapther: Document Model Creation](/academy/MasteryTrack/DocumentModelCreation/WhatIsADocumentModel) we guide you through the theoretics of the previous steps while created a more advanced version of the To-do List.
 
 You will learn: 
 - The in's & out's of a document model.

package/docs/academy/01-GetStarted/_04-BuildToDoListEditor

@@ -1,13 +1,13 @@
 # Build a ToDoList Editor
 
-In this chapter we will continue with the interface or editor implementation of the **ToDoList** document model. This means you will create a simple user interface for the **ToDoList** document model which will be used inside the Connect app to create, update and delete your ToDoList items, but also dispaly the statistics we've implemented in our reducers. 
+In this chapter we will continue with the interface or editor implementation of the **To-do List** document model. This means you will create a simple user interface for the **To-do List** document model which will be used inside the Connect app to create, update and delete your To-do List items, but also dispaly the statistics we've implemented in our reducers. 
 
 ## Generate the editor template
 
-Run the command below to generate the editor template for the **ToDoList** document model.   
-This command reads the **ToDoList** document model definition from the `document-models` folder and generates the editor template in the `editors/to-do-list` folder as `editor.tsx`.
+Run the command below to generate the editor template for the **To-do List** document model.   
+This command reads the **To-do List** document model definition from the `document-models` folder and generates the editor template in the `editors/to-do-list` folder as `editor.tsx`.
 
-Notice the `--editor` flag which specifies the **ToDoList** document model, and the `--document-types` flag defines the document type `powerhouse/todolist`.
+Notice the `--editor` flag which specifies the **To-do List** document model, and the `--document-types` flag defines the document type `powerhouse/todolist`.
 
 ```bash
 ph generate --editor ToDoList --document-types powerhouse/todolist
@@ -28,7 +28,7 @@ Connect Studio provides a dynamic local environment (`ph connect`) to visualize
 
 ---
 
-## ToDoList Editor
+## To-do List Editor
 
 :::tip
 ### Implementing Components
@@ -113,7 +113,7 @@ export const InputField = (props: InputFieldProps) => {
 Below is the complete code for the To-Do List editor. It primarily uses Tailwind CSS for styling and imports the local `Checkbox` and `InputField` components you created in the previous step. These local components, in turn, utilize elements from the Powerhouse Document Engineering design system.
 
 <details>
-<summary>Complete ToDoList Editor Example (using Tailwind CSS)</summary>
+<summary>Complete To-do List Editor Example (using Tailwind CSS)</summary>
 
 ```typescript
 import { EditorProps } from 'document-model'; // Core type for editor components.
@@ -337,24 +337,24 @@ export default function Editor(props: IProps) {
 ```
 </details>
 
-Now you can run the Connect app and see the **ToDoList** editor in action.
+Now you can run the Connect app and see the **to-do list** editor in action.
 
 ```bash
 ph connect
 ```
 
-In Connect, in the bottom right corner you'll find a new Document Model that you can create: **ToDoList**.    
-Click on it to create a new ToDoList document.
+In Connect, in the bottom right corner you'll find a new Document Model that you can create: **to-do list**.    
+Click on it to create a new to-do list document.
 
 :::info
 The editor will update dynamically, so you can play around with your editor styling while seeing your results appear in Connect Studio. 
 :::
 
 Congratulations!
-If you managed to follow this tutorial until this point, you have successfully implemented the **ToDoList** document model with its reducer operations and editor. 
+If you managed to follow this tutorial until this point, you have successfully implemented the **to-do list** document model with its reducer operations and editor. 
 
-Now you can move on to creating a [custom drive explorer](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer) for your ToDoList document.    
-Imagine you have many ToDoLists sitting in a drive. A custom drive explorer will allow you to organize and track them at a glance, opening up a new world of possibilities to increase the functionality of your documents!
+Now you can move on to creating a [custom drive explorer](/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer) for your to-do list document.    
+Imagine you have many to-do Lists sitting in a drive. A custom drive explorer will allow you to organize and track them at a glance, opening up a new world of possibilities to increase the functionality of your documents!