Merge pull request #412 from vishnoianil/knowledge-docs

Graduate UI native mode (github detached mode) to stable feature.

.env.example

@@ -11,15 +11,16 @@ IL_GRANITE_API=<GRANITE_HOST>
 IL_GRANITE_MODEL_NAME=<GRANITE_MODEL_NAME>
 IL_MERLINITE_API=<MERLINITE_HOST>
 IL_MERLINITE_MODEL_NAME=<MERLINITE_MODEL_NAME>
-IL_UI_DEPLOYMENT=dev ## Comment it out if it's not a dev deployment
+
+IL_UI_DEPLOYMENT=native # Two deployment modes are available: github and native
+IL_ENABLE_DEV_MODE=true #Enable this option if you want to enable UI features that helps in development, such as form Auto-Fill feature.
 
 GITHUB_TOKEN=<TOKEN FOR OAUTH INSTRUCTLAB MEMBER LOOKUP>
 TAXONOMY_DOCUMENTS_REPO=github.com/instructlab-public/taxonomy-knowledge-docs
 NEXT_PUBLIC_AUTHENTICATION_ORG=<AUTHENTICATION_ORG>
 NEXT_PUBLIC_TAXONOMY_REPO_OWNER=<GITHUB_ACCOUNT>
 NEXT_PUBLIC_TAXONOMY_REPO=<REPO_NAME>
 
+NEXT_PUBLIC_TAXONOMY_REPO_DIR=
+
 NEXT_PUBLIC_EXPERIMENTAL_FEATURES=false
-# The following requires experimental and dev mode to be enabled
-# NEXT_PUBLIC_BASE_CLONE_DIRECTORY=/base/path/
-# NEXT_PUBLIC_LOCAL_REPO_PATH=/base/path/cloned_dir_name

.gitignore

@@ -27,7 +27,9 @@ pathservice.pid
 /blob-report/
 /playwright/.cache/
 playwright/.auth
+.instructlab-ui
 # dont track secrets in git
 deploy/k8s/overlays/kind/umami/umami-secret.yaml
 deploy/k8s/overlays/openshift/umami/qa/umami-secret.yaml
 deploy/k8s/overlays/openshift/umami/prod/umami-secret.yaml
+

docs/development.md

@@ -2,6 +2,45 @@
 
 This is a [NextJS](https://nextjs.org) framework with [Patternfly](https://www.patternfly.org/get-started/develop/) UI library components.
 
+## Deploying the UI stack on your local machine
+
+Podman is a requirement. Install and init instructions [here](https://podman.io/docs/installation).
+
+Set the .env in the ui directory and make sure you uncomment the `IL_ENABLE_DEV_MODE=true`. `IL_ENABLE_DEV_MODE` flag enables assistive features that help you automate the time consuming and repetitive tasks, such as filling skill and knowledge forms for testing. Once .env file is setup, run the following:
+
+```bash
+make start-dev-local
+```
+
+This will start the UI and the dependent pathservice locally on the machine.
+
+> [!NOTE]
+> It might ask for permission to allow to listen on port 4000.
+
+To stop the the local dev environment run the following:
+
+```bash
+make stop-dev-local
+```
+
+## Deploying the UI stack in KIND cluster
+
+Set the .env in the ui directory and run the following:
+
+```bash
+make start-dev-kind
+```
+
+This will start the Kind cluster and deploy the UI stack related manifest files in the cluster.
+
+To stop the Kind cluster and delete the UI stack related resources, run the following:
+
+```bash
+make stop-dev-kind
+```
+
+Use `make help` to see all the available commands.
+
 ## Manually Running the React UI
 
 Set the .env in the ui directory and run the following:
@@ -15,7 +54,7 @@ npm run build
 npm run start
 ```
 
-## Other helpful NPM Commands
+### Other helpful NPM Commands
 
 ```bash
 # Run a production build (outputs to ".next" dir)
@@ -38,53 +77,20 @@ npm run type-check
 
 ```
 
-## Make scripts
-
-Podman is a requirement. Install and init instructions [here](https://podman.io/docs/installation).
+UI stack supports two mode of deployments:
 
-```bash
-# Run markdown linter
-make md-lint
-```
+- github - This is the default mode and it allows users to push their knowledge and skill contribution to the github taxonomy repository.
+- native - This mode allow users to keep the skill and knowledge contribution in their local machine.
 
-## Deploying the UI stack on your local machine
+## Running the UI in Native Deployment Mode
 
-Set the .env in the ui directory and make sure you uncomment the `IL_UI_DEPLOYMENT=dev`. Once .env file is setup, run the following:
+To enable the native mode, set the `IL_UI_DEPLOYMENT=native` in the .env file. Once the flag is set, the UI will not push the knowledge and skill contribution to the github repository. Instead, it will keep the contribution in the local machine. In the `native` mode, the UI login page will show username and password input box to authenticate the user. You can setup the username and password in the .env file through the `IL_UI_ADMIN_USERNAME` and `IL_UI_ADMIN_USERNAME` flags.
 
-```bash
-make start-dev-local
-```
+## Running the UI in Github Deployment Mode
 
-This will start the UI and the dependent pathservice locally on the machine.
-
-> [!NOTE]
-> It might ask for permission to allow to listen on port 4000.
-
-To stop the the local dev environment run the following:
-
-```bash
-make stop-dev-local
-```
-
-## Deploying the UI stack in KIND cluster
-
-Set the .env in the ui directory and run the following:
-
-```bash
-make start-dev-kind
-```
-
-This will start the Kind cluster and deploy the UI stack related manifest files in the cluster.
-
-To stop the Kind cluster and delete the UI stack related resources, run the following:
-
-```bash
-make stop-dev-kind
-```
-
-Use `make help` to see all the available commands.
+To enable the github mode, set the `IL_UI_DEPLOYMENT=github` in the .env file. Once the flag is set, the UI will push the knowledge and skill contribution to the github taxonomy repository. In the `github` mode, the UI login page will show the github login button to authenticate the user.
 
-## OAuth Configuration
+### OAuth Configuration for Github Deployment Mode
 
 You can either set up the Oauth app in your
 [GitHub](https://docs.github.com/en/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app)
@@ -140,7 +146,7 @@ The chat interface should now use the server.
 
 ![enter image description here](../public/dev-local-chat-server/successful-chat.png)
 
-### How to Cherry-Pick a Merged PR to `release-1.0`
+## How to Cherry-Pick a Merged PR to `release-1.0`
 
 Until we finish automating releases, you may be asked to cherry-pick your PR after it is merged. Here are instructions for cherry-picking a merged Pull Request to the `release-1.0` branch.
 
@@ -223,7 +229,7 @@ If there are multiple commits associated with the PR, repeat this command for ea
 
 - Navigate to your GitHub repository and create a new Pull Request from your cherry-pick branch (`cherry-pick-pr-<PR-number>-release-1.0`) into the `release-1.0` branch.
 
-### How to Run Playwright tests locally
+## How to Run Playwright tests locally
 
 As a developer, you can add more integration (end to end tests) after you develop your feature. We use [playwright](https://playwright.dev/) as the automation test runner for executing integration tests on our app. To execute playwright tests locally run the following command:
 
@@ -252,7 +258,7 @@ The configuration for playwright tests is defined in `playwright.config` file an
 
 If you'd like to run a specific single test, use the following command with the appropriate folder path to your test. Example: `npx playwright test tests/routing.spec.ts`. To get a detailed report of the completed tests, run `npx playwright show-report` and you'll get a detailed view.
 
-### How to use the devcontainer
+## How to use the devcontainer
 
 ** NOTE: requires the `devcontainer` binary
 
@@ -285,6 +291,6 @@ This will generate the new encrypted sealed-secret manifest in the file you spec
 BE CERTAIN to delete the un-encrypted secret file, we do not want to leak these values in `git`. Finally you can move the `sealed-secret`
 to its correct location within this repo.
 
-### Common issues
+## Common issues
 
 - `error: cannot get sealed secret service: Unauthorized`: You must be signed in to the qa cluster to be able to communicate with the sealed secrets controller.

src/app/api/envConfig/route.ts

@@ -15,7 +15,9 @@ export async function GET() {
     UPSTREAM_REPO_OWNER: process.env.NEXT_PUBLIC_TAXONOMY_REPO_OWNER || '',
     UPSTREAM_REPO_NAME: process.env.NEXT_PUBLIC_TAXONOMY_REPO || '',
     DEPLOYMENT_TYPE: process.env.IL_UI_DEPLOYMENT || '',
-    EXPERIMENTAL_FEATURES: process.env.NEXT_PUBLIC_EXPERIMENTAL_FEATURES || ''
+    ENABLE_DEV_MODE: process.env.IL_ENABLE_DEV_MODE || 'false',
+    EXPERIMENTAL_FEATURES: process.env.NEXT_PUBLIC_EXPERIMENTAL_FEATURES || '',
+    TAXONOMY_REPO_DIR: process.env.NEXT_PUBLIC_TAXONOMY_REPO_DIR || ''
   };
 
   return NextResponse.json(envConfig);