Slice 1: Initial `ModInstance` type and adapter applied to re-/activation code (1/3) #9182

twschiller · 2024-09-22T01:43:22Z

What does this PR do?

Context: https://www.notion.so/pixiebrix/Return-mod-instance-from-slice-selectors-instead-of-returning-activated-mod-components-fff43b21a25381269578d4845535e37e?pvs=4
Adds ModInstance type
Add adapters to use ModInstance to simplify some React code:
- useActivateMod
- useReactivateMod
- useActivateModWizard
Floss refactoring:
- Removes the toggled mod component tracking from the WizardValues because we don't support toggling on/off individual mod components anymore

Discussion

By using adapters, we can evaluate the ergonomics of the shape before migrating the persisted mod component slice shape
Using the mod instance selector in the lifecycle is a bit tricky due to draft behavior:

pixiebrix-extension/src/contentScript/lifecycle.ts

Line 442 in 955553c

const modComponentsToActivate = options.activatedModComponents.filter(
- We may want to punt on that until we change Page Editor behavior to use drafts for all mod components when a mod is selected vs. only drafts for mod components that have been interacted with in the Page Editor
A benefit of doing this work now is that it simplifies some of the deployment code that @fungairino is working on

Future Work

Prioritizing changes that simplify deployment code, doesn't require a migration, and avoids the Page Editor:

Rewrite deployment updater to pass around ModInstance[] instead of ActivatedModComponent[]: Slice 2: Use ModInstance type in mod deployment code (2/3) #9190
Rewrite Mods Screen / Launcher to pass around ModInstance[] instead of passing around ActivatedModComponent[]. E.g., see buildModsList, buildGetModActivationStatus, etc.: Slice 3: Use ModInstance type on the mods screen (3/3) #9191

Consider adding a wrapper that wraps ModInstance with helper methods for derived data/properties. E.g., modId, isPaused, etc. without duplicating the data

For more information on our expectations for the PR process, see the
code review principles doc

src/activation/useActivateModWizard.ts

twschiller · 2024-09-22T01:54:00Z

src/pageEditor/panes/save/saveHelpers.test.ts

@@ -890,115 +883,3 @@ describe("buildNewMod", () => {
    },
  );
 });
-
-describe("findMaxIntegrationDependencyApiVersion", () => {


Moved to utility folder test file

github-actions · 2024-09-22T02:18:51Z

Playwright test results

120 passed
14 flaky
4 skipped

Details

Open report ↗︎
138 tests across 45 suites
45 minutes, 23 seconds
b4faee6
For more information on how to debug and view this report, see our readme

Flaky tests

chrome-setup › setup/unaffiliated.setup.ts › authenticate with unaffiliated user
msedge › tests/deployments/deploymentActivation.spec.ts › activate a deployed mod in the extension console
chrome › tests/pageEditor/addStarterBrick.spec.ts › Add new mod with different starter brick components
chrome › tests/pageEditor/addStarterBrick.spec.ts › Add starter brick to mod
msedge › tests/pageEditor/addStarterBrick.spec.ts › Add new mod with different starter brick components
msedge › tests/pageEditor/addStarterBrick.spec.ts › Add starter brick to mod
msedge › tests/pageEditor/brickActions.spec.ts › brick actions panel behavior
msedge › tests/pageEditor/modEditorPane.spec.ts › mod editor pane behavior
chrome › tests/runtime/insertAtCursor.spec.ts › Insert at Cursor › 8157: can insert at cursor from side bar
msedge › tests/runtime/insertAtCursor.spec.ts › Insert at Cursor › 8157: can insert at cursor from side bar
chrome › tests/runtime/setInputValue.spec.ts › can set input value
chrome › tests/runtime/sidebar/sidebarController.spec.ts › sidebar controller › shows focus dialog in top-level frame
msedge › tests/smoke/floatingActionButton.spec.ts › sidebar page smoke test › can hide the floating action button
msedge › tests/workshop/createMod.spec.ts › can create a new mod from a yaml definition and update it

Skipped tests

chrome › tests/regressions/doNotCloseSidebarOnPageEditorSave.spec.ts › #8104: Do not automatically close the sidebar when saving in the Page Editor
msedge › tests/regressions/doNotCloseSidebarOnPageEditorSave.spec.ts › #8104: Do not automatically close the sidebar when saving in the Page Editor
chrome › tests/runtime/googleSheetsIntegration.spec.ts › can activate a google spreadsheet mod with config options
msedge › tests/runtime/googleSheetsIntegration.spec.ts › can activate a google spreadsheet mod with config options

twschiller · 2024-09-22T02:44:27Z

src/activation/useActivateModWizard.ts

-  const hasPersonalDeployment = activatedModComponentsForMod?.some(
-    (x) => x._deployment?.isPersonalDeployment,
-  );
+  const hasPersonalDeployment =


Example of simplifying personal deployment code

twschiller · 2024-09-22T02:45:46Z

src/types/modInstanceTypes.ts

+   * In the future, we might consider eliminating by using a predictable id based on the mod instance id and position
+   * in the mod definition. But that's not possible today because the ids use a UUID format.
+   */
+  modComponentIds: UUID[];


A key insight I didn't originally anticipate is that ModInstance has to track the mod component ids. (See comment in code for why)

In addition, this is expected to be a non-empty array, right? We should at least update the comment with that note, or see how much effort it would be to enforce a non-empty array type.

Yes, it's non-empty. The stronger invariant is that it needs to match the length of definition.extensionPoints. So, in the future we might consider reshaping this type to ensure that matches. But that would involve enriching/reshaping the definition. Right now my preference is to reuse the ModDefinition type for the definition prop

codecov · 2024-09-22T13:14:09Z

Codecov Report

Attention: Patch coverage is 91.94631% with 12 lines in your changes missing coverage. Please review.

Project coverage is 74.99%. Comparing base (8318d74) to head (b4faee6).
Report is 343 commits behind head on main.

Files with missing lines	Patch %	Lines
src/activation/useActivateModWizard.ts	92.10%	3 Missing ⚠️
src/store/modComponents/modComponentUtils.ts	90.62%	3 Missing ⚠️
src/store/modComponents/modInstanceSelectors.ts	85.71%	2 Missing ⚠️
src/utils/registryUtils.ts	33.33%	2 Missing ⚠️
.../sidebar/activateMod/ActivateMultipleModsPanel.tsx	66.66%	1 Missing ⚠️
src/store/modComponents/modInstanceUtils.ts	96.66%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #9182      +/-   ##
==========================================
+ Coverage   74.24%   74.99%   +0.74%     
==========================================
  Files        1332     1372      +40     
  Lines       40817    42427    +1610     
  Branches     7634     7925     +291     
==========================================
+ Hits        30306    31817    +1511     
- Misses      10511    10610      +99

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

twschiller · 2024-09-22T18:22:24Z

src/activation/useActivateModWizard.ts

 export type UseActivateModWizardResult = {
  wizardSteps: WizardStep[];
  initialValues: WizardValues;
  validationSchema: Yup.AnyObjectSchema;
 };

+function getInitialIntegrationDependencies(


Extracted these 2 from other method because they're both quite long

twschiller · 2024-09-22T18:22:54Z

src/extensionConsole/pages/activateMod/ActivateModPage.tsx

@@ -60,8 +60,6 @@ function useModNotFoundRedirectEffect(error: unknown): void {

 /**
 * Common page for activating a mod definition
- *
- * @param modDefinitionQuery The mod definition to activate


Invalid documentation

twschiller · 2024-09-22T18:24:00Z

src/store/modComponents/modInstanceUtils.ts

+ * Maps activated mod components to a mod instance.
+ * @param modComponents mod components from the mod
+ */
+export function mapActivatedModComponentsToModInstance(


The primary adapter to review in this PR

twschiller · 2024-09-22T18:24:51Z

src/store/modComponents/modInstanceUtils.ts

+      // definition vs. looking up the definition
+      options: emptyModOptionsDefinitionFactory(),
+      sharing: modMetadata.sharing ?? createPrivateSharing(),
+      updated_at: modMetadata.updated_at ?? firstComponent.updateTimestamp,


We might consider this line of refactoring as an opportunity to fix the snake case and/or perform other reshaping

I would perform that at the service layer level. We also want to map extensionPoints -> starterBricks at the same time

src/types/modInstanceTypes.ts

grahamlangford · 2024-09-26T18:15:40Z

src/store/modComponents/modInstanceSelectors.ts

+  if (!Array.isArray(options.activatedModComponents)) {
+    console.warn("state migration has not been applied yet", {
+      options,
+    });
+    throw new TypeError("state migration has not been applied yet");
+  }


NIT: better to compare options._persist.version to persistModComponentOptionsConfig.version as it would make this selector much more change-tolerant

That makes sense - I had copied this from the modComponentSelectors code

pixiebrix-extension/src/store/modComponents/modComponentSelectors.ts

Line 28 in 9e0d9be

if (!Array.isArray(options.activatedModComponents)) {

I think that might be a problem for test ergonomics given that test stores typically don't have the persistence props attached to the slices? https://github.com/pixiebrix/pixiebrix-extension/blob/feature%2Fdevex-mod-instance/src/pageEditor/testHelpers.ts#L38-L38

Let's punt to be separate work?

grahamlangford · 2024-09-26T18:18:04Z

src/store/modComponents/modInstanceSelectors.ts

+export const selectModInstanceMap = createSelector(
+  selectModInstances,
+  (modInstances) =>
+    new Map(
+      modInstances.map((modInstance) => [
+        modInstance.definition.metadata.id,
+        modInstance,
+      ]),
+    ),
+);


I would avoid returning a Map from a redux selector. We shouldn't ever store a Map in redux, so we would still be adapting redux state even after a redux migration

I would avoid returning a Map from a redux selector. We shouldn't ever store a Map in redux, so we would still be adapting redux state even after a redux migration

Could you clarify your concern for returning a Map? The output of selectors don't need to be serializable

We shouldn't ever store a Map in redux, so we would still be adapting redux state even after a redux migration

My understanding of selectors is that they adapt the persisted redux state into a form that's easy for the application to use. They allow you, for example, to have the data denormalized in the redux state (to avoid invalid data) and then normalize it for the application to use

Not sure what you'd recommend instead. The options off the top of my head are:

Creating a selector factory that takes an id and produces a selector?

Returning an array having the callsite do an O(n) search?

Having this return an object for the callsite to do the lookup? From an ergonomics perspective, a Map is preferable to using an object as a map

If you intend the data to never be stored in Redux, then I can withdraw my objection.

My understanding was the intention of these selectors in particular was to serve as a stand-in for the eventual redux migration. Since we can't store Maps, we would have to rewrite both the selector and the consumers. Not an issue if the selector will always contain the logic of creating the Map

The redux state will be an array of ModInstances which are serializable. And there can be a selector for that.

But business logic that uses the slice has a need to be able to get the ModInstance for a given mod id.

So it's useful to also have a selector that returns a lookup. And it's useful to memoize that since multiple components on the screen may be performing the lookup. Our code on main has to perform a lot of O(n) lookups of mod components

There's also a hook if the users needs a specific mod id (or undefined) vs. needing the map. Some of the activation methods (e.g., useActivateMod) and mods screen method need the Map because the returned callbacks take mod id as an argument. So we can't use the hook in those cases

Agreed. I'm fine with the Map in that case. Just wanted to call attention in case the plan was to store the Map

As you mention, when we go to migrate the redux state, there will be a question of storing as an array vs. object keyed by mod registry id. My general feeling is array works best since the lookups would generally be by:

all mod instances

registry id

deployment id

But keep as array leaves open if we ever want to support multiple mod instances for a given mod id. And for these lookups we can just use reselect

src/activation/useActivateMod.ts

src/store/modComponents/modInstanceUtils.ts

…tance

fungairino · 2024-10-07T14:43:13Z

src/store/modComponents/modInstanceUtils.ts

+  const firstComponent = modComponents[0];
+  assertNotNullish(firstComponent, "activatedModComponents is empty");


nit: there's a very simple type definition we can write for a non-empty array to avoid needing a run-time check here:

type NonEmptyArray<T> = [T, ...T[]];

This would mean doing some more type-checking upstream though

Cool - I'd vote we leave for future DevEx improvement since it's easy to layer on later. See Typefest discussion: sindresorhus/type-fest#476

src/types/deploymentTypes.ts

fungairino · 2024-10-07T18:40:48Z

src/store/modComponents/modInstanceUtils.ts

+        if (modComponent._recipe?.id !== modMetadata.id) {
+          throw new Error("Mod component does not match mod metadata");
+        }


nit: After doing this runtime check, we could refine the type definition if we wanted to.

type ArrayWithSameId<T extends { id: unknown }> = T extends { id: infer IdType } ? (T & { id: IdType })[] : never;

I'm not sure what type you're planning on refining? Once the mod components have been grouped into a ModInstance there's no data duplication for that invariant to describe

Oh yup, I was just thinking about how to describe this runtime check as a type enforcement but in this case it's not as useful.

github-actions · 2024-10-07T19:17:28Z

No loom links were found in the first post. Please add one there if you'd like to it to appear on Slack.

Do not edit this comment manually.

twschiller added 2 commits September 21, 2024 21:30

[WIP] mod instance type and adapters

955553c

Remove some unrelated refactoring

dc76c27

twschiller self-assigned this Sep 22, 2024

vercel bot deployed to Preview September 22, 2024 01:49 View deployment

Fix bad refactor

005f8b0

vercel bot deployed to Preview September 22, 2024 01:52 View deployment

twschiller commented Sep 22, 2024

View reviewed changes

src/activation/useActivateModWizard.ts Show resolved Hide resolved

twschiller commented Sep 22, 2024

View reviewed changes

twschiller added the developer experience label Sep 22, 2024

twschiller changed the title ~~[WIP] mod instance type and adapters~~ [WIP] initial mod instance type and adapters Sep 22, 2024

twschiller requested a review from grahamlangford September 22, 2024 02:04

Refactor useReactivateMod

6a90319

vercel bot deployed to Preview September 22, 2024 02:31 View deployment

twschiller changed the title ~~[WIP] initial mod instance type and adapters~~ [WIP] initial mod instance type and adapter applies to activation code Sep 22, 2024

twschiller changed the title ~~[WIP] initial mod instance type and adapter applies to activation code~~ [WIP] initial mod instance type and adapter applied to re-/activation code Sep 22, 2024

twschiller commented Sep 22, 2024

View reviewed changes

twschiller added the 30% time label Sep 22, 2024

twschiller requested a review from fungairino September 22, 2024 12:18

Fix activation form validation

5f53bcc

vercel bot deployed to Preview September 22, 2024 13:08 View deployment

twschiller changed the title ~~[WIP] initial mod instance type and adapter applied to re-/activation code~~ Initial mod instance type and adapter applied to re-/activation code Sep 22, 2024

twschiller marked this pull request as ready for review September 22, 2024 13:09

twschiller changed the title ~~Initial mod instance type and adapter applied to re-/activation code~~ Initial mod instance type and adapter applied to re-/activation code (1/2) Sep 22, 2024

twschiller mentioned this pull request Sep 22, 2024

Slice 2: Use ModInstance type in mod deployment code (2/3) #9190

Merged

Remove dead code

4e69887

vercel bot deployed to Preview September 22, 2024 14:47 View deployment

twschiller changed the title ~~Initial mod instance type and adapter applied to re-/activation code (1/2)~~ Initial mod instance type and adapter applied to re-/activation code (1/3) Sep 22, 2024

twschiller commented Sep 22, 2024

View reviewed changes

twschiller changed the title ~~Initial mod instance type and adapter applied to re-/activation code (1/3)~~ Initial ModInstance type and adapter applied to re-/activation code (1/3) Sep 22, 2024

twschiller commented Sep 22, 2024

View reviewed changes

src/types/modInstanceTypes.ts Outdated Show resolved Hide resolved

Merge with origin/main

c80c074

vercel bot deployed to Preview September 24, 2024 15:23 View deployment

twschiller changed the title ~~Initial ModInstance type and adapter applied to re-/activation code (1/3)~~ Slice 1: Initial ModInstance type and adapter applied to re-/activation code (1/3) Sep 24, 2024

grahamlangford reviewed Sep 26, 2024

View reviewed changes

src/activation/useActivateMod.ts Show resolved Hide resolved

grahamlangford reviewed Sep 26, 2024

View reviewed changes

src/store/modComponents/modInstanceUtils.ts Show resolved Hide resolved

twschiller added 3 commits September 26, 2024 15:31

[WIP] address PR comments

de91858

Merge remote-tracking branch 'origin/main' into feature/devex-mod-ins…

466ecf5

…tance

Tag mod instance type

24a8fce

vercel bot deployed to Preview September 26, 2024 19:40 View deployment

Remove redundant check

625c84f

vercel bot deployed to Preview September 26, 2024 19:59 View deployment

fungairino reviewed Oct 7, 2024

View reviewed changes

src/types/deploymentTypes.ts Outdated Show resolved Hide resolved

fungairino reviewed Oct 7, 2024

View reviewed changes

Clarify comments

b4faee6

vercel bot deployed to Preview October 7, 2024 18:44 View deployment

grahamlangford approved these changes Oct 7, 2024

View reviewed changes

twschiller added this to the 2.1.4 milestone Oct 7, 2024

twschiller enabled auto-merge (squash) October 7, 2024 19:21

twschiller merged commit ba1e9da into main Oct 7, 2024
29 checks passed

twschiller deleted the feature/devex-mod-instance branch October 7, 2024 19:33

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Slice 1: Initial `ModInstance` type and adapter applied to re-/activation code (1/3) #9182

Slice 1: Initial `ModInstance` type and adapter applied to re-/activation code (1/3) #9182

twschiller commented Sep 22, 2024 •

edited

Loading

twschiller Sep 22, 2024

github-actions bot commented Sep 22, 2024 •

edited

Loading

twschiller Sep 22, 2024

twschiller Sep 22, 2024 •

edited

Loading

fungairino Oct 7, 2024 •

edited

Loading

twschiller Oct 7, 2024

codecov bot commented Sep 22, 2024 •

edited

Loading

twschiller Sep 22, 2024

twschiller Sep 22, 2024

twschiller Sep 22, 2024

twschiller Sep 22, 2024

grahamlangford Sep 26, 2024

grahamlangford Sep 26, 2024

twschiller Sep 26, 2024

twschiller Sep 26, 2024 •

edited

Loading

grahamlangford Sep 26, 2024

twschiller Sep 26, 2024 •

edited

Loading

grahamlangford Sep 26, 2024 •

edited

Loading

twschiller Sep 26, 2024 •

edited

Loading

grahamlangford Sep 26, 2024

twschiller Sep 26, 2024 •

edited

Loading

fungairino Oct 7, 2024

twschiller Oct 7, 2024 •

edited

Loading

fungairino Oct 7, 2024

twschiller Oct 7, 2024 •

edited

Loading

fungairino Oct 7, 2024

github-actions bot commented Oct 7, 2024

		const firstComponent = modComponents[0];
		assertNotNullish(firstComponent, "activatedModComponents is empty");

Slice 1: Initial ModInstance type and adapter applied to re-/activation code (1/3) #9182

Slice 1: Initial ModInstance type and adapter applied to re-/activation code (1/3) #9182

Conversation

twschiller commented Sep 22, 2024 • edited Loading

What does this PR do?

Discussion

Future Work

Choose a reason for hiding this comment

github-actions bot commented Sep 22, 2024 • edited Loading

Playwright test results

Details

Choose a reason for hiding this comment

twschiller Sep 22, 2024 • edited Loading

Choose a reason for hiding this comment

fungairino Oct 7, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

codecov bot commented Sep 22, 2024 • edited Loading

Codecov Report

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

twschiller Sep 26, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

twschiller Sep 26, 2024 • edited Loading

Choose a reason for hiding this comment

grahamlangford Sep 26, 2024 • edited Loading

Choose a reason for hiding this comment

twschiller Sep 26, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

twschiller Sep 26, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

twschiller Oct 7, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

twschiller Oct 7, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

github-actions bot commented Oct 7, 2024

Slice 1: Initial `ModInstance` type and adapter applied to re-/activation code (1/3) #9182

Slice 1: Initial `ModInstance` type and adapter applied to re-/activation code (1/3) #9182

twschiller commented Sep 22, 2024 •

edited

Loading

github-actions bot commented Sep 22, 2024 •

edited

Loading

twschiller Sep 22, 2024 •

edited

Loading

fungairino Oct 7, 2024 •

edited

Loading

codecov bot commented Sep 22, 2024 •

edited

Loading

twschiller Sep 26, 2024 •

edited

Loading

twschiller Sep 26, 2024 •

edited

Loading

grahamlangford Sep 26, 2024 •

edited

Loading

twschiller Sep 26, 2024 •

edited

Loading

twschiller Sep 26, 2024 •

edited

Loading

twschiller Oct 7, 2024 •

edited

Loading

twschiller Oct 7, 2024 •

edited

Loading