Merge remote-tracking branch 'radfish-doc/main' into 139

.github/workflows/deploy.yml

@@ -15,12 +15,11 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           node-version: 18
-          cache: yarn
 
       - name: Install dependencies
-        run: yarn install --frozen-lockfile
+        run: npm install
       - name: Build website
-        run: yarn build
+        run: npm run build
 
       - name: Upload Build Artifact
         uses: actions/upload-pages-artifact@v3

.github/workflows/test-deploy.yml

@@ -18,9 +18,8 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           node-version: 18
-          cache: yarn
 
       - name: Install dependencies
-        run: yarn install --frozen-lockfile
+        run: npm install
       - name: Test build website
-        run: yarn build
+        run: npm run build

docs/design-system/custom-components/index.mdx

@@ -4,9 +4,9 @@ sidebar_position: 1
 
 # RADFish Custom Components
 
-{Most of RADFish uses standard components from React libraries and the [U.S. Design System](https://designsystem.digital.gov/), as implemented by the [react-uswds open source project](https://github.com/trussworks/react-uswds). 
+Most of RADFish uses standard components from React libraries and the [U.S. Design System](https://designsystem.digital.gov/), as implemented by the [react-uswds open source project](https://github.com/trussworks/react-uswds). 
 
-Custom components which are not part of these standardized libraries are listed here:}
+Custom components which are not part of these standardized libraries are listed here:
 
 
 ```mdx-code-block

docs/developer-documentation/building-your-application/patterns/offline-storage.md

@@ -10,7 +10,7 @@ RADFish application users can be out at sea for an extended period of time and m
 
 ## Storage Models
 
-The `@nmfs-radfish/radfish`package provides two storage methods available `LocalStorageMethod` and `IndexedDBStorageMethod`.
+The `@nmfs-radfish/radfish`package provides two storage methods available `LocalStorageMethod` and `IndexedDBMethod`.
 
 ### LocalStorage
 
@@ -29,9 +29,9 @@ new LocalStorageMethod(
 When using IndexedDB, we additionally need to provide a schema version and model structures. These are used to manage future data migrations.
 
 ```js
-import { IndexedDBStorageMethod } from '@nmfs-radfish/radfish';
+import { IndexedDBMethod } from '@nmfs-radfish/radfish';
 
-new IndexedDBStorageMethod(
+new IndexedDBMethod(
   "survey-app-storage",
   "1.0.0",
   {

docs/developer-documentation/getting-started.md

@@ -78,7 +78,7 @@ npx @nmfs-radfish/create-radfish-app --help
 Please visit [upgrading](./upgrading.md) for more information. 
 
 ## Scripts
-See [Available Scripts](./building-your-application/available-scripts/available-scripts.md) for full list of commands.
+See [Available Scripts](./building-your-application/available-scripts) for full list of commands.
 
 The **`npm start`** script starts the Vite development server. It runs the app locally with hot module reloading, allowing for fast development and instant updates as you make changes. Open [http://localhost:3000](http://localhost:3000/) to view it in the browser.
 

docusaurus.config.js

@@ -51,6 +51,13 @@ const config = {
     ],
   ],
   plugins: [
+    [
+      require.resolve("@cmfcmf/docusaurus-search-local"),
+      {
+        indexBlog: false,
+        // Options here
+      },
+    ],
     [
       "docusaurus-plugin-remote-content",
       {
@@ -79,7 +86,7 @@ const config = {
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example includes an example on how to build a form where the values of certain input fields compute the value of a separate readOnly input field elsewhere in the form.
+description: Automatically calculates a read-only field in forms
 title: Computed Form Fields
 id: computed-form-fields
 ---
@@ -117,7 +124,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example includes an example on how to build a form where the values of certain input fields control the visibility of other fields within that form.
+description: Dynamically show/hide fields based on other inputs
 title: Conditional Form Fields
 id: conditional-form-fields
 ---
@@ -155,7 +162,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example demonstrates how to enforce field validation logic on certain fields within your form. 
+description: Enforce validation logic, like disallowing numbers
 title: Field Validators
 id: field-validators
 ---
@@ -193,7 +200,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example shows you how to detect if a user has network connectivity. 
+description: Detect network connectivity and display offline alerts
 title: Network Status
 id: network-status
 ---
@@ -231,7 +238,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example includes how to setup and use mock service worker and the native fetch API to build out a mock API on the frontend to consume without needing to rely on a backend system. 
+description: Mock API for frontend development with MSW and fetch
 title: Mock API
 id: mock-api
 ---
@@ -269,7 +276,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example includes how to setup and use the on-device storage using IndexedDB and Dexie.js.
+description: Use IndexedDB/Dexie.js for offline or local storage
 title: On Device Storage
 id: on-device-storage
 ---
@@ -307,7 +314,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example includes an example on how to build a form that includes multiple "steps"
+description: Multi-step form saving progress and inputs locally
 title: Multistep Form
 id: multistep-form 
 ---
@@ -345,7 +352,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: The ServerSync component is responsible for synchronizing data between a client application and a remote server.
+description: Sync client-server data with offline storage support
 title: ServerSync
 id: server-sync 
 ---
@@ -383,7 +390,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example shows you how you could use the React Query library to manage state in your application.
+description: Manage app state with React Query's simplified API
 title: React Query
 id: react-query 
 ---
@@ -421,7 +428,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example shows you how to configure a persisted form that saves the data locally.
+description: Save and persist form data locally with FormWrapper
 title: Persisted Form
 id: persisted-form
 ---
@@ -459,7 +466,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example demonstrates how to use the <Table> component to display tabular data.
+description: Display tabular data using the <Table> component
 title: Simple Table
 id: simple-table 
 ---
@@ -497,7 +504,7 @@ ${content}`,
           return {
             filename: readmeToNamedMd(filename),
             content: `---
-description: This example demonstrates how build a non-trivial form using Trussworks components.
+description: Build complex forms using Trussworks core components
 title: Form Structure
 id: form-structure
 ---