Thursday, October 10, 2024

I am working on #5777 (ParameterStore (…) expects a list of 3 values but got 5), which requires me to dive into the NavigationControl.js and Base.ts files. This page contains my reading notes.

The localStorage read-only property of window allows you to access a Storage object for the Document‘s origin; the stored data is saved across browser sessions. localStorage is similar to sessionStorage, except that sessionStorage gets cleared when the page session ends — that is, when the page is closed. (Source: mozilla.org) that

Base.ts

The Base.ts file:

  • defines the DynDep() class, which adds dynamic dependency management to a class. The constructor() loads the modules specified by requiredModules and then calls prepare(), sets ready to true and finally calls onReady() (which subclasses can override).

  • it also defines a Component() class, which extends the bare React.Component() to use DynDep().

The file also creates two contexts URLContextType and DataContextType, using React.createContext(), and their default value is an (empty) object. A context lets a parent component provide data to the entire tree below it. (Source: react.dev)

They are assigned to the contextType of our components. More precisely:

  • URLContextType is used by: GridFilter, LinoBbar, LinoBody, LinoLayout, LinoDialog, LinoPaginator, LinoParamsPanel, …

  • DataContextType is used by: GridElement, LinoComponents.UnknownElement

IOW, in a GridElement instance, e.g. in the GridElement.arrowSelect() method, this.context points to the DataContextType and we can say this.context.rows to access the array of rows. Two questions:

  • Do all GridElement() instances share the same context? I guess that React actually makes a copy of contextType for each new instance.

  • Where do we define that a DataContextType has an attribute rows?

I see that React “recommend defining components as functions instead of classes.” So some day we will probably want to migrate. But that won’t be as easy as they describe it because we use an enhanced Component() base class.

NavigationControl.js

The NavigationControl.js file:

  • defines the Context() class, which extends DynDep(). A Context is a controller for all navigation features. It as an attribute contextType, which contains one of the following values (defined in constants.js):

    CONTEXT_TYPE_SINGLE_ROW = "SingleRow";
CONTEXT_TYPE_MULTI_ROW = "MultiRow";
CONTEXT_TYPE_ACTION = "Action";

  • defines the History() class, with attributes like state (contains the “router state”, an instance of State()), and context (the context of its owner).

    History.pushPath()

  • defines Delegate()

  • defines State(), which represents a router state

The ActionHandler()

class ActionHandler()
ActionHandler.singleRow(event, pk, where, status)

Open a detail window on the given primary key pk in the current table.

The ActionHandler.singleRow() method is called by:

  • GridElement.showDetail() (which is called when you click on the first cell of a row)

  • when you click on the title of a LinoCards() item

class GridElement()

defines

DynDep.reflect()

RegisterImportPool(),