Typed data object definitions

SynergiWeb apps generate a local appframe.d.ts file containing TypeScript definitions for all data objects and procedures exposed by the article. These typings provide strong typing when working with data objects in the application code.

Generating appframe.d.ts

Run pnpm generate-types to produce or update the declaration file. The command executes app-generate-types.ts, which fetches the article script, runs the application in a Node context and writes the resulting typings to src/appframe.d.ts. Internally it relies on generateTypes.ts to transform Appframe metadata into TypeScript interfaces and global DataObject/Procedure declarations.

Data objects are created on the dev server, while the declaration file pulls metadata from the currently configured proxy server. Run pnpm copy-datasources (see app-copy-datasources.ts) to copy the latest data objects to that proxy before generating types. The pnpm cd shortcut combines both copy and generate steps.

Consuming the types in an app

The declaration file is imported using the ~/appframe alias. In the timekeeping-timereg application, the PersonLookup component uses the generated EmployeeLookupRecord interface together with the globally declared dsEmployeeLookup data object:

import type { EmployeeLookupRecord } from "~/appframe";

let { data: persons } = useFetchData(
        dsEmployeeLookup,
        query
                ? query
                                .split(/\s+/g)
                                .map((word) => `[SearchColumn] LIKE '%${word}%'`)
                                .join(" AND ")
                : "",
        { maxRecords: 200 },
);

With these typings you get autocompletion and compile‑time safety when accessing record fields or calling procedures:

function handleSelect(record: EmployeeLookupRecord) {
        console.log(record.PersonID, record.Fullname);
}

Benefits

• Safer refactors – changing a field name in the backend surfaces compile errors where it is used.

• Better IDE support – editors can provide autocompletion and documentation for data objects and procedure parameters.

• Self‑documenting code – the generated file serves as a living reference to available data objects and procedures.

Customizing generated types

The appframe.d.ts file is regenerated each time pnpm generate-types runs, so manual edits will be lost. Use types.json to override field or parameter types, and declare reusable type definitions in src/custom.d.ts referenced with the Custom. prefix. See TypeScript definitions and overrides for more information.

Regenerate typings whenever data objects or procedures change by running pnpm generate-types.