├── .env.template
├── website
    ├── static
    │   ├── .nojekyll
    │   └── img
    │   │   ├── favicon.ico
    │   │   ├── docusaurus.png
    │   │   ├── docusaurus-social-card.jpg
    │   │   ├── logo.svg
    │   │   ├── undraw_docusaurus_tree.svg
    │   │   ├── undraw_docusaurus_mountain.svg
    │   │   └── undraw_docusaurus_react.svg
    ├── src
    │   ├── components
    │   │   └── HomepageFeatures
    │   │   │   ├── styles.module.css
    │   │   │   └── index.tsx
    │   ├── pages
    │   │   ├── index.module.css
    │   │   └── index.tsx
    │   └── css
    │   │   └── custom.css
    ├── tsconfig.json
    ├── .gitignore
    ├── sidebars.ts
    ├── package.json
    ├── docs
    │   ├── intro.md
    │   ├── installation.md
    │   └── usage.md
    ├── README.md
    └── docusaurus.config.ts
├── docs
    └── kpa.png
├── .vscode
    ├── settings.json
    └── launch.json
├── requirements.txt
├── app
    ├── __init__.py
    ├── api
    │   ├── __init__.py
    │   ├── handlers.py
    │   └── routes.py
    ├── models
    │   ├── __init__.py
    │   └── scenarios.py
    ├── services
    │   ├── __init__.py
    │   ├── kubectl.py
    │   ├── ai.py
    │   └── db.py
    ├── utils
    │   └── logger.py
    ├── web
    │   ├── templates
    │   │   ├── scenario_select.html
    │   │   └── index.html
    │   └── static
    │   │   ├── css
    │   │       └── styles.css
    │   │   └── js
    │   │       ├── scenario_select.js
    │   │       └── main.js
    ├── main.py
    └── websocket.py
├── tests
    └── __init__.py
├── Taskfile.yaml
├── chart
    ├── Chart.yaml
    ├── templates
    │   ├── service.yaml
    │   ├── tests
    │   │   └── test-connection.yaml
    │   ├── NOTES.txt
    │   ├── rbac.yaml
    │   ├── _helpers.tpl
    │   └── deployment.yaml
    ├── .helmignore
    └── values.yaml
├── LICENSE
├── Dockerfile
├── .github
    └── workflows
    │   └── deploy-docs.yml
├── README.md
└── .gitignore


/.env.template:
--------------------------------------------------------------------------------
1 | OPENAI_API_KEY=


--------------------------------------------------------------------------------
/website/static/.nojekyll:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/docs/kpa.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/robert-cronin/kpa/HEAD/docs/kpa.png


--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 |     "licenser.license": "MIT",
3 |     "licenser.author": "Robert Cronin"
4 | }


--------------------------------------------------------------------------------
/website/static/img/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/robert-cronin/kpa/HEAD/website/static/img/favicon.ico


--------------------------------------------------------------------------------
/requirements.txt:
--------------------------------------------------------------------------------
1 | openai==1.42.0
2 | Flask==3.0.3
3 | kubernetes==30.1.0
4 | pydantic==2.8.2
5 | Flask-SocketIO==5.3.6
6 | 


--------------------------------------------------------------------------------
/website/static/img/docusaurus.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/robert-cronin/kpa/HEAD/website/static/img/docusaurus.png


--------------------------------------------------------------------------------
/website/static/img/docusaurus-social-card.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/robert-cronin/kpa/HEAD/website/static/img/docusaurus-social-card.jpg


--------------------------------------------------------------------------------
/app/__init__.py:
--------------------------------------------------------------------------------
1 | # Copyright (c) 2024 Robert Cronin
2 | # 
3 | # This software is released under the MIT License.
4 | # https://opensource.org/licenses/MIT
5 | 
6 | 


--------------------------------------------------------------------------------
/app/api/__init__.py:
--------------------------------------------------------------------------------
1 | # Copyright (c) 2024 Robert Cronin
2 | # 
3 | # This software is released under the MIT License.
4 | # https://opensource.org/licenses/MIT
5 | 
6 | 


--------------------------------------------------------------------------------
/tests/__init__.py:
--------------------------------------------------------------------------------
1 | # Copyright (c) 2024 Robert Cronin
2 | # 
3 | # This software is released under the MIT License.
4 | # https://opensource.org/licenses/MIT
5 | 
6 | 


--------------------------------------------------------------------------------
/app/models/__init__.py:
--------------------------------------------------------------------------------
1 | # Copyright (c) 2024 Robert Cronin
2 | # 
3 | # This software is released under the MIT License.
4 | # https://opensource.org/licenses/MIT
5 | 
6 | 


--------------------------------------------------------------------------------
/app/services/__init__.py:
--------------------------------------------------------------------------------
1 | # Copyright (c) 2024 Robert Cronin
2 | # 
3 | # This software is released under the MIT License.
4 | # https://opensource.org/licenses/MIT
5 | 
6 | 


--------------------------------------------------------------------------------
/website/src/components/HomepageFeatures/styles.module.css:
--------------------------------------------------------------------------------
 1 | .features {
 2 |   display: flex;
 3 |   align-items: center;
 4 |   padding: 2rem 0;
 5 |   width: 100%;
 6 | }
 7 | 
 8 | .featureSvg {
 9 |   height: 200px;
10 |   width: 200px;
11 | }
12 | 


--------------------------------------------------------------------------------
/.vscode/launch.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "configurations": [
 3 |         {
 4 |             "name": "Python Debugger: Module",
 5 |             "type": "debugpy",
 6 |             "request": "launch",
 7 |             "module": "app.main"
 8 |         }
 9 |     ]
10 | }


--------------------------------------------------------------------------------
/website/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 |   // This file is not used in compilation. It is here just for a nice editor experience.
3 |   "extends": "@docusaurus/tsconfig",
4 |   "compilerOptions": {
5 |     "baseUrl": "."
6 |   },
7 |   "exclude": [".docusaurus", "build"]
8 | }
9 | 


--------------------------------------------------------------------------------
/Taskfile.yaml:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | # 
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | version: '3'
 7 | 
 8 | tasks:
 9 |   default:
10 |     cmds:
11 |       - task --list-all
12 |   
13 |   start:
14 |     cmds:
15 |       - python -m app.main


--------------------------------------------------------------------------------
/website/.gitignore:
--------------------------------------------------------------------------------
 1 | # Dependencies
 2 | /node_modules
 3 | 
 4 | # Production
 5 | /build
 6 | 
 7 | # Generated files
 8 | .docusaurus
 9 | .cache-loader
10 | 
11 | # Misc
12 | .DS_Store
13 | .env.local
14 | .env.development.local
15 | .env.test.local
16 | .env.production.local
17 | 
18 | npm-debug.log*
19 | yarn-debug.log*
20 | yarn-error.log*
21 | 


--------------------------------------------------------------------------------
/app/models/scenarios.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | # 
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | from dataclasses import dataclass
 7 | from typing import List
 8 | 
 9 | @dataclass
10 | class Scenario:
11 |     id: int
12 |     name: str
13 |     description: str
14 |     tasks: List[str]
15 |     validation: str


--------------------------------------------------------------------------------
/chart/Chart.yaml:
--------------------------------------------------------------------------------
 1 | apiVersion: v2
 2 | name: kpa
 3 | description: A simple tool to practice Kubernetes commands, for both new and experienced users.
 4 | type: application
 5 | version: 0.1.0
 6 | appVersion: "v0.1.0"
 7 | keywords:
 8 |   - kubernetes
 9 |   - openai
10 |   - practice
11 |   - ckad
12 |   - cka
13 | maintainers:
14 |   - name: Robert Cronin
15 |     email: robert@robertcronin.com
16 | 


--------------------------------------------------------------------------------
/chart/templates/service.yaml:
--------------------------------------------------------------------------------
 1 | apiVersion: v1
 2 | kind: Service
 3 | metadata:
 4 |   name: {{ include "chart.fullname" . }}
 5 |   labels:
 6 |     {{- include "chart.labels" . | nindent 4 }}
 7 | spec:
 8 |   type: {{ .Values.service.type }}
 9 |   ports:
10 |     - port: {{ .Values.service.port }}
11 |       targetPort: http
12 |       protocol: TCP
13 |       name: http
14 |   selector:
15 |     {{- include "chart.selectorLabels" . | nindent 4 }}


--------------------------------------------------------------------------------
/chart/.helmignore:
--------------------------------------------------------------------------------
 1 | # Patterns to ignore when building packages.
 2 | # This supports shell glob matching, relative path matching, and
 3 | # negation (prefixed with !). Only one pattern per line.
 4 | .DS_Store
 5 | # Common VCS dirs
 6 | .git/
 7 | .gitignore
 8 | .bzr/
 9 | .bzrignore
10 | .hg/
11 | .hgignore
12 | .svn/
13 | # Common backup files
14 | *.swp
15 | *.bak
16 | *.tmp
17 | *.orig
18 | *~
19 | # Various IDEs
20 | .project
21 | .idea/
22 | *.tmproj
23 | .vscode/
24 | 


--------------------------------------------------------------------------------
/chart/templates/tests/test-connection.yaml:
--------------------------------------------------------------------------------
 1 | apiVersion: v1
 2 | kind: Pod
 3 | metadata:
 4 |   name: "{{ include "chart.fullname" . }}-test-connection"
 5 |   labels:
 6 |     {{- include "chart.labels" . | nindent 4 }}
 7 |   annotations:
 8 |     "helm.sh/hook": test
 9 | spec:
10 |   containers:
11 |     - name: wget
12 |       image: busybox
13 |       command: ['wget']
14 |       args: ['{{ include "chart.fullname" . }}:{{ .Values.service.port }}']
15 |   restartPolicy: Never
16 | 


--------------------------------------------------------------------------------
/website/src/pages/index.module.css:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * CSS files with the .module.css suffix will be treated as CSS modules
 3 |  * and scoped locally.
 4 |  */
 5 | 
 6 | .heroBanner {
 7 |   padding: 4rem 0;
 8 |   text-align: center;
 9 |   position: relative;
10 |   overflow: hidden;
11 | }
12 | 
13 | @media screen and (max-width: 996px) {
14 |   .heroBanner {
15 |     padding: 2rem;
16 |   }
17 | }
18 | 
19 | .buttons {
20 |   display: flex;
21 |   align-items: center;
22 |   justify-content: center;
23 | }
24 | 


--------------------------------------------------------------------------------
/app/utils/logger.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | #
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | import logging
 7 | import sys
 8 | 
 9 | 
10 | def setup_logger():
11 |     logger = logging.getLogger('KPA')
12 |     logger.setLevel(logging.DEBUG)
13 | 
14 |     formatter = logging.Formatter(
15 |         '%(asctime)s - %(name)s - %(levelname)s - %(message)s')
16 | 
17 |     console_handler = logging.StreamHandler(sys.stdout)
18 |     console_handler.setFormatter(formatter)
19 |     logger.addHandler(console_handler)
20 | 
21 |     file_handler = logging.FileHandler('kpa.log')
22 |     file_handler.setFormatter(formatter)
23 |     logger.addHandler(file_handler)
24 | 
25 |     return logger
26 | 
27 | 
28 | logger = setup_logger()
29 | 


--------------------------------------------------------------------------------
/website/sidebars.ts:
--------------------------------------------------------------------------------
 1 | import type {SidebarsConfig} from '@docusaurus/plugin-content-docs';
 2 | 
 3 | // This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
 4 | 
 5 | /**
 6 |  * Creating a sidebar enables you to:
 7 |  - create an ordered group of docs
 8 |  - render a sidebar for each doc of that group
 9 |  - provide next/previous navigation
10 | 
11 |  The sidebars can be generated from the filesystem, or explicitly defined here.
12 | 
13 |  Create as many sidebars as you want.
14 |  */
15 | const sidebars: SidebarsConfig = {
16 |   // By default, Docusaurus generates a sidebar from the docs folder structure
17 |   tutorialSidebar: [{type: 'autogenerated', dirName: '.'}],
18 | 
19 |   // But you can create a sidebar manually
20 |   /*
21 |   tutorialSidebar: [
22 |     'intro',
23 |     'hello',
24 |     {
25 |       type: 'category',
26 |       label: 'Tutorial',
27 |       items: ['tutorial-basics/create-a-document'],
28 |     },
29 |   ],
30 |    */
31 | };
32 | 
33 | export default sidebars;
34 | 


--------------------------------------------------------------------------------
/app/services/kubectl.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | #
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | import subprocess
 7 | from app.utils.logger import logger
 8 | 
 9 | 
10 | class Executor:
11 |     def execute(self, command):
12 |         logger.info(f"Executing command: {command}")
13 |         args = command.split()
14 |         if not args or args[0] != "kubectl":
15 |             logger.error(f"Invalid kubectl command: {command}")
16 |             raise ValueError(f"Invalid kubectl command: {command}")
17 | 
18 |         try:
19 |             result = subprocess.run(
20 |                 args, capture_output=True, text=True, check=True)
21 |             logger.info(f"Command executed successfully: {command}")
22 |             return result.stdout
23 |         except subprocess.CalledProcessError as e:
24 |             logger.error(f"Command failed: {command}\nStderr: {e.stderr}")
25 |             raise Exception(f"Command failed: {e}\nStderr: {e.stderr}")
26 | 


--------------------------------------------------------------------------------
/chart/templates/NOTES.txt:
--------------------------------------------------------------------------------
 1 | Thank you for installing {{ .Chart.Name }}!
 2 | 
 3 | Your release is named {{ .Release.Name }}.
 4 | 
 5 | To access KubeMedic:
 6 | 
 7 | {{- if .Values.ingress.enabled }}
 8 | {{- range $host := .Values.ingress.hosts }}
 9 |   {{- range .paths }}
10 |   http{{ if $.Values.ingress.tls }}s{{ end }}://{{ $host.host }}{{ .path }}
11 |   {{- end }}
12 | {{- end }}
13 | {{- else }}
14 | Run this command to access KubeMedic locally:
15 | 
16 |   kubectl port-forward -n {{ .Release.Namespace }} svc/{{ include "chart.fullname" . }} {{ .Values.service.port }}:{{ .Values.service.port }}
17 | 
18 | Then open http://localhost:{{ .Values.service.port }} in your browser.
19 | {{- end }}
20 | 
21 | IMPORTANT: Make sure you've created a secret named '{{ .Values.openai.secretName }}' with your OpenAI API key.
22 | If you need to update it:
23 | 
24 |   kubectl create secret generic {{ .Values.openai.secretName }} \
25 |     --from-literal=OPENAI_API_KEY=<OPENAI_API_KEY> \
26 |     --dry-run=client -o yaml | kubectl apply -f -
27 | 
28 | For more information, check the KubeMedic documentation.


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2024 Robbie Cronin
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/website/src/css/custom.css:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Any CSS included here will be global. The classic template
 3 |  * bundles Infima by default. Infima is a CSS framework designed to
 4 |  * work well for content-centric websites.
 5 |  */
 6 | 
 7 | /* You can override the default Infima variables here. */
 8 | :root {
 9 |   --ifm-color-primary: #2e8555;
10 |   --ifm-color-primary-dark: #29784c;
11 |   --ifm-color-primary-darker: #277148;
12 |   --ifm-color-primary-darkest: #205d3b;
13 |   --ifm-color-primary-light: #33925d;
14 |   --ifm-color-primary-lighter: #359962;
15 |   --ifm-color-primary-lightest: #3cad6e;
16 |   --ifm-code-font-size: 95%;
17 |   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
18 | }
19 | 
20 | /* For readability concerns, you should choose a lighter palette in dark mode. */
21 | [data-theme='dark'] {
22 |   --ifm-color-primary: #25c2a0;
23 |   --ifm-color-primary-dark: #21af90;
24 |   --ifm-color-primary-darker: #1fa588;
25 |   --ifm-color-primary-darkest: #1a8870;
26 |   --ifm-color-primary-light: #29d5b0;
27 |   --ifm-color-primary-lighter: #32d8b4;
28 |   --ifm-color-primary-lightest: #4fddbf;
29 |   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
30 | }
31 | 


--------------------------------------------------------------------------------
/Dockerfile:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | # 
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | # ================ BUILD STAGE ================
 7 | FROM golang:1.22 as builder
 8 | 
 9 | ARG TARGETARCH
10 | 
11 | WORKDIR /app
12 | 
13 | COPY go.mod go.sum ./
14 | RUN go mod download
15 | 
16 | COPY . .
17 | RUN CGO_ENABLED=0 GOOS=linux GOARCH=$TARGETARCH go build -a -installsuffix cgo -o kpa .
18 | 
19 | # ================= KUBECTL STAGE =================
20 | FROM alpine:latest as kubectl
21 | 
22 | ARG TARGETARCH
23 | ARG KUBECTL_VERSION=v1.28.2
24 | 
25 | RUN apk add --no-cache curl
26 | 
27 | RUN curl -LO "https://dl.k8s.io/release/${KUBECTL_VERSION}/bin/linux/${TARGETARCH}/kubectl" && \
28 |     curl -LO "https://dl.k8s.io/${KUBECTL_VERSION}/bin/linux/${TARGETARCH}/kubectl.sha256" && \
29 |     echo "$(cat kubectl.sha256)  kubectl" | sha256sum -c && \
30 |     chmod +x kubectl
31 | 
32 | # ================ RUN STAGE ================
33 | FROM alpine:latest
34 | 
35 | ARG TARGETARCH
36 | 
37 | RUN apk add --no-cache ca-certificates
38 | 
39 | WORKDIR /root/
40 | 
41 | COPY --from=builder /app/kpa .
42 | COPY --from=kubectl /kubectl /usr/local/bin/
43 | 
44 | CMD ["./kpa"]


--------------------------------------------------------------------------------
/chart/templates/rbac.yaml:
--------------------------------------------------------------------------------
 1 | ---
 2 | apiVersion: v1
 3 | kind: ServiceAccount
 4 | metadata:
 5 |   name: {{ include "chart.serviceAccountName" . }}
 6 |   labels:
 7 |     {{- include "chart.labels" . | nindent 4 }}
 8 |   {{- with .Values.serviceAccount.annotations }}
 9 |   annotations:
10 |     {{- toYaml . | nindent 4 }}
11 |   {{- end }}
12 | ---
13 | apiVersion: rbac.authorization.k8s.io/v1
14 | kind: ClusterRole
15 | metadata:
16 |   name: {{ include "chart.fullname" . }}-role
17 |   labels:
18 |     {{- include "chart.labels" . | nindent 4 }}
19 | rules:
20 |   - apiGroups: [""]
21 |     resources: ["pods", "pods/log", "events"]
22 |     verbs: ["get", "list", "watch"]
23 |   - apiGroups: ["apps"]
24 |     resources: ["deployments", "replicasets"]
25 |     verbs: ["get", "list", "watch"]
26 | ---
27 | apiVersion: rbac.authorization.k8s.io/v1
28 | kind: ClusterRoleBinding
29 | metadata:
30 |   name: {{ include "chart.fullname" . }}-rolebinding
31 |   labels:
32 |     {{- include "chart.labels" . | nindent 4 }}
33 | roleRef:
34 |   apiGroup: rbac.authorization.k8s.io
35 |   kind: ClusterRole
36 |   name: {{ include "chart.fullname" . }}-role
37 | subjects:
38 |   - kind: ServiceAccount
39 |     name: {{ include "chart.serviceAccountName" . }}
40 |     namespace: {{ .Release.Namespace }}


--------------------------------------------------------------------------------
/chart/values.yaml:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | # 
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | replicaCount: 1
 7 | 
 8 | image:
 9 |   repository: ghcr.io/robert-cronin/kpa
10 |   pullPolicy: Always
11 |   tag: ""
12 | 
13 | imagePullSecrets: []
14 | nameOverride: ""
15 | fullnameOverride: ""
16 | 
17 | serviceAccount:
18 |   create: true
19 |   annotations: {}
20 |   name: ""
21 | 
22 | podAnnotations: {}
23 | 
24 | podSecurityContext: {}
25 | 
26 | securityContext: {}
27 | 
28 | service:
29 |   type: ClusterIP
30 |   port: 5000
31 | 
32 | ingress:
33 |   enabled: false
34 |   className: ""
35 |   annotations: {}
36 |   hosts:
37 |     - host: chart-example.local
38 |       paths:
39 |         - path: /
40 |           pathType: ImplementationSpecific
41 |   tls: []
42 | 
43 | resources:
44 |   limits:
45 |     cpu: 500m
46 |     memory: 512Mi
47 |   requests:
48 |     cpu: 250m
49 |     memory: 256Mi
50 | 
51 | autoscaling:
52 |   enabled: false
53 |   minReplicas: 1
54 |   maxReplicas: 3
55 |   targetCPUUtilizationPercentage: 80
56 | 
57 | nodeSelector: {}
58 | 
59 | tolerations: []
60 | 
61 | affinity: {}
62 | 
63 | openai:
64 |   secretName: ""
65 | 
66 | kubemedic:
67 |   debug: false
68 |   logLevel: "INFO"
69 | 


--------------------------------------------------------------------------------
/website/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "website",
 3 |   "version": "0.0.0",
 4 |   "private": true,
 5 |   "scripts": {
 6 |     "docusaurus": "docusaurus",
 7 |     "start": "docusaurus start",
 8 |     "build": "docusaurus build",
 9 |     "swizzle": "docusaurus swizzle",
10 |     "deploy": "docusaurus deploy",
11 |     "clear": "docusaurus clear",
12 |     "serve": "docusaurus serve",
13 |     "write-translations": "docusaurus write-translations",
14 |     "write-heading-ids": "docusaurus write-heading-ids",
15 |     "typecheck": "tsc"
16 |   },
17 |   "dependencies": {
18 |     "@docusaurus/core": "3.8.1",
19 |     "@docusaurus/preset-classic": "3.8.1",
20 |     "@mdx-js/react": "^3.0.0",
21 |     "clsx": "^2.0.0",
22 |     "prism-react-renderer": "^2.3.0",
23 |     "react": "^19.0.0",
24 |     "react-dom": "^19.0.0"
25 |   },
26 |   "devDependencies": {
27 |     "@docusaurus/module-type-aliases": "3.8.1",
28 |     "@docusaurus/tsconfig": "3.8.1",
29 |     "@docusaurus/types": "3.8.1",
30 |     "typescript": "~5.6.2"
31 |   },
32 |   "browserslist": {
33 |     "production": [
34 |       ">0.5%",
35 |       "not dead",
36 |       "not op_mini all"
37 |     ],
38 |     "development": [
39 |       "last 3 chrome version",
40 |       "last 3 firefox version",
41 |       "last 5 safari version"
42 |     ]
43 |   },
44 |   "engines": {
45 |     "node": ">=18.0"
46 |   }
47 | }
48 | 


--------------------------------------------------------------------------------
/.github/workflows/deploy-docs.yml:
--------------------------------------------------------------------------------
 1 | name: Deploy Docs to GitHub Pages
 2 | 
 3 | on:
 4 |   push:
 5 |     branches:
 6 |       - main
 7 |     paths:
 8 |       - 'website/**'
 9 |   workflow_dispatch:
10 | 
11 | permissions:
12 |   contents: read
13 |   pages: write
14 |   id-token: write
15 | 
16 | concurrency:
17 |   group: "pages"
18 |   cancel-in-progress: false
19 | 
20 | jobs:
21 |   build:
22 |     runs-on: ubuntu-latest
23 |     steps:
24 |       - name: Checkout
25 |         uses: actions/checkout@v4
26 | 
27 |       - name: Setup Node.js
28 |         uses: actions/setup-node@v4
29 |         with:
30 |           node-version: '20'
31 |           cache: 'npm'
32 |           cache-dependency-path: website/package-lock.json
33 | 
34 |       - name: Install dependencies
35 |         run: |
36 |           cd website
37 |           npm ci
38 | 
39 |       - name: Build website
40 |         run: |
41 |           cd website
42 |           npm run build
43 | 
44 |       - name: Setup Pages
45 |         uses: actions/configure-pages@v4
46 | 
47 |       - name: Upload artifact
48 |         uses: actions/upload-pages-artifact@v3
49 |         with:
50 |           path: website/build
51 | 
52 |   deploy:
53 |     environment:
54 |       name: github-pages
55 |       url: ${{ steps.deployment.outputs.page_url }}
56 |     runs-on: ubuntu-latest
57 |     needs: build
58 |     steps:
59 |       - name: Deploy to GitHub Pages
60 |         id: deployment
61 |         uses: actions/deploy-pages@v4


--------------------------------------------------------------------------------
/app/web/templates/scenario_select.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="UTF-8" />
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6 |     <title>KPA - Select Scenario</title>
 7 |     <link rel="stylesheet" href="/static/css/styles.css" />
 8 |     <link rel="icon" href="/static/favicon.ico" type="image/x-icon" />
 9 |   </head>
10 |   <body>
11 |     <div class="container">
12 |       <h1>Kubernetes Practice Assistant</h1>
13 |       <div id="scenario-input">
14 |         <h2>Generate Scenarios</h2>
15 |         <textarea
16 |           id="scenario-prompt"
17 |           placeholder="Describe the type of Kubernetes scenario you want to practice..."
18 |         ></textarea>
19 |         <div class="button-group">
20 |           <button id="generate-scenarios">Generate Scenarios</button>
21 |           <button
22 |             id="feeling-lucky"
23 |             title="Let the AI generate scenarios randomly"
24 |           >
25 |             I'm feeling (p)lucky
26 |           </button>
27 |         </div>
28 |       </div>
29 |       <div id="scenario-list"></div>
30 |     </div>
31 |     <script src="/static/js/scenario_select.js" type="module"></script>
32 |     <script>
33 |       // Ensure selectScenario is available in the global scope
34 |       window.selectScenario = function (id) {
35 |         window.location.href = `/scenario?id=${id}`;
36 |       };
37 |     </script>
38 |   </body>
39 | </html>
40 | 


--------------------------------------------------------------------------------
/website/src/pages/index.tsx:
--------------------------------------------------------------------------------
 1 | import type {ReactNode} from 'react';
 2 | import clsx from 'clsx';
 3 | import Link from '@docusaurus/Link';
 4 | import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 5 | import Layout from '@theme/Layout';
 6 | import HomepageFeatures from '@site/src/components/HomepageFeatures';
 7 | import Heading from '@theme/Heading';
 8 | 
 9 | import styles from './index.module.css';
10 | 
11 | function HomepageHeader() {
12 |   const {siteConfig} = useDocusaurusContext();
13 |   return (
14 |     <header className={clsx('hero hero--primary', styles.heroBanner)}>
15 |       <div className="container">
16 |         <Heading as="h1" className="hero__title">
17 |           {siteConfig.title}
18 |         </Heading>
19 |         <p className="hero__subtitle">{siteConfig.tagline}</p>
20 |         <div className={styles.buttons}>
21 |           <Link
22 |             className="button button--secondary button--lg"
23 |             to="/docs/intro">
24 |             Get Started with KPA →
25 |           </Link>
26 |         </div>
27 |       </div>
28 |     </header>
29 |   );
30 | }
31 | 
32 | export default function Home(): ReactNode {
33 |   const {siteConfig} = useDocusaurusContext();
34 |   return (
35 |     <Layout
36 |       title={`${siteConfig.title} - Interactive Kubernetes Learning`}
37 |       description="Master Kubernetes with hands-on practice scenarios and AI-powered guidance. Perfect for CKA/CKAD exam preparation.">
38 |       <HomepageHeader />
39 |       <main>
40 |         <HomepageFeatures />
41 |       </main>
42 |     </Layout>
43 |   );
44 | }
45 | 


--------------------------------------------------------------------------------
/app/web/templates/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="UTF-8" />
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 6 |     <title>Kubernetes Practice Assistant</title>
 7 |     <link rel="stylesheet" href="/static/css/styles.css" />
 8 |     <link
 9 |       rel="stylesheet"
10 |       href="https://cdnjs.cloudflare.com/ajax/libs/xterm/3.14.5/xterm.min.css"
11 |     />
12 |   </head>
13 |   <body>
14 |     <div class="container">
15 |       <h1 id="scenario-title">Scenario Title</h1>
16 |       <div class="main-content">
17 |         <div class="left-panel">
18 |           <div id="terminal"></div>
19 |         </div>
20 |         <div class="right-panel">
21 |           <div class="scenario-details">
22 |             <h2>Description:</h2>
23 |             <p id="scenario-description">
24 |               Scenario description will appear here.
25 |             </p>
26 |             <h2>Tasks:</h2>
27 |             <ol id="task-list"></ol>
28 |             <button id="check-button">Check Progress</button>
29 |             <pre id="check-output"></pre>
30 |           </div>
31 |           <div class="chat-panel">
32 |             <div id="chat-messages"></div>
33 |             <div class="chat-input">
34 |               <textarea
35 |                 id="user-input"
36 |                 placeholder="Ask for help or clarification"
37 |               ></textarea>
38 |               <button id="send-button">Send</button>
39 |             </div>
40 |           </div>
41 |         </div>
42 |       </div>
43 |     </div>
44 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/xterm/3.14.5/xterm.min.js"></script>
45 |     <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.min.js"></script>
46 |     <script src="/static/js/main.js"></script>
47 |   </body>
48 | </html>
49 | 


--------------------------------------------------------------------------------
/chart/templates/_helpers.tpl:
--------------------------------------------------------------------------------
 1 | {{/*
 2 | Expand the name of the chart.
 3 | */}}
 4 | {{- define "chart.name" -}}
 5 | {{- default .Chart.Name .Values.nameOverride | trunc 63 | trimSuffix "-" }}
 6 | {{- end }}
 7 | 
 8 | {{/*
 9 | Create a default fully qualified app name.
10 | We truncate at 63 chars because some Kubernetes name fields are limited to this (by the DNS naming spec).
11 | If release name contains chart name it will be used as a full name.
12 | */}}
13 | {{- define "chart.fullname" -}}
14 | {{- if .Values.fullnameOverride }}
15 | {{- .Values.fullnameOverride | trunc 63 | trimSuffix "-" }}
16 | {{- else }}
17 | {{- $name := default .Chart.Name .Values.nameOverride }}
18 | {{- if contains $name .Release.Name }}
19 | {{- .Release.Name | trunc 63 | trimSuffix "-" }}
20 | {{- else }}
21 | {{- printf "%s-%s" .Release.Name $name | trunc 63 | trimSuffix "-" }}
22 | {{- end }}
23 | {{- end }}
24 | {{- end }}
25 | 
26 | {{/*
27 | Create chart name and version as used by the chart label.
28 | */}}
29 | {{- define "chart.chart" -}}
30 | {{- printf "%s-%s" .Chart.Name .Chart.Version | replace "+" "_" | trunc 63 | trimSuffix "-" }}
31 | {{- end }}
32 | 
33 | {{/*
34 | Common labels
35 | */}}
36 | {{- define "chart.labels" -}}
37 | helm.sh/chart: {{ include "chart.chart" . }}
38 | {{ include "chart.selectorLabels" . }}
39 | {{- if .Chart.AppVersion }}
40 | app.kubernetes.io/version: {{ .Chart.AppVersion | quote }}
41 | {{- end }}
42 | app.kubernetes.io/managed-by: {{ .Release.Service }}
43 | {{- end }}
44 | 
45 | {{/*
46 | Selector labels
47 | */}}
48 | {{- define "chart.selectorLabels" -}}
49 | app.kubernetes.io/name: {{ include "chart.name" . }}
50 | app.kubernetes.io/instance: {{ .Release.Name }}
51 | {{- end }}
52 | 
53 | {{/*
54 | Create the name of the service account to use
55 | */}}
56 | {{- define "chart.serviceAccountName" -}}
57 | {{- if .Values.serviceAccount.create }}
58 | {{- default (include "chart.fullname" .) .Values.serviceAccount.name }}
59 | {{- else }}
60 | {{- default "default" .Values.serviceAccount.name }}
61 | {{- end }}
62 | {{- end }}
63 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Kubernetes Practice Assistant (KPA)
 2 | 
 3 | ![KPA](docs/kpa.png)
 4 | 
 5 | The Kubernetes Practice Assistant (KPA) is a simple tool designed to help you prepare for Kubernetes certifications and improve your practical skills. 
 6 | 
 7 | Key features:
 8 | - Interactive practice environment for Kubernetes
 9 | - AI-powered assistant to guide your learning
10 | - Flexible scenarios to test various skill levels
11 | - Open-ended practice sessions to fit your schedule
12 | 
13 | Whether you're studying for a certification or just want to sharpen your Kubernetes skills, KPA provides a hands-on, adaptable practice experience.
14 | 
15 | ## Why KPA?
16 | 
17 | Kubernetes certifications are heavily focused on practical skills, and the best way to learn Kubernetes is by doing. KPA was created with this principle in mind, offering a sandbox environment where you can experiment, make mistakes, and learn from hands-on experience. By combining real Kubernetes interactions with AI-guided assistance, KPA aims to bridge the gap between theory and practice, helping you build the confidence and skills needed for both certifications and real-world Kubernetes management.
18 | 
19 | # Development Roadmap
20 | 
21 | The KPA project is currently in the early stages of development. The following features are planned for future releases:
22 | - [x] Have GPT4o mini create a few scenarios to choose from based on a simple initial prompt
23 | - [x] Store scenarios in a sqlite database
24 | - [x] Add terminal to scenario page and have it connect to backend via ws
25 | - [ ] Simple interface with the chosen scenario created on the left and a chat window on the right
26 |     - [ ] The left pane will house the task description as well as a "Check" button
27 | - [ ] Ability to have GPT4o mini provide hints and guidance based on user input
28 | - [ ] Agent flow to check if the user has completed the scenario
29 | - [ ] Helm chart to deploy the KPA application on a Kubernetes cluster
30 | 
31 | # License
32 | 
33 | This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.


--------------------------------------------------------------------------------
/website/docs/intro.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | sidebar_position: 1
 3 | title: Getting Started
 4 | ---
 5 | 
 6 | # Getting Started with Kubernetes Practice Assistant
 7 | 
 8 | Welcome to the Kubernetes Practice Assistant (KPA) - an interactive learning environment designed to help you master Kubernetes through hands-on practice and AI-powered guidance.
 9 | 
10 | ## What is KPA?
11 | 
12 | KPA is a web-based application that provides:
13 | 
14 | - 🎯 **Interactive scenarios** for Kubernetes practice
15 | - 🤖 **AI-powered assistance** to guide you through challenges
16 | - 💻 **Web-based terminal** with kubectl access
17 | - 📚 **Structured learning paths** for CKA/CKAD preparation
18 | - 🔄 **Real-time feedback** on your commands and progress
19 | 
20 | ## Prerequisites
21 | 
22 | Before you begin, ensure you have:
23 | 
24 | - Python 3.8 or higher
25 | - pip (Python package manager)
26 | - A Kubernetes cluster (optional - can run locally with kind/minikube)
27 | - An OpenAI API key (for AI assistance features)
28 | 
29 | ## Quick Start
30 | 
31 | ### 1. Clone the Repository
32 | 
33 | ```bash
34 | git clone https://github.com/robert-cronin/kpa.git
35 | cd kpa
36 | ```
37 | 
38 | ### 2. Install Dependencies
39 | 
40 | ```bash
41 | pip install -r requirements.txt
42 | ```
43 | 
44 | ### 3. Set Up Environment Variables
45 | 
46 | Create a `.env` file in the project root:
47 | 
48 | ```bash
49 | OPENAI_API_KEY=your-openai-api-key-here
50 | ```
51 | 
52 | ### 4. Run the Application
53 | 
54 | You can start KPA using either method:
55 | 
56 | ```bash
57 | # Method 1: Direct Python execution
58 | python -m app.main
59 | 
60 | # Method 2: Using the task runner
61 | task start
62 | ```
63 | 
64 | The application will start on `http://localhost:8080`
65 | 
66 | ## Next Steps
67 | 
68 | - [Installation Guide](./installation) - Detailed setup instructions
69 | - [Usage Guide](./usage) - Learn how to use KPA effectively
70 | 
71 | ## Getting Help
72 | 
73 | If you encounter any issues:
74 | 
75 | 1. Check the documentation
76 | 2. Open an issue on [GitHub](https://github.com/robert-cronin/kpa/issues)
77 | 
78 | Happy learning! 🚀
79 | 


--------------------------------------------------------------------------------
/app/main.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | #
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | from flask import Flask, render_template
 7 | from app.api.routes import setup_routes
 8 | from app.services.db import init_db
 9 | from app.services.ai import ChatHandler
10 | from app.services.kubectl import Executor
11 | from app.utils.logger import logger
12 | from app.websocket import init_socketio
13 | import os
14 | 
15 | 
16 | def create_app():
17 |     curr_dir = os.path.dirname(os.path.realpath(__file__))
18 |     app = Flask(__name__,
19 |                 template_folder=os.path.join(curr_dir, 'web/templates'),
20 |                 static_folder=os.path.join(curr_dir, 'web/static'))
21 | 
22 |     # Initialize database
23 |     logger.info("Initializing database")
24 |     init_db('kpa.db')
25 |     logger.info("Database initialized successfully")
26 | 
27 |     # Initialize services
28 |     logger.info("Initializing services")
29 |     kubectl_executor = Executor()
30 |     ai_chat = ChatHandler(kubectl_executor)
31 |     logger.info("Services initialized successfully")
32 | 
33 |     # Setup routes
34 |     logger.info("Setting up routes")
35 |     setup_routes(app, kubectl_executor, ai_chat)
36 |     logger.info("Routes set up successfully")
37 | 
38 |     # Initialize SocketIO
39 |     logger.info("Initializing SocketIO")
40 |     init_socketio(app)
41 |     logger.info("SocketIO initialized successfully")
42 | 
43 |     @app.route('/')
44 |     def scenario_select():
45 |         logger.info("Rendering scenario_select.html")
46 |         return render_template('scenario_select.html')
47 | 
48 |     @app.route('/scenario/<int:id>')
49 |     def scenario(id):
50 |         logger.info(f"Rendering index.html for scenario id: {id}")
51 |         return render_template('index.html')
52 | 
53 |     return app
54 | 
55 | 
56 | if __name__ == '__main__':
57 |     logger.info("Starting application")
58 |     app = create_app()
59 |     from app.websocket import socketio
60 |     socketio.run(app, debug=True, port=8080)
61 |     logger.info("Application started successfully")
62 | 


--------------------------------------------------------------------------------
/website/src/components/HomepageFeatures/index.tsx:
--------------------------------------------------------------------------------
 1 | import type {ReactNode} from 'react';
 2 | import clsx from 'clsx';
 3 | import Heading from '@theme/Heading';
 4 | import styles from './styles.module.css';
 5 | 
 6 | type FeatureItem = {
 7 |   title: string;
 8 |   Svg: React.ComponentType<React.ComponentProps<'svg'>>;
 9 |   description: ReactNode;
10 | };
11 | 
12 | const FeatureList: FeatureItem[] = [
13 |   {
14 |     title: 'Interactive Learning',
15 |     Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default,
16 |     description: (
17 |       <>
18 |         Practice Kubernetes commands in a real web-based terminal. Execute kubectl 
19 |         commands, manage resources, and learn by doing in a safe environment.
20 |       </>
21 |     ),
22 |   },
23 |   {
24 |     title: 'AI-Powered Assistance',
25 |     Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default,
26 |     description: (
27 |       <>
28 |         Get intelligent hints and guidance from our AI assistant. Learn best practices,
29 |         debug issues, and understand complex concepts with contextual help.
30 |       </>
31 |     ),
32 |   },
33 |   {
34 |     title: 'Exam-Ready Scenarios',
35 |     Svg: require('@site/static/img/undraw_docusaurus_react.svg').default,
36 |     description: (
37 |       <>
38 |         Prepare for CKA/CKAD certifications with real-world scenarios. Track your
39 |         progress, practice under time constraints, and build confidence.
40 |       </>
41 |     ),
42 |   },
43 | ];
44 | 
45 | function Feature({title, Svg, description}: FeatureItem) {
46 |   return (
47 |     <div className={clsx('col col--4')}>
48 |       <div className="text--center">
49 |         <Svg className={styles.featureSvg} role="img" />
50 |       </div>
51 |       <div className="text--center padding-horiz--md">
52 |         <Heading as="h3">{title}</Heading>
53 |         <p>{description}</p>
54 |       </div>
55 |     </div>
56 |   );
57 | }
58 | 
59 | export default function HomepageFeatures(): ReactNode {
60 |   return (
61 |     <section className={styles.features}>
62 |       <div className="container">
63 |         <div className="row">
64 |           {FeatureList.map((props, idx) => (
65 |             <Feature key={idx} {...props} />
66 |           ))}
67 |         </div>
68 |       </div>
69 |     </section>
70 |   );
71 | }
72 | 


--------------------------------------------------------------------------------
/chart/templates/deployment.yaml:
--------------------------------------------------------------------------------
 1 | apiVersion: apps/v1
 2 | kind: Deployment
 3 | metadata:
 4 |   name: {{ include "chart.fullname" . }}
 5 |   labels:
 6 |     {{- include "chart.labels" . | nindent 4 }}
 7 | spec:
 8 |   {{- if not .Values.autoscaling.enabled }}
 9 |   replicas: {{ .Values.replicaCount }}
10 |   {{- end }}
11 |   selector:
12 |     matchLabels:
13 |       {{- include "chart.selectorLabels" . | nindent 6 }}
14 |   template:
15 |     metadata:
16 |       {{- with .Values.podAnnotations }}
17 |       annotations:
18 |         {{- toYaml . | nindent 8 }}
19 |       {{- end }}
20 |       labels:
21 |         {{- include "chart.selectorLabels" . | nindent 8 }}
22 |     spec:
23 |       {{- with .Values.imagePullSecrets }}
24 |       imagePullSecrets:
25 |         {{- toYaml . | nindent 8 }}
26 |       {{- end }}
27 |       serviceAccountName: {{ include "chart.serviceAccountName" . }}
28 |       securityContext:
29 |         {{- toYaml .Values.podSecurityContext | nindent 8 }}
30 |       containers:
31 |         - name: {{ .Chart.Name }}
32 |           securityContext:
33 |             {{- toYaml .Values.securityContext | nindent 12 }}
34 |           image: "{{ .Values.image.repository }}:{{ .Values.image.tag | default .Chart.AppVersion }}"
35 |           imagePullPolicy: {{ .Values.image.pullPolicy }}
36 |           ports:
37 |             - name: http
38 |               containerPort: {{ .Values.service.port }}
39 |               protocol: TCP
40 |           livenessProbe:
41 |             httpGet:
42 |               path: /
43 |               port: http
44 |           readinessProbe:
45 |             httpGet:
46 |               path: /
47 |               port: http
48 |           resources:
49 |             {{- toYaml .Values.resources | nindent 12 }}
50 |           env:
51 |             - name: OPENAI_API_KEY
52 |               valueFrom:
53 |                 secretKeyRef:
54 |                   name: {{ .Values.openai.secretName | default "openai-api-key" }}
55 |                   key: OPENAI_API_KEY
56 |             - name: DEBUG_MODE
57 |               value: {{ .Values.kubemedic.debug | quote }}
58 |             - name: LOG_LEVEL
59 |               value: {{ .Values.kubemedic.logLevel }}
60 |       {{- with .Values.nodeSelector }}
61 |       nodeSelector:
62 |         {{- toYaml . | nindent 8 }}
63 |       {{- end }}
64 |       {{- with .Values.affinity }}
65 |       affinity:
66 |         {{- toYaml . | nindent 8 }}
67 |       {{- end }}
68 |       {{- with .Values.tolerations }}
69 |       tolerations:
70 |         {{- toYaml . | nindent 8 }}
71 |       {{- end }}


--------------------------------------------------------------------------------
/website/README.md:
--------------------------------------------------------------------------------
 1 | # KPA Documentation Website
 2 | 
 3 | This folder contains the Docusaurus-based documentation website for the Kubernetes Practice Assistant (KPA).
 4 | 
 5 | ## Quick Start
 6 | 
 7 | ### Development
 8 | 
 9 | ```bash
10 | # Install dependencies
11 | npm install
12 | 
13 | # Start development server
14 | npm start
15 | ```
16 | 
17 | The site will be available at `http://localhost:3000`
18 | 
19 | ### Build
20 | 
21 | ```bash
22 | # Build static files
23 | npm run build
24 | 
25 | # Test production build locally
26 | npm run serve
27 | ```
28 | 
29 | ## Deployment
30 | 
31 | The website is automatically deployed to GitHub Pages when changes are pushed to the main branch. The deployment is handled by the GitHub Actions workflow at `.github/workflows/deploy-docs.yml`.
32 | 
33 | ### Before Deploying
34 | 
35 | 1. Update `docusaurus.config.ts` with your GitHub username:
36 |    - Replace `your-github-username` with your actual GitHub username
37 |    - Update the `url` if using a custom domain
38 | 
39 | 2. Enable GitHub Pages in your repository settings:
40 |    - Go to Settings → Pages
41 |    - Select "GitHub Actions" as the source
42 | 
43 | ### Manual Deployment
44 | 
45 | If you need to deploy manually:
46 | 
47 | ```bash
48 | # Deploy using SSH
49 | USE_SSH=true npm run deploy
50 | 
51 | # Or using HTTPS
52 | GIT_USER=<Your GitHub username> npm run deploy
53 | ```
54 | 
55 | ## Project Structure
56 | 
57 | ```
58 | website/
59 | ├── docs/                 # Documentation pages
60 | │   ├── intro.md         # Getting started guide
61 | │   ├── installation.md  # Installation instructions
62 | │   ├── usage.md         # Usage guide
63 | │   └── deployment.md    # Deployment instructions
64 | ├── src/
65 | │   ├── components/      # React components
66 | │   ├── css/            # Custom styles
67 | │   └── pages/          # Additional pages
68 | ├── static/             # Static assets
69 | ├── docusaurus.config.ts # Main configuration
70 | └── sidebars.ts         # Sidebar configuration
71 | ```
72 | 
73 | ## Adding Documentation
74 | 
75 | 1. Create new markdown files in the `docs/` directory
76 | 2. Add frontmatter for metadata:
77 |    ```markdown
78 |    ---
79 |    sidebar_position: 5
80 |    title: Your Page Title
81 |    ---
82 |    ```
83 | 3. The sidebar will automatically include new pages
84 | 
85 | ## Customization
86 | 
87 | - **Theme**: Edit `src/css/custom.css` for styling
88 | - **Configuration**: Update `docusaurus.config.ts`
89 | - **Homepage**: Modify `src/pages/index.tsx`
90 | - **Features**: Edit `src/components/HomepageFeatures/index.tsx`
91 | 
92 | ## Learn More
93 | 
94 | - [Docusaurus Documentation](https://docusaurus.io/)
95 | - [GitHub Pages Documentation](https://docs.github.com/en/pages)
96 | 


--------------------------------------------------------------------------------
/app/websocket.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | #
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | import subprocess
 7 | import json
 8 | import os
 9 | from flask_socketio import SocketIO, emit
10 | from app.utils.logger import logger
11 | 
12 | socketio = SocketIO()
13 | 
14 | 
15 | @socketio.on('connect')
16 | def handle_connect():
17 |     logger.info('Client connected')
18 | 
19 | 
20 | @socketio.on('disconnect')
21 | def handle_disconnect():
22 |     logger.info('Client disconnected')
23 | 
24 | 
25 | @socketio.on('input')
26 | def handle_input(data):
27 |     logger.info(f'Received input: {data}')
28 |     try:
29 |         if data.strip().lower() == 'exit':
30 |             emit('output', json.dumps(
31 |                 {'type': 'text', 'content': 'Goodbye!\r\n'}))
32 |             return
33 | 
34 |         command = data.split()[0]
35 |         if command == 'ls':
36 |             output = handle_ls_command(data)
37 |         elif command == 'cd':
38 |             output = handle_cd_command(data)
39 |         elif command == 'pwd':
40 |             output = handle_pwd_command()
41 |         else:
42 |             output = run_command(data)
43 | 
44 |         emit('output', json.dumps(output))
45 |     except Exception as e:
46 |         logger.error(f"Error executing command: {e}")
47 |         emit('output', json.dumps(
48 |             {'type': 'error', 'content': f"Error: {str(e)}\r\n"}))
49 | 
50 | 
51 | def run_command(command):
52 |     process = subprocess.Popen(
53 |         command,
54 |         shell=True,
55 |         stdout=subprocess.PIPE,
56 |         stderr=subprocess.PIPE,
57 |         text=True
58 |     )
59 |     stdout, stderr = process.communicate()
60 | 
61 |     if stderr:
62 |         return {'type': 'error', 'content': stderr}
63 |     return {'type': 'text', 'content': stdout}
64 | 
65 | 
66 | def handle_ls_command(command):
67 |     try:
68 |         output = subprocess.check_output(command, shell=True, text=True)
69 |         files = output.strip().split('\n')
70 |         return {'type': 'ls', 'content': files}
71 |     except subprocess.CalledProcessError as e:
72 |         return {'type': 'error', 'content': str(e)}
73 | 
74 | 
75 | def handle_cd_command(command):
76 |     try:
77 |         path = command.split(maxsplit=1)[1] if len(
78 |             command.split()) > 1 else '~'
79 |         os.chdir(os.path.expanduser(path))
80 |         return {'type': 'text', 'content': ''}
81 |     except FileNotFoundError:
82 |         return {'type': 'error', 'content': f"cd: no such file or directory: {path}\n"}
83 |     except Exception as e:
84 |         return {'type': 'error', 'content': str(e)}
85 | 
86 | 
87 | def handle_pwd_command():
88 |     return {'type': 'text', 'content': f"{os.getcwd()}\n"}
89 | 
90 | 
91 | def init_socketio(app):
92 |     socketio.init_app(app)
93 | 


--------------------------------------------------------------------------------
/app/api/handlers.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | #
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | import json
 7 | from flask import jsonify, request
 8 | from app.services import db, ai
 9 | from app.utils.logger import logger
10 | 
11 | 
12 | class Handler:
13 |     def __init__(self, kubectl_executor, ai_chat):
14 |         self.kubectl_executor = kubectl_executor
15 |         self.ai_chat = ai_chat
16 | 
17 |     def handle_generate_scenarios(self):
18 |         logger.info("Generating scenarios")
19 |         data = request.json
20 |         prompt = data.get('prompt', '')
21 | 
22 |         try:
23 |             generated_scenarios = self.ai_chat.generate_scenarios(prompt)
24 |             stored_scenarios = []
25 | 
26 |             for scenario in generated_scenarios.scenarios:
27 |                 scenario_dict = scenario.dict()
28 |                 id = db.store_scenario(scenario_dict)
29 |                 stored_scenarios.append({
30 |                     'id': id,
31 |                     'title': scenario_dict['title'],
32 |                     'description': scenario_dict['description']
33 |                 })
34 | 
35 |             logger.info("Scenarios generated and stored successfully")
36 |             return jsonify(stored_scenarios)
37 |         except Exception as e:
38 |             logger.error(f"Error generating scenarios: {e}")
39 |             return jsonify({"error": "Failed to generate scenarios"}), 500
40 | 
41 |     def get_all_scenarios(self):
42 |         logger.info("Fetching all scenarios")
43 |         try:
44 |             scenarios = db.get_all_scenarios()
45 |             logger.info("All scenarios fetched successfully")
46 |             return jsonify(scenarios)
47 |         except Exception as e:
48 |             logger.error(f"Error fetching all scenarios: {e}")
49 |             return jsonify({"error": "Failed to fetch scenarios"}), 500
50 | 
51 |     def handle_get_scenario(self, id):
52 |         logger.info(f"Fetching scenario with id: {id}")
53 |         try:
54 |             scenario = db.get_scenario(id)
55 |             if scenario:
56 |                 logger.info(f"Scenario with id {id} fetched successfully")
57 |                 return jsonify(scenario)
58 |             logger.warning(f"Scenario with id {id} not found")
59 |             return jsonify({'error': 'Scenario not found'}), 404
60 |         except Exception as e:
61 |             logger.error(f"Error fetching scenario with id {id}: {e}")
62 |             return jsonify({"error": "Failed to fetch scenario"}), 500
63 | 
64 |     def handle_validate(self, id):
65 |         logger.info(f"Validating scenario with id: {id}")
66 |         try:
67 |             # Implementation for validating a scenario
68 |             pass
69 |         except Exception as e:
70 |             logger.error(f"Error validating scenario with id {id}: {e}")
71 |             return jsonify({"error": "Failed to validate scenario"}), 500
72 | 
73 |     def handle_ai_chat(self):
74 |         logger.info("Handling AI chat request")
75 |         data = request.json
76 |         message = data.get('message')
77 |         scenario_id = data.get('scenarioId')
78 | 
79 |         try:
80 |             response = self.ai_chat.generate_response(message, scenario_id)
81 |             logger.info("AI chat response generated successfully")
82 |             return jsonify({'response': response})
83 |         except Exception as e:
84 |             logger.error(f"Error handling AI chat request: {e}")
85 |             return jsonify({"error": "Failed to handle AI chat request"}), 500
86 | 


--------------------------------------------------------------------------------
/app/api/routes.py:
--------------------------------------------------------------------------------
 1 | # Copyright (c) 2024 Robert Cronin
 2 | #
 3 | # This software is released under the MIT License.
 4 | # https://opensource.org/licenses/MIT
 5 | 
 6 | from flask import jsonify, request
 7 | from app.services import db
 8 | from app.api.handlers import Handler
 9 | from app.utils.logger import logger
10 | 
11 | 
12 | def setup_routes(app, kubectl_executor, ai_chat):
13 |     handler = Handler(kubectl_executor, ai_chat)
14 | 
15 |     @app.route('/api/scenarios/<int:id>', methods=['GET'])
16 |     def get_scenario(id):
17 |         logger.info(f"Fetching scenario with id: {id}")
18 |         try:
19 |             response = handler.handle_get_scenario(id)
20 |             logger.info(f"Scenario with id {id} fetched successfully")
21 |             return response
22 |         except Exception as e:
23 |             logger.error(f"Error fetching scenario with id {id}: {e}")
24 |             return jsonify({"error": "Failed to fetch scenario"}), 500
25 | 
26 |     @app.route('/api/scenarios/<int:id>/validate', methods=['POST'])
27 |     def validate_scenario(id):
28 |         logger.info(f"Validating scenario with id: {id}")
29 |         try:
30 |             response = handler.handle_validate(id)
31 |             logger.info(f"Scenario with id {id} validated successfully")
32 |             return response
33 |         except Exception as e:
34 |             logger.error(f"Error validating scenario with id {id}: {e}")
35 |             return jsonify({"error": "Failed to validate scenario"}), 500
36 | 
37 |     @app.route('/api/ai-chat', methods=['POST'])
38 |     def ai_chat():
39 |         logger.info("Received AI chat request")
40 |         try:
41 |             response = handler.handle_ai_chat()
42 |             logger.info("AI chat request handled successfully")
43 |             return response
44 |         except Exception as e:
45 |             logger.error(f"Error handling AI chat request: {e}")
46 |             return jsonify({"error": "Failed to handle AI chat request"}), 500
47 | 
48 |     @app.route('/api/generate-scenarios', methods=['POST'])
49 |     def generate_scenarios():
50 |         logger.info("Generating scenarios")
51 |         try:
52 |             response = handler.handle_generate_scenarios()
53 |             logger.info("Scenarios generated successfully")
54 |             return response
55 |         except Exception as e:
56 |             logger.error(f"Error generating scenarios: {e}")
57 |             return jsonify({"error": "Failed to generate scenarios"}), 500
58 | 
59 |     @app.route('/api/scenarios', methods=['GET'])
60 |     def get_scenarios():
61 |         logger.info("Fetching all scenarios")
62 |         try:
63 |             scenarios = db.get_all_scenarios()
64 |             logger.info("All scenarios fetched successfully")
65 |             return jsonify(scenarios)
66 |         except Exception as e:
67 |             logger.error(f"Error fetching all scenarios: {e}")
68 |             return jsonify({"error": "Failed to fetch scenarios"}), 500
69 | 
70 |     @app.route('/api/scenarios/<int:id>', methods=['DELETE'])
71 |     def delete_scenario(id):
72 |         logger.info(f"Deleting scenario with id: {id}")
73 |         try:
74 |             success = db.delete_scenario(id)
75 |             if success:
76 |                 logger.info(f"Scenario with id {id} deleted successfully")
77 |                 return jsonify({"message": "Scenario deleted successfully"}), 200
78 |             else:
79 |                 logger.error(f"Failed to delete scenario with id: {id}")
80 |                 return jsonify({"error": "Failed to delete scenario"}), 500
81 |         except Exception as e:
82 |             logger.error(f"Error deleting scenario with id {id}: {e}")
83 |             return jsonify({"error": "Failed to delete scenario"}), 500
84 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
  1 | # Byte-compiled / optimized / DLL files
  2 | __pycache__/
  3 | *.py[cod]
  4 | *$py.class
  5 | 
  6 | # C extensions
  7 | *.so
  8 | 
  9 | # Distribution / packaging
 10 | .Python
 11 | build/
 12 | develop-eggs/
 13 | dist/
 14 | downloads/
 15 | eggs/
 16 | .eggs/
 17 | lib/
 18 | lib64/
 19 | parts/
 20 | sdist/
 21 | var/
 22 | wheels/
 23 | share/python-wheels/
 24 | *.egg-info/
 25 | .installed.cfg
 26 | *.egg
 27 | MANIFEST
 28 | 
 29 | # PyInstaller
 30 | #  Usually these files are written by a python script from a template
 31 | #  before PyInstaller builds the exe, so as to inject date/other infos into it.
 32 | *.manifest
 33 | *.spec
 34 | 
 35 | # Installer logs
 36 | pip-log.txt
 37 | pip-delete-this-directory.txt
 38 | 
 39 | # Unit test / coverage reports
 40 | htmlcov/
 41 | .tox/
 42 | .nox/
 43 | .coverage
 44 | .coverage.*
 45 | .cache
 46 | nosetests.xml
 47 | coverage.xml
 48 | *.cover
 49 | *.py,cover
 50 | .hypothesis/
 51 | .pytest_cache/
 52 | cover/
 53 | 
 54 | # Translations
 55 | *.mo
 56 | *.pot
 57 | 
 58 | # Django stuff:
 59 | *.log
 60 | local_settings.py
 61 | db.sqlite3
 62 | db.sqlite3-journal
 63 | 
 64 | # Flask stuff:
 65 | instance/
 66 | .webassets-cache
 67 | 
 68 | # Scrapy stuff:
 69 | .scrapy
 70 | 
 71 | # Sphinx documentation
 72 | docs/_build/
 73 | 
 74 | # PyBuilder
 75 | .pybuilder/
 76 | target/
 77 | 
 78 | # Jupyter Notebook
 79 | .ipynb_checkpoints
 80 | 
 81 | # IPython
 82 | profile_default/
 83 | ipython_config.py
 84 | 
 85 | # pyenv
 86 | #   For a library or package, you might want to ignore these files since the code is
 87 | #   intended to run in multiple environments; otherwise, check them in:
 88 | # .python-version
 89 | 
 90 | # pipenv
 91 | #   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
 92 | #   However, in case of collaboration, if having platform-specific dependencies or dependencies
 93 | #   having no cross-platform support, pipenv may install dependencies that don't work, or not
 94 | #   install all needed dependencies.
 95 | #Pipfile.lock
 96 | 
 97 | # poetry
 98 | #   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
 99 | #   This is especially recommended for binary packages to ensure reproducibility, and is more
100 | #   commonly ignored for libraries.
101 | #   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
102 | #poetry.lock
103 | 
104 | # pdm
105 | #   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
106 | #pdm.lock
107 | #   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
108 | #   in version control.
109 | #   https://pdm.fming.dev/latest/usage/project/#working-with-version-control
110 | .pdm.toml
111 | .pdm-python
112 | .pdm-build/
113 | 
114 | # PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
115 | __pypackages__/
116 | 
117 | # Celery stuff
118 | celerybeat-schedule
119 | celerybeat.pid
120 | 
121 | # SageMath parsed files
122 | *.sage.py
123 | 
124 | # Environments
125 | .env
126 | .venv
127 | env/
128 | venv/
129 | ENV/
130 | env.bak/
131 | venv.bak/
132 | 
133 | # Spyder project settings
134 | .spyderproject
135 | .spyproject
136 | 
137 | # Rope project settings
138 | .ropeproject
139 | 
140 | # mkdocs documentation
141 | /site
142 | 
143 | # mypy
144 | .mypy_cache/
145 | .dmypy.json
146 | dmypy.json
147 | 
148 | # Pyre type checker
149 | .pyre/
150 | 
151 | # pytype static type analyzer
152 | .pytype/
153 | 
154 | # Cython debug symbols
155 | cython_debug/
156 | 
157 | # PyCharm
158 | #  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
159 | #  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
160 | #  and can be added to the global gitignore or merged into this file.  For a more nuclear
161 | #  option (not recommended) you can uncomment the following to ignore the entire idea folder.
162 | #.idea/
163 | 
164 | *.db
165 | 


--------------------------------------------------------------------------------
/website/docusaurus.config.ts:
--------------------------------------------------------------------------------
  1 | import {themes as prismThemes} from 'prism-react-renderer';
  2 | import type {Config} from '@docusaurus/types';
  3 | import type * as Preset from '@docusaurus/preset-classic';
  4 | 
  5 | // This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
  6 | 
  7 | const config: Config = {
  8 |   title: 'Kubernetes Practice Assistant',
  9 |   tagline: 'Interactive Kubernetes learning environment with AI-powered assistance',
 10 |   favicon: 'img/favicon.ico',
 11 | 
 12 |   // Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future
 13 |   future: {
 14 |     v4: true, // Improve compatibility with the upcoming Docusaurus v4
 15 |   },
 16 | 
 17 |   // Set the production url of your site here
 18 |   url: 'https://robert-cronin.github.io',
 19 |   // Set the /<baseUrl>/ pathname under which your site is served
 20 |   // For GitHub pages deployment, it is often '/<projectName>/'
 21 |   baseUrl: '/kpa/',
 22 | 
 23 |   // GitHub pages deployment config.
 24 |   // If you aren't using GitHub pages, you don't need these.
 25 |   organizationName: 'robert-cronin', // Usually your GitHub org/user name.
 26 |   projectName: 'kpa', // Usually your repo name.
 27 | 
 28 |   onBrokenLinks: 'throw',
 29 |   onBrokenMarkdownLinks: 'warn',
 30 | 
 31 |   // Even if you don't use internationalization, you can use this field to set
 32 |   // useful metadata like html lang. For example, if your site is Chinese, you
 33 |   // may want to replace "en" with "zh-Hans".
 34 |   i18n: {
 35 |     defaultLocale: 'en',
 36 |     locales: ['en'],
 37 |   },
 38 | 
 39 |   presets: [
 40 |     [
 41 |       'classic',
 42 |       {
 43 |         docs: {
 44 |           sidebarPath: './sidebars.ts',
 45 |           // Please change this to your repo.
 46 |           // Remove this to remove the "edit this page" links.
 47 |           editUrl:
 48 |             'https://github.com/robert-cronin/kpa/tree/main/website/',
 49 |         },
 50 |         blog: false,
 51 |         theme: {
 52 |           customCss: './src/css/custom.css',
 53 |         },
 54 |       } satisfies Preset.Options,
 55 |     ],
 56 |   ],
 57 | 
 58 |   themeConfig: {
 59 |     // Replace with your project's social card
 60 |     image: 'img/kpa-social-card.jpg',
 61 |     navbar: {
 62 |       title: 'KPA',
 63 |       logo: {
 64 |         alt: 'KPA Logo',
 65 |         src: 'img/logo.svg',
 66 |       },
 67 |       items: [
 68 |         {
 69 |           type: 'docSidebar',
 70 |           sidebarId: 'tutorialSidebar',
 71 |           position: 'left',
 72 |           label: 'Documentation',
 73 |         },
 74 |         {
 75 |           href: 'https://github.com/robert-cronin/kpa',
 76 |           label: 'GitHub',
 77 |           position: 'right',
 78 |         },
 79 |       ],
 80 |     },
 81 |     footer: {
 82 |       style: 'dark',
 83 |       links: [
 84 |         {
 85 |           title: 'Docs',
 86 |           items: [
 87 |             {
 88 |               label: 'Getting Started',
 89 |               to: '/docs/intro',
 90 |             },
 91 |           ],
 92 |         },
 93 |         {
 94 |           title: 'Resources',
 95 |           items: [
 96 |             {
 97 |               label: 'Kubernetes Docs',
 98 |               href: 'https://kubernetes.io/docs/',
 99 |             },
100 |             {
101 |               label: 'CKA Certification',
102 |               href: 'https://www.cncf.io/certification/cka/',
103 |             },
104 |           ],
105 |         },
106 |         {
107 |           title: 'More',
108 |           items: [
109 |             {
110 |               label: 'GitHub',
111 |               href: 'https://github.com/robert-cronin/kpa',
112 |             },
113 |           ],
114 |         },
115 |       ],
116 |       copyright: `Copyright © ${new Date().getFullYear()} Kubernetes Practice Assistant. Built with Docusaurus.`,
117 |     },
118 |     prism: {
119 |       theme: prismThemes.github,
120 |       darkTheme: prismThemes.dracula,
121 |     },
122 |   } satisfies Preset.ThemeConfig,
123 | };
124 | 
125 | export default config;
126 | 


--------------------------------------------------------------------------------
/website/docs/installation.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | sidebar_position: 2
  3 | title: Installation Guide
  4 | ---
  5 | 
  6 | # Installation Guide
  7 | 
  8 | This guide provides detailed instructions for installing and setting up the Kubernetes Practice Assistant (KPA) on your system.
  9 | 
 10 | ## System Requirements
 11 | 
 12 | ### Minimum Requirements
 13 | 
 14 | - **OS**: Linux, macOS, or Windows (with WSL2)
 15 | - **Python**: 3.8 or higher
 16 | - **Memory**: 4GB RAM minimum
 17 | - **Storage**: 1GB free space
 18 | 
 19 | ### Recommended Requirements
 20 | 
 21 | - **Memory**: 8GB RAM or more
 22 | - **CPU**: 2+ cores
 23 | - **Kubernetes**: Local cluster (kind, minikube, or k3s)
 24 | 
 25 | ## Installation Methods
 26 | 
 27 | ### Method 1: Local Development Setup
 28 | 
 29 | #### Step 1: Clone the Repository
 30 | 
 31 | ```bash
 32 | git clone https://github.com/robert-cronin/kpa.git
 33 | cd kpa
 34 | ```
 35 | 
 36 | #### Step 2: Create a Virtual Environment (Recommended)
 37 | 
 38 | ```bash
 39 | # Create virtual environment
 40 | python -m venv venv
 41 | 
 42 | # Activate virtual environment
 43 | # On Linux/macOS:
 44 | source venv/bin/activate
 45 | 
 46 | # On Windows:
 47 | venv\Scripts\activate
 48 | ```
 49 | 
 50 | #### Step 3: Install Dependencies
 51 | 
 52 | ```bash
 53 | pip install -r requirements.txt
 54 | ```
 55 | 
 56 | #### Step 4: Configure Environment Variables
 57 | 
 58 | Create a `.env` file in the project root:
 59 | 
 60 | ```bash
 61 | # Required
 62 | OPENAI_API_KEY=your-openai-api-key-here
 63 | 
 64 | # Optional
 65 | PORT=8080
 66 | DATABASE_PATH=./kpa.db
 67 | LOG_LEVEL=INFO
 68 | ```
 69 | 
 70 | #### Step 5: Initialize the Database
 71 | 
 72 | The database will be automatically created when you first run the application. It contains pre-configured scenarios for Kubernetes practice.
 73 | 
 74 | #### Step 6: Run the Application
 75 | 
 76 | ```bash
 77 | # Using Python directly
 78 | python -m app.main
 79 | 
 80 | # Or using the task runner
 81 | task start
 82 | ```
 83 | 
 84 | Access the application at `http://localhost:8080`
 85 | 
 86 | ### Method 2: Docker Installation
 87 | 
 88 | #### Step 1: Build the Docker Image
 89 | 
 90 | ```bash
 91 | docker build -t kpa:latest .
 92 | ```
 93 | 
 94 | #### Step 2: Run the Container
 95 | 
 96 | ```bash
 97 | docker run -d \
 98 |   -p 8080:8080 \
 99 |   -e OPENAI_API_KEY=your-openai-api-key \
100 |   --name kpa \
101 |   kpa:latest
102 | ```
103 | 
104 | ### Method 3: Kubernetes Deployment
105 | 
106 | #### Step 1: Create ConfigMap for Configuration
107 | 
108 | ```bash
109 | kubectl create configmap kpa-config \
110 |   --from-literal=OPENAI_API_KEY=your-openai-api-key
111 | ```
112 | 
113 | #### Step 2: Deploy using Helm
114 | 
115 | ```bash
116 | # Add the KPA Helm repository (if available)
117 | helm repo add kpa https://robert-cronin.github.io/kpa-helm-charts
118 | helm repo update
119 | 
120 | # Install KPA
121 | helm install kpa kpa/kpa \
122 |   --set config.openaiApiKey=your-openai-api-key \
123 |   --set ingress.enabled=true \
124 |   --set ingress.host=kpa.your-domain.com
125 | ```
126 | 
127 | Or deploy using the included Helm chart:
128 | 
129 | ```bash
130 | cd chart
131 | helm install kpa . \
132 |   --set config.openaiApiKey=your-openai-api-key
133 | ```
134 | 
135 | ## Setting Up a Local Kubernetes Cluster
136 | 
137 | KPA works best with a local Kubernetes cluster. Here are quick setup guides for popular options:
138 | 
139 | ### Option 1: kind (Kubernetes in Docker)
140 | 
141 | ```bash
142 | # Install kind
143 | curl -Lo ./kind https://kind.sigs.k8s.io/dl/v0.20.0/kind-linux-amd64
144 | chmod +x ./kind
145 | sudo mv ./kind /usr/local/bin/kind
146 | 
147 | # Create cluster
148 | kind create cluster --name kpa-cluster
149 | ```
150 | 
151 | ### Option 2: minikube
152 | 
153 | ```bash
154 | # Install minikube
155 | curl -LO https://storage.googleapis.com/minikube/releases/latest/minikube-linux-amd64
156 | sudo install minikube-linux-amd64 /usr/local/bin/minikube
157 | 
158 | # Start cluster
159 | minikube start
160 | ```
161 | 
162 | ### Option 3: k3s (Lightweight Kubernetes)
163 | 
164 | ```bash
165 | # Install k3s
166 | curl -sfL https://get.k3s.io | sh -
167 | 
168 | # Check status
169 | sudo k3s kubectl get nodes
170 | ```
171 | 
172 | ## Verifying Installation
173 | 
174 | After installation, verify that KPA is working correctly:
175 | 
176 | 1. **Check Application Health**:
177 | 
178 |    ```bash
179 |    curl http://localhost:8080/health
180 |    ```
181 | 
182 | 2. **Access the Web Interface**:
183 |    Open your browser and navigate to `http://localhost:8080`
184 | 
185 | 3. **Test kubectl Integration**:
186 |    Try running a scenario that uses kubectl commands
187 | 
188 | ## Troubleshooting
189 | 
190 | ### Common Issues
191 | 
192 | #### Port Already in Use
193 | 
194 | ```bash
195 | # Check what's using port 8080
196 | lsof -i :8080
197 | 
198 | # Use a different port
199 | PORT=8081 python -m app.main
200 | ```
201 | 
202 | #### Python Version Issues
203 | 
204 | ```bash
205 | # Check Python version
206 | python --version
207 | 
208 | # Use pyenv to manage Python versions
209 | pyenv install 3.11.0
210 | pyenv local 3.11.0
211 | ```
212 | 
213 | #### Database Connection Errors
214 | 
215 | ```bash
216 | # Remove corrupted database
217 | rm kpa.db
218 | 
219 | # Restart the application (database will be recreated)
220 | python -m app.main
221 | ```
222 | 
223 | ## Next Steps
224 | 
225 | - [Usage Guide](./usage) - Learn how to use KPA effectively
226 | 


--------------------------------------------------------------------------------
/app/web/static/css/styles.css:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * Copyright (c) 2024 Robert Cronin
  3 |  * 
  4 |  * This software is released under the MIT License.
  5 |  * https://opensource.org/licenses/MIT
  6 |  */
  7 | 
  8 | body,
  9 | html {
 10 |   height: 100%;
 11 |   margin: 0;
 12 |   font-family: "Menlo", "Monaco", "Courier New", monospace;
 13 |   background-color: #282a36;
 14 |   color: #f8f8f2;
 15 | }
 16 | 
 17 | .container {
 18 |   margin: 0 auto;
 19 |   padding: 20px;
 20 |   height: calc(100vh - 40px);
 21 |   display: flex;
 22 |   flex-direction: column;
 23 | }
 24 | 
 25 | h1 {
 26 |   color: #ff79c6;
 27 |   text-align: center;
 28 | }
 29 | 
 30 | #scenario-input {
 31 |   background-color: #44475a;
 32 |   border-radius: 8px;
 33 |   padding: 20px;
 34 |   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
 35 |   margin-bottom: 20px;
 36 | }
 37 | 
 38 | #scenario-prompt {
 39 |   width: 100%;
 40 |   height: 100px;
 41 |   margin-bottom: 10px;
 42 |   border: 1px solid #6272a4;
 43 |   border-radius: 4px;
 44 |   resize: vertical;
 45 |   background-color: #282a36;
 46 |   color: #f8f8f2;
 47 | }
 48 | 
 49 | button {
 50 |   background-color: #bd93f9;
 51 |   color: #282a36;
 52 |   border: none;
 53 |   padding: 10px 20px;
 54 |   border-radius: 4px;
 55 |   cursor: pointer;
 56 |   transition: background-color 0.3s;
 57 | }
 58 | 
 59 | button:hover {
 60 |   background-color: #caa9fa;
 61 | }
 62 | 
 63 | #scenario-list {
 64 |   display: flex;
 65 |   flex-wrap: wrap;
 66 |   gap: 20px;
 67 | }
 68 | 
 69 | .scenario-option {
 70 |   background-color: #44475a;
 71 |   border-radius: 8px;
 72 |   padding: 20px;
 73 |   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
 74 |   margin-bottom: 20px;
 75 | }
 76 | 
 77 | .scenario-option h3 {
 78 |   margin-top: 0;
 79 |   color: #ff79c6;
 80 | }
 81 | 
 82 | .scenario-option p {
 83 |   color: #f8f8f2;
 84 |   margin-bottom: 15px;
 85 | }
 86 | 
 87 | @media (max-width: 600px) {
 88 |   .scenario-option {
 89 |     width: 100%;
 90 |   }
 91 | }
 92 | 
 93 | .button-group {
 94 |   display: flex;
 95 |   gap: 10px;
 96 |   margin-top: 10px;
 97 | }
 98 | 
 99 | #feeling-lucky {
100 |   background-color: #50fa7b;
101 | }
102 | 
103 | #feeling-lucky:hover {
104 |   background-color: #5af78e;
105 | }
106 | 
107 | .description-container {
108 |   margin-bottom: 10px;
109 | }
110 | 
111 | .description {
112 |   margin-bottom: 5px;
113 | }
114 | 
115 | .expand-btn,
116 | .show-tasks-btn {
117 |   background-color: #6272a4;
118 |   border: none;
119 |   padding: 5px 10px;
120 |   border-radius: 4px;
121 |   cursor: pointer;
122 |   font-size: 0.9em;
123 |   color: #f8f8f2;
124 | }
125 | 
126 | .expand-btn:hover,
127 | .show-tasks-btn:hover,
128 | .delete-btn:hover {
129 |   background-color: #48b0ff;
130 | }
131 | 
132 | .tasks-list {
133 |   margin-top: 10px;
134 |   padding-left: 20px;
135 | }
136 | 
137 | .hidden {
138 |   display: none;
139 | }
140 | 
141 | .button-container {
142 |   display: flex;
143 |   justify-content: space-between;
144 |   margin-top: 10px;
145 | }
146 | 
147 | .delete-btn {
148 |   background-color: #ff5555;
149 |   color: #f8f8f2;
150 | }
151 | 
152 | .delete-btn:hover {
153 |   background-color: #ff6e6e;
154 | }
155 | 
156 | .main-content {
157 |   display: flex;
158 |   flex-grow: 1;
159 |   gap: 20px;
160 |   overflow: hidden;
161 | }
162 | 
163 | .left-panel,
164 | .right-panel {
165 |   flex: 1;
166 |   background-color: #44475a;
167 |   border-radius: 8px;
168 |   padding: 20px;
169 |   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
170 |   display: flex;
171 |   flex-direction: column;
172 |   overflow: auto; /* Allow scrolling within panels */
173 | }
174 | 
175 | #terminal {
176 |   flex-grow: 1;
177 |   background-color: #282a36;
178 |   border-radius: 4px;
179 |   padding: 10px;
180 |   overflow: hidden;
181 | }
182 | 
183 | .scenario-details {
184 |   margin-bottom: 20px;
185 | }
186 | 
187 | #task-list {
188 |   padding-left: 20px;
189 |   color: #50fa7b;
190 | }
191 | 
192 | #check-button {
193 |   background-color: #bd93f9;
194 |   color: #282a36;
195 |   border: none;
196 |   padding: 10px 20px;
197 |   border-radius: 4px;
198 |   cursor: pointer;
199 |   transition: background-color 0.3s;
200 | }
201 | 
202 | #check-button:hover {
203 |   background-color: #caa9fa;
204 | }
205 | 
206 | #check-output {
207 |   margin-top: 10px;
208 |   padding: 10px;
209 |   background-color: #44475a;
210 |   border-radius: 4px;
211 | }
212 | 
213 | .chat-panel {
214 |   display: flex;
215 |   flex-direction: column;
216 |   height: 300px;
217 | }
218 | 
219 | #chat-messages {
220 |   flex-grow: 1;
221 |   overflow-y: auto;
222 |   border: 1px solid #6272a4;
223 |   border-radius: 4px;
224 |   padding: 10px;
225 |   margin-bottom: 10px;
226 | }
227 | 
228 | .chat-input {
229 |   display: flex;
230 | }
231 | 
232 | #user-input {
233 |   flex-grow: 1;
234 |   padding: 5px;
235 |   border: 1px solid #6272a4;
236 |   border-radius: 4px;
237 |   resize: vertical;
238 |   background-color: #44475a;
239 |   color: #f8f8f2;
240 | }
241 | 
242 | #send-button {
243 |   background-color: #50fa7b;
244 |   color: #282a36;
245 |   border: none;
246 |   padding: 5px 10px;
247 |   border-radius: 4px;
248 |   cursor: pointer;
249 |   transition: background-color 0.3s;
250 |   margin-left: 10px;
251 | }
252 | 
253 | #send-button:hover {
254 |   background-color: #5af78e;
255 | }
256 | 
257 | .message {
258 |   margin-bottom: 10px;
259 |   padding: 5px;
260 |   border-radius: 4px;
261 | }
262 | 
263 | .user-message {
264 |   background-color: #6272a4;
265 |   align-self: flex-end;
266 | }
267 | 
268 | .ai-message {
269 |   background-color: #44475a;
270 |   align-self: flex-start;
271 | }
272 | 


--------------------------------------------------------------------------------
/app/web/static/js/scenario_select.js:
--------------------------------------------------------------------------------
  1 | // Copyright (c) 2024 Robert Cronin
  2 | //
  3 | // This software is released under the MIT License.
  4 | // https://opensource.org/licenses/MIT
  5 | 
  6 | document.addEventListener("DOMContentLoaded", () => {
  7 |   const scenarioPrompt = document.getElementById("scenario-prompt");
  8 |   const generateButton = document.getElementById("generate-scenarios");
  9 |   const feelingLuckyButton = document.getElementById("feeling-lucky");
 10 |   const scenarioList = document.getElementById("scenario-list");
 11 | 
 12 |   function displayScenarios(scenarios) {
 13 |     scenarioList.innerHTML = scenarios
 14 |       .map(
 15 |         (scenario, index) => `
 16 |         <div class="scenario-option" data-id="${scenario.id}">
 17 |           <h3>Scenario ${index + 1}: ${scenario.title}</h3>
 18 |           <div class="description-container">
 19 |             <p class="description">${scenario.description.slice(0, 100)}${
 20 |           scenario.description.length > 100 ? "..." : ""
 21 |         }</p>
 22 |             <button class="expand-btn">Show More</button>
 23 |           </div>
 24 |           ${
 25 |             scenario.tasks
 26 |               ? `
 27 |           <div class="tasks-container">
 28 |             <button class="show-tasks-btn">Show Tasks</button>
 29 |             <ul class="tasks-list hidden">
 30 |               ${scenario.tasks.map((task) => `<li>${task}</li>`).join("")}
 31 |             </ul>
 32 |           </div>
 33 |           `
 34 |               : ""
 35 |           }
 36 |           <div class="button-container">
 37 |             <button onclick="selectScenario(${scenario.id})">Select</button>
 38 |             <button class="delete-btn" data-id="${scenario.id}">Delete</button>
 39 |           </div>
 40 |         </div>
 41 |       `
 42 |       )
 43 |       .join("");
 44 | 
 45 |     // Add event listeners for expand buttons
 46 |     document.querySelectorAll(".expand-btn").forEach((btn) => {
 47 |       btn.addEventListener("click", function () {
 48 |         const descContainer = this.closest(".description-container");
 49 |         const descP = descContainer.querySelector(".description");
 50 |         if (this.textContent === "Show More") {
 51 |           descP.textContent = scenarios.find(
 52 |             (s) =>
 53 |               s.id === parseInt(this.closest(".scenario-option").dataset.id)
 54 |           ).description;
 55 |           this.textContent = "Show Less";
 56 |         } else {
 57 |           descP.textContent =
 58 |             scenarios
 59 |               .find(
 60 |                 (s) =>
 61 |                   s.id === parseInt(this.closest(".scenario-option").dataset.id)
 62 |               )
 63 |               .description.slice(0, 100) + "...";
 64 |           this.textContent = "Show More";
 65 |         }
 66 |       });
 67 |     });
 68 | 
 69 |     // Add event listeners for show tasks buttons
 70 |     document.querySelectorAll(".show-tasks-btn").forEach((btn) => {
 71 |       btn.addEventListener("click", function () {
 72 |         const tasksList = this.nextElementSibling;
 73 |         tasksList.classList.toggle("hidden");
 74 |         this.textContent = tasksList.classList.contains("hidden")
 75 |           ? "Show Tasks"
 76 |           : "Hide Tasks";
 77 |       });
 78 |     });
 79 | 
 80 |     // Add event listeners for delete buttons
 81 |     document.querySelectorAll(".delete-btn").forEach((btn) => {
 82 |       btn.addEventListener("click", function () {
 83 |         const scenarioId = this.dataset.id;
 84 |         if (confirm("Are you sure you want to delete this scenario?")) {
 85 |           deleteScenario(scenarioId);
 86 |         }
 87 |       });
 88 |     });
 89 |   }
 90 | 
 91 |   function fetchExistingScenarios() {
 92 |     fetch("/api/scenarios")
 93 |       .then((response) => {
 94 |         if (!response.ok) {
 95 |           throw new Error(`HTTP error! status: ${response.status}`);
 96 |         }
 97 |         return response.json();
 98 |       })
 99 |       .then((scenarios) => {
100 |         displayScenarios(scenarios);
101 |       })
102 |       .catch((error) => {
103 |         console.error("Error fetching existing scenarios:", error);
104 |         scenarioList.innerHTML =
105 |           "<p>Error loading scenarios. Please try refreshing the page.</p>";
106 |       });
107 |   }
108 | 
109 |   function generateScenarios(prompt = "") {
110 |     fetch("/api/generate-scenarios", {
111 |       method: "POST",
112 |       headers: {
113 |         "Content-Type": "application/json",
114 |       },
115 |       body: JSON.stringify({ prompt }),
116 |     })
117 |       .then((response) => {
118 |         if (!response.ok) {
119 |           throw new Error(`HTTP error! status: ${response.status}`);
120 |         }
121 |         return response.json();
122 |       })
123 |       .then((scenarios) => {
124 |         displayScenarios(scenarios);
125 |       })
126 |       .catch((error) => {
127 |         console.error("Error generating scenarios:", error);
128 |         scenarioList.innerHTML =
129 |           "<p>Error generating scenarios. Please try again.</p>";
130 |       });
131 |   }
132 | 
133 |   function deleteScenario(id) {
134 |     fetch(`/api/scenarios/${id}`, {
135 |       method: "DELETE",
136 |     })
137 |       .then((response) => {
138 |         if (!response.ok) {
139 |           throw new Error(`HTTP error! status: ${response.status}`);
140 |         }
141 |         return response.json();
142 |       })
143 |       .then(() => {
144 |         fetchExistingScenarios();
145 |       })
146 |       .catch((error) => {
147 |         console.error("Error deleting scenario:", error);
148 |         alert("Error deleting scenario. Please try again.");
149 |       });
150 |   }
151 | 
152 |   generateButton.addEventListener("click", () => {
153 |     generateScenarios(scenarioPrompt.value);
154 |   });
155 | 
156 |   feelingLuckyButton.addEventListener("click", () => {
157 |     scenarioPrompt.value = "";
158 |     generateScenarios();
159 |   });
160 | 
161 |   fetchExistingScenarios();
162 | });
163 | 
164 | // Define selectScenario in the global scope
165 | window.selectScenario = function (id) {
166 |   window.location.href = `/scenario/${id}`;
167 | };
168 | 


--------------------------------------------------------------------------------
/website/static/img/logo.svg:
--------------------------------------------------------------------------------
1 | <svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path fill="#FFF" d="M99 52h84v34H99z"/><path d="M23 163c-7.398 0-13.843-4.027-17.303-10A19.886 19.886 0 0 0 3 163c0 11.046 8.954 20 20 20h20v-20H23z" fill="#3ECC5F"/><path d="M112.98 57.376L183 53V43c0-11.046-8.954-20-20-20H73l-2.5-4.33c-1.112-1.925-3.889-1.925-5 0L63 23l-2.5-4.33c-1.111-1.925-3.889-1.925-5 0L53 23l-2.5-4.33c-1.111-1.925-3.889-1.925-5 0L43 23c-.022 0-.042.003-.065.003l-4.142-4.141c-1.57-1.571-4.252-.853-4.828 1.294l-1.369 5.104-5.192-1.392c-2.148-.575-4.111 1.389-3.535 3.536l1.39 5.193-5.102 1.367c-2.148.576-2.867 3.259-1.296 4.83l4.142 4.142c0 .021-.003.042-.003.064l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 53l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 63l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 73l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 83l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 93l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 103l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 113l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 123l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 133l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 143l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 153l-4.33 2.5c-1.925 1.111-1.925 3.889 0 5L23 163c0 11.046 8.954 20 20 20h120c11.046 0 20-8.954 20-20V83l-70.02-4.376A10.645 10.645 0 0 1 103 68c0-5.621 4.37-10.273 9.98-10.624" fill="#3ECC5F"/><path fill="#3ECC5F" d="M143 183h30v-40h-30z"/><path d="M193 158c-.219 0-.428.037-.639.064-.038-.15-.074-.301-.116-.451A5 5 0 0 0 190.32 148a4.96 4.96 0 0 0-3.016 1.036 26.531 26.531 0 0 0-.335-.336 4.955 4.955 0 0 0 1.011-2.987 5 5 0 0 0-9.599-1.959c-.148-.042-.297-.077-.445-.115.027-.211.064-.42.064-.639a5 5 0 0 0-5-5 5 5 0 0 0-5 5c0 .219.037.428.064.639-.148.038-.297.073-.445.115a4.998 4.998 0 0 0-9.599 1.959c0 1.125.384 2.151 1.011 2.987-3.717 3.632-6.031 8.693-6.031 14.3 0 11.046 8.954 20 20 20 9.339 0 17.16-6.41 19.361-15.064.211.027.42.064.639.064a5 5 0 0 0 5-5 5 5 0 0 0-5-5" fill="#44D860"/><path fill="#3ECC5F" d="M153 123h30v-20h-30z"/><path d="M193 115.5a2.5 2.5 0 1 0 0-5c-.109 0-.214.019-.319.032-.02-.075-.037-.15-.058-.225a2.501 2.501 0 0 0-.963-4.807c-.569 0-1.088.197-1.508.518a6.653 6.653 0 0 0-.168-.168c.314-.417.506-.931.506-1.494a2.5 2.5 0 0 0-4.8-.979A9.987 9.987 0 0 0 183 103c-5.522 0-10 4.478-10 10s4.478 10 10 10c.934 0 1.833-.138 2.69-.377a2.5 2.5 0 0 0 4.8-.979c0-.563-.192-1.077-.506-1.494.057-.055.113-.111.168-.168.42.321.939.518 1.508.518a2.5 2.5 0 0 0 .963-4.807c.021-.074.038-.15.058-.225.105.013.21.032.319.032" fill="#44D860"/><path d="M63 55.5a2.5 2.5 0 0 1-2.5-2.5c0-4.136-3.364-7.5-7.5-7.5s-7.5 3.364-7.5 7.5a2.5 2.5 0 1 1-5 0c0-6.893 5.607-12.5 12.5-12.5S65.5 46.107 65.5 53a2.5 2.5 0 0 1-2.5 2.5" fill="#000"/><path d="M103 183h60c11.046 0 20-8.954 20-20V93h-60c-11.046 0-20 8.954-20 20v70z" fill="#FFFF50"/><path d="M168.02 124h-50.04a1 1 0 1 1 0-2h50.04a1 1 0 1 1 0 2m0 20h-50.04a1 1 0 1 1 0-2h50.04a1 1 0 1 1 0 2m0 20h-50.04a1 1 0 1 1 0-2h50.04a1 1 0 1 1 0 2m0-49.814h-50.04a1 1 0 1 1 0-2h50.04a1 1 0 1 1 0 2m0 19.814h-50.04a1 1 0 1 1 0-2h50.04a1 1 0 1 1 0 2m0 20h-50.04a1 1 0 1 1 0-2h50.04a1 1 0 1 1 0 2M183 61.611c-.012 0-.022-.006-.034-.005-3.09.105-4.552 3.196-5.842 5.923-1.346 2.85-2.387 4.703-4.093 4.647-1.889-.068-2.969-2.202-4.113-4.46-1.314-2.594-2.814-5.536-5.963-5.426-3.046.104-4.513 2.794-5.807 5.167-1.377 2.528-2.314 4.065-4.121 3.994-1.927-.07-2.951-1.805-4.136-3.813-1.321-2.236-2.848-4.75-5.936-4.664-2.994.103-4.465 2.385-5.763 4.4-1.373 2.13-2.335 3.428-4.165 3.351-1.973-.07-2.992-1.51-4.171-3.177-1.324-1.873-2.816-3.993-5.895-3.89-2.928.1-4.399 1.97-5.696 3.618-1.232 1.564-2.194 2.802-4.229 2.724a1 1 0 0 0-.072 2c3.017.101 4.545-1.8 5.872-3.487 1.177-1.496 2.193-2.787 4.193-2.855 1.926-.082 2.829 1.115 4.195 3.045 1.297 1.834 2.769 3.914 5.731 4.021 3.103.104 4.596-2.215 5.918-4.267 1.182-1.834 2.202-3.417 4.15-3.484 1.793-.067 2.769 1.35 4.145 3.681 1.297 2.197 2.766 4.686 5.787 4.796 3.125.108 4.634-2.62 5.949-5.035 1.139-2.088 2.214-4.06 4.119-4.126 1.793-.042 2.728 1.595 4.111 4.33 1.292 2.553 2.757 5.445 5.825 5.556l.169.003c3.064 0 4.518-3.075 5.805-5.794 1.139-2.41 2.217-4.68 4.067-4.773v-2z" fill="#000"/><path fill="#3ECC5F" d="M83 183h40v-40H83z"/><path d="M143 158c-.219 0-.428.037-.639.064-.038-.15-.074-.301-.116-.451A5 5 0 0 0 140.32 148a4.96 4.96 0 0 0-3.016 1.036 26.531 26.531 0 0 0-.335-.336 4.955 4.955 0 0 0 1.011-2.987 5 5 0 0 0-9.599-1.959c-.148-.042-.297-.077-.445-.115.027-.211.064-.42.064-.639a5 5 0 0 0-5-5 5 5 0 0 0-5 5c0 .219.037.428.064.639-.148.038-.297.073-.445.115a4.998 4.998 0 0 0-9.599 1.959c0 1.125.384 2.151 1.011 2.987-3.717 3.632-6.031 8.693-6.031 14.3 0 11.046 8.954 20 20 20 9.339 0 17.16-6.41 19.361-15.064.211.027.42.064.639.064a5 5 0 0 0 5-5 5 5 0 0 0-5-5" fill="#44D860"/><path fill="#3ECC5F" d="M83 123h40v-20H83z"/><path d="M133 115.5a2.5 2.5 0 1 0 0-5c-.109 0-.214.019-.319.032-.02-.075-.037-.15-.058-.225a2.501 2.501 0 0 0-.963-4.807c-.569 0-1.088.197-1.508.518a6.653 6.653 0 0 0-.168-.168c.314-.417.506-.931.506-1.494a2.5 2.5 0 0 0-4.8-.979A9.987 9.987 0 0 0 123 103c-5.522 0-10 4.478-10 10s4.478 10 10 10c.934 0 1.833-.138 2.69-.377a2.5 2.5 0 0 0 4.8-.979c0-.563-.192-1.077-.506-1.494.057-.055.113-.111.168-.168.42.321.939.518 1.508.518a2.5 2.5 0 0 0 .963-4.807c.021-.074.038-.15.058-.225.105.013.21.032.319.032" fill="#44D860"/><path d="M143 41.75c-.16 0-.33-.02-.49-.05a2.52 2.52 0 0 1-.47-.14c-.15-.06-.29-.14-.431-.23-.13-.09-.259-.2-.38-.31-.109-.12-.219-.24-.309-.38s-.17-.28-.231-.43a2.619 2.619 0 0 1-.189-.96c0-.16.02-.33.05-.49.03-.16.08-.31.139-.47.061-.15.141-.29.231-.43.09-.13.2-.26.309-.38.121-.11.25-.22.38-.31.141-.09.281-.17.431-.23.149-.06.31-.11.47-.14.32-.07.65-.07.98 0 .159.03.32.08.47.14.149.06.29.14.43.23.13.09.259.2.38.31.11.12.22.25.31.38.09.14.17.28.23.43.06.16.11.31.14.47.029.16.05.33.05.49 0 .66-.271 1.31-.73 1.77-.121.11-.25.22-.38.31-.14.09-.281.17-.43.23a2.565 2.565 0 0 1-.96.19m20-1.25c-.66 0-1.3-.27-1.771-.73a3.802 3.802 0 0 1-.309-.38c-.09-.14-.17-.28-.231-.43a2.619 2.619 0 0 1-.189-.96c0-.66.27-1.3.729-1.77.121-.11.25-.22.38-.31.141-.09.281-.17.431-.23.149-.06.31-.11.47-.14.32-.07.66-.07.98 0 .159.03.32.08.47.14.149.06.29.14.43.23.13.09.259.2.38.31.459.47.73 1.11.73 1.77 0 .16-.021.33-.05.49-.03.16-.08.32-.14.47-.07.15-.14.29-.23.43-.09.13-.2.26-.31.38-.121.11-.25.22-.38.31-.14.09-.281.17-.43.23a2.565 2.565 0 0 1-.96.19" fill="#000"/></g></svg>


--------------------------------------------------------------------------------
/website/docs/usage.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | sidebar_position: 3
  3 | title: Usage Guide
  4 | ---
  5 | 
  6 | # Usage Guide
  7 | 
  8 | Learn how to effectively use the Kubernetes Practice Assistant to enhance your Kubernetes skills.
  9 | 
 10 | ## Getting Started with KPA
 11 | 
 12 | ### Accessing the Application
 13 | 
 14 | Once KPA is running, navigate to `http://localhost:8080` in your web browser. You'll see the main interface with available scenarios.
 15 | 
 16 | ### Understanding the Interface
 17 | 
 18 | The KPA interface consists of:
 19 | 
 20 | 1. **Scenario Selection Page** (`/`)
 21 |    - Browse available practice scenarios
 22 |    - Filter by difficulty level
 23 |    - Track your progress
 24 | 
 25 | 2. **Scenario Page** (`/scenario/<id>`)
 26 |    - Interactive terminal with kubectl access
 27 |    - AI chat assistant
 28 |    - Task objectives and hints
 29 | 
 30 | ## Working with Scenarios
 31 | 
 32 | ### Available Scenarios
 33 | 
 34 | KPA includes various scenarios covering:
 35 | - **Basic Operations**: Pod creation, deployment management
 36 | - **Troubleshooting**: Debugging failed deployments, fixing configurations
 37 | - **Networking**: Service configuration, ingress setup
 38 | - **Storage**: PersistentVolume and PersistentVolumeClaim management
 39 | - **Security**: RBAC, NetworkPolicies, SecurityContexts
 40 | - **Advanced Topics**: StatefulSets, DaemonSets, Jobs, CronJobs
 41 | 
 42 | ### Starting a Scenario
 43 | 
 44 | 1. **Select a Scenario**: Click on any scenario from the home page
 45 | 2. **Read the Objectives**: Each scenario displays clear objectives
 46 | 3. **Use the Terminal**: Execute kubectl commands in the web terminal
 47 | 4. **Get AI Assistance**: Ask questions in the chat panel
 48 | 
 49 | ### Example Workflow
 50 | 
 51 | Let's walk through a typical scenario:
 52 | 
 53 | ```bash
 54 | # Scenario: Create and expose a deployment
 55 | 
 56 | # 1. Create a deployment
 57 | kubectl create deployment nginx --image=nginx:latest --replicas=3
 58 | 
 59 | # 2. Check the deployment status
 60 | kubectl get deployments
 61 | kubectl get pods
 62 | 
 63 | # 3. Expose the deployment as a service
 64 | kubectl expose deployment nginx --port=80 --type=ClusterIP
 65 | 
 66 | # 4. Verify the service
 67 | kubectl get services
 68 | kubectl describe service nginx
 69 | ```
 70 | 
 71 | ## Using the AI Assistant
 72 | 
 73 | ### Effective Prompting
 74 | 
 75 | The AI assistant can help you with:
 76 | - **Explaining concepts**: "What is a Kubernetes Service?"
 77 | - **Debugging help**: "Why is my pod in CrashLoopBackOff?"
 78 | - **Command assistance**: "How do I scale a deployment?"
 79 | - **Best practices**: "What's the best way to handle secrets?"
 80 | 
 81 | ### Example Interactions
 82 | 
 83 | ```text
 84 | You: My pod is stuck in Pending state. How can I debug this?
 85 | 
 86 | AI: To debug a pod stuck in Pending state, follow these steps:
 87 | 1. Check pod events: kubectl describe pod <pod-name>
 88 | 2. Look for scheduling issues, resource constraints, or node selectors
 89 | 3. Check node resources: kubectl describe nodes
 90 | 4. Verify if PersistentVolumeClaims are bound
 91 | ...
 92 | ```
 93 | 
 94 | ## Terminal Features
 95 | 
 96 | ### Supported Commands
 97 | 
 98 | The web terminal supports most kubectl commands:
 99 | - `kubectl get/describe/create/delete/edit`
100 | - `kubectl logs`
101 | - `kubectl exec`
102 | - `kubectl port-forward`
103 | - Basic shell commands: `ls`, `cat`, `echo`, etc.
104 | 
105 | ### Keyboard Shortcuts
106 | 
107 | - **Ctrl+C**: Cancel current command
108 | - **Ctrl+L**: Clear terminal
109 | - **Tab**: Auto-completion (where available)
110 | - **↑/↓**: Navigate command history
111 | 
112 | ## Tips for Success
113 | 
114 | ### 1. Practice Systematically
115 | 
116 | - Start with beginner scenarios
117 | - Complete each scenario thoroughly
118 | - Review solutions after completion
119 | - Retry scenarios to improve speed
120 | 
121 | ### 2. Use the AI Wisely
122 | 
123 | - Ask for hints, not complete solutions
124 | - Request explanations for concepts you don't understand
125 | - Use it to verify your approach
126 | 
127 | ### 3. Learn from Mistakes
128 | 
129 | - Don't worry about breaking things - it's a safe environment
130 | - Experiment with different approaches
131 | - Review error messages carefully
132 | 
133 | ### 4. Track Your Progress
134 | 
135 | - Complete scenarios in order
136 | - Note areas where you struggle
137 | - Return to challenging scenarios
138 | 
139 | ## Advanced Features
140 | 
141 | ### Custom Scenarios
142 | 
143 | You can create custom scenarios by:
144 | 
145 | 1. Defining scenario objectives
146 | 2. Setting up initial cluster state
147 | 3. Creating validation checks
148 | 
149 | ### Keyboard Navigation
150 | 
151 | - **Alt+T**: Focus terminal
152 | - **Alt+C**: Focus chat
153 | - **Esc**: Exit focus mode
154 | 
155 | ### Session Management
156 | 
157 | - Sessions are automatically saved
158 | - You can resume scenarios where you left off
159 | - Progress is tracked in the local database
160 | 
161 | ## Common Use Cases
162 | 
163 | ### CKA/CKAD Exam Preparation
164 | 
165 | 1. **Time yourself**: Practice scenarios within exam time limits
166 | 2. **No external resources**: Try solving without documentation
167 | 3. **Focus on speed**: Improve command execution efficiency
168 | 4. **Cover all domains**: Ensure you practice all exam objectives
169 | 
170 | ### Team Training
171 | 
172 | 1. **Share scenarios**: Export and import custom scenarios
173 | 2. **Track team progress**: Monitor completion rates
174 | 3. **Collaborative learning**: Discuss solutions with teammates
175 | 
176 | ### Skill Assessment
177 | 
178 | 1. **Benchmark performance**: Track completion times
179 | 2. **Identify weak areas**: Focus on challenging topics
180 | 3. **Regular practice**: Maintain and improve skills
181 | 
182 | ## Troubleshooting Common Issues
183 | 
184 | ### Terminal Not Responding
185 | 
186 | ```bash
187 | # Refresh the page
188 | # Check browser console for errors
189 | # Ensure WebSocket connection is active
190 | ```
191 | 
192 | ### Commands Not Working
193 | 
194 | ```bash
195 | # Verify kubectl is properly configured
196 | kubectl version
197 | 
198 | # Check cluster connection
199 | kubectl cluster-info
200 | ```
201 | 
202 | ### AI Assistant Issues
203 | 
204 | - Ensure OpenAI API key is configured
205 | - Check for rate limiting
206 | - Verify internet connectivity
207 | 
208 | ## Next Steps
209 | 
210 | - [Installation](./installation) - Installation instructions


--------------------------------------------------------------------------------
/app/services/ai.py:
--------------------------------------------------------------------------------
  1 | # Copyright (c) 2024 Robert Cronin
  2 | #
  3 | # This software is released under the MIT License.
  4 | # https://opensource.org/licenses/MIT
  5 | 
  6 | from pydantic import BaseModel, Field
  7 | from typing import List, Optional
  8 | from openai import OpenAI
  9 | from app.services import db
 10 | from app.utils.logger import logger
 11 | import json
 12 | 
 13 | client = OpenAI()
 14 | 
 15 | 
 16 | # A dictionary containing 'commands' (list of strings) and 'explanation' (string)"
 17 | class KubernetesScenarioSolution(BaseModel):
 18 |     explanation: str
 19 |     commands: List[str]
 20 | 
 21 | 
 22 | class KubernetesScenario(BaseModel):
 23 |     title: str
 24 |     description: str
 25 |     setup_commands: List[str]
 26 |     tasks: List[str]
 27 |     hints: List[str]
 28 |     solution: KubernetesScenarioSolution
 29 |     verification_commands: List[str]
 30 | 
 31 | 
 32 | class ScenarioReflection(BaseModel):
 33 |     perceived_weaknesses: List[str]
 34 |     learning_opportunities: List[str]
 35 | 
 36 | 
 37 | class ScenarioResponse(BaseModel):
 38 |     scenarios: List[KubernetesScenario]
 39 | 
 40 | 
 41 | class ChatHandler:
 42 |     def __init__(self, kubectl_executor):
 43 |         self.kubectl_executor = kubectl_executor
 44 | 
 45 |     def generate_scenarios(self, prompt: str) -> ScenarioResponse:
 46 |         logger.info("Generating scenarios")
 47 |         notes = db.get_notes()
 48 |         last_scenario_id = db.get_last_scenario_id()
 49 |         previous_scenarios = [
 50 |             db.get_scenario(i) for i in range(max(1, last_scenario_id - 4), last_scenario_id + 1)
 51 |             if db.get_scenario(i) is not None
 52 |         ]
 53 |         
 54 |         num_scenarios = 1
 55 | 
 56 |         system_prompt = f"""
 57 |         You are a Kubernetes expert creating practice scenarios. Based on the user notes and previous
 58 |         scenarios, generate {num_scenarios} Kubernetes practice scenarios suitable for CKA/CKS exam preparation.
 59 |         Focus on addressing perceived weaknesses and providing learning opportunities.
 60 |         """
 61 |         try:
 62 |             completion = client.beta.chat.completions.parse(
 63 |                 model="gpt-4o-mini-2024-07-18",
 64 |                 messages=[
 65 |                     {"role": "system", "content": system_prompt},
 66 |                     {"role": "user", "content": f"Notes: {notes}\nPrevious scenarios: {previous_scenarios}\nGenerate scenarios based on: {prompt}"}
 67 |                 ],
 68 |                 response_format=ScenarioResponse
 69 |             )
 70 |             response = completion.choices[0].message.parsed
 71 |             logger.info("Scenarios generated successfully")
 72 | 
 73 |             # Store the generated scenarios in the database
 74 |             for scenario in response.scenarios:
 75 |                 db.store_scenario(scenario.model_dump())
 76 |                 logger.info(f"Scenario stored: {scenario.title}")
 77 | 
 78 |             return response
 79 |         except Exception as e:
 80 |             logger.error(f"Error generating scenarios: {e}")
 81 |             raise
 82 | 
 83 |     def evaluate_progress(self, scenario_id: int, user_commands: List[str]) -> dict:
 84 |         logger.info(f"Evaluating progress for scenario_id: {scenario_id}")
 85 |         try:
 86 |             scenario = db.get_scenario(scenario_id)
 87 |             chat_history = db.get_chat_history(scenario_id)
 88 | 
 89 |             prompt = f"""
 90 |             Evaluate the progress on the following Kubernetes scenario:
 91 | 
 92 |             Scenario: {scenario}
 93 | 
 94 |             Chat history: {chat_history}
 95 | 
 96 |             User commands: {user_commands}
 97 | 
 98 |             Provide feedback and the next hint if needed.
 99 |             """
100 | 
101 |             completion = client.beta.chat.completions.parse(
102 |                 model="gpt-4o-mini-2024-07-18",
103 |                 messages=[
104 |                     {"role": "system", "content": "You are a Kubernetes expert evaluating progress on a mock scenario."},
105 |                     {"role": "user", "content": prompt}
106 |                 ],
107 |                 response_format={"type": "json_schema", "schema": {
108 |                     "type": "object",
109 |                     "properties": {
110 |                         "progress": {"type": "number"},
111 |                         "feedback": {"type": "string"},
112 |                         "next_hint": {"type": "string"}
113 |                     },
114 |                     "required": ["progress", "feedback", "next_hint"],
115 |                     "additionalProperties": False
116 |                 }}
117 |             )
118 | 
119 |             evaluation = json.loads(completion.choices[0].message.content)
120 |             logger.info(f"Evaluation completed for scenario_id: {scenario_id}")
121 | 
122 |             # Store the evaluation as a chat message
123 |             db.store_chat_message(scenario_id, "assistant", json.dumps(evaluation))
124 |             logger.info(f"Evaluation stored in chat history for scenario_id: {scenario_id}")
125 | 
126 |             # Update scenario progress
127 |             current_progress = db.get_scenario_progress(scenario_id)
128 |             if current_progress:
129 |                 completed_tasks = current_progress['completed_tasks']
130 |                 if evaluation['progress'] > len(completed_tasks) / len(scenario['tasks']):
131 |                     completed_tasks.append(scenario['tasks'][len(completed_tasks)])
132 |             else:
133 |                 completed_tasks = [scenario['tasks'][0]] if evaluation['progress'] > 0 else []
134 | 
135 |             db.update_scenario_progress(scenario_id, "in_progress", completed_tasks)
136 |             logger.info(f"Scenario progress updated for scenario_id: {scenario_id}")
137 | 
138 |             return evaluation
139 |         except Exception as e:
140 |             logger.error(f"Error evaluating progress for scenario_id {scenario_id}: {e}")
141 |             raise
142 | 
143 |     def explain_concept(self, concept: str) -> dict:
144 |         logger.info(f"Explaining concept: {concept}")
145 |         prompt = f"Explain the Kubernetes concept '{concept}'."
146 | 
147 |         try:
148 |             completion = client.beta.chat.completions.parse(
149 |                 model="gpt-4o-mini-2024-07-18",
150 |                 messages=[
151 |                     {"role": "system", "content": "You are a Kubernetes expert explaining concepts."},
152 |                     {"role": "user", "content": prompt}
153 |                 ],
154 |                 response_format={"type": "json_schema", "schema": {
155 |                     "type": "object",
156 |                     "properties": {
157 |                         "explanation": {"type": "string"},
158 |                         "examples": {"type": "array", "items": {"type": "string"}},
159 |                         "related_concepts": {"type": "array", "items": {"type": "string"}}
160 |                     },
161 |                     "required": ["explanation", "examples", "related_concepts"],
162 |                     "additionalProperties": False
163 |                 }}
164 |             )
165 | 
166 |             explanation = json.loads(completion.choices[0].message.content)
167 |             logger.info(f"Concept explained: {concept}")
168 |             return explanation
169 |         except Exception as e:
170 |             logger.error(f"Error explaining concept {concept}: {e}")
171 |             raise
172 | 
173 |     def troubleshoot_issue(self, problem_description: str, user_commands: List[str], system_output: str) -> dict:
174 |         logger.info(f"Troubleshooting issue: {problem_description}")
175 |         prompt = f"""
176 |         Troubleshoot the following Kubernetes issue:
177 | 
178 |         Problem: {problem_description}
179 |         User commands: {user_commands}
180 |         System output: {system_output}
181 | 
182 |         Provide possible causes, suggested actions, and an explanation.
183 |         """
184 | 
185 |         try:
186 |             completion = client.chat.completions.create(
187 |                 model="gpt-4o-mini-2024-07-18",
188 |                 messages=[
189 |                     {"role": "system", "content": "You are a Kubernetes expert troubleshooting issues."},
190 |                     {"role": "user", "content": prompt}
191 |                 ],
192 |                 response_format={"type": "json_schema", "schema": {
193 |                     "type": "object",
194 |                     "properties": {
195 |                         "possible_causes": {"type": "array", "items": {"type": "string"}},
196 |                         "suggested_actions": {"type": "array", "items": {"type": "string"}},
197 |                         "explanation": {"type": "string"}
198 |                     },
199 |                     "required": ["possible_causes", "suggested_actions", "explanation"],
200 |                     "additionalProperties": False
201 |                 }}
202 |             )
203 | 
204 |             troubleshooting = json.loads(completion.choices[0].message.content)
205 |             logger.info(f"Issue troubleshooted: {problem_description}")
206 |             return troubleshooting
207 |         except Exception as e:
208 |             logger.error(f"Error troubleshooting issue {problem_description}: {e}")
209 |             raise


--------------------------------------------------------------------------------
/app/services/db.py:
--------------------------------------------------------------------------------
  1 | # Copyright (c) 2024 Robert Cronin
  2 | #
  3 | # This software is released under the MIT License.
  4 | # https://opensource.org/licenses/MIT
  5 | 
  6 | import sqlite3
  7 | import json
  8 | from contextlib import contextmanager
  9 | from typing import List, Dict, Any
 10 | from datetime import datetime
 11 | from app.utils.logger import logger
 12 | 
 13 | DATABASE = None
 14 | 
 15 | 
 16 | @contextmanager
 17 | def get_db():
 18 |     global DATABASE
 19 |     db = sqlite3.connect(DATABASE)
 20 |     db.row_factory = sqlite3.Row
 21 |     try:
 22 |         yield db
 23 |     finally:
 24 |         db.close()
 25 | 
 26 | 
 27 | def init_db(db_path):
 28 |     global DATABASE
 29 |     DATABASE = db_path
 30 |     logger.info(f"Initializing database at {db_path}")
 31 |     with get_db() as db:
 32 |         db.executescript('''
 33 |             CREATE TABLE IF NOT EXISTS scenarios (
 34 |                 id INTEGER PRIMARY KEY AUTOINCREMENT,
 35 |                 title TEXT NOT NULL,
 36 |                 description TEXT NOT NULL,
 37 |                 setup_commands TEXT NOT NULL,
 38 |                 tasks TEXT NOT NULL,
 39 |                 hints TEXT NOT NULL,
 40 |                 solution TEXT NOT NULL,
 41 |                 verification_commands TEXT NOT NULL,
 42 |                 created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
 43 |             );
 44 | 
 45 |             CREATE TABLE IF NOT EXISTS notes (
 46 |                 id INTEGER PRIMARY KEY AUTOINCREMENT,
 47 |                 content TEXT NOT NULL,
 48 |                 created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
 49 |             );
 50 | 
 51 |             CREATE TABLE IF NOT EXISTS chat_history (
 52 |                 id INTEGER PRIMARY KEY AUTOINCREMENT,
 53 |                 scenario_id INTEGER,
 54 |                 role TEXT NOT NULL,
 55 |                 content TEXT NOT NULL,
 56 |                 timestamp TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
 57 |                 FOREIGN KEY (scenario_id) REFERENCES scenarios(id)
 58 |             );
 59 | 
 60 |             CREATE TABLE IF NOT EXISTS scenario_progress (
 61 |                 id INTEGER PRIMARY KEY AUTOINCREMENT,
 62 |                 scenario_id INTEGER NOT NULL,
 63 |                 status TEXT NOT NULL,
 64 |                 completed_tasks TEXT NOT NULL,
 65 |                 last_updated TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
 66 |                 FOREIGN KEY (scenario_id) REFERENCES scenarios(id)
 67 |             );
 68 |         ''')
 69 |         db.commit()
 70 |     logger.info("Database initialized successfully")
 71 | 
 72 | 
 73 | def store_scenario(scenario: Dict[str, Any]) -> int:
 74 |     logger.info(f"Storing scenario: {scenario['title']}")
 75 |     with get_db() as db:
 76 |         cursor = db.cursor()
 77 |         cursor.execute('''
 78 |             INSERT INTO scenarios 
 79 |             (title, description, setup_commands, tasks, hints, solution, verification_commands)
 80 |             VALUES (?, ?, ?, ?, ?, ?, ?)
 81 |         ''', (
 82 |             scenario['title'],
 83 |             scenario['description'],
 84 |             json.dumps(scenario['setup_commands']),
 85 |             json.dumps(scenario['tasks']),
 86 |             json.dumps(scenario['hints']),
 87 |             json.dumps(scenario['solution']),
 88 |             json.dumps(scenario['verification_commands'])
 89 |         ))
 90 |         db.commit()
 91 |         scenario_id = cursor.lastrowid
 92 |     logger.info(f"Scenario stored with id: {scenario_id}")
 93 |     return scenario_id
 94 | 
 95 | 
 96 | def delete_scenario(scenario_id: int) -> bool:
 97 |     logger.info(f"Deleting scenario with id: {scenario_id}")
 98 |     with get_db() as db:
 99 |         cursor = db.cursor()
100 |         cursor.execute("DELETE FROM scenarios WHERE id = ?", (scenario_id,))
101 |         db.commit()
102 |         rows_affected = cursor.rowcount
103 |     logger.info(f"Deleted scenario with id {
104 |                 scenario_id}. Rows affected: {rows_affected}")
105 |     return rows_affected > 0
106 | 
107 | 
108 | def get_scenario(scenario_id: int) -> Dict[str, Any]:
109 |     logger.info(f"Fetching scenario with id: {scenario_id}")
110 |     with get_db() as db:
111 |         cursor = db.cursor()
112 |         cursor.execute("SELECT * FROM scenarios WHERE id = ?", (scenario_id,))
113 |         row = cursor.fetchone()
114 |         if row:
115 |             scenario = dict(row)
116 |             for field in ['setup_commands', 'tasks', 'hints', 'solution', 'verification_commands']:
117 |                 if field in scenario and scenario[field]:
118 |                     scenario[field] = json.loads(scenario[field])
119 |                 else:
120 |                     scenario[field] = []
121 |             logger.info(f"Scenario fetched: {scenario}")
122 |             return scenario
123 |     logger.warning(f"Scenario with id {scenario_id} not found")
124 |     return None
125 | 
126 | 
127 | def store_note(content: str) -> int:
128 |     logger.info("Storing note")
129 |     with get_db() as db:
130 |         cursor = db.cursor()
131 |         cursor.execute(
132 |             "INSERT INTO notes (content) VALUES (?)",
133 |             (content,)
134 |         )
135 |         db.commit()
136 |         note_id = cursor.lastrowid
137 |     logger.info(f"Note stored with id: {note_id}")
138 |     return note_id
139 | 
140 | 
141 | def get_notes() -> List[Dict[str, Any]]:
142 |     logger.info("Fetching all notes")
143 |     with get_db() as db:
144 |         cursor = db.cursor()
145 |         cursor.execute("SELECT * FROM notes ORDER BY created_at DESC")
146 |         notes = [dict(row) for row in cursor.fetchall()]
147 |     logger.info(f"Fetched {len(notes)} notes")
148 |     return notes
149 | 
150 | 
151 | def store_chat_message(scenario_id: int, role: str, content: str) -> int:
152 |     logger.info(f"Storing chat message for scenario_id: {
153 |                 scenario_id}, role: {role}")
154 |     with get_db() as db:
155 |         cursor = db.cursor()
156 |         cursor.execute(
157 |             "INSERT INTO chat_history (scenario_id, role, content) VALUES (?, ?, ?)",
158 |             (scenario_id, role, content)
159 |         )
160 |         db.commit()
161 |         message_id = cursor.lastrowid
162 |     logger.info(f"Chat message stored with id: {message_id}")
163 |     return message_id
164 | 
165 | 
166 | def get_chat_history(scenario_id: int) -> List[Dict[str, Any]]:
167 |     logger.info(f"Fetching chat history for scenario_id: {scenario_id}")
168 |     with get_db() as db:
169 |         cursor = db.cursor()
170 |         cursor.execute(
171 |             "SELECT * FROM chat_history WHERE scenario_id = ? ORDER BY timestamp",
172 |             (scenario_id,)
173 |         )
174 |         chat_history = [dict(row) for row in cursor.fetchall()]
175 |     logger.info(f"Fetched {len(chat_history)} chat messages")
176 |     return chat_history
177 | 
178 | 
179 | def update_scenario_progress(scenario_id: int, status: str, completed_tasks: List[str]) -> None:
180 |     logger.info(f"Updating scenario progress for scenario_id: {scenario_id}")
181 |     with get_db() as db:
182 |         cursor = db.cursor()
183 |         cursor.execute('''
184 |             INSERT OR REPLACE INTO scenario_progress 
185 |             (scenario_id, status, completed_tasks, last_updated)
186 |             VALUES (?, ?, ?, ?)
187 |         ''', (
188 |             scenario_id,
189 |             status,
190 |             json.dumps(completed_tasks),
191 |             datetime.now().isoformat()
192 |         ))
193 |         db.commit()
194 |     logger.info(f"Scenario progress updated for scenario_id: {scenario_id}")
195 | 
196 | 
197 | def get_scenario_progress(scenario_id: int) -> Dict[str, Any]:
198 |     logger.info(f"Fetching scenario progress for scenario_id: {scenario_id}")
199 |     with get_db() as db:
200 |         cursor = db.cursor()
201 |         cursor.execute(
202 |             "SELECT * FROM scenario_progress WHERE scenario_id = ?",
203 |             (scenario_id,)
204 |         )
205 |         row = cursor.fetchone()
206 |         if row:
207 |             progress = dict(row)
208 |             progress['completed_tasks'] = json.loads(
209 |                 progress['completed_tasks'])
210 |             logger.info(f"Scenario progress fetched: {progress}")
211 |             return progress
212 |     logger.warning(f"Scenario progress for scenario_id {
213 |                    scenario_id} not found")
214 |     return None
215 | 
216 | 
217 | def get_all_scenarios() -> List[Dict[str, Any]]:
218 |     logger.info("Fetching all scenarios")
219 |     with get_db() as db:
220 |         cursor = db.cursor()
221 |         cursor.execute(
222 |             "SELECT id, title, description, tasks FROM scenarios ORDER BY created_at DESC")
223 |         scenarios = []
224 |         for row in cursor.fetchall():
225 |             scenario = dict(row)
226 |             scenario['tasks'] = json.loads(scenario['tasks'])
227 |             scenarios.append(scenario)
228 |     logger.info(f"Fetched {len(scenarios)} scenarios")
229 |     return scenarios
230 | 
231 | 
232 | def get_last_scenario_id() -> int:
233 |     logger.info("Fetching last scenario id")
234 |     with get_db() as db:
235 |         cursor = db.cursor()
236 |         cursor.execute("SELECT MAX(id) FROM scenarios")
237 |         result = cursor.fetchone()
238 |         last_id = result[0] if result[0] is not None else 0
239 |     logger.info(f"Last scenario id: {last_id}")
240 |     return last_id
241 | 


--------------------------------------------------------------------------------
/app/web/static/js/main.js:
--------------------------------------------------------------------------------
  1 | // Copyright (c) 2024 Robert Cronin
  2 | //
  3 | // This software is released under the MIT License.
  4 | // https://opensource.org/licenses/MIT
  5 | 
  6 | document.addEventListener("DOMContentLoaded", async () => {
  7 |   const scenarioTitle = document.getElementById("scenario-title");
  8 |   const scenarioDescription = document.getElementById("scenario-description");
  9 |   const taskList = document.getElementById("task-list");
 10 |   const checkButton = document.getElementById("check-button");
 11 |   const checkOutput = document.getElementById("check-output");
 12 |   const chatMessages = document.getElementById("chat-messages");
 13 |   const userInput = document.getElementById("user-input");
 14 |   const sendButton = document.getElementById("send-button");
 15 | 
 16 |   let currentScenarioId = null;
 17 |   let term = null;
 18 |   let socket = null;
 19 | 
 20 |   function initializeTerminal() {
 21 |     const terminalElement = document.getElementById("terminal");
 22 |     term = new Terminal({
 23 |       cursorBlink: true,
 24 |       fontSize: 14,
 25 |       fontFamily: 'Menlo, Monaco, "Courier New", monospace',
 26 |       theme: {
 27 |         background: "#282a36",
 28 |         foreground: "#f8f8f2",
 29 |         cursor: "#f8f8f2",
 30 |         selection: "rgba(248,248,242,0.3)",
 31 |         black: "#000000",
 32 |         red: "#ff5555",
 33 |         green: "#50fa7b",
 34 |         yellow: "#f1fa8c",
 35 |         blue: "#bd93f9",
 36 |         magenta: "#ff79c6",
 37 |         cyan: "#8be9fd",
 38 |         white: "#bfbfbf",
 39 |         brightBlack: "#4d4d4d",
 40 |         brightRed: "#ff6e67",
 41 |         brightGreen: "#5af78e",
 42 |         brightYellow: "#f4f99d",
 43 |         brightBlue: "#caa9fa",
 44 |         brightMagenta: "#ff92d0",
 45 |         brightCyan: "#9aedfe",
 46 |         brightWhite: "#e6e6e6",
 47 |       },
 48 |     });
 49 |     term.open(terminalElement);
 50 | 
 51 |     function fitTerminal() {
 52 |       const CHAR_WIDTH = 9;
 53 |       const CHAR_HEIGHT = 17;
 54 | 
 55 |       const cols = Math.floor(terminalElement.clientWidth / CHAR_WIDTH);
 56 |       const rows = Math.floor(terminalElement.clientHeight / CHAR_HEIGHT);
 57 | 
 58 |       term.resize(cols, rows);
 59 |     }
 60 | 
 61 |     fitTerminal();
 62 |     window.addEventListener("resize", fitTerminal);
 63 | 
 64 |     socket = io();
 65 | 
 66 |     socket.on("connect", () => {
 67 |       term.write(
 68 |         "\r\n\x1b[1;32m➜ \x1b[1;36mKubernetes Practice Assistant\x1b[0m\r\n"
 69 |       );
 70 |       writePrompt();
 71 |     });
 72 | 
 73 |     socket.on("output", (data) => {
 74 |       // Improve output formatting
 75 |       const formattedOutput = formatOutput(data);
 76 |       term.write(formattedOutput);
 77 |       writePrompt();
 78 |     });
 79 | 
 80 |     // Update the socket.on('output') handler
 81 |     socket.on("output", (data) => {
 82 |       const formattedOutput = formatOutput(data);
 83 |       term.write(formattedOutput);
 84 |       writePrompt();
 85 |     });
 86 | 
 87 | 
 88 | 
 89 |     let currentLine = "";
 90 |     let commandHistory = [];
 91 |     let historyIndex = -1;
 92 | 
 93 |     term.onKey(({ key, domEvent }) => {
 94 |       const printable = !domEvent.altKey && !domEvent.ctrlKey && !domEvent.metaKey;
 95 | 
 96 |       if (domEvent.keyCode === 13) { // Enter key
 97 |         term.write("\r\n");
 98 |         if (currentLine.trim()) {
 99 |           processCommand(currentLine);
100 |           commandHistory.push(currentLine);
101 |           historyIndex = commandHistory.length;
102 |         }
103 |         currentLine = "";
104 |       } else if (domEvent.keyCode === 8) { // Backspace
105 |         if (currentLine.length > 0) {
106 |           currentLine = currentLine.slice(0, -1);
107 |           term.write("\b \b");
108 |         }
109 |       } else if (domEvent.keyCode === 38) { // Up arrow
110 |         if (historyIndex > 0) {
111 |           historyIndex--;
112 |           currentLine = commandHistory[historyIndex];
113 |           term.write('\r\x1B[K' + getPrompt() + currentLine);
114 |         }
115 |       } else if (domEvent.keyCode === 40) { // Down arrow
116 |         if (historyIndex < commandHistory.length - 1) {
117 |           historyIndex++;
118 |           currentLine = commandHistory[historyIndex];
119 |           term.write('\r\x1B[K' + getPrompt() + currentLine);
120 |         } else if (historyIndex === commandHistory.length - 1) {
121 |           historyIndex = commandHistory.length;
122 |           currentLine = '';
123 |           term.write('\r\x1B[K' + getPrompt());
124 |         }
125 |       } else if (printable) {
126 |         currentLine += key;
127 |         term.write(key);
128 |       }
129 |     });
130 | 
131 |     function processCommand(command) {
132 |       if (command.trim() === 'clear') {
133 |         term.clear();
134 |       } else if (command.startsWith('k ') || command.startsWith('kubectl ')) {
135 |         // Handle kubectl commands
136 |         const kubectlCommand = command.replace(/^k /, 'kubectl ');
137 |         socket.emit("input", kubectlCommand);
138 |       } else {
139 |         socket.emit("input", command);
140 |       }
141 |     }
142 | 
143 |     socket.on("output", (data) => {
144 |       const formattedOutput = formatOutput(data);
145 |       term.writeln(formattedOutput);
146 |       writePrompt();
147 |     });
148 | 
149 |     function writePrompt() {
150 |       term.write(getPrompt());
151 |     }
152 | 
153 |     function getPrompt() {
154 |       return "\r\n\x1B[1;32m➜\x1B[0m \x1B[1;34m~/kubernetes\x1B[0m \x1B[1;36m(main)\x1B[0m $ ";
155 |     }
156 | 
157 |     writePrompt();
158 |   }
159 | 
160 |   // function writePrompt() {
161 |   //   const username = "user";
162 |   //   const hostname = "kpa";
163 |   //   const currentDir = "~/kubernetes";
164 |   //   const gitBranch = "main";
165 |   //   term.write(
166 |   //     `\r\n\x1b[1;32m➜ \x1b[1;36m${username}@${hostname}\x1b[0m:\x1b[1;34m${currentDir}\x1b[0m \x1b[1;33m(${gitBranch})\x1b[0m `
167 |   //   );
168 |   // }
169 |   //
170 |   function loadScenario() {
171 |     const urlParams = new URLSearchParams(window.location.search);
172 |     const scenarioId = urlParams.get("id");
173 | 
174 |     if (scenarioId) {
175 |       fetch(`/api/scenarios/${scenarioId}`)
176 |         .then((response) => {
177 |           if (!response.ok) {
178 |             throw new Error(`HTTP error! status: ${response.status}`);
179 |           }
180 |           return response.json();
181 |         })
182 |         .then((scenario) => {
183 |           console.log("Scenario loaded:", scenario);
184 |           currentScenarioId = scenario.id;
185 |           scenarioTitle.textContent = scenario.title;
186 |           scenarioDescription.textContent = scenario.description;
187 |           taskList.innerHTML = scenario.tasks
188 |             .map((task) => `<li>${task}</li>`)
189 |             .join("");
190 |           addMessage(
191 |             "ai",
192 |             "Welcome to the new scenario! How can I assist you?"
193 |           );
194 |         })
195 |         .catch((error) => {
196 |           console.error("Error loading scenario:", error);
197 |           scenarioTitle.textContent = "Error loading scenario";
198 |           scenarioDescription.textContent = "Please try refreshing the page.";
199 |         });
200 |     } else {
201 |       scenarioTitle.textContent = "No scenario selected";
202 |       scenarioDescription.textContent =
203 |         "Please select a scenario from the home page.";
204 |     }
205 |   }
206 | 
207 | 
208 |   function formatOutput(outputData) {
209 |     try {
210 |       const data = JSON.parse(outputData);
211 |       switch (data.type) {
212 |         case "ls":
213 |           return formatLsOutput(data.content);
214 |         case "error":
215 |           return `\x1B[1;31m${data.content}\x1B[0m`;
216 |         case "text":
217 |           return data.content;
218 |         default:
219 |           return outputData;
220 |       }
221 |     } catch (e) {
222 |       console.error("Error parsing output:", e);
223 |       return outputData;
224 |     }
225 |   }
226 | 
227 |   function formatLsOutput(files) {
228 |     const columns = 4; // Number of columns for ls output
229 |     const formattedFiles = files.map(file => {
230 |       if (file.endsWith("/")) {
231 |         // Blue for directories
232 |         return `\x1B[1;34m${file.padEnd(20)}\x1B[0m`;
233 |       } else if (file.match(/\.(exe|sh|bat)$/)) {
234 |         // Green for executables
235 |         return `\x1B[1;32m${file.padEnd(20)}\x1B[0m`;
236 |       }
237 |       return file.padEnd(20);
238 |     });
239 | 
240 |     let output = "";
241 |     for (let i = 0; i < formattedFiles.length; i += columns) {
242 |       output += formattedFiles.slice(i, i + columns).join("") + "\r\n";
243 |     }
244 |     return output;
245 |   }
246 | 
247 |   function addMessage(sender, content) {
248 |     const messageElement = document.createElement("div");
249 |     messageElement.classList.add("message", `${sender}-message`);
250 |     messageElement.textContent = content;
251 |     chatMessages.appendChild(messageElement);
252 |     chatMessages.scrollTop = chatMessages.scrollHeight;
253 |   }
254 | 
255 |   function sendMessage() {
256 |     const message = userInput.value.trim();
257 |     if (message) {
258 |       addMessage("user", message);
259 |       userInput.value = "";
260 | 
261 |       fetch("/api/ai-chat", {
262 |         method: "POST",
263 |         headers: {
264 |           "Content-Type": "application/json",
265 |         },
266 |         body: JSON.stringify({ message, scenarioId: currentScenarioId }),
267 |       })
268 |         .then((response) => {
269 |           if (!response.ok) {
270 |             throw new Error(`HTTP error! status: ${response.status}`);
271 |           }
272 |           return response.json();
273 |         })
274 |         .then((data) => {
275 |           addMessage("ai", data.response);
276 |         })
277 |         .catch((error) => {
278 |           console.error("Error sending message:", error);
279 |           addMessage(
280 |             "ai",
281 |             "Sorry, there was an error processing your message. Please try again."
282 |           );
283 |         });
284 |     }
285 |   }
286 | 
287 |   checkButton.addEventListener("click", () => {
288 |     fetch(`/api/scenarios/${currentScenarioId}/validate`, { method: "POST" })
289 |       .then((response) => {
290 |         if (!response.ok) {
291 |           throw new Error(`HTTP error! status: ${response.status}`);
292 |         }
293 |         return response.json();
294 |       })
295 |       .then((data) => {
296 |         checkOutput.textContent = data.message;
297 |       })
298 |       .catch((error) => {
299 |         console.error("Error validating scenario:", error);
300 |         checkOutput.textContent =
301 |           "Error validating scenario. Please try again.";
302 |       });
303 |   });
304 | 
305 |   sendButton.addEventListener("click", sendMessage);
306 | 
307 |   userInput.addEventListener("keypress", (e) => {
308 |     if (e.key === "Enter" && !e.shiftKey) {
309 |       e.preventDefault();
310 |       sendMessage();
311 |     }
312 |   });
313 | 
314 |   loadScenario();
315 |   initializeTerminal();
316 | });
317 | 
318 | console.log("main.js loaded");
319 | 


--------------------------------------------------------------------------------
/website/static/img/undraw_docusaurus_tree.svg:
--------------------------------------------------------------------------------
 1 | <svg xmlns="http://www.w3.org/2000/svg" width="1129" height="663" viewBox="0 0 1129 663">
 2 |   <title>Focus on What Matters</title>
 3 |   <circle cx="321" cy="321" r="321" fill="#f2f2f2" />
 4 |   <ellipse cx="559" cy="635.49998" rx="514" ry="27.50002" fill="#3f3d56" />
 5 |   <ellipse cx="558" cy="627" rx="460" ry="22" opacity="0.2" />
 6 |   <rect x="131" y="152.5" width="840" height="50" fill="#3f3d56" />
 7 |   <path d="M166.5,727.3299A21.67009,21.67009,0,0,0,188.1701,749H984.8299A21.67009,21.67009,0,0,0,1006.5,727.3299V296h-840Z" transform="translate(-35.5 -118.5)" fill="#3f3d56" />
 8 |   <path d="M984.8299,236H188.1701A21.67009,21.67009,0,0,0,166.5,257.6701V296h840V257.6701A21.67009,21.67009,0,0,0,984.8299,236Z" transform="translate(-35.5 -118.5)" fill="#3f3d56" />
 9 |   <path d="M984.8299,236H188.1701A21.67009,21.67009,0,0,0,166.5,257.6701V296h840V257.6701A21.67009,21.67009,0,0,0,984.8299,236Z" transform="translate(-35.5 -118.5)" opacity="0.2" />
10 |   <circle cx="181" cy="147.5" r="13" fill="#3f3d56" />
11 |   <circle cx="217" cy="147.5" r="13" fill="#3f3d56" />
12 |   <circle cx="253" cy="147.5" r="13" fill="#3f3d56" />
13 |   <rect x="168" y="213.5" width="337" height="386" rx="5.33505" fill="#606060" />
14 |   <rect x="603" y="272.5" width="284" height="22" rx="5.47638" fill="#2e8555" />
15 |   <rect x="537" y="352.5" width="416" height="15" rx="5.47638" fill="#2e8555" />
16 |   <rect x="537" y="396.5" width="416" height="15" rx="5.47638" fill="#2e8555" />
17 |   <rect x="537" y="440.5" width="416" height="15" rx="5.47638" fill="#2e8555" />
18 |   <rect x="537" y="484.5" width="416" height="15" rx="5.47638" fill="#2e8555" />
19 |   <rect x="865" y="552.5" width="88" height="26" rx="7.02756" fill="#3ecc5f" />
20 |   <path d="M1088.60287,624.61594a30.11371,30.11371,0,0,0,3.98291-15.266c0-13.79652-8.54358-24.98081-19.08256-24.98081s-19.08256,11.18429-19.08256,24.98081a30.11411,30.11411,0,0,0,3.98291,15.266,31.248,31.248,0,0,0,0,30.53213,31.248,31.248,0,0,0,0,30.53208,31.248,31.248,0,0,0,0,30.53208,30.11408,30.11408,0,0,0-3.98291,15.266c0,13.79652,8.54353,24.98081,19.08256,24.98081s19.08256-11.18429,19.08256-24.98081a30.11368,30.11368,0,0,0-3.98291-15.266,31.248,31.248,0,0,0,0-30.53208,31.248,31.248,0,0,0,0-30.53208,31.248,31.248,0,0,0,0-30.53213Z" transform="translate(-35.5 -118.5)" fill="#3f3d56" />
21 |   <ellipse cx="1038.00321" cy="460.31783" rx="19.08256" ry="24.9808" fill="#3f3d56" />
22 |   <ellipse cx="1038.00321" cy="429.78574" rx="19.08256" ry="24.9808" fill="#3f3d56" />
23 |   <path d="M1144.93871,339.34489a91.61081,91.61081,0,0,0,7.10658-10.46092l-50.141-8.23491,54.22885.4033a91.566,91.566,0,0,0,1.74556-72.42605l-72.75449,37.74139,67.09658-49.32086a91.41255,91.41255,0,1,0-150.971,102.29805,91.45842,91.45842,0,0,0-10.42451,16.66946l65.0866,33.81447-69.40046-23.292a91.46011,91.46011,0,0,0,14.73837,85.83669,91.40575,91.40575,0,1,0,143.68892,0,91.41808,91.41808,0,0,0,0-113.02862Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
24 |   <path d="M981.6885,395.8592a91.01343,91.01343,0,0,0,19.56129,56.51431,91.40575,91.40575,0,1,0,143.68892,0C1157.18982,436.82067,981.6885,385.60008,981.6885,395.8592Z" transform="translate(-35.5 -118.5)" opacity="0.1" />
25 |   <path d="M365.62,461.43628H477.094v45.12043H365.62Z" transform="translate(-35.5 -118.5)" fill="#fff" fill-rule="evenodd" />
26 |   <path d="M264.76252,608.74122a26.50931,26.50931,0,0,1-22.96231-13.27072,26.50976,26.50976,0,0,0,22.96231,39.81215H291.304V608.74122Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
27 |   <path d="M384.17242,468.57061l92.92155-5.80726V449.49263a26.54091,26.54091,0,0,0-26.54143-26.54143H331.1161l-3.31768-5.74622a3.83043,3.83043,0,0,0-6.63536,0l-3.31768,5.74622-3.31767-5.74622a3.83043,3.83043,0,0,0-6.63536,0l-3.31768,5.74622L301.257,417.205a3.83043,3.83043,0,0,0-6.63536,0L291.304,422.9512c-.02919,0-.05573.004-.08625.004l-5.49674-5.49541a3.8293,3.8293,0,0,0-6.4071,1.71723l-1.81676,6.77338L270.607,424.1031a3.82993,3.82993,0,0,0-4.6912,4.69253l1.84463,6.89148-6.77072,1.81411a3.8315,3.8315,0,0,0-1.71988,6.40975l5.49673,5.49673c0,.02787-.004.05574-.004.08493l-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74621,3.31768L259.0163,466.081a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31767a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31767a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83042,3.83042,0,0,0,0,6.63535l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768L259.0163,558.976a3.83042,3.83042,0,0,0,0,6.63535l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83042,3.83042,0,0,0,0,6.63535l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768A26.54091,26.54091,0,0,0,291.304,635.28265H450.55254A26.5409,26.5409,0,0,0,477.094,608.74122V502.5755l-92.92155-5.80727a14.12639,14.12639,0,0,1,0-28.19762" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
28 |   <path d="M424.01111,635.28265h39.81214V582.19979H424.01111Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
29 |   <path d="M490.36468,602.10586a6.60242,6.60242,0,0,0-.848.08493c-.05042-.19906-.09821-.39945-.15393-.59852A6.62668,6.62668,0,1,0,482.80568,590.21q-.2203-.22491-.44457-.44589a6.62391,6.62391,0,1,0-11.39689-6.56369c-.1964-.05575-.39414-.10218-.59056-.15262a6.63957,6.63957,0,1,0-13.10086,0c-.1964.05042-.39414.09687-.59056.15262a6.62767,6.62767,0,1,0-11.39688,6.56369,26.52754,26.52754,0,1,0,44.23127,25.52756,6.6211,6.6211,0,1,0,.848-13.18579" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd" />
30 |   <path d="M437.28182,555.65836H477.094V529.11693H437.28182Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
31 |   <path d="M490.36468,545.70532a3.31768,3.31768,0,0,0,0-6.63536,3.41133,3.41133,0,0,0-.42333.04247c-.02655-.09953-.04911-.19907-.077-.29859a3.319,3.319,0,0,0-1.278-6.37923,3.28174,3.28174,0,0,0-2.00122.68742q-.10947-.11346-.22294-.22295a3.282,3.282,0,0,0,.67149-1.98265,3.31768,3.31768,0,0,0-6.37-1.2992,13.27078,13.27078,0,1,0,0,25.54082,3.31768,3.31768,0,0,0,6.37-1.2992,3.282,3.282,0,0,0-.67149-1.98265q.11347-.10947.22294-.22294a3.28174,3.28174,0,0,0,2.00122.68742,3.31768,3.31768,0,0,0,1.278-6.37923c.02786-.0982.05042-.19907.077-.29859a3.41325,3.41325,0,0,0,.42333.04246" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd" />
32 |   <path d="M317.84538,466.081a3.31768,3.31768,0,0,1-3.31767-3.31768,9.953,9.953,0,1,0-19.90608,0,3.31768,3.31768,0,1,1-6.63535,0,16.58839,16.58839,0,1,1,33.17678,0,3.31768,3.31768,0,0,1-3.31768,3.31768" transform="translate(-35.5 -118.5)" fill-rule="evenodd" />
33 |   <path d="M370.92825,635.28265h79.62429A26.5409,26.5409,0,0,0,477.094,608.74122v-92.895H397.46968a26.54091,26.54091,0,0,0-26.54143,26.54143Z" transform="translate(-35.5 -118.5)" fill="#ffff50" fill-rule="evenodd" />
34 |   <path d="M457.21444,556.98543H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.54143H390.80778a1.32707,1.32707,0,1,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.54143H390.80778a1.32707,1.32707,0,1,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0-66.10674H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.29459H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.54143H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414M477.094,474.19076c-.01592,0-.0292-.008-.04512-.00663-4.10064.13934-6.04083,4.24132-7.75274,7.86024-1.78623,3.78215-3.16771,6.24122-5.43171,6.16691-2.50685-.09024-3.94007-2.92222-5.45825-5.91874-1.74377-3.44243-3.73438-7.34667-7.91333-7.20069-4.04227.138-5.98907,3.70784-7.70631,6.857-1.82738,3.35484-3.07084,5.39455-5.46887,5.30033-2.55727-.09289-3.91619-2.39536-5.48877-5.06013-1.75306-2.96733-3.77951-6.30359-7.8775-6.18946-3.97326.13669-5.92537,3.16507-7.64791,5.83912-1.82207,2.82666-3.09872,4.5492-5.52725,4.447-2.61832-.09289-3.9706-2.00388-5.53522-4.21611-1.757-2.4856-3.737-5.299-7.82308-5.16231-3.88567.13271-5.83779,2.61434-7.559,4.80135-1.635,2.07555-2.9116,3.71846-5.61218,3.615a1.32793,1.32793,0,1,0-.09555,2.65414c4.00377.134,6.03154-2.38873,7.79257-4.6275,1.562-1.9853,2.91027-3.69855,5.56441-3.78879,2.55594-.10882,3.75429,1.47968,5.56707,4.04093,1.7212,2.43385,3.67465,5.19416,7.60545,5.33616,4.11789.138,6.09921-2.93946,7.8536-5.66261,1.56861-2.43385,2.92221-4.53461,5.50734-4.62352,2.37944-.08892,3.67466,1.79154,5.50072,4.885,1.72121,2.91557,3.67069,6.21865,7.67977,6.36463,4.14709.14332,6.14965-3.47693,7.89475-6.68181,1.51155-2.77092,2.93814-5.38791,5.46621-5.4755,2.37944-.05573,3.62025,2.11668,5.45558,5.74622,1.71459,3.388,3.65875,7.22591,7.73019,7.37321l.22429.004c4.06614,0,5.99571-4.08074,7.70364-7.68905,1.51154-3.19825,2.94211-6.21069,5.3972-6.33411Z" transform="translate(-35.5 -118.5)" fill-rule="evenodd" />
35 |   <path d="M344.38682,635.28265h53.08286V582.19979H344.38682Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
36 |   <path d="M424.01111,602.10586a6.60242,6.60242,0,0,0-.848.08493c-.05042-.19906-.09821-.39945-.15394-.59852A6.62667,6.62667,0,1,0,416.45211,590.21q-.2203-.22491-.44458-.44589a6.62391,6.62391,0,1,0-11.39689-6.56369c-.1964-.05575-.39413-.10218-.59054-.15262a6.63957,6.63957,0,1,0-13.10084,0c-.19641.05042-.39414.09687-.59055.15262a6.62767,6.62767,0,1,0-11.39689,6.56369,26.52755,26.52755,0,1,0,44.2313,25.52756,6.6211,6.6211,0,1,0,.848-13.18579" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd" />
37 |   <path d="M344.38682,555.65836h53.08286V529.11693H344.38682Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd" />
38 |   <path d="M410.74039,545.70532a3.31768,3.31768,0,1,0,0-6.63536,3.41133,3.41133,0,0,0-.42333.04247c-.02655-.09953-.04911-.19907-.077-.29859a3.319,3.319,0,0,0-1.278-6.37923,3.28174,3.28174,0,0,0-2.00122.68742q-.10947-.11346-.22294-.22295a3.282,3.282,0,0,0,.67149-1.98265,3.31768,3.31768,0,0,0-6.37-1.2992,13.27078,13.27078,0,1,0,0,25.54082,3.31768,3.31768,0,0,0,6.37-1.2992,3.282,3.282,0,0,0-.67149-1.98265q.11347-.10947.22294-.22294a3.28174,3.28174,0,0,0,2.00122.68742,3.31768,3.31768,0,0,0,1.278-6.37923c.02786-.0982.05042-.19907.077-.29859a3.41325,3.41325,0,0,0,.42333.04246" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd" />
39 |   <path d="M424.01111,447.8338a3.60349,3.60349,0,0,1-.65028-.06636,3.34415,3.34415,0,0,1-.62372-.18579,3.44679,3.44679,0,0,1-.572-.30522,5.02708,5.02708,0,0,1-.50429-.4114,3.88726,3.88726,0,0,1-.41007-.50428,3.27532,3.27532,0,0,1-.55737-1.84463,3.60248,3.60248,0,0,1,.06636-.65027,3.82638,3.82638,0,0,1,.18447-.62373,3.48858,3.48858,0,0,1,.30656-.57064,3.197,3.197,0,0,1,.91436-.91568,3.44685,3.44685,0,0,1,.572-.30523,3.344,3.344,0,0,1,.62372-.18578,3.06907,3.06907,0,0,1,1.30053,0,3.22332,3.22332,0,0,1,1.19436.491,5.02835,5.02835,0,0,1,.50429.41139,4.8801,4.8801,0,0,1,.41139.50429,3.38246,3.38246,0,0,1,.30522.57064,3.47806,3.47806,0,0,1,.25215,1.274A3.36394,3.36394,0,0,1,426.36,446.865a5.02708,5.02708,0,0,1-.50429.4114,3.3057,3.3057,0,0,1-1.84463.55737m26.54143-1.65884a3.38754,3.38754,0,0,1-2.35024-.96877,5.04185,5.04185,0,0,1-.41007-.50428,3.27532,3.27532,0,0,1-.55737-1.84463,3.38659,3.38659,0,0,1,.96744-2.34892,5.02559,5.02559,0,0,1,.50429-.41139,3.44685,3.44685,0,0,1,.572-.30523,3.3432,3.3432,0,0,1,.62373-.18579,3.06952,3.06952,0,0,1,1.30052,0,3.22356,3.22356,0,0,1,1.19436.491,5.02559,5.02559,0,0,1,.50429.41139,3.38792,3.38792,0,0,1,.96876,2.34892,3.72635,3.72635,0,0,1-.06636.65026,3.37387,3.37387,0,0,1-.18579.62373,4.71469,4.71469,0,0,1-.30522.57064,4.8801,4.8801,0,0,1-.41139.50429,5.02559,5.02559,0,0,1-.50429.41139,3.30547,3.30547,0,0,1-1.84463.55737" transform="translate(-35.5 -118.5)" fill-rule="evenodd" />
40 | </svg>
41 | 


--------------------------------------------------------------------------------
/website/static/img/undraw_docusaurus_mountain.svg:
--------------------------------------------------------------------------------
  1 | <svg xmlns="http://www.w3.org/2000/svg" width="1088" height="687.962" viewBox="0 0 1088 687.962">
  2 |   <title>Easy to Use</title>
  3 |   <g id="Group_12" data-name="Group 12" transform="translate(-57 -56)">
  4 |     <g id="Group_11" data-name="Group 11" transform="translate(57 56)">
  5 |       <path id="Path_83" data-name="Path 83" d="M1017.81,560.461c-5.27,45.15-16.22,81.4-31.25,110.31-20,38.52-54.21,54.04-84.77,70.28a193.275,193.275,0,0,1-27.46,11.94c-55.61,19.3-117.85,14.18-166.74,3.99a657.282,657.282,0,0,0-104.09-13.16q-14.97-.675-29.97-.67c-15.42.02-293.07,5.29-360.67-131.57-16.69-33.76-28.13-75-32.24-125.27-11.63-142.12,52.29-235.46,134.74-296.47,155.97-115.41,369.76-110.57,523.43,7.88C941.15,276.621,1036.99,396.031,1017.81,560.461Z" transform="translate(-56 -106.019)" fill="#3f3d56"/>
  6 |       <path id="Path_84" data-name="Path 84" d="M986.56,670.771c-20,38.52-47.21,64.04-77.77,80.28a193.272,193.272,0,0,1-27.46,11.94c-55.61,19.3-117.85,14.18-166.74,3.99a657.3,657.3,0,0,0-104.09-13.16q-14.97-.675-29.97-.67-23.13.03-46.25,1.72c-100.17,7.36-253.82-6.43-321.42-143.29L382,283.981,444.95,445.6l20.09,51.59,55.37-75.98L549,381.981l130.2,149.27,36.8-81.27L970.78,657.9l14.21,11.59Z" transform="translate(-56 -106.019)" fill="#f2f2f2"/>
  7 |       <path id="Path_85" data-name="Path 85" d="M302,282.962l26-57,36,83-31-60Z" opacity="0.1"/>
  8 |       <path id="Path_86" data-name="Path 86" d="M610.5,753.821q-14.97-.675-29.97-.67L465.04,497.191Z" transform="translate(-56 -106.019)" opacity="0.1"/>
  9 |       <path id="Path_87" data-name="Path 87" d="M464.411,315.191,493,292.962l130,150-132-128Z" opacity="0.1"/>
 10 |       <path id="Path_88" data-name="Path 88" d="M908.79,751.051a193.265,193.265,0,0,1-27.46,11.94L679.2,531.251Z" transform="translate(-56 -106.019)" opacity="0.1"/>
 11 |       <circle id="Ellipse_11" data-name="Ellipse 11" cx="3" cy="3" r="3" transform="translate(479 98.962)" fill="#f2f2f2"/>
 12 |       <circle id="Ellipse_12" data-name="Ellipse 12" cx="3" cy="3" r="3" transform="translate(396 201.962)" fill="#f2f2f2"/>
 13 |       <circle id="Ellipse_13" data-name="Ellipse 13" cx="2" cy="2" r="2" transform="translate(600 220.962)" fill="#f2f2f2"/>
 14 |       <circle id="Ellipse_14" data-name="Ellipse 14" cx="2" cy="2" r="2" transform="translate(180 265.962)" fill="#f2f2f2"/>
 15 |       <circle id="Ellipse_15" data-name="Ellipse 15" cx="2" cy="2" r="2" transform="translate(612 96.962)" fill="#f2f2f2"/>
 16 |       <circle id="Ellipse_16" data-name="Ellipse 16" cx="2" cy="2" r="2" transform="translate(736 192.962)" fill="#f2f2f2"/>
 17 |       <circle id="Ellipse_17" data-name="Ellipse 17" cx="2" cy="2" r="2" transform="translate(858 344.962)" fill="#f2f2f2"/>
 18 |       <path id="Path_89" data-name="Path 89" d="M306,121.222h-2.76v-2.76h-1.48v2.76H299V122.7h2.76v2.759h1.48V122.7H306Z" fill="#f2f2f2"/>
 19 |       <path id="Path_90" data-name="Path 90" d="M848,424.222h-2.76v-2.76h-1.48v2.76H841V425.7h2.76v2.759h1.48V425.7H848Z" fill="#f2f2f2"/>
 20 |       <path id="Path_91" data-name="Path 91" d="M1144,719.981c0,16.569-243.557,74-544,74s-544-57.431-544-74,243.557,14,544,14S1144,703.413,1144,719.981Z" transform="translate(-56 -106.019)" fill="#3f3d56"/>
 21 |       <path id="Path_92" data-name="Path 92" d="M1144,719.981c0,16.569-243.557,74-544,74s-544-57.431-544-74,243.557,14,544,14S1144,703.413,1144,719.981Z" transform="translate(-56 -106.019)" opacity="0.1"/>
 22 |       <ellipse id="Ellipse_18" data-name="Ellipse 18" cx="544" cy="30" rx="544" ry="30" transform="translate(0 583.962)" fill="#3f3d56"/>
 23 |       <path id="Path_93" data-name="Path 93" d="M624,677.981c0,33.137-14.775,24-33,24s-33,9.137-33-24,33-96,33-96S624,644.844,624,677.981Z" transform="translate(-56 -106.019)" fill="#ff6584"/>
 24 |       <path id="Path_94" data-name="Path 94" d="M606,690.66c0,15.062-6.716,10.909-15,10.909s-15,4.153-15-10.909,15-43.636,15-43.636S606,675.6,606,690.66Z" transform="translate(-56 -106.019)" opacity="0.1"/>
 25 |       <rect id="Rectangle_97" data-name="Rectangle 97" width="92" height="18" rx="9" transform="translate(489 604.962)" fill="#2f2e41"/>
 26 |       <rect id="Rectangle_98" data-name="Rectangle 98" width="92" height="18" rx="9" transform="translate(489 586.962)" fill="#2f2e41"/>
 27 |       <path id="Path_95" data-name="Path 95" d="M193,596.547c0,55.343,34.719,100.126,77.626,100.126" transform="translate(-56 -106.019)" fill="#3f3d56"/>
 28 |       <path id="Path_96" data-name="Path 96" d="M270.626,696.673c0-55.965,38.745-101.251,86.626-101.251" transform="translate(-56 -106.019)" fill="#6c63ff"/>
 29 |       <path id="Path_97" data-name="Path 97" d="M221.125,601.564c0,52.57,22.14,95.109,49.5,95.109" transform="translate(-56 -106.019)" fill="#6c63ff"/>
 30 |       <path id="Path_98" data-name="Path 98" d="M270.626,696.673c0-71.511,44.783-129.377,100.126-129.377" transform="translate(-56 -106.019)" fill="#3f3d56"/>
 31 |       <path id="Path_99" data-name="Path 99" d="M254.3,697.379s11.009-.339,14.326-2.7,16.934-5.183,17.757-1.395,16.544,18.844,4.115,18.945-28.879-1.936-32.19-3.953S254.3,697.379,254.3,697.379Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
 32 |       <path id="Path_100" data-name="Path 100" d="M290.716,710.909c-12.429.1-28.879-1.936-32.19-3.953-2.522-1.536-3.527-7.048-3.863-9.591l-.368.014s.7,8.879,4.009,10.9,19.761,4.053,32.19,3.953c3.588-.029,4.827-1.305,4.759-3.2C294.755,710.174,293.386,710.887,290.716,710.909Z" transform="translate(-56 -106.019)" opacity="0.2"/>
 33 |       <path id="Path_101" data-name="Path 101" d="M777.429,633.081c0,38.029,23.857,68.8,53.341,68.8" transform="translate(-56 -106.019)" fill="#3f3d56"/>
 34 |       <path id="Path_102" data-name="Path 102" d="M830.769,701.882c0-38.456,26.623-69.575,59.525-69.575" transform="translate(-56 -106.019)" fill="#6c63ff"/>
 35 |       <path id="Path_103" data-name="Path 103" d="M796.755,636.528c0,36.124,15.213,65.354,34.014,65.354" transform="translate(-56 -106.019)" fill="#6c63ff"/>
 36 |       <path id="Path_104" data-name="Path 104" d="M830.769,701.882c0-49.139,30.773-88.9,68.8-88.9" transform="translate(-56 -106.019)" fill="#3f3d56"/>
 37 |       <path id="Path_105" data-name="Path 105" d="M819.548,702.367s7.565-.233,9.844-1.856,11.636-3.562,12.2-.958,11.368,12.949,2.828,13.018-19.844-1.33-22.119-2.716S819.548,702.367,819.548,702.367Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
 38 |       <path id="Path_106" data-name="Path 106" d="M844.574,711.664c-8.54.069-19.844-1.33-22.119-2.716-1.733-1.056-2.423-4.843-2.654-6.59l-.253.01s.479,6.1,2.755,7.487,13.579,2.785,22.119,2.716c2.465-.02,3.317-.9,3.27-2.2C847.349,711.159,846.409,711.649,844.574,711.664Z" transform="translate(-56 -106.019)" opacity="0.2"/>
 39 |       <path id="Path_107" data-name="Path 107" d="M949.813,724.718s11.36-1.729,14.5-4.591,16.89-7.488,18.217-3.667,19.494,17.447,6.633,19.107-30.153,1.609-33.835-.065S949.813,724.718,949.813,724.718Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
 40 |       <path id="Path_108" data-name="Path 108" d="M989.228,734.173c-12.86,1.659-30.153,1.609-33.835-.065-2.8-1.275-4.535-6.858-5.2-9.45l-.379.061s1.833,9.109,5.516,10.783,20.975,1.725,33.835.065c3.712-.479,4.836-1.956,4.529-3.906C993.319,732.907,991.991,733.817,989.228,734.173Z" transform="translate(-56 -106.019)" opacity="0.2"/>
 41 |       <path id="Path_109" data-name="Path 109" d="M670.26,723.9s9.587-1.459,12.237-3.875,14.255-6.32,15.374-3.095,16.452,14.725,5.6,16.125-25.448,1.358-28.555-.055S670.26,723.9,670.26,723.9Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
 42 |       <path id="Path_110" data-name="Path 110" d="M703.524,731.875c-10.853,1.4-25.448,1.358-28.555-.055-2.367-1.076-3.827-5.788-4.39-7.976l-.32.051s1.547,7.687,4.655,9.1,17.7,1.456,28.555.055c3.133-.4,4.081-1.651,3.822-3.3C706.977,730.807,705.856,731.575,703.524,731.875Z" transform="translate(-56 -106.019)" opacity="0.2"/>
 43 |       <path id="Path_111" data-name="Path 111" d="M178.389,719.109s7.463-1.136,9.527-3.016,11.1-4.92,11.969-2.409,12.808,11.463,4.358,12.553-19.811,1.057-22.23-.043S178.389,719.109,178.389,719.109Z" transform="translate(-56 -106.019)" fill="#a8a8a8"/>
 44 |       <path id="Path_112" data-name="Path 112" d="M204.285,725.321c-8.449,1.09-19.811,1.057-22.23-.043-1.842-.838-2.979-4.506-3.417-6.209l-.249.04s1.2,5.984,3.624,7.085,13.781,1.133,22.23.043c2.439-.315,3.177-1.285,2.976-2.566C206.973,724.489,206.1,725.087,204.285,725.321Z" transform="translate(-56 -106.019)" opacity="0.2"/>
 45 |       <path id="Path_113" data-name="Path 113" d="M439.7,707.337c0,30.22-42.124,20.873-93.7,20.873s-93.074,9.347-93.074-20.873,42.118-36.793,93.694-36.793S439.7,677.117,439.7,707.337Z" transform="translate(-56 -106.019)" opacity="0.1"/>
 46 |       <path id="Path_114" data-name="Path 114" d="M439.7,699.9c0,30.22-42.124,20.873-93.7,20.873s-93.074,9.347-93.074-20.873S295.04,663.1,346.616,663.1,439.7,669.676,439.7,699.9Z" transform="translate(-56 -106.019)" fill="#3f3d56"/>
 47 |     </g>
 48 |     <g id="docusaurus_keytar" transform="translate(312.271 493.733)">
 49 |       <path id="Path_40" data-name="Path 40" d="M99,52h91.791V89.153H99Z" transform="translate(5.904 -14.001)" fill="#fff" fill-rule="evenodd"/>
 50 |       <path id="Path_41" data-name="Path 41" d="M24.855,163.927A21.828,21.828,0,0,1,5.947,153a21.829,21.829,0,0,0,18.908,32.782H46.71V163.927Z" transform="translate(-3 -4.634)" fill="#3ecc5f" fill-rule="evenodd"/>
 51 |       <path id="Path_42" data-name="Path 42" d="M121.861,61.1l76.514-4.782V45.39A21.854,21.854,0,0,0,176.52,23.535H78.173L75.441,18.8a3.154,3.154,0,0,0-5.464,0l-2.732,4.732L64.513,18.8a3.154,3.154,0,0,0-5.464,0l-2.732,4.732L53.586,18.8a3.154,3.154,0,0,0-5.464,0L45.39,23.535c-.024,0-.046,0-.071,0l-4.526-4.525a3.153,3.153,0,0,0-5.276,1.414l-1.5,5.577-5.674-1.521a3.154,3.154,0,0,0-3.863,3.864L26,34.023l-5.575,1.494a3.155,3.155,0,0,0-1.416,5.278l4.526,4.526c0,.023,0,.046,0,.07L18.8,48.122a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,59.05a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,69.977a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,80.9a3.154,3.154,0,0,0,0,5.464L23.535,89.1,18.8,91.832a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,102.76a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,113.687a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,124.615a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,135.542a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,146.469a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,157.4a3.154,3.154,0,0,0,0,5.464l4.732,2.732L18.8,168.324a3.154,3.154,0,0,0,0,5.464l4.732,2.732A21.854,21.854,0,0,0,45.39,198.375H176.52a21.854,21.854,0,0,0,21.855-21.855V89.1l-76.514-4.782a11.632,11.632,0,0,1,0-23.219" transform="translate(-1.681 -17.226)" fill="#3ecc5f" fill-rule="evenodd"/>
 52 |       <path id="Path_43" data-name="Path 43" d="M143,186.71h32.782V143H143Z" transform="translate(9.984 -5.561)" fill="#3ecc5f" fill-rule="evenodd"/>
 53 |       <path id="Path_44" data-name="Path 44" d="M196.71,159.855a5.438,5.438,0,0,0-.7.07c-.042-.164-.081-.329-.127-.493a5.457,5.457,0,1,0-5.4-9.372q-.181-.185-.366-.367a5.454,5.454,0,1,0-9.384-5.4c-.162-.046-.325-.084-.486-.126a5.467,5.467,0,1,0-10.788,0c-.162.042-.325.08-.486.126a5.457,5.457,0,1,0-9.384,5.4,21.843,21.843,0,1,0,36.421,21.02,5.452,5.452,0,1,0,.7-10.858" transform="translate(10.912 -6.025)" fill="#44d860" fill-rule="evenodd"/>
 54 |       <path id="Path_45" data-name="Path 45" d="M153,124.855h32.782V103H153Z" transform="translate(10.912 -9.271)" fill="#3ecc5f" fill-rule="evenodd"/>
 55 |       <path id="Path_46" data-name="Path 46" d="M194.855,116.765a2.732,2.732,0,1,0,0-5.464,2.811,2.811,0,0,0-.349.035c-.022-.082-.04-.164-.063-.246a2.733,2.733,0,0,0-1.052-5.253,2.7,2.7,0,0,0-1.648.566q-.09-.093-.184-.184a2.7,2.7,0,0,0,.553-1.633,2.732,2.732,0,0,0-5.245-1.07,10.928,10.928,0,1,0,0,21.031,2.732,2.732,0,0,0,5.245-1.07,2.7,2.7,0,0,0-.553-1.633q.093-.09.184-.184a2.7,2.7,0,0,0,1.648.566,2.732,2.732,0,0,0,1.052-5.253c.023-.081.042-.164.063-.246a2.814,2.814,0,0,0,.349.035" transform="translate(12.767 -9.377)" fill="#44d860" fill-rule="evenodd"/>
 56 |       <path id="Path_47" data-name="Path 47" d="M65.087,56.891a2.732,2.732,0,0,1-2.732-2.732,8.2,8.2,0,0,0-16.391,0,2.732,2.732,0,0,1-5.464,0,13.659,13.659,0,0,1,27.319,0,2.732,2.732,0,0,1-2.732,2.732" transform="translate(0.478 -15.068)" fill-rule="evenodd"/>
 57 |       <path id="Path_48" data-name="Path 48" d="M103,191.347h65.565a21.854,21.854,0,0,0,21.855-21.855V93H124.855A21.854,21.854,0,0,0,103,114.855Z" transform="translate(6.275 -10.199)" fill="#ffff50" fill-rule="evenodd"/>
 58 |       <path id="Path_49" data-name="Path 49" d="M173.216,129.787H118.535a1.093,1.093,0,1,1,0-2.185h54.681a1.093,1.093,0,0,1,0,2.185m0,21.855H118.535a1.093,1.093,0,1,1,0-2.186h54.681a1.093,1.093,0,0,1,0,2.186m0,21.855H118.535a1.093,1.093,0,1,1,0-2.185h54.681a1.093,1.093,0,0,1,0,2.185m0-54.434H118.535a1.093,1.093,0,1,1,0-2.185h54.681a1.093,1.093,0,0,1,0,2.185m0,21.652H118.535a1.093,1.093,0,1,1,0-2.186h54.681a1.093,1.093,0,0,1,0,2.186m0,21.855H118.535a1.093,1.093,0,1,1,0-2.186h54.681a1.093,1.093,0,0,1,0,2.186M189.585,61.611c-.013,0-.024-.007-.037-.005-3.377.115-4.974,3.492-6.384,6.472-1.471,3.114-2.608,5.139-4.473,5.078-2.064-.074-3.244-2.406-4.494-4.874-1.436-2.835-3.075-6.049-6.516-5.929-3.329.114-4.932,3.053-6.346,5.646-1.5,2.762-2.529,4.442-4.5,4.364-2.106-.076-3.225-1.972-4.52-4.167-1.444-2.443-3.112-5.191-6.487-5.1-3.272.113-4.879,2.606-6.3,4.808-1.5,2.328-2.552,3.746-4.551,3.662-2.156-.076-3.27-1.65-4.558-3.472-1.447-2.047-3.077-4.363-6.442-4.251-3.2.109-4.807,2.153-6.224,3.954-1.346,1.709-2.4,3.062-4.621,2.977a1.093,1.093,0,0,0-.079,2.186c3.3.11,4.967-1.967,6.417-3.81,1.286-1.635,2.4-3.045,4.582-3.12,2.1-.09,3.091,1.218,4.584,3.327,1.417,2,3.026,4.277,6.263,4.394,3.391.114,5.022-2.42,6.467-4.663,1.292-2,2.406-3.734,4.535-3.807,1.959-.073,3.026,1.475,4.529,4.022,1.417,2.4,3.023,5.121,6.324,5.241,3.415.118,5.064-2.863,6.5-5.5,1.245-2.282,2.419-4.437,4.5-4.509,1.959-.046,2.981,1.743,4.492,4.732,1.412,2.79,3.013,5.95,6.365,6.071l.185,0c3.348,0,4.937-3.36,6.343-6.331,1.245-2.634,2.423-5.114,4.444-5.216Z" transform="translate(7.109 -13.11)" fill-rule="evenodd"/>
 59 |       <path id="Path_50" data-name="Path 50" d="M83,186.71h43.71V143H83Z" transform="translate(4.42 -5.561)" fill="#3ecc5f" fill-rule="evenodd"/>
 60 |       <g id="Group_8" data-name="Group 8" transform="matrix(0.966, -0.259, 0.259, 0.966, 109.327, 91.085)">
 61 |         <rect id="Rectangle_3" data-name="Rectangle 3" width="92.361" height="36.462" rx="2" transform="translate(0 0)" fill="#d8d8d8"/>
 62 |         <g id="Group_2" data-name="Group 2" transform="translate(1.531 23.03)">
 63 |           <rect id="Rectangle_4" data-name="Rectangle 4" width="5.336" height="5.336" rx="1" transform="translate(16.797 0)" fill="#4a4a4a"/>
 64 |           <rect id="Rectangle_5" data-name="Rectangle 5" width="5.336" height="5.336" rx="1" transform="translate(23.12 0)" fill="#4a4a4a"/>
 65 |           <rect id="Rectangle_6" data-name="Rectangle 6" width="5.336" height="5.336" rx="1" transform="translate(29.444 0)" fill="#4a4a4a"/>
 66 |           <rect id="Rectangle_7" data-name="Rectangle 7" width="5.336" height="5.336" rx="1" transform="translate(35.768 0)" fill="#4a4a4a"/>
 67 |           <rect id="Rectangle_8" data-name="Rectangle 8" width="5.336" height="5.336" rx="1" transform="translate(42.091 0)" fill="#4a4a4a"/>
 68 |           <rect id="Rectangle_9" data-name="Rectangle 9" width="5.336" height="5.336" rx="1" transform="translate(48.415 0)" fill="#4a4a4a"/>
 69 |           <rect id="Rectangle_10" data-name="Rectangle 10" width="5.336" height="5.336" rx="1" transform="translate(54.739 0)" fill="#4a4a4a"/>
 70 |           <rect id="Rectangle_11" data-name="Rectangle 11" width="5.336" height="5.336" rx="1" transform="translate(61.063 0)" fill="#4a4a4a"/>
 71 |           <rect id="Rectangle_12" data-name="Rectangle 12" width="5.336" height="5.336" rx="1" transform="translate(67.386 0)" fill="#4a4a4a"/>
 72 |           <path id="Path_51" data-name="Path 51" d="M1.093,0H14.518a1.093,1.093,0,0,1,1.093,1.093V4.243a1.093,1.093,0,0,1-1.093,1.093H1.093A1.093,1.093,0,0,1,0,4.243V1.093A1.093,1.093,0,0,1,1.093,0ZM75,0H88.426a1.093,1.093,0,0,1,1.093,1.093V4.243a1.093,1.093,0,0,1-1.093,1.093H75a1.093,1.093,0,0,1-1.093-1.093V1.093A1.093,1.093,0,0,1,75,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
 73 |         </g>
 74 |         <g id="Group_3" data-name="Group 3" transform="translate(1.531 10.261)">
 75 |           <path id="Path_52" data-name="Path 52" d="M1.093,0H6.218A1.093,1.093,0,0,1,7.31,1.093V4.242A1.093,1.093,0,0,1,6.218,5.335H1.093A1.093,1.093,0,0,1,0,4.242V1.093A1.093,1.093,0,0,1,1.093,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
 76 |           <rect id="Rectangle_13" data-name="Rectangle 13" width="5.336" height="5.336" rx="1" transform="translate(8.299 0)" fill="#4a4a4a"/>
 77 |           <rect id="Rectangle_14" data-name="Rectangle 14" width="5.336" height="5.336" rx="1" transform="translate(14.623 0)" fill="#4a4a4a"/>
 78 |           <rect id="Rectangle_15" data-name="Rectangle 15" width="5.336" height="5.336" rx="1" transform="translate(20.947 0)" fill="#4a4a4a"/>
 79 |           <rect id="Rectangle_16" data-name="Rectangle 16" width="5.336" height="5.336" rx="1" transform="translate(27.271 0)" fill="#4a4a4a"/>
 80 |           <rect id="Rectangle_17" data-name="Rectangle 17" width="5.336" height="5.336" rx="1" transform="translate(33.594 0)" fill="#4a4a4a"/>
 81 |           <rect id="Rectangle_18" data-name="Rectangle 18" width="5.336" height="5.336" rx="1" transform="translate(39.918 0)" fill="#4a4a4a"/>
 82 |           <rect id="Rectangle_19" data-name="Rectangle 19" width="5.336" height="5.336" rx="1" transform="translate(46.242 0)" fill="#4a4a4a"/>
 83 |           <rect id="Rectangle_20" data-name="Rectangle 20" width="5.336" height="5.336" rx="1" transform="translate(52.565 0)" fill="#4a4a4a"/>
 84 |           <rect id="Rectangle_21" data-name="Rectangle 21" width="5.336" height="5.336" rx="1" transform="translate(58.888 0)" fill="#4a4a4a"/>
 85 |           <rect id="Rectangle_22" data-name="Rectangle 22" width="5.336" height="5.336" rx="1" transform="translate(65.212 0)" fill="#4a4a4a"/>
 86 |           <rect id="Rectangle_23" data-name="Rectangle 23" width="5.336" height="5.336" rx="1" transform="translate(71.536 0)" fill="#4a4a4a"/>
 87 |           <rect id="Rectangle_24" data-name="Rectangle 24" width="5.336" height="5.336" rx="1" transform="translate(77.859 0)" fill="#4a4a4a"/>
 88 |           <rect id="Rectangle_25" data-name="Rectangle 25" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
 89 |         </g>
 90 |         <g id="Group_4" data-name="Group 4" transform="translate(91.05 9.546) rotate(180)">
 91 |           <path id="Path_53" data-name="Path 53" d="M1.093,0H6.219A1.093,1.093,0,0,1,7.312,1.093v3.15A1.093,1.093,0,0,1,6.219,5.336H1.093A1.093,1.093,0,0,1,0,4.243V1.093A1.093,1.093,0,0,1,1.093,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
 92 |           <rect id="Rectangle_26" data-name="Rectangle 26" width="5.336" height="5.336" rx="1" transform="translate(8.299 0)" fill="#4a4a4a"/>
 93 |           <rect id="Rectangle_27" data-name="Rectangle 27" width="5.336" height="5.336" rx="1" transform="translate(14.623 0)" fill="#4a4a4a"/>
 94 |           <rect id="Rectangle_28" data-name="Rectangle 28" width="5.336" height="5.336" rx="1" transform="translate(20.947 0)" fill="#4a4a4a"/>
 95 |           <rect id="Rectangle_29" data-name="Rectangle 29" width="5.336" height="5.336" rx="1" transform="translate(27.271 0)" fill="#4a4a4a"/>
 96 |           <rect id="Rectangle_30" data-name="Rectangle 30" width="5.336" height="5.336" rx="1" transform="translate(33.594 0)" fill="#4a4a4a"/>
 97 |           <rect id="Rectangle_31" data-name="Rectangle 31" width="5.336" height="5.336" rx="1" transform="translate(39.918 0)" fill="#4a4a4a"/>
 98 |           <rect id="Rectangle_32" data-name="Rectangle 32" width="5.336" height="5.336" rx="1" transform="translate(46.242 0)" fill="#4a4a4a"/>
 99 |           <rect id="Rectangle_33" data-name="Rectangle 33" width="5.336" height="5.336" rx="1" transform="translate(52.565 0)" fill="#4a4a4a"/>
100 |           <rect id="Rectangle_34" data-name="Rectangle 34" width="5.336" height="5.336" rx="1" transform="translate(58.889 0)" fill="#4a4a4a"/>
101 |           <rect id="Rectangle_35" data-name="Rectangle 35" width="5.336" height="5.336" rx="1" transform="translate(65.213 0)" fill="#4a4a4a"/>
102 |           <rect id="Rectangle_36" data-name="Rectangle 36" width="5.336" height="5.336" rx="1" transform="translate(71.537 0)" fill="#4a4a4a"/>
103 |           <rect id="Rectangle_37" data-name="Rectangle 37" width="5.336" height="5.336" rx="1" transform="translate(77.86 0)" fill="#4a4a4a"/>
104 |           <rect id="Rectangle_38" data-name="Rectangle 38" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
105 |           <rect id="Rectangle_39" data-name="Rectangle 39" width="5.336" height="5.336" rx="1" transform="translate(8.299 0)" fill="#4a4a4a"/>
106 |           <rect id="Rectangle_40" data-name="Rectangle 40" width="5.336" height="5.336" rx="1" transform="translate(14.623 0)" fill="#4a4a4a"/>
107 |           <rect id="Rectangle_41" data-name="Rectangle 41" width="5.336" height="5.336" rx="1" transform="translate(20.947 0)" fill="#4a4a4a"/>
108 |           <rect id="Rectangle_42" data-name="Rectangle 42" width="5.336" height="5.336" rx="1" transform="translate(27.271 0)" fill="#4a4a4a"/>
109 |           <rect id="Rectangle_43" data-name="Rectangle 43" width="5.336" height="5.336" rx="1" transform="translate(33.594 0)" fill="#4a4a4a"/>
110 |           <rect id="Rectangle_44" data-name="Rectangle 44" width="5.336" height="5.336" rx="1" transform="translate(39.918 0)" fill="#4a4a4a"/>
111 |           <rect id="Rectangle_45" data-name="Rectangle 45" width="5.336" height="5.336" rx="1" transform="translate(46.242 0)" fill="#4a4a4a"/>
112 |           <rect id="Rectangle_46" data-name="Rectangle 46" width="5.336" height="5.336" rx="1" transform="translate(52.565 0)" fill="#4a4a4a"/>
113 |           <rect id="Rectangle_47" data-name="Rectangle 47" width="5.336" height="5.336" rx="1" transform="translate(58.889 0)" fill="#4a4a4a"/>
114 |           <rect id="Rectangle_48" data-name="Rectangle 48" width="5.336" height="5.336" rx="1" transform="translate(65.213 0)" fill="#4a4a4a"/>
115 |           <rect id="Rectangle_49" data-name="Rectangle 49" width="5.336" height="5.336" rx="1" transform="translate(71.537 0)" fill="#4a4a4a"/>
116 |           <rect id="Rectangle_50" data-name="Rectangle 50" width="5.336" height="5.336" rx="1" transform="translate(77.86 0)" fill="#4a4a4a"/>
117 |           <rect id="Rectangle_51" data-name="Rectangle 51" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
118 |         </g>
119 |         <g id="Group_6" data-name="Group 6" transform="translate(1.531 16.584)">
120 |           <path id="Path_54" data-name="Path 54" d="M1.093,0h7.3A1.093,1.093,0,0,1,9.485,1.093v3.15A1.093,1.093,0,0,1,8.392,5.336h-7.3A1.093,1.093,0,0,1,0,4.243V1.094A1.093,1.093,0,0,1,1.093,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
121 |           <g id="Group_5" data-name="Group 5" transform="translate(10.671 0)">
122 |             <rect id="Rectangle_52" data-name="Rectangle 52" width="5.336" height="5.336" rx="1" fill="#4a4a4a"/>
123 |             <rect id="Rectangle_53" data-name="Rectangle 53" width="5.336" height="5.336" rx="1" transform="translate(6.324 0)" fill="#4a4a4a"/>
124 |             <rect id="Rectangle_54" data-name="Rectangle 54" width="5.336" height="5.336" rx="1" transform="translate(12.647 0)" fill="#4a4a4a"/>
125 |             <rect id="Rectangle_55" data-name="Rectangle 55" width="5.336" height="5.336" rx="1" transform="translate(18.971 0)" fill="#4a4a4a"/>
126 |             <rect id="Rectangle_56" data-name="Rectangle 56" width="5.336" height="5.336" rx="1" transform="translate(25.295 0)" fill="#4a4a4a"/>
127 |             <rect id="Rectangle_57" data-name="Rectangle 57" width="5.336" height="5.336" rx="1" transform="translate(31.619 0)" fill="#4a4a4a"/>
128 |             <rect id="Rectangle_58" data-name="Rectangle 58" width="5.336" height="5.336" rx="1" transform="translate(37.942 0)" fill="#4a4a4a"/>
129 |             <rect id="Rectangle_59" data-name="Rectangle 59" width="5.336" height="5.336" rx="1" transform="translate(44.265 0)" fill="#4a4a4a"/>
130 |             <rect id="Rectangle_60" data-name="Rectangle 60" width="5.336" height="5.336" rx="1" transform="translate(50.589 0)" fill="#4a4a4a"/>
131 |             <rect id="Rectangle_61" data-name="Rectangle 61" width="5.336" height="5.336" rx="1" transform="translate(56.912 0)" fill="#4a4a4a"/>
132 |             <rect id="Rectangle_62" data-name="Rectangle 62" width="5.336" height="5.336" rx="1" transform="translate(63.236 0)" fill="#4a4a4a"/>
133 |           </g>
134 |           <path id="Path_55" data-name="Path 55" d="M1.094,0H8A1.093,1.093,0,0,1,9.091,1.093v3.15A1.093,1.093,0,0,1,8,5.336H1.093A1.093,1.093,0,0,1,0,4.243V1.094A1.093,1.093,0,0,1,1.093,0Z" transform="translate(80.428 0)" fill="#4a4a4a" fill-rule="evenodd"/>
135 |         </g>
136 |         <g id="Group_7" data-name="Group 7" transform="translate(1.531 29.627)">
137 |           <rect id="Rectangle_63" data-name="Rectangle 63" width="5.336" height="5.336" rx="1" transform="translate(0 0)" fill="#4a4a4a"/>
138 |           <rect id="Rectangle_64" data-name="Rectangle 64" width="5.336" height="5.336" rx="1" transform="translate(6.324 0)" fill="#4a4a4a"/>
139 |           <rect id="Rectangle_65" data-name="Rectangle 65" width="5.336" height="5.336" rx="1" transform="translate(12.647 0)" fill="#4a4a4a"/>
140 |           <rect id="Rectangle_66" data-name="Rectangle 66" width="5.336" height="5.336" rx="1" transform="translate(18.971 0)" fill="#4a4a4a"/>
141 |           <path id="Path_56" data-name="Path 56" d="M1.093,0H31.515a1.093,1.093,0,0,1,1.093,1.093V4.244a1.093,1.093,0,0,1-1.093,1.093H1.093A1.093,1.093,0,0,1,0,4.244V1.093A1.093,1.093,0,0,1,1.093,0ZM34.687,0h3.942a1.093,1.093,0,0,1,1.093,1.093V4.244a1.093,1.093,0,0,1-1.093,1.093H34.687a1.093,1.093,0,0,1-1.093-1.093V1.093A1.093,1.093,0,0,1,34.687,0Z" transform="translate(25.294 0)" fill="#4a4a4a" fill-rule="evenodd"/>
142 |           <rect id="Rectangle_67" data-name="Rectangle 67" width="5.336" height="5.336" rx="1" transform="translate(66.003 0)" fill="#4a4a4a"/>
143 |           <rect id="Rectangle_68" data-name="Rectangle 68" width="5.336" height="5.336" rx="1" transform="translate(72.327 0)" fill="#4a4a4a"/>
144 |           <rect id="Rectangle_69" data-name="Rectangle 69" width="5.336" height="5.336" rx="1" transform="translate(84.183 0)" fill="#4a4a4a"/>
145 |           <path id="Path_57" data-name="Path 57" d="M5.336,0V1.18A1.093,1.093,0,0,1,4.243,2.273H1.093A1.093,1.093,0,0,1,0,1.18V0Z" transform="translate(83.59 2.273) rotate(180)" fill="#4a4a4a"/>
146 |           <path id="Path_58" data-name="Path 58" d="M5.336,0V1.18A1.093,1.093,0,0,1,4.243,2.273H1.093A1.093,1.093,0,0,1,0,1.18V0Z" transform="translate(78.255 3.063)" fill="#4a4a4a"/>
147 |         </g>
148 |         <rect id="Rectangle_70" data-name="Rectangle 70" width="88.927" height="2.371" rx="1.085" transform="translate(1.925 1.17)" fill="#4a4a4a"/>
149 |         <rect id="Rectangle_71" data-name="Rectangle 71" width="4.986" height="1.581" rx="0.723" transform="translate(4.1 1.566)" fill="#d8d8d8" opacity="0.136"/>
150 |         <rect id="Rectangle_72" data-name="Rectangle 72" width="4.986" height="1.581" rx="0.723" transform="translate(10.923 1.566)" fill="#d8d8d8" opacity="0.136"/>
151 |         <rect id="Rectangle_73" data-name="Rectangle 73" width="4.986" height="1.581" rx="0.723" transform="translate(16.173 1.566)" fill="#d8d8d8" opacity="0.136"/>
152 |         <rect id="Rectangle_74" data-name="Rectangle 74" width="4.986" height="1.581" rx="0.723" transform="translate(21.421 1.566)" fill="#d8d8d8" opacity="0.136"/>
153 |         <rect id="Rectangle_75" data-name="Rectangle 75" width="4.986" height="1.581" rx="0.723" transform="translate(26.671 1.566)" fill="#d8d8d8" opacity="0.136"/>
154 |         <rect id="Rectangle_76" data-name="Rectangle 76" width="4.986" height="1.581" rx="0.723" transform="translate(33.232 1.566)" fill="#d8d8d8" opacity="0.136"/>
155 |         <rect id="Rectangle_77" data-name="Rectangle 77" width="4.986" height="1.581" rx="0.723" transform="translate(38.48 1.566)" fill="#d8d8d8" opacity="0.136"/>
156 |         <rect id="Rectangle_78" data-name="Rectangle 78" width="4.986" height="1.581" rx="0.723" transform="translate(43.73 1.566)" fill="#d8d8d8" opacity="0.136"/>
157 |         <rect id="Rectangle_79" data-name="Rectangle 79" width="4.986" height="1.581" rx="0.723" transform="translate(48.978 1.566)" fill="#d8d8d8" opacity="0.136"/>
158 |         <rect id="Rectangle_80" data-name="Rectangle 80" width="4.986" height="1.581" rx="0.723" transform="translate(55.54 1.566)" fill="#d8d8d8" opacity="0.136"/>
159 |         <rect id="Rectangle_81" data-name="Rectangle 81" width="4.986" height="1.581" rx="0.723" transform="translate(60.788 1.566)" fill="#d8d8d8" opacity="0.136"/>
160 |         <rect id="Rectangle_82" data-name="Rectangle 82" width="4.986" height="1.581" rx="0.723" transform="translate(66.038 1.566)" fill="#d8d8d8" opacity="0.136"/>
161 |         <rect id="Rectangle_83" data-name="Rectangle 83" width="4.986" height="1.581" rx="0.723" transform="translate(72.599 1.566)" fill="#d8d8d8" opacity="0.136"/>
162 |         <rect id="Rectangle_84" data-name="Rectangle 84" width="4.986" height="1.581" rx="0.723" transform="translate(77.847 1.566)" fill="#d8d8d8" opacity="0.136"/>
163 |         <rect id="Rectangle_85" data-name="Rectangle 85" width="4.986" height="1.581" rx="0.723" transform="translate(83.097 1.566)" fill="#d8d8d8" opacity="0.136"/>
164 |       </g>
165 |       <path id="Path_59" data-name="Path 59" d="M146.71,159.855a5.439,5.439,0,0,0-.7.07c-.042-.164-.081-.329-.127-.493a5.457,5.457,0,1,0-5.4-9.372q-.181-.185-.366-.367a5.454,5.454,0,1,0-9.384-5.4c-.162-.046-.325-.084-.486-.126a5.467,5.467,0,1,0-10.788,0c-.162.042-.325.08-.486.126a5.457,5.457,0,1,0-9.384,5.4,21.843,21.843,0,1,0,36.421,21.02,5.452,5.452,0,1,0,.7-10.858" transform="translate(6.275 -6.025)" fill="#44d860" fill-rule="evenodd"/>
166 |       <path id="Path_60" data-name="Path 60" d="M83,124.855h43.71V103H83Z" transform="translate(4.42 -9.271)" fill="#3ecc5f" fill-rule="evenodd"/>
167 |       <path id="Path_61" data-name="Path 61" d="M134.855,116.765a2.732,2.732,0,1,0,0-5.464,2.811,2.811,0,0,0-.349.035c-.022-.082-.04-.164-.063-.246a2.733,2.733,0,0,0-1.052-5.253,2.7,2.7,0,0,0-1.648.566q-.09-.093-.184-.184a2.7,2.7,0,0,0,.553-1.633,2.732,2.732,0,0,0-5.245-1.07,10.928,10.928,0,1,0,0,21.031,2.732,2.732,0,0,0,5.245-1.07,2.7,2.7,0,0,0-.553-1.633q.093-.09.184-.184a2.7,2.7,0,0,0,1.648.566,2.732,2.732,0,0,0,1.052-5.253c.023-.081.042-.164.063-.246a2.811,2.811,0,0,0,.349.035" transform="translate(7.202 -9.377)" fill="#44d860" fill-rule="evenodd"/>
168 |       <path id="Path_62" data-name="Path 62" d="M143.232,42.33a2.967,2.967,0,0,1-.535-.055,2.754,2.754,0,0,1-.514-.153,2.838,2.838,0,0,1-.471-.251,4.139,4.139,0,0,1-.415-.339,3.2,3.2,0,0,1-.338-.415A2.7,2.7,0,0,1,140.5,39.6a2.968,2.968,0,0,1,.055-.535,3.152,3.152,0,0,1,.152-.514,2.874,2.874,0,0,1,.252-.47,2.633,2.633,0,0,1,.753-.754,2.837,2.837,0,0,1,.471-.251,2.753,2.753,0,0,1,.514-.153,2.527,2.527,0,0,1,1.071,0,2.654,2.654,0,0,1,.983.4,4.139,4.139,0,0,1,.415.339,4.019,4.019,0,0,1,.339.415,2.786,2.786,0,0,1,.251.47,2.864,2.864,0,0,1,.208,1.049,2.77,2.77,0,0,1-.8,1.934,4.139,4.139,0,0,1-.415.339,2.722,2.722,0,0,1-1.519.459m21.855-1.366a2.789,2.789,0,0,1-1.935-.8,4.162,4.162,0,0,1-.338-.415,2.7,2.7,0,0,1-.459-1.519,2.789,2.789,0,0,1,.8-1.934,4.139,4.139,0,0,1,.415-.339,2.838,2.838,0,0,1,.471-.251,2.752,2.752,0,0,1,.514-.153,2.527,2.527,0,0,1,1.071,0,2.654,2.654,0,0,1,.983.4,4.139,4.139,0,0,1,.415.339,2.79,2.79,0,0,1,.8,1.934,3.069,3.069,0,0,1-.055.535,2.779,2.779,0,0,1-.153.514,3.885,3.885,0,0,1-.251.47,4.02,4.02,0,0,1-.339.415,4.138,4.138,0,0,1-.415.339,2.722,2.722,0,0,1-1.519.459" transform="translate(9.753 -15.532)" fill-rule="evenodd"/>
169 |     </g>
170 |   </g>
171 | </svg>
172 | 


--------------------------------------------------------------------------------
/website/static/img/undraw_docusaurus_react.svg:
--------------------------------------------------------------------------------
  1 | <svg xmlns="http://www.w3.org/2000/svg" width="1041.277" height="554.141" viewBox="0 0 1041.277 554.141">
  2 |   <title>Powered by React</title>
  3 |   <g id="Group_24" data-name="Group 24" transform="translate(-440 -263)">
  4 |     <g id="Group_23" data-name="Group 23" transform="translate(439.989 262.965)">
  5 |       <path id="Path_299" data-name="Path 299" d="M1040.82,611.12q-1.74,3.75-3.47,7.4-2.7,5.67-5.33,11.12c-.78,1.61-1.56,3.19-2.32,4.77-8.6,17.57-16.63,33.11-23.45,45.89A73.21,73.21,0,0,1,942.44,719l-151.65,1.65h-1.6l-13,.14-11.12.12-34.1.37h-1.38l-17.36.19h-.53l-107,1.16-95.51,1-11.11.12-69,.75H429l-44.75.48h-.48l-141.5,1.53-42.33.46a87.991,87.991,0,0,1-10.79-.54h0c-1.22-.14-2.44-.3-3.65-.49a87.38,87.38,0,0,1-51.29-27.54C116,678.37,102.75,655,93.85,629.64q-1.93-5.49-3.6-11.12C59.44,514.37,97,380,164.6,290.08q4.25-5.64,8.64-11l.07-.08c20.79-25.52,44.1-46.84,68.93-62,44-26.91,92.75-34.49,140.7-11.9,40.57,19.12,78.45,28.11,115.17,30.55,3.71.24,7.42.42,11.11.53,84.23,2.65,163.17-27.7,255.87-47.29,3.69-.78,7.39-1.55,11.12-2.28,66.13-13.16,139.49-20.1,226.73-5.51a189.089,189.089,0,0,1,26.76,6.4q5.77,1.86,11.12,4c41.64,16.94,64.35,48.24,74,87.46q1.37,5.46,2.37,11.11C1134.3,384.41,1084.19,518.23,1040.82,611.12Z" transform="translate(-79.34 -172.91)" fill="#f2f2f2"/>
  6 |       <path id="Path_300" data-name="Path 300" d="M576.36,618.52a95.21,95.21,0,0,1-1.87,11.12h93.7V618.52Zm-78.25,62.81,11.11-.09V653.77c-3.81-.17-7.52-.34-11.11-.52ZM265.19,618.52v11.12h198.5V618.52ZM1114.87,279h-74V191.51q-5.35-2.17-11.12-4V279H776.21V186.58c-3.73.73-7.43,1.5-11.12,2.28V279H509.22V236.15c-3.69-.11-7.4-.29-11.11-.53V279H242.24V217c-24.83,15.16-48.14,36.48-68.93,62h-.07v.08q-4.4,5.4-8.64,11h8.64V618.52h-83q1.66,5.63,3.6,11.12h79.39v93.62a87,87,0,0,0,12.2,2.79c1.21.19,2.43.35,3.65.49h0a87.991,87.991,0,0,0,10.79.54l42.33-.46v-97H498.11v94.21l11.11-.12V629.64H765.09V721l11.12-.12V629.64H1029.7v4.77c.76-1.58,1.54-3.16,2.32-4.77q2.63-5.45,5.33-11.12,1.73-3.64,3.47-7.4v-321h76.42Q1116.23,284.43,1114.87,279ZM242.24,618.52V290.08H498.11V618.52Zm267,0V290.08H765.09V618.52Zm520.48,0H776.21V290.08H1029.7Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
  7 |       <path id="Path_301" data-name="Path 301" d="M863.09,533.65v13l-151.92,1.4-1.62.03-57.74.53-1.38.02-17.55.15h-.52l-106.98.99L349.77,551.4h-.15l-44.65.42-.48.01-198.4,1.82v-15l46.65-28,93.6-.78,2-.01.66-.01,2-.03,44.94-.37,2.01-.01.64-.01,2-.01L315,509.3l.38-.01,35.55-.3h.29l277.4-2.34,6.79-.05h.68l5.18-.05,37.65-.31,2-.03,1.85-.02h.96l11.71-.09,2.32-.03,3.11-.02,9.75-.09,15.47-.13,2-.02,3.48-.02h.65l74.71-.64Z" fill="#65617d"/>
  8 |       <path id="Path_302" data-name="Path 302" d="M863.09,533.65v13l-151.92,1.4-1.62.03-57.74.53-1.38.02-17.55.15h-.52l-106.98.99L349.77,551.4h-.15l-44.65.42-.48.01-198.4,1.82v-15l46.65-28,93.6-.78,2-.01.66-.01,2-.03,44.94-.37,2.01-.01.64-.01,2-.01L315,509.3l.38-.01,35.55-.3h.29l277.4-2.34,6.79-.05h.68l5.18-.05,37.65-.31,2-.03,1.85-.02h.96l11.71-.09,2.32-.03,3.11-.02,9.75-.09,15.47-.13,2-.02,3.48-.02h.65l74.71-.64Z" opacity="0.2"/>
  9 |       <path id="Path_303" data-name="Path 303" d="M375.44,656.57v24.49a6.13,6.13,0,0,1-3.5,5.54,6,6,0,0,1-2.5.6l-34.9.74a6,6,0,0,1-2.7-.57,6.12,6.12,0,0,1-3.57-5.57V656.57Z" transform="translate(-79.34 -172.91)" fill="#3f3d56"/>
 10 |       <path id="Path_304" data-name="Path 304" d="M375.44,656.57v24.49a6.13,6.13,0,0,1-3.5,5.54,6,6,0,0,1-2.5.6l-34.9.74a6,6,0,0,1-2.7-.57,6.12,6.12,0,0,1-3.57-5.57V656.57Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 11 |       <path id="Path_305" data-name="Path 305" d="M377.44,656.57v24.49a6.13,6.13,0,0,1-3.5,5.54,6,6,0,0,1-2.5.6l-34.9.74a6,6,0,0,1-2.7-.57,6.12,6.12,0,0,1-3.57-5.57V656.57Z" transform="translate(-79.34 -172.91)" fill="#3f3d56"/>
 12 |       <rect id="Rectangle_137" data-name="Rectangle 137" width="47.17" height="31.5" transform="translate(680.92 483.65)" fill="#3f3d56"/>
 13 |       <rect id="Rectangle_138" data-name="Rectangle 138" width="47.17" height="31.5" transform="translate(680.92 483.65)" opacity="0.1"/>
 14 |       <rect id="Rectangle_139" data-name="Rectangle 139" width="47.17" height="31.5" transform="translate(678.92 483.65)" fill="#3f3d56"/>
 15 |       <path id="Path_306" data-name="Path 306" d="M298.09,483.65v4.97l-47.17,1.26v-6.23Z" opacity="0.1"/>
 16 |       <path id="Path_307" data-name="Path 307" d="M460.69,485.27v168.2a4,4,0,0,1-3.85,3.95l-191.65,5.1h-.05a4,4,0,0,1-3.95-3.95V485.27a4,4,0,0,1,3.95-3.95h191.6a4,4,0,0,1,3.95,3.95Z" transform="translate(-79.34 -172.91)" fill="#65617d"/>
 17 |       <path id="Path_308" data-name="Path 308" d="M265.19,481.32v181.2h-.05a4,4,0,0,1-3.95-3.95V485.27a4,4,0,0,1,3.95-3.95Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 18 |       <path id="Path_309" data-name="Path 309" d="M194.59,319.15h177.5V467.4l-177.5,4Z" fill="#39374d"/>
 19 |       <path id="Path_310" data-name="Path 310" d="M726.09,483.65v6.41l-47.17-1.26v-5.15Z" opacity="0.1"/>
 20 |       <path id="Path_311" data-name="Path 311" d="M867.69,485.27v173.3a4,4,0,0,1-4,3.95h0L672,657.42a4,4,0,0,1-3.85-3.95V485.27a4,4,0,0,1,3.95-3.95H863.7a4,4,0,0,1,3.99,3.95Z" transform="translate(-79.34 -172.91)" fill="#65617d"/>
 21 |       <path id="Path_312" data-name="Path 312" d="M867.69,485.27v173.3a4,4,0,0,1-4,3.95h0V481.32h0a4,4,0,0,1,4,3.95Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 22 |       <path id="Path_313" data-name="Path 313" d="M775.59,319.15H598.09V467.4l177.5,4Z" fill="#39374d"/>
 23 |       <path id="Path_314" data-name="Path 314" d="M663.19,485.27v168.2a4,4,0,0,1-3.85,3.95l-191.65,5.1h0a4,4,0,0,1-4-3.95V485.27a4,4,0,0,1,3.95-3.95h191.6A4,4,0,0,1,663.19,485.27Z" transform="translate(-79.34 -172.91)" fill="#65617d"/>
 24 |       <path id="Path_315" data-name="Path 315" d="M397.09,319.15h177.5V467.4l-177.5,4Z" fill="#4267b2"/>
 25 |       <path id="Path_316" data-name="Path 316" d="M863.09,533.65v13l-151.92,1.4-1.62.03-57.74.53-1.38.02-17.55.15h-.52l-106.98.99L349.77,551.4h-.15l-44.65.42-.48.01-198.4,1.82v-15l202.51-1.33h.48l40.99-.28h.19l283.08-1.87h.29l.17-.01h.47l4.79-.03h1.46l74.49-.5,4.4-.02.98-.01Z" opacity="0.1"/>
 26 |       <circle id="Ellipse_111" data-name="Ellipse 111" cx="51.33" cy="51.33" r="51.33" transform="translate(435.93 246.82)" fill="#fbbebe"/>
 27 |       <path id="Path_317" data-name="Path 317" d="M617.94,550.07s-99.5,12-90,0c3.44-4.34,4.39-17.2,4.2-31.85-.06-4.45-.22-9.06-.45-13.65-1.1-22-3.75-43.5-3.75-43.5s87-41,77-8.5c-4,13.13-2.69,31.57.35,48.88.89,5.05,1.92,10,3,14.7a344.66,344.66,0,0,0,9.65,33.92Z" transform="translate(-79.34 -172.91)" fill="#fbbebe"/>
 28 |       <path id="Path_318" data-name="Path 318" d="M585.47,546c11.51-2.13,23.7-6,34.53-1.54,2.85,1.17,5.47,2.88,8.39,3.86s6.12,1.22,9.16,1.91c10.68,2.42,19.34,10.55,24.9,20s8.44,20.14,11.26,30.72l6.9,25.83c6,22.45,12,45.09,13.39,68.3a2437.506,2437.506,0,0,1-250.84,1.43c5.44-10.34,11-21.31,10.54-33s-7.19-23.22-4.76-34.74c1.55-7.34,6.57-13.39,9.64-20.22,8.75-19.52,1.94-45.79,17.32-60.65,6.92-6.68,17-9.21,26.63-8.89,12.28.41,24.85,4.24,37,6.11C555.09,547.48,569.79,548.88,585.47,546Z" transform="translate(-79.34 -172.91)" fill="#ff6584"/>
 29 |       <path id="Path_319" data-name="Path 319" d="M716.37,657.17l-.1,1.43v.1l-.17,2.3-1.33,18.51-1.61,22.3-.46,6.28-1,13.44v.17l-107,1-175.59,1.9v.84h-.14v-1.12l.45-14.36.86-28.06.74-23.79.07-2.37a10.53,10.53,0,0,1,11.42-10.17c4.72.4,10.85.89,18.18,1.41l3,.22c42.33,2.94,120.56,6.74,199.5,2,1.66-.09,3.33-.19,5-.31,12.24-.77,24.47-1.76,36.58-3a10.53,10.53,0,0,1,11.6,11.23Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 30 |       <path id="Path_320" data-name="Path 320" d="M429.08,725.44v-.84l175.62-1.91,107-1h.3v-.17l1-13.44.43-6,1.64-22.61,1.29-17.9v-.44a10.617,10.617,0,0,0-.11-2.47.3.3,0,0,0,0-.1,10.391,10.391,0,0,0-2-4.64,10.54,10.54,0,0,0-9.42-4c-12.11,1.24-24.34,2.23-36.58,3-1.67.12-3.34.22-5,.31-78.94,4.69-157.17.89-199.5-2l-3-.22c-7.33-.52-13.46-1-18.18-1.41a10.54,10.54,0,0,0-11.24,8.53,11,11,0,0,0-.18,1.64l-.68,22.16L429.54,710l-.44,14.36v1.12Z" transform="translate(-79.34 -172.91)" fill="#3f3d56"/>
 31 |       <path id="Path_321" data-name="Path 321" d="M716.67,664.18l-1.23,15.33-1.83,22.85-.46,5.72-1,12.81-.06.64v.17h0l-.15,1.48.11-1.48h-.29l-107,1-175.65,1.9v-.28l.49-14.36,1-28.06.64-18.65A6.36,6.36,0,0,1,434.3,658a6.25,6.25,0,0,1,3.78-.9c2.1.17,4.68.37,7.69.59,4.89.36,10.92.78,17.94,1.22,13,.82,29.31,1.7,48,2.42,52,2,122.2,2.67,188.88-3.17,3-.26,6.1-.55,9.13-.84a6.26,6.26,0,0,1,3.48.66,5.159,5.159,0,0,1,.86.54,6.14,6.14,0,0,1,2,2.46,3.564,3.564,0,0,1,.25.61A6.279,6.279,0,0,1,716.67,664.18Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 32 |       <path id="Path_322" data-name="Path 322" d="M377.44,677.87v3.19a6.13,6.13,0,0,1-3.5,5.54l-40.1.77a6.12,6.12,0,0,1-3.57-5.57v-3Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 33 |       <path id="Path_323" data-name="Path 323" d="M298.59,515.57l-52.25,1V507.9l52.25-1Z" fill="#3f3d56"/>
 34 |       <path id="Path_324" data-name="Path 324" d="M298.59,515.57l-52.25,1V507.9l52.25-1Z" opacity="0.1"/>
 35 |       <path id="Path_325" data-name="Path 325" d="M300.59,515.57l-52.25,1V507.9l52.25-1Z" fill="#3f3d56"/>
 36 |       <path id="Path_326" data-name="Path 326" d="M758.56,679.87v3.19a6.13,6.13,0,0,0,3.5,5.54l40.1.77a6.12,6.12,0,0,0,3.57-5.57v-3Z" transform="translate(-79.34 -172.91)" opacity="0.1"/>
 37 |       <path id="Path_327" data-name="Path 327" d="M678.72,517.57l52.25,1V509.9l-52.25-1Z" opacity="0.1"/>
 38 |       <path id="Path_328" data-name="Path 328" d="M676.72,517.57l52.25,1V509.9l-52.25-1Z" fill="#3f3d56"/>
 39 |       <path id="Path_329" data-name="Path 329" d="M534.13,486.79c.08,7-3.16,13.6-5.91,20.07a163.491,163.491,0,0,0-12.66,74.71c.73,11,2.58,22,.73,32.9s-8.43,21.77-19,24.9c17.53,10.45,41.26,9.35,57.76-2.66,8.79-6.4,15.34-15.33,21.75-24.11a97.86,97.86,0,0,1-13.31,44.75A103.43,103.43,0,0,0,637,616.53c4.31-5.81,8.06-12.19,9.72-19.23,3.09-13-1.22-26.51-4.51-39.5a266.055,266.055,0,0,1-6.17-33c-.43-3.56-.78-7.22.1-10.7,1-4.07,3.67-7.51,5.64-11.22,5.6-10.54,5.73-23.3,2.86-34.88s-8.49-22.26-14.06-32.81c-4.46-8.46-9.3-17.31-17.46-22.28-5.1-3.1-11-4.39-16.88-5.64l-25.37-5.43c-5.55-1.19-11.26-2.38-16.87-1.51-9.47,1.48-16.14,8.32-22,15.34-4.59,5.46-15.81,15.71-16.6,22.86-.72,6.59,5.1,17.63,6.09,24.58,1.3,9,2.22,6,7.3,11.52C532,478.05,534.07,482,534.13,486.79Z" transform="translate(-79.34 -172.91)" fill="#3f3d56"/>
 40 |     </g>
 41 |     <g id="docusaurus_keytar" transform="translate(670.271 615.768)">
 42 |       <path id="Path_40" data-name="Path 40" d="M99,52h43.635V69.662H99Z" transform="translate(-49.132 -33.936)" fill="#fff" fill-rule="evenodd"/>
 43 |       <path id="Path_41" data-name="Path 41" d="M13.389,158.195A10.377,10.377,0,0,1,4.4,153a10.377,10.377,0,0,0,8.988,15.584H23.779V158.195Z" transform="translate(-3 -82.47)" fill="#3ecc5f" fill-rule="evenodd"/>
 44 |       <path id="Path_42" data-name="Path 42" d="M66.967,38.083l36.373-2.273V30.615A10.389,10.389,0,0,0,92.95,20.226H46.2l-1.3-2.249a1.5,1.5,0,0,0-2.6,0L41,20.226l-1.3-2.249a1.5,1.5,0,0,0-2.6,0l-1.3,2.249-1.3-2.249a1.5,1.5,0,0,0-2.6,0l-1.3,2.249-.034,0-2.152-2.151a1.5,1.5,0,0,0-2.508.672L25.21,21.4l-2.7-.723a1.5,1.5,0,0,0-1.836,1.837l.722,2.7-2.65.71a1.5,1.5,0,0,0-.673,2.509l2.152,2.152c0,.011,0,.022,0,.033l-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6L20.226,41l-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3-2.249,1.3a1.5,1.5,0,0,0,0,2.6l2.249,1.3A10.389,10.389,0,0,0,30.615,103.34H92.95A10.389,10.389,0,0,0,103.34,92.95V51.393L66.967,49.12a5.53,5.53,0,0,1,0-11.038" transform="translate(-9.836 -17.226)" fill="#3ecc5f" fill-rule="evenodd"/>
 45 |       <path id="Path_43" data-name="Path 43" d="M143,163.779h15.584V143H143Z" transform="translate(-70.275 -77.665)" fill="#3ecc5f" fill-rule="evenodd"/>
 46 |       <path id="Path_44" data-name="Path 44" d="M173.779,148.389a2.582,2.582,0,0,0-.332.033c-.02-.078-.038-.156-.06-.234a2.594,2.594,0,1,0-2.567-4.455q-.086-.088-.174-.175a2.593,2.593,0,1,0-4.461-2.569c-.077-.022-.154-.04-.231-.06a2.6,2.6,0,1,0-5.128,0c-.077.02-.154.038-.231.06a2.594,2.594,0,1,0-4.461,2.569,10.384,10.384,0,1,0,17.314,9.992,2.592,2.592,0,1,0,.332-5.161" transform="translate(-75.08 -75.262)" fill="#44d860" fill-rule="evenodd"/>
 47 |       <path id="Path_45" data-name="Path 45" d="M153,113.389h15.584V103H153Z" transform="translate(-75.08 -58.444)" fill="#3ecc5f" fill-rule="evenodd"/>
 48 |       <path id="Path_46" data-name="Path 46" d="M183.389,108.944a1.3,1.3,0,1,0,0-2.6,1.336,1.336,0,0,0-.166.017c-.01-.039-.019-.078-.03-.117a1.3,1.3,0,0,0-.5-2.5,1.285,1.285,0,0,0-.783.269q-.043-.044-.087-.087a1.285,1.285,0,0,0,.263-.776,1.3,1.3,0,0,0-2.493-.509,5.195,5.195,0,1,0,0,10,1.3,1.3,0,0,0,2.493-.509,1.285,1.285,0,0,0-.263-.776q.044-.043.087-.087a1.285,1.285,0,0,0,.783.269,1.3,1.3,0,0,0,.5-2.5c.011-.038.02-.078.03-.117a1.337,1.337,0,0,0,.166.017" transform="translate(-84.691 -57.894)" fill="#44d860" fill-rule="evenodd"/>
 49 |       <path id="Path_47" data-name="Path 47" d="M52.188,48.292a1.3,1.3,0,0,1-1.3-1.3,3.9,3.9,0,0,0-7.792,0,1.3,1.3,0,1,1-2.6,0,6.493,6.493,0,0,1,12.987,0,1.3,1.3,0,0,1-1.3,1.3" transform="translate(-21.02 -28.41)" fill-rule="evenodd"/>
 50 |       <path id="Path_48" data-name="Path 48" d="M103,139.752h31.168a10.389,10.389,0,0,0,10.389-10.389V93H113.389A10.389,10.389,0,0,0,103,103.389Z" transform="translate(-51.054 -53.638)" fill="#ffff50" fill-rule="evenodd"/>
 51 |       <path id="Path_49" data-name="Path 49" d="M141.1,94.017H115.106a.519.519,0,1,1,0-1.039H141.1a.519.519,0,0,1,0,1.039m0,10.389H115.106a.519.519,0,1,1,0-1.039H141.1a.519.519,0,0,1,0,1.039m0,10.389H115.106a.519.519,0,1,1,0-1.039H141.1a.519.519,0,0,1,0,1.039m0-25.877H115.106a.519.519,0,1,1,0-1.039H141.1a.519.519,0,0,1,0,1.039m0,10.293H115.106a.519.519,0,1,1,0-1.039H141.1a.519.519,0,0,1,0,1.039m0,10.389H115.106a.519.519,0,1,1,0-1.039H141.1a.519.519,0,0,1,0,1.039m7.782-47.993c-.006,0-.011,0-.018,0-1.605.055-2.365,1.66-3.035,3.077-.7,1.48-1.24,2.443-2.126,2.414-.981-.035-1.542-1.144-2.137-2.317-.683-1.347-1.462-2.876-3.1-2.819-1.582.054-2.344,1.451-3.017,2.684-.715,1.313-1.2,2.112-2.141,2.075-1-.036-1.533-.938-2.149-1.981-.686-1.162-1.479-2.467-3.084-2.423-1.555.053-2.319,1.239-2.994,2.286-.713,1.106-1.213,1.781-2.164,1.741-1.025-.036-1.554-.784-2.167-1.65-.688-.973-1.463-2.074-3.062-2.021a3.815,3.815,0,0,0-2.959,1.879c-.64.812-1.14,1.456-2.2,1.415a.52.52,0,0,0-.037,1.039,3.588,3.588,0,0,0,3.05-1.811c.611-.777,1.139-1.448,2.178-1.483,1-.043,1.47.579,2.179,1.582.674.953,1.438,2.033,2.977,2.089,1.612.054,2.387-1.151,3.074-2.217.614-.953,1.144-1.775,2.156-1.81.931-.035,1.438.7,2.153,1.912.674,1.141,1.437,2.434,3.006,2.491,1.623.056,2.407-1.361,3.09-2.616.592-1.085,1.15-2.109,2.14-2.143.931-.022,1.417.829,2.135,2.249.671,1.326,1.432,2.828,3.026,2.886l.088,0c1.592,0,2.347-1.6,3.015-3.01.592-1.252,1.152-2.431,2.113-2.479Z" transform="translate(-55.378 -38.552)" fill-rule="evenodd"/>
 52 |       <path id="Path_50" data-name="Path 50" d="M83,163.779h20.779V143H83Z" transform="translate(-41.443 -77.665)" fill="#3ecc5f" fill-rule="evenodd"/>
 53 |       <g id="Group_8" data-name="Group 8" transform="matrix(0.966, -0.259, 0.259, 0.966, 51.971, 43.3)">
 54 |         <rect id="Rectangle_3" data-name="Rectangle 3" width="43.906" height="17.333" rx="2" transform="translate(0 0)" fill="#d8d8d8"/>
 55 |         <g id="Group_2" data-name="Group 2" transform="translate(0.728 10.948)">
 56 |           <rect id="Rectangle_4" data-name="Rectangle 4" width="2.537" height="2.537" rx="1" transform="translate(7.985 0)" fill="#4a4a4a"/>
 57 |           <rect id="Rectangle_5" data-name="Rectangle 5" width="2.537" height="2.537" rx="1" transform="translate(10.991 0)" fill="#4a4a4a"/>
 58 |           <rect id="Rectangle_6" data-name="Rectangle 6" width="2.537" height="2.537" rx="1" transform="translate(13.997 0)" fill="#4a4a4a"/>
 59 |           <rect id="Rectangle_7" data-name="Rectangle 7" width="2.537" height="2.537" rx="1" transform="translate(17.003 0)" fill="#4a4a4a"/>
 60 |           <rect id="Rectangle_8" data-name="Rectangle 8" width="2.537" height="2.537" rx="1" transform="translate(20.009 0)" fill="#4a4a4a"/>
 61 |           <rect id="Rectangle_9" data-name="Rectangle 9" width="2.537" height="2.537" rx="1" transform="translate(23.015 0)" fill="#4a4a4a"/>
 62 |           <rect id="Rectangle_10" data-name="Rectangle 10" width="2.537" height="2.537" rx="1" transform="translate(26.021 0)" fill="#4a4a4a"/>
 63 |           <rect id="Rectangle_11" data-name="Rectangle 11" width="2.537" height="2.537" rx="1" transform="translate(29.028 0)" fill="#4a4a4a"/>
 64 |           <rect id="Rectangle_12" data-name="Rectangle 12" width="2.537" height="2.537" rx="1" transform="translate(32.034 0)" fill="#4a4a4a"/>
 65 |           <path id="Path_51" data-name="Path 51" d="M.519,0H6.9A.519.519,0,0,1,7.421.52v1.5a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,2.017V.519A.519.519,0,0,1,.519,0ZM35.653,0h6.383a.519.519,0,0,1,.519.519v1.5a.519.519,0,0,1-.519.519H35.652a.519.519,0,0,1-.519-.519V.519A.519.519,0,0,1,35.652,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
 66 |         </g>
 67 |         <g id="Group_3" data-name="Group 3" transform="translate(0.728 4.878)">
 68 |           <path id="Path_52" data-name="Path 52" d="M.519,0H2.956a.519.519,0,0,1,.519.519v1.5a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,2.017V.519A.519.519,0,0,1,.519,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
 69 |           <rect id="Rectangle_13" data-name="Rectangle 13" width="2.537" height="2.537" rx="1" transform="translate(3.945 0)" fill="#4a4a4a"/>
 70 |           <rect id="Rectangle_14" data-name="Rectangle 14" width="2.537" height="2.537" rx="1" transform="translate(6.951 0)" fill="#4a4a4a"/>
 71 |           <rect id="Rectangle_15" data-name="Rectangle 15" width="2.537" height="2.537" rx="1" transform="translate(9.958 0)" fill="#4a4a4a"/>
 72 |           <rect id="Rectangle_16" data-name="Rectangle 16" width="2.537" height="2.537" rx="1" transform="translate(12.964 0)" fill="#4a4a4a"/>
 73 |           <rect id="Rectangle_17" data-name="Rectangle 17" width="2.537" height="2.537" rx="1" transform="translate(15.97 0)" fill="#4a4a4a"/>
 74 |           <rect id="Rectangle_18" data-name="Rectangle 18" width="2.537" height="2.537" rx="1" transform="translate(18.976 0)" fill="#4a4a4a"/>
 75 |           <rect id="Rectangle_19" data-name="Rectangle 19" width="2.537" height="2.537" rx="1" transform="translate(21.982 0)" fill="#4a4a4a"/>
 76 |           <rect id="Rectangle_20" data-name="Rectangle 20" width="2.537" height="2.537" rx="1" transform="translate(24.988 0)" fill="#4a4a4a"/>
 77 |           <rect id="Rectangle_21" data-name="Rectangle 21" width="2.537" height="2.537" rx="1" transform="translate(27.994 0)" fill="#4a4a4a"/>
 78 |           <rect id="Rectangle_22" data-name="Rectangle 22" width="2.537" height="2.537" rx="1" transform="translate(31 0)" fill="#4a4a4a"/>
 79 |           <rect id="Rectangle_23" data-name="Rectangle 23" width="2.537" height="2.537" rx="1" transform="translate(34.006 0)" fill="#4a4a4a"/>
 80 |           <rect id="Rectangle_24" data-name="Rectangle 24" width="2.537" height="2.537" rx="1" transform="translate(37.012 0)" fill="#4a4a4a"/>
 81 |           <rect id="Rectangle_25" data-name="Rectangle 25" width="2.537" height="2.537" rx="1" transform="translate(40.018 0)" fill="#4a4a4a"/>
 82 |         </g>
 83 |         <g id="Group_4" data-name="Group 4" transform="translate(43.283 4.538) rotate(180)">
 84 |           <path id="Path_53" data-name="Path 53" d="M.519,0H2.956a.519.519,0,0,1,.519.519v1.5a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,2.017V.519A.519.519,0,0,1,.519,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
 85 |           <rect id="Rectangle_26" data-name="Rectangle 26" width="2.537" height="2.537" rx="1" transform="translate(3.945 0)" fill="#4a4a4a"/>
 86 |           <rect id="Rectangle_27" data-name="Rectangle 27" width="2.537" height="2.537" rx="1" transform="translate(6.951 0)" fill="#4a4a4a"/>
 87 |           <rect id="Rectangle_28" data-name="Rectangle 28" width="2.537" height="2.537" rx="1" transform="translate(9.958 0)" fill="#4a4a4a"/>
 88 |           <rect id="Rectangle_29" data-name="Rectangle 29" width="2.537" height="2.537" rx="1" transform="translate(12.964 0)" fill="#4a4a4a"/>
 89 |           <rect id="Rectangle_30" data-name="Rectangle 30" width="2.537" height="2.537" rx="1" transform="translate(15.97 0)" fill="#4a4a4a"/>
 90 |           <rect id="Rectangle_31" data-name="Rectangle 31" width="2.537" height="2.537" rx="1" transform="translate(18.976 0)" fill="#4a4a4a"/>
 91 |           <rect id="Rectangle_32" data-name="Rectangle 32" width="2.537" height="2.537" rx="1" transform="translate(21.982 0)" fill="#4a4a4a"/>
 92 |           <rect id="Rectangle_33" data-name="Rectangle 33" width="2.537" height="2.537" rx="1" transform="translate(24.988 0)" fill="#4a4a4a"/>
 93 |           <rect id="Rectangle_34" data-name="Rectangle 34" width="2.537" height="2.537" rx="1" transform="translate(27.994 0)" fill="#4a4a4a"/>
 94 |           <rect id="Rectangle_35" data-name="Rectangle 35" width="2.537" height="2.537" rx="1" transform="translate(31.001 0)" fill="#4a4a4a"/>
 95 |           <rect id="Rectangle_36" data-name="Rectangle 36" width="2.537" height="2.537" rx="1" transform="translate(34.007 0)" fill="#4a4a4a"/>
 96 |           <rect id="Rectangle_37" data-name="Rectangle 37" width="2.537" height="2.537" rx="1" transform="translate(37.013 0)" fill="#4a4a4a"/>
 97 |           <rect id="Rectangle_38" data-name="Rectangle 38" width="2.537" height="2.537" rx="1" transform="translate(40.018 0)" fill="#4a4a4a"/>
 98 |           <rect id="Rectangle_39" data-name="Rectangle 39" width="2.537" height="2.537" rx="1" transform="translate(3.945 0)" fill="#4a4a4a"/>
 99 |           <rect id="Rectangle_40" data-name="Rectangle 40" width="2.537" height="2.537" rx="1" transform="translate(6.951 0)" fill="#4a4a4a"/>
100 |           <rect id="Rectangle_41" data-name="Rectangle 41" width="2.537" height="2.537" rx="1" transform="translate(9.958 0)" fill="#4a4a4a"/>
101 |           <rect id="Rectangle_42" data-name="Rectangle 42" width="2.537" height="2.537" rx="1" transform="translate(12.964 0)" fill="#4a4a4a"/>
102 |           <rect id="Rectangle_43" data-name="Rectangle 43" width="2.537" height="2.537" rx="1" transform="translate(15.97 0)" fill="#4a4a4a"/>
103 |           <rect id="Rectangle_44" data-name="Rectangle 44" width="2.537" height="2.537" rx="1" transform="translate(18.976 0)" fill="#4a4a4a"/>
104 |           <rect id="Rectangle_45" data-name="Rectangle 45" width="2.537" height="2.537" rx="1" transform="translate(21.982 0)" fill="#4a4a4a"/>
105 |           <rect id="Rectangle_46" data-name="Rectangle 46" width="2.537" height="2.537" rx="1" transform="translate(24.988 0)" fill="#4a4a4a"/>
106 |           <rect id="Rectangle_47" data-name="Rectangle 47" width="2.537" height="2.537" rx="1" transform="translate(27.994 0)" fill="#4a4a4a"/>
107 |           <rect id="Rectangle_48" data-name="Rectangle 48" width="2.537" height="2.537" rx="1" transform="translate(31.001 0)" fill="#4a4a4a"/>
108 |           <rect id="Rectangle_49" data-name="Rectangle 49" width="2.537" height="2.537" rx="1" transform="translate(34.007 0)" fill="#4a4a4a"/>
109 |           <rect id="Rectangle_50" data-name="Rectangle 50" width="2.537" height="2.537" rx="1" transform="translate(37.013 0)" fill="#4a4a4a"/>
110 |           <rect id="Rectangle_51" data-name="Rectangle 51" width="2.537" height="2.537" rx="1" transform="translate(40.018 0)" fill="#4a4a4a"/>
111 |         </g>
112 |         <g id="Group_6" data-name="Group 6" transform="translate(0.728 7.883)">
113 |           <path id="Path_54" data-name="Path 54" d="M.519,0h3.47a.519.519,0,0,1,.519.519v1.5a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,2.017V.52A.519.519,0,0,1,.519,0Z" transform="translate(0 0)" fill="#4a4a4a" fill-rule="evenodd"/>
114 |           <g id="Group_5" data-name="Group 5" transform="translate(5.073 0)">
115 |             <rect id="Rectangle_52" data-name="Rectangle 52" width="2.537" height="2.537" rx="1" transform="translate(0 0)" fill="#4a4a4a"/>
116 |             <rect id="Rectangle_53" data-name="Rectangle 53" width="2.537" height="2.537" rx="1" transform="translate(3.006 0)" fill="#4a4a4a"/>
117 |             <rect id="Rectangle_54" data-name="Rectangle 54" width="2.537" height="2.537" rx="1" transform="translate(6.012 0)" fill="#4a4a4a"/>
118 |             <rect id="Rectangle_55" data-name="Rectangle 55" width="2.537" height="2.537" rx="1" transform="translate(9.018 0)" fill="#4a4a4a"/>
119 |             <rect id="Rectangle_56" data-name="Rectangle 56" width="2.537" height="2.537" rx="1" transform="translate(12.025 0)" fill="#4a4a4a"/>
120 |             <rect id="Rectangle_57" data-name="Rectangle 57" width="2.537" height="2.537" rx="1" transform="translate(15.031 0)" fill="#4a4a4a"/>
121 |             <rect id="Rectangle_58" data-name="Rectangle 58" width="2.537" height="2.537" rx="1" transform="translate(18.037 0)" fill="#4a4a4a"/>
122 |             <rect id="Rectangle_59" data-name="Rectangle 59" width="2.537" height="2.537" rx="1" transform="translate(21.042 0)" fill="#4a4a4a"/>
123 |             <rect id="Rectangle_60" data-name="Rectangle 60" width="2.537" height="2.537" rx="1" transform="translate(24.049 0)" fill="#4a4a4a"/>
124 |             <rect id="Rectangle_61" data-name="Rectangle 61" width="2.537" height="2.537" rx="1" transform="translate(27.055 0)" fill="#4a4a4a"/>
125 |             <rect id="Rectangle_62" data-name="Rectangle 62" width="2.537" height="2.537" rx="1" transform="translate(30.061 0)" fill="#4a4a4a"/>
126 |           </g>
127 |           <path id="Path_55" data-name="Path 55" d="M.52,0H3.8a.519.519,0,0,1,.519.519v1.5a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,2.017V.52A.519.519,0,0,1,.519,0Z" transform="translate(38.234 0)" fill="#4a4a4a" fill-rule="evenodd"/>
128 |         </g>
129 |         <g id="Group_7" data-name="Group 7" transform="translate(0.728 14.084)">
130 |           <rect id="Rectangle_63" data-name="Rectangle 63" width="2.537" height="2.537" rx="1" transform="translate(0 0)" fill="#4a4a4a"/>
131 |           <rect id="Rectangle_64" data-name="Rectangle 64" width="2.537" height="2.537" rx="1" transform="translate(3.006 0)" fill="#4a4a4a"/>
132 |           <rect id="Rectangle_65" data-name="Rectangle 65" width="2.537" height="2.537" rx="1" transform="translate(6.012 0)" fill="#4a4a4a"/>
133 |           <rect id="Rectangle_66" data-name="Rectangle 66" width="2.537" height="2.537" rx="1" transform="translate(9.018 0)" fill="#4a4a4a"/>
134 |           <path id="Path_56" data-name="Path 56" d="M.519,0H14.981A.519.519,0,0,1,15.5.519v1.5a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,2.018V.519A.519.519,0,0,1,.519,0Zm15.97,0h1.874a.519.519,0,0,1,.519.519v1.5a.519.519,0,0,1-.519.519H16.489a.519.519,0,0,1-.519-.519V.519A.519.519,0,0,1,16.489,0Z" transform="translate(12.024 0)" fill="#4a4a4a" fill-rule="evenodd"/>
135 |           <rect id="Rectangle_67" data-name="Rectangle 67" width="2.537" height="2.537" rx="1" transform="translate(31.376 0)" fill="#4a4a4a"/>
136 |           <rect id="Rectangle_68" data-name="Rectangle 68" width="2.537" height="2.537" rx="1" transform="translate(34.382 0)" fill="#4a4a4a"/>
137 |           <rect id="Rectangle_69" data-name="Rectangle 69" width="2.537" height="2.537" rx="1" transform="translate(40.018 0)" fill="#4a4a4a"/>
138 |           <path id="Path_57" data-name="Path 57" d="M2.537,0V.561a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,.561V0Z" transform="translate(39.736 1.08) rotate(180)" fill="#4a4a4a"/>
139 |           <path id="Path_58" data-name="Path 58" d="M2.537,0V.561a.519.519,0,0,1-.519.519H.519A.519.519,0,0,1,0,.561V0Z" transform="translate(37.2 1.456)" fill="#4a4a4a"/>
140 |         </g>
141 |         <rect id="Rectangle_70" data-name="Rectangle 70" width="42.273" height="1.127" rx="0.564" transform="translate(0.915 0.556)" fill="#4a4a4a"/>
142 |         <rect id="Rectangle_71" data-name="Rectangle 71" width="2.37" height="0.752" rx="0.376" transform="translate(1.949 0.744)" fill="#d8d8d8" opacity="0.136"/>
143 |         <rect id="Rectangle_72" data-name="Rectangle 72" width="2.37" height="0.752" rx="0.376" transform="translate(5.193 0.744)" fill="#d8d8d8" opacity="0.136"/>
144 |         <rect id="Rectangle_73" data-name="Rectangle 73" width="2.37" height="0.752" rx="0.376" transform="translate(7.688 0.744)" fill="#d8d8d8" opacity="0.136"/>
145 |         <rect id="Rectangle_74" data-name="Rectangle 74" width="2.37" height="0.752" rx="0.376" transform="translate(10.183 0.744)" fill="#d8d8d8" opacity="0.136"/>
146 |         <rect id="Rectangle_75" data-name="Rectangle 75" width="2.37" height="0.752" rx="0.376" transform="translate(12.679 0.744)" fill="#d8d8d8" opacity="0.136"/>
147 |         <rect id="Rectangle_76" data-name="Rectangle 76" width="2.37" height="0.752" rx="0.376" transform="translate(15.797 0.744)" fill="#d8d8d8" opacity="0.136"/>
148 |         <rect id="Rectangle_77" data-name="Rectangle 77" width="2.37" height="0.752" rx="0.376" transform="translate(18.292 0.744)" fill="#d8d8d8" opacity="0.136"/>
149 |         <rect id="Rectangle_78" data-name="Rectangle 78" width="2.37" height="0.752" rx="0.376" transform="translate(20.788 0.744)" fill="#d8d8d8" opacity="0.136"/>
150 |         <rect id="Rectangle_79" data-name="Rectangle 79" width="2.37" height="0.752" rx="0.376" transform="translate(23.283 0.744)" fill="#d8d8d8" opacity="0.136"/>
151 |         <rect id="Rectangle_80" data-name="Rectangle 80" width="2.37" height="0.752" rx="0.376" transform="translate(26.402 0.744)" fill="#d8d8d8" opacity="0.136"/>
152 |         <rect id="Rectangle_81" data-name="Rectangle 81" width="2.37" height="0.752" rx="0.376" transform="translate(28.897 0.744)" fill="#d8d8d8" opacity="0.136"/>
153 |         <rect id="Rectangle_82" data-name="Rectangle 82" width="2.37" height="0.752" rx="0.376" transform="translate(31.393 0.744)" fill="#d8d8d8" opacity="0.136"/>
154 |         <rect id="Rectangle_83" data-name="Rectangle 83" width="2.37" height="0.752" rx="0.376" transform="translate(34.512 0.744)" fill="#d8d8d8" opacity="0.136"/>
155 |         <rect id="Rectangle_84" data-name="Rectangle 84" width="2.37" height="0.752" rx="0.376" transform="translate(37.007 0.744)" fill="#d8d8d8" opacity="0.136"/>
156 |         <rect id="Rectangle_85" data-name="Rectangle 85" width="2.37" height="0.752" rx="0.376" transform="translate(39.502 0.744)" fill="#d8d8d8" opacity="0.136"/>
157 |       </g>
158 |       <path id="Path_59" data-name="Path 59" d="M123.779,148.389a2.583,2.583,0,0,0-.332.033c-.02-.078-.038-.156-.06-.234a2.594,2.594,0,1,0-2.567-4.455q-.086-.088-.174-.175a2.593,2.593,0,1,0-4.461-2.569c-.077-.022-.154-.04-.231-.06a2.6,2.6,0,1,0-5.128,0c-.077.02-.154.038-.231.06a2.594,2.594,0,1,0-4.461,2.569,10.384,10.384,0,1,0,17.314,9.992,2.592,2.592,0,1,0,.332-5.161" transform="translate(-51.054 -75.262)" fill="#44d860" fill-rule="evenodd"/>
159 |       <path id="Path_60" data-name="Path 60" d="M83,113.389h20.779V103H83Z" transform="translate(-41.443 -58.444)" fill="#3ecc5f" fill-rule="evenodd"/>
160 |       <path id="Path_61" data-name="Path 61" d="M123.389,108.944a1.3,1.3,0,1,0,0-2.6,1.338,1.338,0,0,0-.166.017c-.01-.039-.019-.078-.03-.117a1.3,1.3,0,0,0-.5-2.5,1.285,1.285,0,0,0-.783.269q-.043-.044-.087-.087a1.285,1.285,0,0,0,.263-.776,1.3,1.3,0,0,0-2.493-.509,5.195,5.195,0,1,0,0,10,1.3,1.3,0,0,0,2.493-.509,1.285,1.285,0,0,0-.263-.776q.044-.043.087-.087a1.285,1.285,0,0,0,.783.269,1.3,1.3,0,0,0,.5-2.5c.011-.038.02-.078.03-.117a1.335,1.335,0,0,0,.166.017" transform="translate(-55.859 -57.894)" fill="#44d860" fill-rule="evenodd"/>
161 |       <path id="Path_62" data-name="Path 62" d="M141.8,38.745a1.41,1.41,0,0,1-.255-.026,1.309,1.309,0,0,1-.244-.073,1.349,1.349,0,0,1-.224-.119,1.967,1.967,0,0,1-.2-.161,1.52,1.52,0,0,1-.161-.2,1.282,1.282,0,0,1-.218-.722,1.41,1.41,0,0,1,.026-.255,1.5,1.5,0,0,1,.072-.244,1.364,1.364,0,0,1,.12-.223,1.252,1.252,0,0,1,.358-.358,1.349,1.349,0,0,1,.224-.119,1.309,1.309,0,0,1,.244-.073,1.2,1.2,0,0,1,.509,0,1.262,1.262,0,0,1,.468.192,1.968,1.968,0,0,1,.2.161,1.908,1.908,0,0,1,.161.2,1.322,1.322,0,0,1,.12.223,1.361,1.361,0,0,1,.1.5,1.317,1.317,0,0,1-.379.919,1.968,1.968,0,0,1-.2.161,1.346,1.346,0,0,1-.223.119,1.332,1.332,0,0,1-.5.1m10.389-.649a1.326,1.326,0,0,1-.92-.379,1.979,1.979,0,0,1-.161-.2,1.282,1.282,0,0,1-.218-.722,1.326,1.326,0,0,1,.379-.919,1.967,1.967,0,0,1,.2-.161,1.351,1.351,0,0,1,.224-.119,1.308,1.308,0,0,1,.244-.073,1.2,1.2,0,0,1,.509,0,1.262,1.262,0,0,1,.468.192,1.967,1.967,0,0,1,.2.161,1.326,1.326,0,0,1,.379.919,1.461,1.461,0,0,1-.026.255,1.323,1.323,0,0,1-.073.244,1.847,1.847,0,0,1-.119.223,1.911,1.911,0,0,1-.161.2,1.967,1.967,0,0,1-.2.161,1.294,1.294,0,0,1-.722.218" transform="translate(-69.074 -26.006)" fill-rule="evenodd"/>
162 |     </g>
163 |     <g id="React-icon" transform="translate(906.3 541.56)">
164 |       <path id="Path_330" data-name="Path 330" d="M263.668,117.179c0-5.827-7.3-11.35-18.487-14.775,2.582-11.4,1.434-20.477-3.622-23.382a7.861,7.861,0,0,0-4.016-1v4a4.152,4.152,0,0,1,2.044.466c2.439,1.4,3.5,6.724,2.672,13.574-.2,1.685-.52,3.461-.914,5.272a86.9,86.9,0,0,0-11.386-1.954,87.469,87.469,0,0,0-7.459-8.965c5.845-5.433,11.332-8.41,15.062-8.41V78h0c-4.931,0-11.386,3.514-17.913,9.611-6.527-6.061-12.982-9.539-17.913-9.539v4c3.712,0,9.216,2.959,15.062,8.356a84.687,84.687,0,0,0-7.405,8.947,83.732,83.732,0,0,0-11.4,1.972c-.412-1.793-.717-3.532-.932-5.2-.843-6.85.2-12.175,2.618-13.592a3.991,3.991,0,0,1,2.062-.466v-4h0a8,8,0,0,0-4.052,1c-5.039,2.9-6.168,11.96-3.568,23.328-11.153,3.443-18.415,8.947-18.415,14.757,0,5.828,7.3,11.35,18.487,14.775-2.582,11.4-1.434,20.477,3.622,23.382a7.882,7.882,0,0,0,4.034,1c4.931,0,11.386-3.514,17.913-9.611,6.527,6.061,12.982,9.539,17.913,9.539a8,8,0,0,0,4.052-1c5.039-2.9,6.168-11.96,3.568-23.328C256.406,128.511,263.668,122.988,263.668,117.179Zm-23.346-11.96c-.663,2.313-1.488,4.7-2.421,7.083-.735-1.434-1.506-2.869-2.349-4.3-.825-1.434-1.7-2.833-2.582-4.2C235.517,104.179,237.974,104.645,240.323,105.219Zm-8.212,19.1c-1.4,2.421-2.833,4.716-4.321,6.85-2.672.233-5.379.359-8.1.359-2.708,0-5.415-.126-8.069-.341q-2.232-3.2-4.339-6.814-2.044-3.523-3.73-7.136c1.112-2.4,2.367-4.805,3.712-7.154,1.4-2.421,2.833-4.716,4.321-6.85,2.672-.233,5.379-.359,8.1-.359,2.708,0,5.415.126,8.069.341q2.232,3.2,4.339,6.814,2.044,3.523,3.73,7.136C234.692,119.564,233.455,121.966,232.11,124.315Zm5.792-2.331c.968,2.4,1.793,4.805,2.474,7.136-2.349.574-4.823,1.058-7.387,1.434.879-1.381,1.757-2.8,2.582-4.25C236.4,124.871,237.167,123.419,237.9,121.984ZM219.72,141.116a73.921,73.921,0,0,1-4.985-5.738c1.614.072,3.263.126,4.931.126,1.685,0,3.353-.036,4.985-.126A69.993,69.993,0,0,1,219.72,141.116ZM206.38,130.555c-2.546-.377-5-.843-7.352-1.417.663-2.313,1.488-4.7,2.421-7.083.735,1.434,1.506,2.869,2.349,4.3S205.5,129.192,206.38,130.555ZM219.63,93.241a73.924,73.924,0,0,1,4.985,5.738c-1.614-.072-3.263-.126-4.931-.126-1.686,0-3.353.036-4.985.126A69.993,69.993,0,0,1,219.63,93.241ZM206.362,103.8c-.879,1.381-1.757,2.8-2.582,4.25-.825,1.434-1.6,2.869-2.331,4.3-.968-2.4-1.793-4.805-2.474-7.136C201.323,104.663,203.8,104.179,206.362,103.8Zm-16.227,22.449c-6.348-2.708-10.454-6.258-10.454-9.073s4.106-6.383,10.454-9.073c1.542-.663,3.228-1.255,4.967-1.811a86.122,86.122,0,0,0,4.034,10.92,84.9,84.9,0,0,0-3.981,10.866C193.38,127.525,191.694,126.915,190.134,126.252Zm9.647,25.623c-2.439-1.4-3.5-6.724-2.672-13.574.2-1.686.52-3.461.914-5.272a86.9,86.9,0,0,0,11.386,1.954,87.465,87.465,0,0,0,7.459,8.965c-5.845,5.433-11.332,8.41-15.062,8.41A4.279,4.279,0,0,1,199.781,151.875Zm42.532-13.663c.843,6.85-.2,12.175-2.618,13.592a3.99,3.99,0,0,1-2.062.466c-3.712,0-9.216-2.959-15.062-8.356a84.689,84.689,0,0,0,7.405-8.947,83.731,83.731,0,0,0,11.4-1.972A50.194,50.194,0,0,1,242.313,138.212Zm6.9-11.96c-1.542.663-3.228,1.255-4.967,1.811a86.12,86.12,0,0,0-4.034-10.92,84.9,84.9,0,0,0,3.981-10.866c1.775.556,3.461,1.165,5.039,1.829,6.348,2.708,10.454,6.258,10.454,9.073C259.67,119.994,255.564,123.562,249.216,126.252Z" fill="#61dafb"/>
165 |       <path id="Path_331" data-name="Path 331" d="M320.8,78.4Z" transform="translate(-119.082 -0.328)" fill="#61dafb"/>
166 |       <circle id="Ellipse_112" data-name="Ellipse 112" cx="8.194" cy="8.194" r="8.194" transform="translate(211.472 108.984)" fill="#61dafb"/>
167 |       <path id="Path_332" data-name="Path 332" d="M520.5,78.1Z" transform="translate(-282.975 -0.082)" fill="#61dafb"/>
168 |     </g>
169 |   </g>
170 | </svg>
171 | 


--------------------------------------------------------------------------------