diff --git a/packages/docs/components/navigation/csc-navigation.json b/packages/docs/components/navigation/csc-navigation.json index 3dd547763..fc05e4222 100644 --- a/packages/docs/components/navigation/csc-navigation.json +++ b/packages/docs/components/navigation/csc-navigation.json @@ -11,6 +11,14 @@ { "title": "Examples", "href": "/csc/examples" + }, + { + "title": "Local development", + "href": "/csc/local-development" + }, + { + "title": "New application", + "href": "/csc/new-application" } ] } diff --git a/packages/docs/pages/csc/environments.mdx b/packages/docs/pages/csc/environments.mdx index d3cd434ed..c1765d8a7 100644 --- a/packages/docs/pages/csc/environments.mdx +++ b/packages/docs/pages/csc/environments.mdx @@ -6,27 +6,25 @@ These are the urls for each branch: ### Beta -* ci-beta -> `https://ci.console.redhat.com/beta` -* qa-beta -> `https://qa.console.redhat.com/beta` -* stage-beta -> `https://console.stage.redhat.com/beta` -* prod-beta -> `https://console.redhat.com/beta` +* stage-beta: `https://console.stage.redhat.com/beta` +* prod-beta: `https://console.redhat.com/beta` +* qa-beta: `https://qaprodauth.console.redhat.com/beta` + ### Stable -* ci-stable -> `https://ci.console.redhat.com` -* qa-stable -> `https://qa.console.redhat.com` -* stage -> `https://console.stage.redhat.com` -* prod-stable -> `https://console.redhat.com` +* stage: `https://console.stage.redhat.com` +* prod-stable: `https://console.redhat.com` +* qa-beta: `https://qaprodauth.console.redhat.com` -These branches sync: +### Branch synchronization * ci-beta -> qa-beta -> stage-beta -* ci-stable -* qa-stable -> stage-stable +* ci-stable -> qa-stable -> stage-stable ## Adding Config for New Apps To enable a new app in our environments, you need to create configuration for it in `main.yml` and in `/chrome` directory. After that create a PR to merge it into the `ci-beta` branch. The configuration for the non-prod beta branches is kept in sync. Changes to `ci-beta` will automatically be merged into `qa-beta` (as mentioned above). -When you need this config added to another environment (`prod-beta`, `ci-stable`, `qa-stable`, `prod-stable`), please open another PR for that environment. If you have any concerns about this process, feel free to ping #forum-clouddot-ui on Slack for assistance. +When you need this config added to another environment (`ci-stable`, `prod-beta`, `prod-stable`), please open another PR for that environment. If you have any concerns about this process, feel free to ping #forum-clouddot-ui on Slack for assistance. diff --git a/packages/docs/pages/csc/index.mdx b/packages/docs/pages/csc/index.mdx index 7480f224a..5bbf8c1d0 100644 --- a/packages/docs/pages/csc/index.mdx +++ b/packages/docs/pages/csc/index.mdx @@ -1,6 +1,10 @@ # About -This repo deals with the high-level configuration of Cloud Services. `main.yml` contains the source of truth for CS apps, and the `akamai` folder deals with updating our Akamai configuration. +The cloud services config repo deals with the high-level configuration of Cloud Services. `main.yml` contains the build assets source of truth apps. The `akamai` folder deals with updating our Akamai configuration. The `chrome` folder hosts UI specific configuration files. + +## Build Process + +This repository has a webhook that automatically builds a [Jenkins job](https://jenkins-jenkins.5a9f.insights-dev.openshiftapps.com/job/akamai-config-deployer/) on every push. To configure this webhook, check the project's [webhook settings](https://github.com/RedHatInsights/cloud-services-config/settings/hooks) ## Akamai API Access @@ -10,60 +14,12 @@ If you're able to run the sample call at the end of the doc, you should be able For more information on the Akamai API, read the [property manager docs](https://developer.akamai.com/api/core_features/property_manager/v1.html). -## Build Process - -This repository has a webhook that automatically builds a [Jenkins job](https://jenkins-jenkins.5a9f.insights-dev.openshiftapps.com/job/akamai-config-deployer/) on every push. To configure this webhook, check the project's [webhook settings](https://github.com/RedHatInsights/cloud-services-config/settings/hooks) - -## Testing your changes locally - -Testing local changes is straightforward. First, add a line like this to your insights-proxy spandx config: - -```diff ---- a/profiles/local-frontend.js -+++ b/profiles/local-frontend.js -@@ -9,5 +9,6 @@ routes[`/beta/${SECTION}/${APP_ID}`] = { host: `http://localhost:${FRONTEND_PORT - routes[`/${SECTION}/${APP_ID}`] = { host: `http://localhost:${FRONTEND_PORT}` }; - routes[`/beta/apps/${APP_ID}`] = { host: `http://localhost:${FRONTEND_PORT}` }; - routes[`/apps/${APP_ID}`] = { host: `http://localhost:${FRONTEND_PORT}` }; -+routes[`/beta/config`] = { host: `http://localhost:8889` }; - - module.exports = { routes }; -``` - -Restart your insights-proxy to pick up the change. - -Create a `beta/config` directory inside of `cloud-services-config` and crate a sym link (or copy) to `/chrome` directory in it. Then, from the `cloud-services-config` dir, run `npx http-server -p 8889`. In your browser, go to `https://ci.foo.redhat.com:1337/beta/rhel/dashboard`. You should see something logged like this from npx: - -```text -$ npx http-server -p 8889 -npx: installed 25 in 2.484s -Starting up http-server, serving ./ -Available on: - http://127.0.0.1:8889 - http://192.168.0.25:8889 - http://10.10.122.158:8889 -Hit CTRL-C to stop the server -[Tue Nov 05 2019 09:50:55 GMT-0500 (Eastern Standard Time)] "GET /beta/config/main.yml" "Mozilla/5.0 (X11; Fedora; Linux x86_64; rv:69.0) Gecko/20100 -101 Firefox/69.0" -``` - -Before you go developing, make sure you can make a simple change and see it in the web UI. Try renaming "Dashboard" link title to "XDashboardX" in `/chrome/rhel-navigation.json`. +## Making changes to main.yml -```diff -diff --git a/chrome/rhel-navigation.json b/chrome/rhel-navigation.json -index 67237cc..4485daa 100644 ---- a/chrome/rhel-navigation.json -+++ b/chrome/rhel-navigation.json -@@ -4,7 +4,7 @@ - "navItems": [ - { - "appId": "dashboard", -- "title": "Dashboard", -+ "title": "XDashboardX", - "filterable": false, - "href": "/insights/dashboard", - "product": "Red Hat Insights" +Most of the config in `main.yml` is deprecated. The only required application attribute is the `deployment_repo` -``` +## Read next -Now go to `/insights/dashboard`. You may not see your navigation change at this point! Try clearing your local storage in your browser. To do this in Firefox, hit Shift-F9 and click "Local Storage", then right click on `https://ci.foo.redhat.com:1337` and delete all. Refresh the page and you should then see your changes. You'll notice too that SimpleHTTPServer logged another request. +- [Local development](/csc/local-development) +- [Environments](/csc/environments) +- [Examples](/csc/examples) diff --git a/packages/docs/pages/csc/local-development.md b/packages/docs/pages/csc/local-development.md new file mode 100644 index 000000000..fec576e8e --- /dev/null +++ b/packages/docs/pages/csc/local-development.md @@ -0,0 +1,75 @@ +# Local development + +## Setup UI proxy for /config + +Testing local changes is straightforward. First, add a routes config proxy settings. Proxy settings are usually in `fec.config.js` or `dev.webpack.config.js` files. Config is exactly the same in both config files. + +Read more about proxy routes config [here](/proxies/webpack-proxy#Customroutes). + +```diff +diff --git a/fec.config.js b/fec.config.js +index af17b44..acf7204 100644 +--- a/fec.config.js ++++ b/fec.config.js +@@ -11,4 +11,12 @@ module.exports = { + * Add additional webpack plugins + */ + plugins: [], ++ routes: { ++ '/config': { ++ host: 'http://localhost:8889', ++ }, ++ '/beta/config': { ++ host: 'http://localhost:8889', ++ }, ++ }, + }; + +``` + +## Host config repo locally + +1. Create a `config` directory inside of `cloud-services-config` and create a sym link (or copy) to `/chrome` directory in it. You can also create a `beta` directory and symlink the `config` in it if you need `/beta` environment. + +2. From the `cloud-services-config` dir, run `npx http-server -p 8889`. In your browser, go to `https://ci.foo.redhat.com:1337/beta/rhel/dashboard`. You should see something logged like this from npx: + +```shell +$ npx http-server -p 8889 +npx: installed 25 in 2.484s +Starting up http-server, serving ./ +Available on: + http://127.0.0.1:8889 + http://192.168.0.25:8889 + http://10.10.122.158:8889 +Hit CTRL-C to stop the server +``` + +## Check if the proxy is working + +Make sure you can make a simple change and see it in the browser. Try renaming "Dashboard" link title to "XDashboardX" in `/chrome/rhel-navigation.json`. + +```diff +diff --git a/chrome/rhel-navigation.json b/chrome/rhel-navigation.json +index 67237cc..4485daa 100644 +--- a/chrome/rhel-navigation.json ++++ b/chrome/rhel-navigation.json +@@ -4,7 +4,7 @@ + "navItems": [ + { + "appId": "dashboard", +- "title": "Dashboard", ++ "title": "XDashboardX", + "filterable": false, + "href": "/insights/dashboard", + "product": "Red Hat Insights" + +``` + +Go to `/insights/dashboard` in the UI and refresh the browser. If you don't see the changes, go to the terminal in which your config server is running. You should see similar HTTP logs: + +```shell +[Tue Nov 05 2019 09:50:55 GMT-0500 (Eastern Standard Time)] "GET /beta/config/chrome/insights-navigation.json" "Mozilla/5.0 (X11; Fedora; Linux x86_64; rv:69.0) Gecko/20100 +101 Firefox/69.0" +``` + +If you don't see any logs, your proxy setup is incorrect. diff --git a/packages/docs/pages/csc/new-application.mdx b/packages/docs/pages/csc/new-application.mdx new file mode 100644 index 000000000..799041ea9 --- /dev/null +++ b/packages/docs/pages/csc/new-application.mdx @@ -0,0 +1,50 @@ +# New application + +## Add deployment_repo to main.yml + +```yaml +moduleId: + title: Module title + deployment_repo: https://github.com/RedHatInsights/ +``` + +## Register new chrome module + +In the CSC repository, open `chrome/fed-modules.json` file and add a new module configuration: + +```js +{ + "moduleId": { + "manifestLocation": "/apps/moduleId/fed-mods.json", // the manifest path depends on app deployment + "modules": [ + { + "id": "arbitrary-unique-id", + "module": "./RootApp", // federated module entry point + "routes": [ + "/bundle/module-route" + ] + } + ] + } +} +``` + +## Add a new navigation config (optional) + +In the CSC repository open a navigation file. Choose navigation file, based on your application bundle. + +*Example: `chrome/settings-navigation.json`* + +Add new navigation entry + +```js +{ + { + "appId": "moduleId", + "title": "New top level link", + "href": "/bundle/module-route" + }, +} +``` + +For more examples and guides, visit the CSC repository.