e-gov/CVI header implementation

[turnerrainer]

AS A Developer I WANT TO re-use the already existing header component by just defining its use case SO THAT I wouldn't have to create a new one or use boilerplate code

Acceptance Criteria

• [ ] Use https://github.com/buerokratt/cvi/tree/main/libs/react-ui/src/lib/header as the source code of the component
• [ ] Basic implementation by physically updating the source code
• [ ] Add header section to base layout (see #2 for reference)
• [ ] ~When the source code changes in the source destination and the application is re-built (locally), the changes from the source code apply~
• [ ] ~Basic CI/CD pipeline to build the end result based on an appropriate source code~
• [ ] Simple Docker Compose to test the result locally

Refactor the current solution

• [ ] Re-use available e-gov/CVI components where possible
• [ ] Fix existing e-gov/CVI components

Node.js packages

• [ ] Create a Node.js package locally
• [ ] Publish the Node.js package
• [ ] Sample implementation via #8

Update base layout

• [ ] Use #2 as the source
• [ ] Use /sample-implementation-cvi/header.html with the header implemented on the base layout as the output

[turnerrainer]

Linked to https://github.com/buerokratt/cvi/issues/64

[turnerrainer]

Blocked due to new AC coming from #8

[turnerrainer]

Groomed by @ExiRain , @turnerrainer and @TarmoKlaarRIA , ready to proceed.

New time estimates needed due to added/changed AC.

@TarmoKlaarRIA will provide input for publishing Node.js packages on behalf of Bürokratt.

[TarmoKlaarRIA]

Bürokratt UI (React) component library

Bourokratt Github registry

Let's make a Github npm package register for boerokratt developments. If UI components are sufficiently mature, then base components can be moved to the e-gov github repo. Here's an article about setting up own npm registry. https://docs.github.com/en/packages/working-with-a-github-packages-registry/working-with-the-npm-registry

?? namespace buerokratt?

@buerokratt/cvi-react  -- for the common UI (cvi) react components
@buerokratt/byk-react  -- reusable UI components for the Bouerokratt 

Repo for the base UI react components: https://github.com/buerokratt/cvi

Repo for the Buerokratt specific common and functional UI components: https://github.com/buerokratt/sample-implementation-cvi

    flowchart TB
    ghui("CVI React base components GH:
        button, input, toast, panel, layout etc")
    ghbyk("Byk React GH:
        navigation, header, ...
        ")
    ghcvi("eGov CVI GH")
    ghbyk_sample("Byk Sample UI ")
    %% ghbyk_chbt("Byk chatbot project")
    ghbyk_pr("Byk UI project X ...
    chatbot, trainig, services etc
    ")

    subgraph "Buerokratt GH Registry"
    npmc("npm pkg
    @buerokratt/cvi-react")
    npmb("npm pkg
    @buerokratt/byk-react")
    end 

    npmr("npm pkg
    @egov/cvi-react")

    %% relations

    ghui -- PullR --> ghcvi --> npmr
    ghui --> npmc -- depend --> ghbyk
    ghbyk --> npmb
    npmc -- depend --> ghbyk_sample
    npmb -- depend --> ghbyk_sample

    npmc -- depend --> ghbyk_pr
    npmb -- depend --> ghbyk_pr

[TarmoKlaarRIA]

Bürokratt UI (React) component library

Bourokratt Github registry

Let's make a Github npm package register for boerokratt developments. If UI components are sufficiently mature, then base components can be moved to the e-gov github repo. Here's an article about setting up own npm registry. https://docs.github.com/en/packages/working-with-a-github-packages-registry/working-with-the-npm-registry

?? namespace buerokratt?

@buerokratt/cvi-react  -- for the common UI (cvi) react components
@buerokratt/byk-react  -- reusable UI components for the Bouerokratt 

Repo for the base UI react components: https://github.com/buerokratt/cvi

Repo for the Buerokratt specific common and functional UI components: https://github.com/buerokratt/sample-implementation-cvi

    flowchart TB
    ghui("CVI React base components GH
        button, input, toast, panel, layout etc")
    ghbyk("Byk React GH
        layout,navigation
        header, ...
        ")
    ghcvi("eGov CVI GH")
    ghbyk_sample("Byk Sample UI ")
    %% ghbyk_chbt("Byk chatbot project")
    ghbyk_pr("Byk UI project X ...
    chatbot, trainig, services etc
    ")

    subgraph "Buerokratt GH Registry"
    npmc("npm pkg
    @buerokratt/cvi-react")
    npmb("npm pkg
    @buerokratt/byk-react")
    end 

    npmr("npm pkg
    @egov/cvi-react")

    %% relations

    ghui -- PullR --> ghcvi --> npmr
    ghui --> npmc -- depend --> ghbyk
    ghbyk --> npmb
    npmc -- depend --> ghbyk_sample
    npmb -- depend --> ghbyk_sample

    npmc -- depend --> ghbyk_pr
    npmb -- depend --> ghbyk_pr