@openfin/here-zero

HERE Zero

Here Zero is a zero install web Platform creation tool/library. It aims to provide an out of the box, low code solution for building Web Platforms that can be themed and integrated with a client’s backend to support application directories and search.

Overview

The Here zero packager is a tool that helps configure and build a core-web powered Web Platform. The output will be a prebuilt application that the Developer user is expected to host. It handles:

• Loading HERE configuration files
• Managing assets and dependencies
• Injecting necessary scripts into overriden HERE Web output
• Customizing logos

Usage

here-zero

Configuration

A Configuration file is required by the tool. This file needs to be called here.config.js (ts, and mjs are also supported) and placed in the project root directory. This configuration file will be the entry point to the Here zero packager.

here.config.ts

import { defineConfig } from '@openfin/here-zero';

export default defineConfig({
    overrides: {
        file: './overrides.js'
    },
    outputDir: './dist',
    // Optional: Configure custom logos
    logo: {
        searchCommandBar: 'path/to/your/logo.ico',
        newTab: 'path/to/your/logo.ico'
    },
    // Optional: Configure title for the application
    title: 'HERE Web App',
    // Optional: Configure favicon for the application
    favicon: 'path/to/your/favicon.ico'
});

Configuration Options

• overrides: Specify the path to your overrides file
  • file: Path to your client-side JavaScript overrides file
• outputDir: Directory where built files will be placed
• logo: (Optional) Customize logos in different parts of the application
  • searchCommandBar: (Optional) Logo for the search command bar
  • newTab: (Optional) Logo for new tabs
• title: (Optional) Set the title of your HERE Web application
• favicon: (Optional) Set the favicon for your HERE Web application

Overrides

To allow developers to integrate their own content and search results into the Web Platform, we provide a simple override mechanism. These overrides enable developers to supply data such as featured apps, launcher entries, and search results, allowing the platform to display dynamic or custom content tailored to their environment.

overrides.js (IMPORTANT: the Here zero packager will not handle building or bundling the provided overrides file, this file must contain valid client-side javascript as it will execute in a browser context)

const { defineOverrides } = require('@openfin/here-zero');

defineOverrides({
    content: {
        fetchFeaturedContent: async () => {
            // Return array of featured content items
            return [
                {
                    title: 'Example App',
                    url: 'https://example.com',
                    iconUrl: 'https://example.com/favicon.ico',
                    type: 'app'
                }
            ];
        },
        fetchLauncherContent: async () => {
            // Return array of launcher content items
            return [
                {
                    title: 'Example App',
                    url: 'https://example.com',
                    iconUrl: 'https://example.com/favicon.ico',
                    type: 'app'
                }
            ];
        }
    },
    search: {
        handleSearchQuery: async ({ query }) => {
            // Handle search queries and return results
            return {
                items: [
                    {
                        title: 'Search Result',
                        url: 'https://example.com',
                        iconUrl: 'https://example.com/favicon.ico',
                        type: 'app'
                    }
                ],
                totalCount: 1
            };
        }
    }
});

Build

In order to generate the Web Platform you will need to run the Here zero packager, this will produce a built core-web Platform in the outputDir specified, you can now host and run this Web Platform.

Example package.json scripts section:

...
    "scripts": {
        "serve": "npx http-server dist -p 8080",
        "start": "npm run serve",
        "build": "npm run build:overrides && npm run build:here",
        "build:overrides": "rollup -c",
        "build:here": "here-zero"
    },
...

On a successful build the packager will:

• Create the outputDir declared in config if it doesn't exist
• Copy necessary HERE Web assets to the output directory
• Copy and inject the provided overrides file into the HERE Web entry point
• If configured, inject logo, title and favicon customizations into the output

Web Interop

The Here Zero Web Platform includes built-in support for Here Web Interop APIs via the @openfin/core-web library.

A core-web Web broker is preconfigured with smart defaults, for example; content placed within Supertabs will automatically be context bound. We recommend setting the connectionInheritance property to "enabled" on the content contexts in order to connect to the preconfigured broker.

core-web Recommended resources

• Core Web Starter Example
• Porting Here Core Container Content to Core Web
• Core Web versions and Release Notes