An open API service indexing awesome lists of open source software.

https://github.com/project-koku/koku-ui-mfe

Koku-ui Microfrontend (MFE) with Module Federation
https://github.com/project-koku/koku-ui-mfe

hacktoberfest koku patternfly ui

Last synced: 6 months ago
JSON representation

Koku-ui Microfrontend (MFE) with Module Federation

Awesome Lists containing this project

README

          

# DEPRECATED

This project is no longer active. Please see the [koku-ui-ros README][koku-ui-ros-readme] in the Koku UI monorepo.

# Koku microfrontend (MFE) with Module Federation

[![Apache 2.0][license-badge]](https://github.com/project-koku/koku-ui-mfe/blob/main/LICENSE)
[![CI Status][build-badge]](https://github.com/project-koku/koku-ui-mfe/actions/workflows/ci.yml?query=branch%3Amain)
[![codecov][codecov-badge]](https://codecov.io/gh/project-koku/koku-ui-mfe)

React.js app for Cost Management.

User interface is based on [Patternfly].

Submit issues in [Jira].

## Requirements

* [NodeJS v20.15+][nodejs]
* [npm v10.8+][npm]
* [Podman][podman]

After installing Podman, create and start your VM.

```
podman machine init
podman machine start
```

## Setup `hosts` entries (do this once)

Edit the `/etc/hosts` file and add the following entries
```
127.0.0.1 prod.foo.redhat.com
127.0.0.1 stage.foo.redhat.com
```

Alternatively, run the [patch-etc-hosts.sh][patch-etc-hosts] script from the insights-proxy repo
```
sudo bash scripts/patch-etc-hosts.sh
```

## Getting Started

1. Install requirements listed above.
2. Setup `/etc/hosts` entries listed above.
3. Clone the repository, and open a terminal in the base of this project.
4. Run the command `npm install` to install all the dependencies.

## Building
```
npm build
```

## Testing
```
npm test
```

## Running Koku MFE against a hosted Koku API, using webpack proxy

Note that this approach currently supports only the Insights stage environment.

1. Start development server
```
npm start
```

Follow the prompts that follow.

* Which platform environment you want to use `stage`

2. Open the following URL
```
https://stage.foo.redhat.com:1337/staging/cost-management
```

Note: Must log in with a user that has Cost Management permissions

### Running Koku MFE with local Cloud Services Backend

Refer to the [serving files locally][serving-files-locally] section of cloud services config for more details

1. Serve files locally from Cloud Services Backend repo
```
make dev-static-node
```

2. Start development server in Koku MFE repo
```
npm start:csb
```

### Running Koku MFE with local Koku UI

Refer to the [koku-ui README][koku-ui-readme] for more details

1. Start development server in Koku MFE repo
```
npm start:static
```

2. Start development server in Koku UI repo
```
npm start:mfe
```

### Running Koku MFE with local Koku UI and Cloud Services Backend

Refer to the [serving files locally][serving-files-locally] section of cloud services config and the [koku-ui README][koku-ui-readme] for more details

1. Serve files locally from Cloud Services Backend repo
```
make dev-static-node
```

2. Start development server in Koku MFE repo
```
npm start:static
```

3. Start development server in Koku UI repo
```
npm start:csb:mfe
```

## Releasing Koku MFE

This [RELEASE][release-doc] doc describes how to release Koku MFE to each staging environment.

[build-badge]: https://github.com/project-koku/koku-ui-mfe/actions/workflows/ci.yml/badge.svg?branch=main
[codecov-badge]: https://codecov.io/gh/project-koku/koku-ui-mfe/graph/badge.svg?token=1hjFIy1cRe
[Jira]: https://issues.redhat.com/projects/COST/
[koku-ui-readme]: https://github.com/project-koku/koku-ui#readme
[koku-ui-ros-readme]: https://github.com/project-koku/koku-ui/blob/main/apps/koku-ui-ros/README.md
[license-badge]: https://img.shields.io/github/license/project-koku/koku-ui-mfe.svg?longCache=true
[nodejs]: https://nodejs.org/en/
[npm]: https://www.npmjs.com/
[patch-etc-hosts]: https://github.com/RedHatInsights/insights-proxy/blob/master/scripts/patch-etc-hosts.sh
[Patternfly]: https://www.patternfly.org/
[release-doc]: https://github.com/project-koku/koku-ui-mfe/blob/main/RELEASE.md
[serving-files-locally]: https://github.com/RedHatInsights/chrome-service-backend/blob/main/docs/cloud-services-config.md#serving-files-locally