Dyn 9702 template files support by Chloepeg · Pull Request #89 · DynamoDS/DynamoHome

Chloepeg · 2026-05-13T17:16:21Z

Purpose

This PR addresses DYN-9702 https://jira.autodesk.com/browse/DYN-9702 The changes in the code aim to add Templates support to the Dynamo Home UI, allowing users to view and open template files directly from the Home page.

This PR works with : DynamoDS/Dynamo#17107

Changes :

Added a DynamoHome callback for receiving template metadata from the Dynamo host.
Added the Home UI data flow for Templates, including a Templates context and rendering support in the Home page.
Added a Templates section with grid/list view support and persisted view mode settings.
Added a Templates info tooltip on the heading question mark icon.
Added local development mock data for Templates while production builds wait for template data from Dynamo.

Declarations

Check these if you believe they are true

Is documented according to the standards
The level of testing this PR includes is appropriate
Changes to the API follow Semantic Versioning and are documented in the API Changes document.

Release Notes

Added template file support to Dynamo Home. The Home page now shows a Templates section with grid and list views. Added a Templates info tooltip

Reviewers

@zeusongit
@DynamoDS/eidos

FYIs

@dnenov
@johnpierson
@jnealb

- Enhance CustomDropdown component to support divider and header option types - Add template options to Sidebar "New" dropdown with visual grouping - Add template data structure in home.ts assets - Update dropdown styling for divider and header elements - Add TypeScript types for dropdown option kinds (item/divider/header) - Update package dependencies

- Add Templates section above Recent section on home page - Implement templates data loading from home.ts (dev) and backend (prod) - Add independent grid/list view toggle for Templates section - Add templatesPageViewMode setting for view preference persistence - Map template data structure (date -> DateModified) for component compatibility - Add receiveTemplatesDataFromDotNet window function for backend integration - Add "Templates" translation key to locale files - Reuse existing GraphGridItem and GraphTable components for templates display

…down - Add newWorkspaceWithTemplate utility function - Implement listener pattern for template data sharing between Sidebar and PageRecent - Map hardcoded dropdown options to real template files from backend - Update TypeScript types for listener pattern

- Add TemplatesContext to manage template state centrally - Update Sidebar and PageRecent to use useTemplates() hook - Remove duplicate global handlers to prevent race conditions - Aligns with existing React patterns

Update template matching logic to use new filenames: - Template 1: matches 'Create a Graph.dyn' (was Template_00_) - Template 2: matches 'Import & Export Workflow.dyn' (was Template_01_)

Drop down menu on side panel removed, will be added back later - Remove Template 1 and Template 2 options from Sidebar dropdown - Remove newWorkspaceWithTemplate function from utility.ts - Remove divider/header support from CustomDropdown component - Remove template data from home.ts assets - Update type definitions to remove template-related types

TemplatesContext requires templates export in development mode

Fix module path in TemplatesContext.tsx and restore package-lock.json metadata.

Display Recent files section above Templates section on the home page. Visual reordering only, there is no functional changes to either section

Add info icon with tooltip to the Templates section title that appears when hovering over the Template heading Changes: - Add tooltip component to Templates title in PageRecent.tsx - Add tooltip text to locale file (en.json) - Extend Tooltip component to support right-side positioning with arrow - Update tooltip styling for wider layout to fit space inbetween - Position tooltip to the right of the title with left-pointing arrow

- Add QuestionMarkIcon import to PageRecent component - Tooltip now appears when hover over the icon instead of the header - Text updated

…-files-support

johnpierson · 2026-06-10T14:22:51Z

+const TemplatesContext = createContext<any[]>([]);
+
+// Provider component that wraps the app components
+export const TemplatesProvider = ({ children }) => {


[Bug 5 — Untyped prop] children is untyped. Should be { children: React.ReactNode }.

TemplatesProvider has now an explicit TemplatesProviderProps type with children: ReactNode

johnpierson · 2026-06-10T14:23:04Z

+  };
+
+  // Handles mouse click over each template row
+  const handleTemplateRowClick = (row: Row) => {


[Bug 1 — Duplicate handler] handleTemplateRowClick is byte-for-byte identical to handleRowClick. Delete this and pass handleRowClick directly to both GraphTable instances.

I removed the duplicate handleTemplateRowClick and now template table rows reuse the existing handleRowClick

johnpierson · 2026-06-10T14:23:04Z

+  // Map templates to match Graph structure for table view (templates use 'date' instead of 'DateModified')
+  const templatesForTable = templates.map(template => ({
+    ...template,
+    DateModified: template.date || template.DateModified || '',


[Bug 2 — Split normalization] The date → DateModified mapping is done twice: here in templatesForTable, and again inline at line 225 for the grid view (DateModified={template.date || template.DateModified || ''}). This normalization should happen once in TemplatesContext so all consumers get a consistent shape. Consumers should not need to know whether the field is called date or DateModified.

I moved the date to DateModified normalization into TemplatesContext, so consumers now receive a consistent template shape. PageRecent no longer maps templates for the table view or handles the inline date || DateModified fallback in the grid view.

johnpierson · 2026-06-10T14:23:04Z

+      updateSettings({ templatesPageViewMode: templatesViewMode });
+
+      // Send settings to Dynamo to save
+      saveHomePageSettings({ ...settings, templatesPageViewMode: templatesViewMode });


[Bug 3 — Stale closure] saveHomePageSettings closes over settings, but settings is excluded from deps via the eslint-disable below. If settings changes independently (e.g. a sidebar width update), this call sends stale data. Either add settings to the deps array, or thread only the changed key into the save call rather than spreading the whole settings object.

Good catch!

Both view-mode save effects now create a merged settings object and pass the same payload to updateSettings and saveHomePageSettings

johnpierson · 2026-06-10T14:23:21Z

    Thumbnail: img
  }
 ];
+


[Minor 9 — Missing newline at EOF] File ends without a trailing newline. Add one.

johnpierson · 2026-06-10T14:23:21Z

-    left: 50%;
-    max-width: 300px;
-    transform: translateX(-50%);
+    max-width: 500px; /* Increased width to make it wider  */


[Minor 10 — Global tooltip width change] max-width changed from 300px → 500px for all .tooltip-box elements. This silently widens every tooltip in the app, not just the templates one. If the wider width is only needed for the templates tooltip, scope it with a modifier class (e.g. .tooltip-box.wide) rather than changing the global default.

I changed back the default tooltip width to 300px and added a scoped template-info-tooltip class so only the Templates info tooltip uses the wider 500px width

johnpierson · 2026-06-10T14:23:21Z

    // "rootDirs": ["./src"],                                   /* Allow multiple folders to be treated as one when resolving modules. */
-    "typeRoots": ["./types", "./node_modules/@types"],   /* Specify multiple folders that act like './node_modules/@types'. */
-    "types": ["react", "node", "jest"],                                      /* Specify type package names to be included without being referenced in a source file. */
+    // "typeRoots": ["./types", "./node_modules/@types"],   /* Specify multiple folders that act like './node_modules/@types'. */


[Minor 11 — typeRoots commented out] The custom ./types directory is no longer listed as a typeRoot. Verify that the global declarations in types/index.d.ts (including the newly added receiveTemplatesDataFromDotNet) are still resolved by running tsc --noEmit before merge.

johnpierson · 2026-06-10T14:25:51Z

@Chloepeg - added some comments from Claude, please let me know if any are too out there

jnealb · 2026-06-10T16:12:39Z

Claude comments: [
pr89-review-checklist.md

jasonstratton

I think John caught most of it.

I wanted to point out that clicking a template just opens the template file directly, but the Jira issue specified "new from template".

The other is that there are no additional tests for the additions to PageRecent.tsx or the new file TemplatesContext.tsx

jasonstratton · 2026-06-10T20:50:57Z

+      updateSettings({ templatesPageViewMode: templatesViewMode });
+
+      // Send settings to Dynamo to save
+      saveHomePageSettings({ ...settings, templatesPageViewMode: templatesViewMode });


Good catch!

jasonstratton · 2026-06-10T20:52:25Z

+import { createContext, useContext, useState, useEffect } from 'react';
+
+// Create the context
+const TemplatesContext = createContext<any[]>([]);


TemplatesContext is untyped as well.

TemplatesContext now uses explicit TemplateInput and Template types instead of any[]

jasonstratton · 2026-06-10T20:58:36Z

+    setIsDisabled(true);
+
+    const contextData = row.original.ContextData;
    openFile(contextData);


I may be confused here, bhen clicking on the template, it should be creating a copy of the template and opening it (or something like that)? And not opening the template file directly?

DynamoHome only passes the selected row path to the host via openFile. The paired Dynamo branch (DynamoDS/Dynamo#17107) detects when that path belongs to TemplateFiles and opens it as a template/new editable workspace.

PageRecent cleanup: Removed duplicate handleTemplateRowClick. Removed inline template normalization. Uses new TemplatesSection. Both view-mode save effects now use one merged settings payload. New Templates component: Added src/components/Recent/TemplatesSection.tsx. Added empty co-located TemplatesSection.module.css for repo convention. TemplatesContext: Replaced any[] with TemplateInput / Template types. Typed children. Normalizes template data once in the context. Tooltip/CSS: Added optional tooltipClassName. Restored global tooltip width to 300px. Scoped Templates tooltip width to 500px. Removed unused arrow-right tooltip CSS. Localization: Added title.text.templates and recent.templates.tooltip across all locale files. Renamed old tooltip.text.templates usage to recent.templates.tooltip. Types: Updated Graph shape to use DateModified. Added optional Author / Description. Added tooltipClassName to Tooltip.

Chloepeg added 12 commits March 3, 2026 12:50

template data to use React Context

362f23a

- Add TemplatesContext to manage template state centrally - Update Sidebar and PageRecent to use useTemplates() hook - Remove duplicate global handlers to prevent race conditions - Aligns with existing React patterns

Update sidebar to match renamed template files

249dce7

Update template matching logic to use new filenames: - Template 1: matches 'Create a Graph.dyn' (was Template_00_) - Template 2: matches 'Import & Export Workflow.dyn' (was Template_01_)

fix development build

20f21b0

TemplatesContext requires templates export in development mode

Fix build errors

9f777ab

Fix module path in TemplatesContext.tsx and restore package-lock.json metadata.

Swap Recent and Templates order on home page

f3b6fa4

Display Recent files section above Templates section on the home page. Visual reordering only, there is no functional changes to either section

Move Templates tooltip to question mark icon

e6ba9d2

- Add QuestionMarkIcon import to PageRecent component - Tooltip now appears when hover over the icon instead of the header - Text updated

Merge remote-tracking branch 'upstream/master' into DYN-9702-template…

291de24

…-files-support

Chloepeg mentioned this pull request May 13, 2026

DYN-: Dyn 9702 templates to home screen DynamoDS/Dynamo#17107

Merged

3 tasks

Chloepeg marked this pull request as ready for review May 20, 2026 15:01

johnpierson requested a review from jasonstratton June 10, 2026 13:41

johnpierson reviewed Jun 10, 2026

View reviewed changes

jasonstratton reviewed Jun 10, 2026

View reviewed changes

Conversation

Chloepeg commented May 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Purpose

Declarations

Release Notes

Reviewers

FYIs

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

johnpierson commented Jun 10, 2026

Uh oh!

jnealb commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jasonstratton left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Chloepeg commented May 13, 2026 •

edited

Loading

jnealb commented Jun 10, 2026 •

edited

Loading