├── .eslintignore
├── .eslintrc.json
├── .gitignore
├── .prettierignore
├── .prettierrc
├── LICENSE
├── README.md
├── images
├── ConfigPage_Advanced.png
├── ConfigPage_Base.png
├── ConfigPage_Configuring.png
├── ConfigPage_Disconnect.png
├── DockerMetrics.png
├── DockerMetrics_Paused.png
├── DockerMetrics_Unpausing.png
├── KSQL_CLI_Example.png
├── KSQL_Stream.gif
├── Metrics_PartitionMetrics.png
├── Overview.png
├── Paused.png
├── Pausing.png
├── Test_Messages_KSQL.png
├── Tests_KSQL.png
├── Tests_Messages.png
├── Tests_Topics.png
├── Unpausing.png
├── banner.png
├── banner_800x450.png
├── docker-metrics.gif
├── export-disconnect.gif
├── home-configuration.gif
├── kafka-metrics.gif
├── testing.gif
├── xkite-banner.png
├── xkite-core-banner.svg
└── xkite-core-banner_28h.png
├── next-env.d.ts
├── next.config.js
├── next.d.ts
├── package.json
├── pages
├── 404.tsx
├── _app.tsx
├── _document.tsx
├── api
│ ├── checkPort.ts
│ ├── docker.ts
│ ├── download.ts
│ ├── grafana.ts
│ ├── kite
│ │ ├── connect
│ │ │ └── kafka.ts
│ │ ├── create.ts
│ │ ├── deploy.ts
│ │ ├── disconnect.ts
│ │ ├── getConfig.ts
│ │ ├── getConfigFile.ts
│ │ ├── getKiteState.ts
│ │ ├── getPackageBuild.ts
│ │ ├── getSetup.ts
│ │ ├── pause.ts
│ │ ├── shutdown.ts
│ │ └── unpause.ts
│ ├── monitor.ts
│ ├── socket.ts
│ └── spring
│ │ └── index.ts
├── components
│ ├── accordions
│ │ └── index.tsx
│ ├── avatars
│ │ └── index.tsx
│ ├── badges
│ │ └── index.tsx
│ ├── buttons
│ │ └── index.tsx
│ ├── cards
│ │ └── index.tsx
│ ├── tabs
│ │ └── index.tsx
│ └── tooltips
│ │ └── index.tsx
├── configuration
│ └── index.tsx
├── connect
│ └── index.tsx
├── dockerMetrics
│ └── index.tsx
├── index.tsx
├── metrics
│ ├── index.tsx
│ └── logs
│ │ └── index.tsx
├── status
│ └── 500
│ │ └── index.tsx
└── tests
│ └── index.tsx
├── public
├── _redirects
├── android-chrome-192x192.png
├── android-chrome-512x512.png
├── apple-touch-icon.png
├── browserconfig.xml
├── favicon.ico
├── icon-16x16.png
├── icon-192x192.png
├── icon-256x256.png
├── icon-32x32.png
├── icon-512x512.png
├── manifest.json
├── mstile-150x150.png
├── robots.txt
├── safari-pinned-tab.svg
├── site.webmanifest
├── spinner.svg
└── static
│ └── images
│ ├── avatars
│ ├── 1.jpg
│ ├── 2.jpg
│ ├── 3.jpg
│ ├── 4.jpg
│ └── 5.jpg
│ ├── logo
│ ├── fake.png
│ ├── fake2.png
│ ├── google.svg
│ ├── material-ui.svg
│ ├── next-js.svg
│ ├── typescript.svg
│ └── xkite-logo.png
│ ├── overview
│ ├── accent_header.png
│ ├── accent_sidebar.png
│ ├── bottom_navigation.png
│ ├── boxed_sidebar.png
│ ├── collapsed_sidebar.png
│ ├── extended_sidebar.png
│ ├── figma.svg
│ ├── hero-screenshot.png
│ ├── management_screen_1.png
│ ├── management_screen_2.png
│ ├── management_screen_3.png
│ ├── performance.png
│ ├── rtl-preview.jpg
│ ├── sketch.svg
│ ├── tokyo-logo.png
│ └── top_navigation.png
│ ├── placeholders
│ ├── covers
│ │ ├── 1.jpg
│ │ ├── 2.jpg
│ │ ├── 3.jpg
│ │ ├── 4.jpg
│ │ ├── 5.jpg
│ │ ├── 6.jpg
│ │ ├── 7.jpg
│ │ ├── automation-bg.jpg
│ │ └── garden_camera.jpg
│ ├── fitness
│ │ ├── 1.jpg
│ │ ├── 2.jpg
│ │ ├── 3.jpg
│ │ └── 4.jpg
│ ├── illustrations
│ │ ├── 1.svg
│ │ ├── 2.png
│ │ ├── 3.svg
│ │ ├── 4.svg
│ │ ├── 5.svg
│ │ ├── 6.png
│ │ ├── analysis.svg
│ │ ├── authentication.svg
│ │ ├── businessman.svg
│ │ ├── handshake.svg
│ │ ├── moving.svg
│ │ ├── partly-cloudy-day-rain.svg
│ │ ├── pressure-high.svg
│ │ ├── security.svg
│ │ ├── time.svg
│ │ └── wireframe.svg
│ ├── logo
│ │ ├── adobe.jpg
│ │ ├── airbnb-icon.svg
│ │ ├── airbnb.svg
│ │ ├── autodesk.jpg
│ │ ├── bankofamerica.svg
│ │ ├── bitcoin.png
│ │ ├── cardano.png
│ │ ├── coinbase.svg
│ │ ├── deutschebank.svg
│ │ ├── deutschebank_light.svg
│ │ ├── discord-icon.svg
│ │ ├── discord.svg
│ │ ├── dribbble-icon.svg
│ │ ├── ea.jpg
│ │ ├── ethereum.png
│ │ ├── facebook.svg
│ │ ├── google-icon.svg
│ │ ├── google-logo.jpg
│ │ ├── google.svg
│ │ ├── hp.jpg
│ │ ├── ibm.jpg
│ │ ├── ing.jpg
│ │ ├── instagram-icon.svg
│ │ ├── instagram.svg
│ │ ├── mastercard.png
│ │ ├── microsoft-icon.svg
│ │ ├── microsoft.svg
│ │ ├── netflix-icon.svg
│ │ ├── netflix-logo.jpg
│ │ ├── netflix.svg
│ │ ├── oracle.jpg
│ │ ├── orange.jpg
│ │ ├── pinterest-icon.svg
│ │ ├── ripple.png
│ │ ├── slack-big.svg
│ │ ├── slack-icon.svg
│ │ ├── slack.svg
│ │ ├── spotify copy.svg
│ │ ├── spotify-icon.svg
│ │ ├── spotify.svg
│ │ ├── stripe.svg
│ │ ├── tesla.svg
│ │ ├── uipath.jpg
│ │ ├── visa.png
│ │ └── wellsfargo.svg
│ └── products
│ │ ├── 1.png
│ │ ├── 10.png
│ │ ├── 2.png
│ │ ├── 3.png
│ │ ├── 4.png
│ │ ├── 5.png
│ │ ├── 6.png
│ │ ├── 7.png
│ │ ├── 8.png
│ │ └── 9.png
│ └── status
│ ├── 404.svg
│ ├── 500.svg
│ ├── coming-soon.svg
│ └── maintenance.svg
├── src
├── common
│ ├── constants
│ │ └── index.ts
│ ├── kafkaConnector
│ │ ├── ConsumerFactory.ts
│ │ ├── ProducerFactory.ts
│ │ ├── index.ts
│ │ └── types
│ │ │ └── kafkaConnector.d.ts
│ ├── monitor
│ │ └── monitor.ts
│ ├── types
│ │ └── io.ts
│ └── utilities
│ │ ├── consumerUtil.ts
│ │ ├── index.ts
│ │ └── producerUtil.ts
├── components
│ ├── Chart
│ │ └── index.tsx
│ ├── Footer
│ │ └── index.tsx
│ ├── Label
│ │ └── index.tsx
│ ├── Link
│ │ └── index.tsx
│ ├── Logo
│ │ └── index.tsx
│ ├── LogoSign
│ │ └── index.tsx
│ ├── PageTitle
│ │ └── index.tsx
│ ├── PageTitleWrapper
│ │ └── index.tsx
│ ├── Scrollbar
│ │ └── index.tsx
│ └── Text
│ │ └── index.tsx
├── content
│ ├── Applications
│ │ └── Messenger
│ │ │ ├── BottomBarContent.tsx
│ │ │ ├── ChatContent.tsx
│ │ │ ├── SidebarContent.tsx
│ │ │ └── TopBarContent.tsx
│ ├── Dashboards
│ │ └── Tasks
│ │ │ ├── ExportConfigBtn.tsx
│ │ │ ├── PageHeader.tsx
│ │ │ └── ShutdownBtn.tsx
│ └── Overview
│ │ └── Hero
│ │ └── index.tsx
├── contexts
│ └── SidebarContext.tsx
├── createEmotionCache.ts
├── layouts
│ ├── BaseLayout
│ │ └── index.tsx
│ └── SidebarLayout
│ │ ├── Header
│ │ ├── Menu
│ │ │ └── index.tsx
│ │ └── index.tsx
│ │ ├── Sidebar
│ │ ├── SidebarMenu
│ │ │ └── index.tsx
│ │ └── index.tsx
│ │ └── index.tsx
├── theme
│ ├── ThemeProvider.tsx
│ ├── base.ts
│ └── schemes
│ │ ├── DarkSpacesTheme.ts
│ │ ├── GreenFieldsTheme.ts
│ │ └── NebulaFighterTheme.ts
├── types.ts
└── workers
│ ├── configWorker.ts
│ ├── ksqlWorker.ts
│ └── testWorker.ts
└── tsconfig.json
/.eslintignore:
--------------------------------------------------------------------------------
1 | # .estlintignore file
2 | dist
3 | .next
4 | build
5 | node_modules/
--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["next/core-web-vitals", "plugin:prettier/recommended"],
3 | "rules": {
4 | "prettier/prettier": "off",
5 | "@next/next/no-img-element": "off",
6 | "jsx-a11y/alt-text": "off",
7 | "react/display-name": "off",
8 | "eslint-disable-next-line": "off",
9 | "react-hooks/exhaustive-deps": "off",
10 | "react/no-unescaped-entities": "off",
11 | "react/jsx-max-props-per-line": [
12 | 1,
13 | {
14 | "maximum": 2,
15 | "when": "multiline"
16 | }
17 | ]
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 |
6 | # misc
7 | .DS_Store
8 | .env.local
9 | .env.development.local
10 | .env.test.local
11 | .env.production.local
12 | .env
13 |
14 | npm-debug.log*
15 | yarn-debug.log*
16 | yarn-error.log*
17 |
18 | # Next.js build output
19 | .next
20 | out
21 |
22 | # Nuxt.js build / generate output
23 | .nuxt
24 | dist
25 |
26 | # Gatsby files
27 | .cache/
28 | # Comment in the public line in if your project uses Gatsby and not Next.js
29 | # https://nextjs.org/blog/next-9-1#public-directory-support
30 | # public
31 |
32 | # vuepress build output
33 | .vuepress/dist
34 |
35 | # vuepress v2.x temp and cache directory
36 | .temp
37 |
38 | # Docusaurus cache and generated files
39 | .docusaurus
40 |
41 | # Serverless directories
42 | .serverless/
43 |
44 | # FuseBox cache
45 | .fusebox/
46 |
47 | # DynamoDB Local files
48 | .dynamodb/
49 |
50 | # TernJS port file
51 | .tern-port
52 |
53 | # Stores VSCode versions used for testing VSCode extensions
54 | .vscode-test
55 |
56 | # yarn v2
57 | .yarn/cache
58 | .yarn/unplugged
59 | .yarn/build-state.yml
60 | .yarn/install-state.gz
61 | .pnp.*
62 |
63 | ## Mac Files
64 | # General
65 | .DS_Store
66 | .AppleDouble
67 | .LSOverride
68 |
69 | # Icon must end with two \r
70 | Icon
71 |
72 | # Thumbnails
73 | ._*
74 |
75 | # Files that might appear in the root of a volume
76 | .DocumentRevisions-V100
77 | .fseventsd
78 | .Spotlight-V100
79 | .TemporaryItems
80 | .Trashes
81 | .VolumeIcon.icns
82 | .com.apple.timemachine.donotpresent
83 |
84 | # Directories potentially created on remote AFP share
85 | .AppleDB
86 | .AppleDesktop
87 | Network Trash Folder
88 | Temporary Items
89 | .apdisk
90 |
91 |
92 | ## Webstorm
93 | .idea
94 |
95 | # vscode
96 | .vscode
97 |
98 | package-lock.json
99 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | # Ignore artifacts:
2 | dist
3 | .next
4 | build
5 | node_modules/
--------------------------------------------------------------------------------
/.prettierrc:
--------------------------------------------------------------------------------
1 | {
2 | "bracketSpacing": true,
3 | "printWidth": 80,
4 | "singleQuote": true,
5 | "trailingComma": "none",
6 | "tabWidth": 2,
7 | "useTabs": false,
8 | "bracketSameLine": false
9 | }
10 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Permission is hereby granted, free of charge, to any person obtaining a copy
4 | of this software and associated documentation files (the "Software"), to deal
5 | in the Software without restriction, including without limitation the rights
6 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | copies of the Software, and to permit persons to whom the Software is
8 | furnished to do so, subject to the following conditions:
9 |
10 | The above copyright notice and this permission notice shall be included in all
11 | copies or substantial portions of the Software.
12 |
13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
19 | SOFTWARE.
20 |
--------------------------------------------------------------------------------
/images/ConfigPage_Advanced.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/ConfigPage_Advanced.png
--------------------------------------------------------------------------------
/images/ConfigPage_Base.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/ConfigPage_Base.png
--------------------------------------------------------------------------------
/images/ConfigPage_Configuring.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/ConfigPage_Configuring.png
--------------------------------------------------------------------------------
/images/ConfigPage_Disconnect.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/ConfigPage_Disconnect.png
--------------------------------------------------------------------------------
/images/DockerMetrics.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/DockerMetrics.png
--------------------------------------------------------------------------------
/images/DockerMetrics_Paused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/DockerMetrics_Paused.png
--------------------------------------------------------------------------------
/images/DockerMetrics_Unpausing.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/DockerMetrics_Unpausing.png
--------------------------------------------------------------------------------
/images/KSQL_CLI_Example.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/KSQL_CLI_Example.png
--------------------------------------------------------------------------------
/images/KSQL_Stream.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/KSQL_Stream.gif
--------------------------------------------------------------------------------
/images/Metrics_PartitionMetrics.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Metrics_PartitionMetrics.png
--------------------------------------------------------------------------------
/images/Overview.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Overview.png
--------------------------------------------------------------------------------
/images/Paused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Paused.png
--------------------------------------------------------------------------------
/images/Pausing.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Pausing.png
--------------------------------------------------------------------------------
/images/Test_Messages_KSQL.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Test_Messages_KSQL.png
--------------------------------------------------------------------------------
/images/Tests_KSQL.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Tests_KSQL.png
--------------------------------------------------------------------------------
/images/Tests_Messages.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Tests_Messages.png
--------------------------------------------------------------------------------
/images/Tests_Topics.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Tests_Topics.png
--------------------------------------------------------------------------------
/images/Unpausing.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/Unpausing.png
--------------------------------------------------------------------------------
/images/banner.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/banner.png
--------------------------------------------------------------------------------
/images/banner_800x450.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/banner_800x450.png
--------------------------------------------------------------------------------
/images/docker-metrics.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/docker-metrics.gif
--------------------------------------------------------------------------------
/images/export-disconnect.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/export-disconnect.gif
--------------------------------------------------------------------------------
/images/home-configuration.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/home-configuration.gif
--------------------------------------------------------------------------------
/images/kafka-metrics.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/kafka-metrics.gif
--------------------------------------------------------------------------------
/images/testing.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/testing.gif
--------------------------------------------------------------------------------
/images/xkite-banner.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/xkite-banner.png
--------------------------------------------------------------------------------
/images/xkite-core-banner_28h.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/images/xkite-core-banner_28h.png
--------------------------------------------------------------------------------
/next-env.d.ts:
--------------------------------------------------------------------------------
1 | ///
2 | ///
3 |
4 | // NOTE: This file should not be edited
5 | // see https://nextjs.org/docs/basic-features/typescript for more information.
6 |
--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | // const withImages = require('next-images');
2 |
3 | // const redirects = {
4 | // async redirects() {
5 | // return [
6 | // {
7 | // source: '/dashboards',
8 | // destination: '/dashboards/tasks',
9 | // permanent: true
10 | // }
11 | // ];
12 | // }
13 | // };
14 |
15 | // module.exports = withImages(redirects);
16 | /** @type {import('next').NextConfig} */
17 | const nextConfig = {
18 | reactStrictMode: true,
19 | experimental: {
20 | nextScriptWorkers: true
21 | }
22 | };
23 |
24 | module.exports = nextConfig;
25 |
26 |
27 |
--------------------------------------------------------------------------------
/next.d.ts:
--------------------------------------------------------------------------------
1 | import type { ReactElement, ReactNode } from 'react';
2 | import type {
3 | NextComponentType,
4 | NextPageContext
5 | } from 'next/dist/shared/lib/utils';
6 |
7 | declare module 'next' {
8 | export declare type NextPage
= NextComponentType<
9 | NextPageContext,
10 | IP,
11 | P
12 | > & {
13 | getLayout?: (page: ReactElement) => ReactNode;
14 | };
15 | }
16 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "xkite",
3 | "version": "1.0.0",
4 | "title": "xkite: Kafka Integrated Testing Environment",
5 | "description": "A comprehensive prototyping, testing, and monitoring toolset built for Apache Kafka.",
6 | "author": "xkite Team- OpenSource Labs",
7 | "license": "MIT",
8 | "repository": {
9 | "type": "git",
10 | "url": "https://github.com/oslabs-beta/xkite"
11 | },
12 | "scripts": {
13 | "next-dev": "next dev",
14 | "dev:6662": "next dev -p 6662",
15 | "dev": "concurrently \"next dev\" \"open http://localhost:3000\"",
16 | "build": "next build",
17 | "start": "next start",
18 | "lint": "next lint"
19 | },
20 | "bin": {
21 | "xkite": "npm start"
22 | },
23 | "keywords": [
24 | "apache",
25 | "kafka",
26 | "kafkajs",
27 | "docker",
28 | "react",
29 | "nextjs",
30 | "typescript",
31 | "zookeeper",
32 | "xkite-core",
33 | "GUI"
34 | ],
35 | "dependencies": {
36 | "@builder.io/partytown": "^0.7.5",
37 | "@emotion/cache": "11.7.1",
38 | "@emotion/react": "11.9.0",
39 | "@emotion/server": "11.4.0",
40 | "@emotion/styled": "11.8.1",
41 | "@mui/core": "5.0.0-alpha.54",
42 | "@mui/icons-material": "5.8.2",
43 | "@mui/lab": "5.0.0-alpha.84",
44 | "@mui/material": "5.8.2",
45 | "@mui/styles": "5.8.0",
46 | "@next/font": "13.0.6",
47 | "@reduxjs/toolkit": "^1.9.3",
48 | "@types/next": "^9.0.0",
49 | "@types/nprogress": "0.2.0",
50 | "@types/numeral": "2.0.2",
51 | "@types/react": "17.0.40",
52 | "@types/react-dom": "17.0.13",
53 | "@types/kafkajs": "^1.9.0",
54 | "@types/socket.io-client": "^1.4.35",
55 | "apexcharts": "3.35.3",
56 | "clsx": "1.1.1",
57 | "concurrently": "^7.6.0",
58 | "date-fns": "2.28.0",
59 | "eslint": "8.34.0",
60 | "eslint-config-next": "13.0.6",
61 | "get-port": "^6.1.2",
62 | "i": "^0.3.7",
63 | "next": "12.1.6",
64 | "next-images": "1.8.4",
65 | "npm": "^9.6.0",
66 | "nprogress": "0.2.0",
67 | "numeral": "2.0.6",
68 | "react": "17.0.2",
69 | "react-apexcharts": "1.4.0",
70 | "react-custom-scrollbars-2": "4.4.0",
71 | "react-dom": "17.0.2",
72 | "react-flow-renderer": "^10.3.17",
73 | "react-spinners": "^0.13.8",
74 | "reactflow": "^11.5.6",
75 | "socket.io": "^4.6.1",
76 | "socket.io-client": "^3.1.2",
77 | "typescript": "4.7.3",
78 | "xkite-core": "^1.0.27",
79 | "child_process": "^1.0.2",
80 | "net": "^1.0.2",
81 | "kafkajs": "^2.2.3"
82 | },
83 | "devDependencies": {
84 | "@types/node": "^18.14.6",
85 | "eslint": "8.17.0",
86 | "eslint-config-next": "12.1.6",
87 | "eslint-config-prettier": "8.5.0",
88 | "eslint-plugin-prettier": "4.0.0",
89 | "prettier": "^2.8.4",
90 | "prettier-eslint": "^15.0.1"
91 | },
92 | "browser": {
93 | "child_process": false,
94 | "fs": false,
95 | "path": false
96 | }
97 | }
98 |
--------------------------------------------------------------------------------
/pages/404.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Box,
3 | Card,
4 | Typography,
5 | Container,
6 | Divider,
7 | Button,
8 | FormControl,
9 | OutlinedInput,
10 | InputAdornment,
11 | styled
12 | } from '@mui/material';
13 | import Head from 'next/head';
14 | import SearchTwoToneIcon from '@mui/icons-material/SearchTwoTone';
15 | import type { ReactElement } from 'react';
16 | import BaseLayout from 'src/layouts/BaseLayout';
17 |
18 | const MainContent = styled(Box)(
19 | () => `
20 | height: 100%;
21 | display: flex;
22 | flex: 1;
23 | flex-direction: column;
24 | `
25 | );
26 |
27 | const TopWrapper = styled(Box)(
28 | ({ theme }) => `
29 | display: flex;
30 | width: 100%;
31 | flex: 1;
32 | align-items: center;
33 | justify-content: center;
34 | padding: ${theme.spacing(6)};
35 | `
36 | );
37 |
38 | const OutlinedInputWrapper = styled(OutlinedInput)(
39 | ({ theme }) => `
40 | background-color: ${theme.colors.alpha.white[100]};
41 | `
42 | );
43 |
44 | const ButtonSearch = styled(Button)(
45 | ({ theme }) => `
46 | margin-right: -${theme.spacing(1)};
47 | `
48 | );
49 |
50 | function Status404() {
51 | return (
52 | <>
53 |
54 | Status - 404
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 | The page you were looking for doesn't exist.
63 |
64 |
70 | It's on us, we moved the content to a different page. The search
71 | below should help!
72 |
73 |
74 |
75 |
76 |
77 |
82 |
83 | Search
84 |
85 |
86 | }
87 | startAdornment={
88 |
89 |
90 |
91 | }
92 | />
93 |
94 | OR
95 |
98 |
99 |
100 |
101 |
102 |
103 | >
104 | );
105 | }
106 |
107 | export default Status404;
108 |
109 | Status404.getLayout = function getLayout(page: ReactElement) {
110 | return {page};
111 | };
112 |
--------------------------------------------------------------------------------
/pages/_app.tsx:
--------------------------------------------------------------------------------
1 | import type { ReactElement, ReactNode } from 'react';
2 |
3 | import type { NextPage } from 'next';
4 | import type { AppProps } from 'next/app';
5 | import Head from 'next/head';
6 | import Router from 'next/router';
7 | import nProgress from 'nprogress';
8 | import 'nprogress/nprogress.css';
9 | import ThemeProvider from 'src/theme/ThemeProvider';
10 | import CssBaseline from '@mui/material/CssBaseline';
11 | import { CacheProvider, EmotionCache } from '@emotion/react';
12 | import createEmotionCache from 'src/createEmotionCache';
13 | import { SidebarProvider } from 'src/contexts/SidebarContext';
14 | import AdapterDateFns from '@mui/lab/AdapterDateFns';
15 | import LocalizationProvider from '@mui/lab/LocalizationProvider';
16 |
17 | const clientSideEmotionCache = createEmotionCache();
18 |
19 | type NextPageWithLayout = NextPage & {
20 | getLayout?: (page: ReactElement) => ReactNode;
21 | };
22 |
23 | interface xKiteAppProps extends AppProps {
24 | emotionCache?: EmotionCache;
25 | Component: NextPageWithLayout;
26 | }
27 |
28 | function xKiteApp(props: xKiteAppProps) {
29 | const { Component, emotionCache = clientSideEmotionCache, pageProps } = props;
30 | const getLayout = Component.getLayout ?? ((page) => page);
31 |
32 | Router.events.on('routeChangeStart', nProgress.start);
33 | Router.events.on('routeChangeError', nProgress.done);
34 | Router.events.on('routeChangeComplete', nProgress.done);
35 |
36 | return (
37 |
38 |
39 | xkite: Kafka Integrated Testing Environment
40 |
44 |
45 |
46 |
47 |
48 |
49 | {getLayout()}
50 |
51 |
52 |
53 |
54 | );
55 | }
56 |
57 | export default xKiteApp;
58 |
--------------------------------------------------------------------------------
/pages/_document.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import Document, { Html, Head, Main, NextScript } from 'next/document';
3 | import createEmotionServer from '@emotion/server/create-instance';
4 | import createEmotionCache from 'src/createEmotionCache';
5 |
6 | export default class MyDocument extends Document {
7 | render() {
8 | return (
9 |
10 |
11 |
12 |
13 |
17 |
18 |
19 |
20 |
21 |
22 |
23 | );
24 | }
25 | }
26 |
27 | // `getInitialProps` belongs to `_document` (instead of `_app`),
28 | // it's compatible with static-site generation (SSG).
29 | MyDocument.getInitialProps = async (ctx) => {
30 | // Resolution order
31 | //
32 | // On the server:
33 | // 1. app.getInitialProps
34 | // 2. page.getInitialProps
35 | // 3. document.getInitialProps
36 | // 4. app.render
37 | // 5. page.render
38 | // 6. document.render
39 | //
40 | // On the server with error:
41 | // 1. document.getInitialProps
42 | // 2. app.render
43 | // 3. page.render
44 | // 4. document.render
45 | //
46 | // On the client
47 | // 1. app.getInitialProps
48 | // 2. page.getInitialProps
49 | // 3. app.render
50 | // 4. page.render
51 |
52 | const originalRenderPage = ctx.renderPage;
53 |
54 | // You can consider sharing the same emotion cache between all the SSR requests to speed up performance.
55 | // However, be aware that it can have global side effects.
56 | const cache = createEmotionCache();
57 | const { extractCriticalToChunks } = createEmotionServer(cache);
58 |
59 | ctx.renderPage = () =>
60 | originalRenderPage({
61 | enhanceApp: (App: any) => (props) =>
62 |
63 | });
64 |
65 | const initialProps = await Document.getInitialProps(ctx);
66 | // This is important. It prevents emotion to render invalid HTML.
67 | // See https://github.com/mui-org/material-ui/issues/26561#issuecomment-855286153
68 | const emotionStyles = extractCriticalToChunks(initialProps.html);
69 | const emotionStyleTags = emotionStyles.styles.map((style) => (
70 |
76 | ));
77 |
78 | return {
79 | ...initialProps,
80 | // Styles fragment is rendered after the app and page rendering finish.
81 | styles: [
82 | ...React.Children.toArray(initialProps.styles),
83 | ...emotionStyleTags
84 | ]
85 | };
86 | };
87 |
--------------------------------------------------------------------------------
/pages/api/checkPort.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | import getPort from 'get-port';
4 |
5 | type isOpen = {
6 | isOpen: boolean;
7 | };
8 |
9 | /**
10 | * Returns a boolean isOpen indicating whether a given port is open
11 | * @param {NextApiRequest} req - NextApiRequest - This is the request object that Next.js provides.
12 | * @param res - NextApiResponse
13 | */
14 | export default async function handler(
15 | req: NextApiRequest,
16 | res: NextApiResponse
17 | ) {
18 | if (req.method === 'POST') {
19 | try {
20 | const requestedPort = req.body.port;
21 |
22 | const openPort = await getPort({ port: requestedPort });
23 |
24 | const isOpen = requestedPort == openPort;
25 | //console.log(isOpen)
26 | res.status(200).json({ isOpen });
27 | } catch (err) {
28 | console.log(err);
29 | res.status(500).send('Internal Server Error /api/kite/checkPort');
30 | }
31 | } else {
32 | res.status(405).send('Method Not Allowed');
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/pages/api/docker.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next/types';
2 | import { exec } from 'child_process';
3 | import util from 'util';
4 |
5 | type Container = {
6 | id: string;
7 | image: string;
8 | command: string;
9 | created: string;
10 | status: string;
11 | ports: string;
12 | names?: string;
13 | };
14 |
15 | type Containers = {
16 | containers: Container[];
17 | };
18 |
19 | const execPromise = util.promisify(exec);
20 | /**
21 | * Returns a boolean isOpen indicating whether a given port is open
22 | * @param {NextApiRequest} req - NextApiRequest - This is the request object that Next.js provides.
23 | * @param res - NextApiResponse
24 | */
25 | export default async function handler(
26 | req: NextApiRequest,
27 | res: NextApiResponse
28 | ) {
29 | if (req.method === 'GET') {
30 | try {
31 | const containerType = req.query.containerStatus as string;
32 | if (containerType === 'active') {
33 | const { stdout } = await execPromise('docker ps');
34 | const lines = stdout.trim().split('\n').slice(1);
35 | const containers = lines.map((line) => {
36 | const [id, image, command, created, status, ports, names] = line
37 | .trim()
38 | .split(/\s{2,}/);
39 | return {
40 | id,
41 | image,
42 | command,
43 | created,
44 | status,
45 | ports,
46 | names
47 | };
48 | });
49 | res.status(200).json({ containers });
50 | } else if (containerType === 'inactive') {
51 | const { stdout } = await execPromise(
52 | 'docker ps -a --filter "status=exited" --filter "status=created"'
53 | );
54 | const lines = stdout.trim().split('\n').slice(1);
55 | const containers = lines.map((line) => {
56 | const [id, image, command, created, status, ports, names] = line
57 | .trim()
58 | .split(/\s{2,}/);
59 | return {
60 | id,
61 | image,
62 | command,
63 | created,
64 | status,
65 | ports
66 | };
67 | });
68 | res.status(200).json({ containers });
69 | }
70 | } catch (err) {
71 | console.log(err);
72 | res.status(500).send('Internal Server Error');
73 | }
74 | } else {
75 | res.status(405).send('Method Not Allowed');
76 | }
77 | }
78 |
--------------------------------------------------------------------------------
/pages/api/download.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 | import ReadableString from '@/common/utilities';
9 | type File = string;
10 |
11 | export default async function handler(
12 | req: NextApiRequest,
13 | res: NextApiResponse
14 | ) {
15 | if (req.method === 'GET') {
16 | try {
17 | const configObj = await Kite.getConfigFile();
18 | if (configObj instanceof Error) return res.status(500);
19 | res.setHeader('Content-Type', 'application/x-yaml');
20 | res.setHeader('Content-Disposition', 'attachment; filename=config.yaml');
21 | if (!configObj) throw Error('ConfigObj not defined!');
22 | res.writeHead(200, configObj.header);
23 | const s = new ReadableString(configObj.fileStream);
24 | s.pipe(res);
25 | } catch (err) {
26 | console.log(err);
27 | res.status(500).send('Internal Server Error /api/kite/download');
28 | }
29 | } else {
30 | res.status(405).send('Method Not Allowed');
31 | }
32 | }
33 |
--------------------------------------------------------------------------------
/pages/api/grafana.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next/types';
2 |
3 | export default async function handler(
4 | req: NextApiRequest,
5 | res: NextApiResponse
6 | ) {
7 | if (req.method === 'GET') {
8 | res.redirect('http://localhost:3050/');
9 | } else {
10 | res.status(405).send('Method Not Allowed');
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/pages/api/kite/connect/kafka.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next/types';
2 | let { Kite } = require('xkite-core');
3 | if (Kite === undefined) {
4 | console.log('using secondary import...');
5 | Kite = require('xkite-core').default;
6 | }
7 | import ProducerFactory from '@/common/kafkaConnector/ProducerFactory';
8 | // import ConsumerFactory from '@/common/kafkaConnector/ConsumerFactory'; --> potentially will be using to retrieve data on which partitions new messages are assigned to
9 |
10 | type Data = {
11 | reply?: string;
12 | err?: unknown;
13 | };
14 |
15 | export default async function handler(
16 | req: NextApiRequest,
17 | res: NextApiResponse
18 | ) {
19 | if (req.method === 'POST') {
20 | try {
21 | console.log(`sending data to kafka...\n${JSON.stringify(req.body)}`);
22 | const { method, topic, messages, clientId } = req.body;
23 | const kafkaSetup = Kite.getKafkaSetup();
24 | // console.log(JSON.stringify(kafkaSetup));
25 | const _clientId =
26 | kafkaSetup.clientId !== '' && kafkaSetup.clientId !== undefined
27 | ? kafkaSetup.clientId
28 | : 'xkite';
29 | // + String(Math.round(Math.random() * 100000));
30 | // console.log('clientId = ', _clientId);
31 | const producer = await ProducerFactory.create({
32 | ...kafkaSetup,
33 | clientId: _clientId
34 | });
35 | let topics: string[] | undefined = undefined;
36 | console.log(method);
37 |
38 | switch (method) {
39 | case 'createTopics':
40 | await producer.createTopics([topic]);
41 | topics = await producer.listTopics();
42 | console.log(topics, 'from post');
43 | break;
44 | case 'getTopics':
45 | topics = await producer.listTopics();
46 | console.log(topics, 'from post');
47 | break;
48 | case 'sendMessage':
49 | //console.log(messages, topic, 'this is from kafka ts')
50 | await producer.sendBatch(messages, topic);
51 | break;
52 | case 'sendMessages':
53 | await producer.sendBatches(messages, topic);
54 | break;
55 | case 'sendMessages:Serial':
56 | await producer.sendBatchesSerial(messages, topic);
57 | break;
58 | default:
59 | return res.status(405).send({ reply: 'Invalid Msg Body' });
60 | break;
61 | }
62 | console.log('produced successfully');
63 | if (topics !== undefined) {
64 | res.status(201).json(topics);
65 | } else {
66 | res.status(200).json({ reply: 'success' });
67 | }
68 |
69 | //TO DO: uncomment when you connecting to the front-end
70 | // res.redirect('/display');
71 | } catch (err) {
72 | console.log(err);
73 | res.status(500).json({ reply: 'Error in /api/kite/connect/kafka POST' });
74 | } finally {
75 | }
76 | } else {
77 | res.status(405).send({ reply: 'Method Not Allowed' });
78 | }
79 | }
80 |
--------------------------------------------------------------------------------
/pages/api/kite/create.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next/types';
2 |
3 | import type { KiteConfig } from 'xkite-core';
4 | let { Kite } = require('xkite-core');
5 | if (Kite === undefined) {
6 | console.log('using secondary import...');
7 | Kite = require('xkite-core').default;
8 | }
9 |
10 | type Data = {
11 | reply?: string;
12 | err?: unknown;
13 | };
14 |
15 | //const kiteHost = 'localhost:6661';
16 |
17 | export default async function handler(
18 | req: NextApiRequest,
19 | res: NextApiResponse
20 | ) {
21 | if (req.method === 'POST') {
22 | console.log('configuring kite...');
23 |
24 | const config: KiteConfig = req.body
25 | ? { ...Kite.defaultCfg, ...req.body }
26 | : Kite.defaultCfg;
27 | console.log('config is: ', JSON.stringify(config));
28 | Kite.configure(config);
29 | console.log('deploying kite...');
30 | await Kite.deploy();
31 |
32 | res.status(200).json({ reply: 'success' });
33 | //TO DO: uncomment when you connecting to the front-end
34 | // res.redirect('/display');
35 | } else {
36 | res.status(405).send({ reply: 'Method Not Allowed' });
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/pages/api/kite/deploy.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 |
9 | export default async function handler(
10 | req: NextApiRequest,
11 | res: NextApiResponse
12 | ) {
13 | if (req.method === 'GET') {
14 | await Kite.deploy();
15 | res.status(200).send('success');
16 | } else {
17 | res.status(405).send('Method Not Allowed');
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/pages/api/kite/disconnect.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 |
9 | export default async function handler(
10 | req: NextApiRequest,
11 | res: NextApiResponse
12 | ) {
13 | if (req.method === 'DELETE') {
14 | await Kite.disconnect();
15 | return res.status(200).json({});
16 | } else {
17 | res.status(405).send('Method Not Allowed');
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/pages/api/kite/getConfig.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 | import type { KiteConfig } from 'xkite-core';
9 |
10 | type Config = KiteConfig;
11 |
12 | export default async function handler(
13 | req: NextApiRequest,
14 | res: NextApiResponse
15 | ) {
16 | if (req.method === 'GET') {
17 | try {
18 | const config: KiteConfig | undefined = await Kite.getConfig();
19 | // console.log(config, 'from backend');
20 | if (!config) throw Error('Config not defined!');
21 | res.status(200).json(config);
22 | } catch (err) {
23 | console.log(err);
24 | res.status(500).send('Internal Server Error /api/kite/getConfig');
25 | }
26 | } else {
27 | res.status(405).send('Method Not Allowed');
28 | }
29 | }
30 |
--------------------------------------------------------------------------------
/pages/api/kite/getConfigFile.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 | import type { KiteConfigFile } from 'xkite-core';
9 |
10 | type ConfigFile = KiteConfigFile;
11 |
12 | export default async function handler(
13 | req: NextApiRequest,
14 | res: NextApiResponse
15 | ) {
16 | if (req.method === 'GET') {
17 | try {
18 | const configFile = await Kite.getConfigFile();
19 | if (!configFile) throw Error('ConfigFile not defined!');
20 | res.status(200).json(configFile);
21 | } catch (err) {
22 | console.log(err);
23 | res.status(500).send('Internal Server Error /api/kite/getConfigFile');
24 | }
25 | } else {
26 | res.status(405).send('Method Not Allowed');
27 | }
28 | }
29 |
--------------------------------------------------------------------------------
/pages/api/kite/getKiteState.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 |
9 | export default function handler(
10 | req: NextApiRequest,
11 | res: NextApiResponse
12 | ) {
13 | if (req.method === 'GET') {
14 | const state = Kite.getKiteState();
15 | res.status(200).send(state);
16 | } else {
17 | res.status(405).send('Method Not Allowed');
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/pages/api/kite/getPackageBuild.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 | import ReadableString from '@/common/utilities';
9 |
10 | type File = string;
11 |
12 | export default async function handler(
13 | req: NextApiRequest,
14 | res: NextApiResponse
15 | ) {
16 | if (req.method === 'GET') {
17 | try {
18 | const packageBuild = await Kite.getPackageBuild();
19 | if (packageBuild instanceof Error) return res.status(500);
20 | res.setHeader('Content-Type', 'application/zip');
21 | res.setHeader('Content-Disposition', 'attachment; filename=package.zip');
22 | if (!packageBuild) throw Error('package build not defined!');
23 | res.writeHead(200, packageBuild.header);
24 | const s = new ReadableString(packageBuild.fileStream);
25 | s.pipe(res);
26 | } catch (err) {
27 | console.log(err);
28 | res.status(500).send('Internal Server Error /api/kite/getPackageBuild');
29 | }
30 | } else {
31 | res.status(405).send('Method Not Allowed');
32 | }
33 | }
34 |
35 | export const config = {
36 | api: {
37 | responseLimit: false
38 | }
39 | };
40 |
--------------------------------------------------------------------------------
/pages/api/kite/getSetup.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 | import type { KiteSetup } from 'xkite-core';
9 |
10 | type Setup = KiteSetup;
11 |
12 | export default async function handler(
13 | req: NextApiRequest,
14 | res: NextApiResponse
15 | ) {
16 | if (req.method === 'GET') {
17 | try {
18 | const setup = await Kite.getSetup();
19 | if (!setup) throw Error('Setup not defined!');
20 | res.status(200).json(setup);
21 | } catch (err) {
22 | console.log(err);
23 | res.status(500).send('Internal Server Error /api/kite/getSetup');
24 | }
25 | } else {
26 | res.status(405).send('Method Not Allowed');
27 | }
28 | }
29 |
--------------------------------------------------------------------------------
/pages/api/kite/pause.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 |
9 | export default async function handler(
10 | req: NextApiRequest,
11 | res: NextApiResponse
12 | ) {
13 | if (req.method === 'POST') {
14 | if (req.body.service !== undefined) await Kite.pause(req.body.service);
15 | else await Kite.pause();
16 | return res.status(200).json({});
17 | } else {
18 | res.status(405).send('Method Not Allowed');
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/pages/api/kite/shutdown.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next/types';
2 | let { Kite } = require('xkite-core');
3 | if (Kite === undefined) {
4 | console.log('using secondary import...');
5 | Kite = require('xkite-core').default;
6 | }
7 |
8 | //import { spawn } from 'child_process';
9 |
10 | // const urls: string[] = [
11 | // `http://localhost:${process.env.PORT1 || 6661}/`,
12 | // `http://localhost:${process.env.PORT1 || 6661}/setup`,
13 | // `http://localhost:${process.env.PORT2 || 6662}/display`
14 | // ];
15 |
16 | type Result = {
17 | result?: string;
18 | error?: string;
19 | };
20 |
21 | export default async function handler(
22 | req: NextApiRequest,
23 | res: NextApiResponse
24 | ) {
25 | if (req.method === 'DELETE') {
26 | await Kite.shutdown();
27 | // for (const url of urls) {
28 | // if (process.platform === 'darwin') {
29 | // // For mac
30 | // spawn('osascript', [
31 | // '-e',
32 | // `tell application "Google Chrome" to close (tabs of window 1 whose URL is "${url}")`,
33 | // ]);
34 | // } else if (process.platform === 'win32') {
35 | // // For Windows
36 | // spawn('taskkill', [
37 | // '/F',
38 | // '/IM',
39 | // 'tasklist.exe',
40 | // '/FI',
41 | // `IMAGENAME eq chrome.exe`,
42 | // ]).stdout.on('data', (data) => {
43 | // const processes = data
44 | // .toString()
45 | // .split('\r\n')
46 | // .slice(3)
47 | // .filter((line: string) => line.trim() !== '')
48 | // .map((line: string) => line.trim().split(/\s+/)[0]);
49 | // processes.forEach((pid: string) => {
50 | // spawn('taskkill', ['/F', '/PID', pid]);
51 | // });
52 | // });
53 | // } else if (process.platform === 'linux') {
54 | // // For Linux
55 | // spawn('pkill', ['-f', `${url}`]);
56 | // }
57 | // }
58 | res.status(200).json({ result: 'success' });
59 | } else {
60 | res.status(405).send({ error: 'Method Not Allowed' });
61 | }
62 | }
63 |
--------------------------------------------------------------------------------
/pages/api/kite/unpause.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 |
9 | export default async function handler(
10 | req: NextApiRequest,
11 | res: NextApiResponse
12 | ) {
13 | if (req.method === 'POST') {
14 | if (req.body.service !== undefined) await Kite.unpause(req.body.service);
15 | else await Kite.unpause();
16 | res.status(200).json({});
17 | } else {
18 | res.status(405).send('Method Not Allowed');
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/pages/api/monitor.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next/types';
2 |
3 | type Data = {
4 | reply?: string;
5 | err?: unknown;
6 | };
7 |
8 | export default async function handler(
9 | req: NextApiRequest,
10 | res: NextApiResponse
11 | ) {
12 | try {
13 | console.log('booting up monitoring app...');
14 | //we won't need this since springboot app is already running in background - potentially redirect user or spawn new page
15 | return res
16 | .status(201)
17 | .json({ reply: 'Successfully started springboot app' });
18 | } catch (err) {
19 | return res.status(500).json({ err: err });
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/pages/api/socket.ts:
--------------------------------------------------------------------------------
1 | import { NextApiRequest } from 'next/types';
2 | import { NextApiResponseServerIO } from 'src/common/types/io';
3 | import { Server as ServerIO } from 'socket.io';
4 | import { Server as NetServer } from 'http';
5 | //import ConsumerFactory from '@/common/kafkaConnector/ConsumerFactory'; //note: socket API path is not currently being used in tests page
6 | //will remove altogether if we decide not to use it
7 |
8 | export const config = {
9 | api: {
10 | bodyParser: false
11 | }
12 | };
13 |
14 | // eslint-disable-next-line import/no-anonymous-default-export
15 | export default async (req: NextApiRequest, res: NextApiResponseServerIO) => {
16 | console.log(req.body);
17 | // const kafkaSetup = Kite.getKafkaSetup();
18 | // const newConsumer = new ConsumerFactory(kafkaSetup);
19 | // const topics = await newConsumer.listTopics();
20 | // await newConsumer.startBatchConsumer(topics);
21 | //console.log('...new consumer socket')
22 | if (!res.socket.server.io) {
23 | console.log('New Socket.io server...');
24 | // adapt Next's net Server to http Server
25 | const httpServer: NetServer = res.socket.server as any;
26 | const io = new ServerIO(httpServer, {
27 | path: '/api/socket'
28 | });
29 | // append SocketIO server to Next.js socket server response
30 | res.socket.server.io = io;
31 | }
32 | res.end();
33 | };
34 |
--------------------------------------------------------------------------------
/pages/api/spring/index.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import type { NextApiRequest, NextApiResponse } from 'next/types';
3 | let { Kite } = require('xkite-core');
4 | if (Kite === undefined) {
5 | console.log('using secondary import...');
6 | Kite = require('xkite-core').default;
7 | }
8 |
9 | /**
10 | * Returns a boolean isOpen indicating whether a given port is open
11 | * @param {NextApiRequest} req - NextApiRequest - This is the request object that Next.js provides.
12 | * @param res - NextApiResponse
13 | */
14 | export default async function handler(
15 | req: NextApiRequest,
16 | res: NextApiResponse
17 | ) {
18 | if (req.method === 'GET') {
19 | return res.status(405).send();
20 | //TBD ...
21 | // try {
22 | // const {spring} = await Kite.getSetup();
23 | // let URI = `localhost:${spring.port}/api/kafka/data`;
24 | // const response = await fetch(URI, {
25 | // method: 'GET',
26 | // headers: {'Content-Type': 'application/json'},
27 | // body: JSON.stringify(req.body),
28 | // });
29 | // return res.status(response.status).;
30 | // } catch (err) {
31 | // console.log(err);
32 | // res.status(500);
33 | // }
34 | } else if (req.method === 'POST') {
35 | try {
36 | const { spring } = await Kite.getSetup();
37 | let URI = `localhost:${spring.port}`;
38 | if ('topicname' in req.body) URI += '/api/v1/topics/create';
39 | else URI += '/api/kafka/public';
40 | console.log(URI);
41 | console.log(req.body);
42 | const response = await fetch(URI, {
43 | method: 'POST',
44 | headers: { 'Content-Type': 'application/json', Accept: '*/*' },
45 | body: JSON.stringify(req.body)
46 | });
47 | return res.status(response.status).send();
48 | } catch (err) {
49 | console.log(err);
50 | res.status(500).send();
51 | }
52 | } else {
53 | res.status(405).send();
54 | }
55 | }
56 |
--------------------------------------------------------------------------------
/pages/components/accordions/index.tsx:
--------------------------------------------------------------------------------
1 | import Head from 'next/head';
2 | import SidebarLayout from '@/layouts/SidebarLayout';
3 |
4 | import PageTitle from '@/components/PageTitle';
5 | import PageTitleWrapper from '@/components/PageTitleWrapper';
6 | import {
7 | Container,
8 | Grid,
9 | Card,
10 | CardHeader,
11 | CardContent,
12 | Divider
13 | } from '@mui/material';
14 | import Accordion from '@mui/material/Accordion';
15 | import AccordionSummary from '@mui/material/AccordionSummary';
16 | import AccordionDetails from '@mui/material/AccordionDetails';
17 | import Typography from '@mui/material/Typography';
18 | import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
19 | import Footer from 'src/components/Footer';
20 |
21 | function Accordions() {
22 | return (
23 | <>
24 |
25 | Accordions - Components
26 |
27 |
28 |
33 |
34 |
35 |
42 |
43 |
44 |
45 |
46 |
47 |
48 | }
50 | aria-controls="panel1a-content"
51 | id="panel1a-header"
52 | >
53 | Accordion 1
54 |
55 |
56 |
57 | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
58 | Suspendisse malesuada lacus ex, sit amet blandit leo
59 | lobortis eget.
60 |
61 |
62 |
63 |
64 | }
66 | aria-controls="panel2a-content"
67 | id="panel2a-header"
68 | >
69 | Accordion 2
70 |
71 |
72 |
73 | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
74 | Suspendisse malesuada lacus ex, sit amet blandit leo
75 | lobortis eget.
76 |
77 |
78 |
79 |
80 | }
82 | aria-controls="panel3a-content"
83 | id="panel3a-header"
84 | >
85 | Disabled Accordion
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 | >
95 | );
96 | }
97 |
98 | Accordions.getLayout = (page: any) => {page};
99 |
100 | export default Accordions;
101 |
--------------------------------------------------------------------------------
/pages/components/tabs/index.tsx:
--------------------------------------------------------------------------------
1 | import Head from 'next/head';
2 | import SidebarLayout from '@/layouts/SidebarLayout';
3 | import PageTitle from '@/components/PageTitle';
4 | import PageTitleWrapper from '@/components/PageTitleWrapper';
5 | import {
6 | Container,
7 | Grid,
8 | Card,
9 | CardHeader,
10 | CardContent,
11 | Divider
12 | } from '@mui/material';
13 | import { useState, SyntheticEvent } from 'react';
14 |
15 | import Tabs from '@mui/material/Tabs';
16 | import Tab from '@mui/material/Tab';
17 | import Typography from '@mui/material/Typography';
18 | import Box from '@mui/material/Box';
19 | import Footer from 'src/components/Footer';
20 |
21 | interface TabPanelProps {
22 | children?: React.ReactNode;
23 | index: number;
24 | value: number;
25 | }
26 |
27 | function TabPanel(props: TabPanelProps) {
28 | const { children, value, index, ...other } = props;
29 |
30 | return (
31 |
38 | {value === index && (
39 |
40 | {children}
41 |
42 | )}
43 |
44 | );
45 | }
46 |
47 | function a11yProps(index: number) {
48 | return {
49 | id: `simple-tab-${index}`,
50 | 'aria-controls': `simple-tabpanel-${index}`
51 | };
52 | }
53 |
54 | function TabsDemo() {
55 | const [value, setValue] = useState(0);
56 |
57 | const handleChange = (_event: SyntheticEvent, newValue: number) => {
58 | setValue(newValue);
59 | };
60 |
61 | return (
62 | <>
63 |
64 | Tabs - Components
65 |
66 |
67 |
72 |
73 |
74 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
96 |
97 |
98 |
99 |
100 |
101 | Item One
102 |
103 |
104 | Item Two
105 |
106 |
107 | Item Three
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 | >
117 | );
118 | }
119 |
120 | TabsDemo.getLayout = (page: any) => {page};
121 |
122 | export default TabsDemo;
123 |
--------------------------------------------------------------------------------
/pages/connect/index.tsx:
--------------------------------------------------------------------------------
1 | import Head from 'next/head';
2 | import SidebarLayout from '@/layouts/SidebarLayout';
3 | import PageTitle from '@/components/PageTitle';
4 | import PageTitleWrapper from '@/components/PageTitleWrapper';
5 | import {Grid} from '@mui/material';
6 |
7 | function Forms() {
8 | // const [portsOpen, setPortsOpen] = useState({});
9 | // const [kiteConfigRequest, setKiteConfigRequest] = useState(defaultCfg);
10 |
11 | return (
12 | <>
13 |
14 | Connect an Existing Kafka Configuration
15 |
16 |
17 |
22 |
23 |
24 |
25 |
26 |
27 |
28 | >
29 | );
30 | }
31 |
32 | Forms.getLayout = (page: any) => {page};
33 |
34 | export default Forms;
35 |
--------------------------------------------------------------------------------
/pages/index.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Box,
3 | Card,
4 | Container,
5 | styled
6 | } from '@mui/material';
7 | import type { ReactElement } from 'react';
8 | import BaseLayout from 'src/layouts/BaseLayout';
9 | import Head from 'next/head';
10 | import Logo from 'src/components/LogoSign';
11 | import Hero from 'src/content/Overview/Hero';
12 |
13 | const HeaderWrapper = styled(Card)(
14 | ({ theme }) => `
15 | width: 100%;
16 | display: flex;
17 | align-items: center;
18 | height: ${theme.spacing(10)};
19 | margin-bottom: ${theme.spacing(10)};
20 | `
21 | );
22 |
23 | const OverviewWrapper = styled(Box)(
24 | ({ theme }) => `
25 | overflow: auto;
26 | background: ${theme.palette.common.white};
27 | flex: 1;
28 | overflow-x: hidden;
29 | `
30 | );
31 |
32 | function Overview() {
33 | return (
34 |
35 |
36 | xkite: A Kafka Prototyping, Testing, and Monitoring Suite
37 |
38 |
39 |
40 |
41 |
42 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 | );
60 | }
61 |
62 | export default Overview;
63 |
64 | Overview.getLayout = function getLayout(page: ReactElement) {
65 | return {page};
66 | };
67 |
--------------------------------------------------------------------------------
/pages/status/500/index.tsx:
--------------------------------------------------------------------------------
1 | import { useState } from 'react';
2 | import {
3 | Box,
4 | Typography,
5 | Hidden,
6 | Container,
7 | Button,
8 | Grid,
9 | styled
10 | } from '@mui/material';
11 | import type { ReactElement } from 'react';
12 | import BaseLayout from 'src/layouts/BaseLayout';
13 |
14 | import Head from 'next/head';
15 | import RefreshTwoToneIcon from '@mui/icons-material/RefreshTwoTone';
16 | import LoadingButton from '@mui/lab/LoadingButton';
17 |
18 | const GridWrapper = styled(Grid)(
19 | ({ theme }) => `
20 | background: ${theme.colors.gradients.blue5};
21 | `
22 | );
23 |
24 | const MainContent = styled(Box)(
25 | () => `
26 | height: 100%;
27 | display: flex;
28 | flex: 1;
29 | overflow: auto;
30 | flex-direction: column;
31 | align-items: center;
32 | justify-content: center;
33 | `
34 | );
35 |
36 | const TypographyPrimary = styled(Typography)(
37 | ({ theme }) => `
38 | color: ${theme.colors.alpha.white[100]};
39 | `
40 | );
41 |
42 | const TypographySecondary = styled(Typography)(
43 | ({ theme }) => `
44 | color: ${theme.colors.alpha.white[70]};
45 | `
46 | );
47 |
48 | function Status500() {
49 | const [pending, setPending] = useState(false);
50 | function handleClick() {
51 | setPending(true);
52 | }
53 |
54 | return (
55 | <>
56 |
57 | Status - 500
58 |
59 |
60 |
66 |
74 |
75 |
76 |
81 |
82 | There was an error, please try again later
83 |
84 |
90 | The server encountered an internal error and was not able to
91 | complete your request
92 |
93 | }
99 | >
100 | Refresh view
101 |
102 |
105 |
106 |
107 |
108 |
109 |
117 |
118 |
119 |
120 | xkite: Kafka Integrated Testing Environment
121 |
122 |
127 | A comprehensive prototyping, testing, and monitoring toolset built for Apache Kafka. Use xkite to bootstrap your next project, or install our library into an existing project. Built by (and for) developers.
128 |
129 |
132 |
133 |
134 |
135 |
136 |
137 |
138 | >
139 | );
140 | }
141 |
142 | export default Status500;
143 |
144 | Status500.getLayout = function getLayout(page: ReactElement) {
145 | return {page};
146 | };
147 |
--------------------------------------------------------------------------------
/public/_redirects:
--------------------------------------------------------------------------------
1 | /* /index.html 200
--------------------------------------------------------------------------------
/public/android-chrome-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/android-chrome-192x192.png
--------------------------------------------------------------------------------
/public/android-chrome-512x512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/android-chrome-512x512.png
--------------------------------------------------------------------------------
/public/apple-touch-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/apple-touch-icon.png
--------------------------------------------------------------------------------
/public/browserconfig.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | #da532c
7 |
8 |
9 |
10 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/favicon.ico
--------------------------------------------------------------------------------
/public/icon-16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/icon-16x16.png
--------------------------------------------------------------------------------
/public/icon-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/icon-192x192.png
--------------------------------------------------------------------------------
/public/icon-256x256.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/icon-256x256.png
--------------------------------------------------------------------------------
/public/icon-32x32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/icon-32x32.png
--------------------------------------------------------------------------------
/public/icon-512x512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/icon-512x512.png
--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "theme_color": "#1975ff",
3 | "background_color": "#f2f5f9",
4 | "display": "standalone",
5 | "start_url": ".",
6 | "short_name": "xKite",
7 | "name": "xkite: Kafka Integrated Testing Environment",
8 | "icons": [
9 | {
10 | "src": "/icon-192x192.png",
11 | "sizes": "192x192",
12 | "type": "image/png"
13 | },
14 | {
15 | "src": "/icon-256x256.png",
16 | "sizes": "256x256",
17 | "type": "image/png"
18 | },
19 | {
20 | "src": "/icon-384x384.png",
21 | "sizes": "384x384",
22 | "type": "image/png"
23 | },
24 | {
25 | "src": "/icon-512x512.png",
26 | "sizes": "512x512",
27 | "type": "image/png"
28 | }
29 | ]
30 | }
31 |
--------------------------------------------------------------------------------
/public/mstile-150x150.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/mstile-150x150.png
--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | Disallow:
4 |
--------------------------------------------------------------------------------
/public/site.webmanifest:
--------------------------------------------------------------------------------
1 | {
2 | "name": "",
3 | "short_name": "",
4 | "icons": [
5 | {
6 | "src": "/android-chrome-192x192.png",
7 | "sizes": "192x192",
8 | "type": "image/png"
9 | },
10 | {
11 | "src": "/android-chrome-512x512.png",
12 | "sizes": "512x512",
13 | "type": "image/png"
14 | }
15 | ],
16 | "theme_color": "#ffffff",
17 | "background_color": "#ffffff",
18 | "display": "standalone"
19 | }
20 |
--------------------------------------------------------------------------------
/public/static/images/avatars/1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/avatars/1.jpg
--------------------------------------------------------------------------------
/public/static/images/avatars/2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/avatars/2.jpg
--------------------------------------------------------------------------------
/public/static/images/avatars/3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/avatars/3.jpg
--------------------------------------------------------------------------------
/public/static/images/avatars/4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/avatars/4.jpg
--------------------------------------------------------------------------------
/public/static/images/avatars/5.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/avatars/5.jpg
--------------------------------------------------------------------------------
/public/static/images/logo/fake.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/logo/fake.png
--------------------------------------------------------------------------------
/public/static/images/logo/fake2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/logo/fake2.png
--------------------------------------------------------------------------------
/public/static/images/logo/google.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/public/static/images/logo/material-ui.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/logo/next-js.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/logo/typescript.svg:
--------------------------------------------------------------------------------
1 |
2 |
7 |
--------------------------------------------------------------------------------
/public/static/images/logo/xkite-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/logo/xkite-logo.png
--------------------------------------------------------------------------------
/public/static/images/overview/accent_header.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/accent_header.png
--------------------------------------------------------------------------------
/public/static/images/overview/accent_sidebar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/accent_sidebar.png
--------------------------------------------------------------------------------
/public/static/images/overview/bottom_navigation.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/bottom_navigation.png
--------------------------------------------------------------------------------
/public/static/images/overview/boxed_sidebar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/boxed_sidebar.png
--------------------------------------------------------------------------------
/public/static/images/overview/collapsed_sidebar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/collapsed_sidebar.png
--------------------------------------------------------------------------------
/public/static/images/overview/extended_sidebar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/extended_sidebar.png
--------------------------------------------------------------------------------
/public/static/images/overview/figma.svg:
--------------------------------------------------------------------------------
1 |
15 |
--------------------------------------------------------------------------------
/public/static/images/overview/hero-screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/hero-screenshot.png
--------------------------------------------------------------------------------
/public/static/images/overview/management_screen_1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/management_screen_1.png
--------------------------------------------------------------------------------
/public/static/images/overview/management_screen_2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/management_screen_2.png
--------------------------------------------------------------------------------
/public/static/images/overview/management_screen_3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/management_screen_3.png
--------------------------------------------------------------------------------
/public/static/images/overview/performance.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/performance.png
--------------------------------------------------------------------------------
/public/static/images/overview/rtl-preview.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/rtl-preview.jpg
--------------------------------------------------------------------------------
/public/static/images/overview/sketch.svg:
--------------------------------------------------------------------------------
1 |
19 |
--------------------------------------------------------------------------------
/public/static/images/overview/tokyo-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/tokyo-logo.png
--------------------------------------------------------------------------------
/public/static/images/overview/top_navigation.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/overview/top_navigation.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/1.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/2.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/3.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/4.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/5.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/5.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/6.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/6.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/7.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/7.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/automation-bg.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/automation-bg.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/covers/garden_camera.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/covers/garden_camera.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/fitness/1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/fitness/1.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/fitness/2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/fitness/2.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/fitness/3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/fitness/3.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/fitness/4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/fitness/4.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/illustrations/2.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/6.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/illustrations/6.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/authentication.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/moving.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/partly-cloudy-day-rain.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/pressure-high.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/illustrations/time.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/adobe.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/adobe.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/airbnb-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/airbnb.svg:
--------------------------------------------------------------------------------
1 |
11 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/autodesk.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/autodesk.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/bitcoin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/bitcoin.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/cardano.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/cardano.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/coinbase.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/deutschebank_light.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/discord-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/discord.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/dribbble-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/ea.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/ea.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/ethereum.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/ethereum.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/facebook.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/google-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/google-logo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/google-logo.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/google.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/hp.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/hp.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/ibm.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/ibm.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/ing.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/ing.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/instagram-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/mastercard.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/mastercard.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/microsoft-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/microsoft.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/netflix-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/netflix-logo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/netflix-logo.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/netflix.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/oracle.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/oracle.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/orange.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/orange.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/pinterest-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/ripple.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/ripple.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/slack-big.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/slack-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/slack.svg:
--------------------------------------------------------------------------------
1 |
11 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/spotify-icon.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/spotify.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/stripe.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/tesla.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/uipath.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/uipath.jpg
--------------------------------------------------------------------------------
/public/static/images/placeholders/logo/visa.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/logo/visa.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/1.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/10.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/10.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/2.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/3.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/4.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/4.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/5.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/5.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/6.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/6.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/7.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/7.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/8.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/8.png
--------------------------------------------------------------------------------
/public/static/images/placeholders/products/9.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/oslabs-beta/xkite/683bc6c344b6e9298141e01b14a5bd7b34e03885/public/static/images/placeholders/products/9.png
--------------------------------------------------------------------------------
/src/common/constants/index.ts:
--------------------------------------------------------------------------------
1 | import type { KiteConfig, YAMLServicesDefaultSetup } from 'xkite-core';
2 | export const _ports_: YAMLServicesDefaultSetup = {
3 | postgresql: { internal: 5432, external: 5432 },
4 | ksql: { internal: 8088, external: 8088 },
5 | ksql_schema: { internal: 8085, external: 8085 },
6 | spark: {
7 | webui: { internal: 8080, external: 8090 },
8 | rpc: { internal: 7077, external: 7077 }
9 | },
10 | spring: { internal: 8080, external: 8080 },
11 | prometheus: { internal: 9090, external: 9099 },
12 | grafana: { internal: 3000, external: 3050 },
13 | jupyter: { internal: 8000, external: 8000 },
14 | kafkaconnect_src: { internal: 8083, external: 8083 },
15 | kafkaconnect_sink: { internal: 8083, external: 8084 },
16 | zookeeper: {
17 | client: { internal: 2182, external: 2182 },
18 | peer: { internal: 2888, external: 3888 } // only internal docker net
19 | },
20 | kafka: {
21 | jmx: 9991, // only internal
22 | broker: { internal: 9092, external: 9092 },
23 | spring: 9095, // only internal
24 | metrics: 29092, // only internal
25 | ksql: 9096, // only internal
26 | connect_src: 9097,
27 | connect_sink: 9098
28 | },
29 | jmx: { internal: 5556, external: 5566 },
30 | docker: { internal: 9323, external: 9323 }
31 | };
32 |
33 | export const defaultCfg: KiteConfig = {
34 | kafka: {
35 | brokers: {
36 | size: 2,
37 | replicas: 2
38 | },
39 | zookeepers: {
40 | size: 2
41 | },
42 | jmx: {
43 | ports: [_ports_.jmx.external, _ports_.jmx.external + 1]
44 | },
45 | spring: {
46 | port: _ports_.spring.external
47 | }
48 | },
49 | db: {
50 | name: 'ksql',
51 | port: _ports_.ksql.external,
52 | kafkaconnect: { port: _ports_.kafkaconnect_src.external }
53 | },
54 | sink: {
55 | name: 'spark',
56 | port: _ports_.spark.webui.external,
57 | rpc_port: _ports_.spark.rpc.external,
58 | kafkaconnect: { port: _ports_.kafkaconnect_sink.external }
59 | },
60 | grafana: {
61 | port: _ports_.grafana.external
62 | },
63 | prometheus: {
64 | scrape_interval: 20,
65 | evaluation_interval: 10,
66 | port: _ports_.prometheus.external
67 | }
68 | };
69 |
--------------------------------------------------------------------------------
/src/common/kafkaConnector/ConsumerFactory.ts:
--------------------------------------------------------------------------------
1 | import { Consumer, ConsumerSubscribeTopics, EachBatchPayload, Kafka, EachMessagePayload, KafkaConfig, Admin } from 'kafkajs'
2 | import { KafkaSetup } from './types/kafkaConnector'
3 |
4 | export default class ConsumerFactory {
5 | private kafkaConsumer: Consumer
6 | private admin: Admin
7 | //private messageProcessor: ExampleMessageProcessor
8 |
9 | public constructor(kafkaSetup: KafkaSetup) {
10 | //this.messageProcessor = messageProcessor
11 | this.kafkaConsumer = this.createKafkaConsumer(kafkaSetup.brokers, kafkaSetup.clientId)
12 | this.admin = this.createKafkaAdmin(kafkaSetup.brokers, kafkaSetup.clientId)
13 | }
14 |
15 | public async startConsumer(topicToFollow: string): Promise {
16 | console.log('starting consumer...')
17 | const topic: ConsumerSubscribeTopics = {
18 | topics: [topicToFollow],
19 | fromBeginning: false
20 | }
21 |
22 | try {
23 | await this.kafkaConsumer.connect()
24 | await this.kafkaConsumer.subscribe(topic)
25 | console.log('connecting')
26 | await this.kafkaConsumer.run({
27 | eachMessage: async (messagePayload: EachMessagePayload) => {
28 | const { topic, partition, message } = messagePayload
29 | const prefix = `${topic}[${partition} | ${message.offset}] / ${message.timestamp}`
30 | console.log(`- ${prefix} ${message.key}#${message.value}`, 'from line 30 of consumerUtil')
31 | }
32 | })
33 | } catch (error) {
34 | console.log('Error: ', error)
35 | }
36 | }
37 |
38 | public async startBatchConsumer(topicsToFollow: string[]): Promise {
39 | const topic: ConsumerSubscribeTopics = {
40 | topics: [...topicsToFollow],
41 | fromBeginning: false
42 | }
43 |
44 | try {
45 | await this.kafkaConsumer.connect()
46 | await this.kafkaConsumer.subscribe(topic)
47 | await this.kafkaConsumer.run({
48 | eachBatch: async (eachBatchPayload: EachBatchPayload) => {
49 | const { batch } = eachBatchPayload
50 | for (const message of batch.messages) {
51 | const prefix = `${batch.topic}[${batch.partition} | ${message.offset}] / ${message.timestamp}`
52 | console.log(`- ${prefix} ${message.key}#${message.value}`, 'from line 52 of consumerUtil')
53 | }
54 | }
55 | })
56 | } catch (error) {
57 | console.log('Error: ', error)
58 | }
59 | }
60 |
61 | public async listTopics(): Promise {
62 |
63 | try {
64 | const topics = await this.admin.listTopics()
65 | console.log(topics)
66 | return topics
67 | } catch (error) {
68 | console.log('Error: ', error)
69 | }
70 | }
71 |
72 | public async shutdown(): Promise {
73 | await this.kafkaConsumer.disconnect()
74 | }
75 |
76 | private createKafkaConsumer(brokers: string[], clientId: string): Consumer {
77 | const kafka = new Kafka({
78 | clientId,
79 | brokers
80 | })
81 | const consumer = kafka.consumer({ groupId: 'myGroup2' })
82 | return consumer
83 | }
84 |
85 | private createKafkaAdmin(brokers: string[], clientId: string): Admin {
86 | const kafka = new Kafka({
87 | clientId,
88 | brokers
89 | })
90 | const admin = kafka.admin()
91 | return admin
92 | }
93 | }
--------------------------------------------------------------------------------
/src/common/kafkaConnector/types/kafkaConnector.d.ts:
--------------------------------------------------------------------------------
1 | export interface KafkaSetup {
2 | clientId: string;
3 | brokers: Array;
4 | ssl?: boolean;
5 | }
6 |
7 | export interface msg {
8 | value: string;
9 | partition?: number | 0;
10 | }
11 |
--------------------------------------------------------------------------------
/src/common/monitor/monitor.ts:
--------------------------------------------------------------------------------
1 | //Monitor class to help connect to Kafka monitoring
2 | const { spawn } = require('child_process');
3 |
4 | export default class Monitor {
5 | public static initiate() {
6 | const port: number = parseInt(process.env.PORT2!, 10) || 6662;
7 | const child = spawn('open', [`http://localhost:${port}/display`]);
8 | child.on('error', (err: any) => {
9 | console.error('Failed to open localhost:', err);
10 | });
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/src/common/types/io.ts:
--------------------------------------------------------------------------------
1 | import { Server as NetServer, Socket } from "net";
2 | import { NextApiResponse } from "next/types";
3 | import { Server as SocketIOServer } from "socket.io";
4 |
5 | export type NextApiResponseServerIO = NextApiResponse & {
6 | socket: Socket & {
7 | server: NetServer & {
8 | io: SocketIOServer
9 | };
10 | };
11 | };
12 |
--------------------------------------------------------------------------------
/src/common/utilities/consumerUtil.ts:
--------------------------------------------------------------------------------
1 | import { Consumer, ConsumerSubscribeTopics, EachBatchPayload, Kafka, EachMessagePayload, Admin } from 'kafkajs'
2 |
3 | export default class ExampleConsumer {
4 | private kafkaConsumer: Consumer
5 | private admin: Admin
6 | //private messageProcessor: ExampleMessageProcessor
7 |
8 | public constructor(brokers: string[], clientId: string) {
9 | //this.messageProcessor = messageProcessor
10 | this.kafkaConsumer = this.createKafkaConsumer(brokers, clientId)
11 | this.admin = this.createKafkaAdmin(brokers, clientId)
12 | }
13 |
14 | public async startConsumer(topicToFollow: string): Promise {
15 | console.log('starting consumer...')
16 | const topic: ConsumerSubscribeTopics = {
17 | topics: [topicToFollow],
18 | fromBeginning: false
19 | }
20 |
21 | try {
22 | await this.kafkaConsumer.connect()
23 | await this.kafkaConsumer.subscribe(topic)
24 | console.log('connecting')
25 | await this.kafkaConsumer.run({
26 | eachMessage: async (messagePayload: EachMessagePayload) => {
27 | const { topic, partition, message } = messagePayload
28 | const prefix = `${topic}[${partition} | ${message.offset}] / ${message.timestamp}`
29 | console.log(`- ${prefix} ${message.key}#${message.value}`, 'from line 30 of consumerUtil')
30 | }
31 | })
32 | } catch (error) {
33 | console.log('Error: ', error)
34 | }
35 | }
36 |
37 | public async startBatchConsumer(topicToFollow: string): Promise {
38 | const topic: ConsumerSubscribeTopics = {
39 | topics: [topicToFollow],
40 | fromBeginning: false
41 | }
42 |
43 | try {
44 | await this.kafkaConsumer.connect()
45 | await this.kafkaConsumer.subscribe(topic)
46 | await this.kafkaConsumer.run({
47 | eachBatch: async (eachBatchPayload: EachBatchPayload) => {
48 | const { batch } = eachBatchPayload
49 | for (const message of batch.messages) {
50 | const prefix = `${batch.topic}[${batch.partition} | ${message.offset}] / ${message.timestamp}`
51 | console.log(`- ${prefix} ${message.key}#${message.value}`, 'from line 52 of consumerUtil')
52 | }
53 | }
54 | })
55 | } catch (error) {
56 | console.log('Error: ', error)
57 | }
58 | }
59 |
60 | public async listTopics(): Promise {
61 |
62 | try {
63 | await this.admin.connect()
64 | const topics = await this.admin.listTopics()
65 | await this.admin.disconnect()
66 | console.log(topics);
67 | return topics;
68 | } catch (error) {
69 | console.log('Error: ', error)
70 | }
71 | }
72 |
73 | public async shutdown(): Promise {
74 | await this.kafkaConsumer.disconnect()
75 | }
76 |
77 | private createKafkaConsumer(brokers: string[], clientId: string): Consumer {
78 | const kafka = new Kafka({
79 | clientId,
80 | brokers
81 | })
82 | const consumer = kafka.consumer({ groupId: 'myGroup2' })
83 | return consumer
84 | }
85 |
86 | private createKafkaAdmin(brokers: string[], clientId: string): Admin {
87 | const kafka = new Kafka({
88 | clientId,
89 | brokers
90 | })
91 | const admin = kafka.admin();
92 | return admin;
93 | }
94 | }
--------------------------------------------------------------------------------
/src/common/utilities/index.ts:
--------------------------------------------------------------------------------
1 | import { Readable } from 'stream';
2 | import { networkInterfaces } from 'os';
3 |
4 | // get first ipAddress on machine
5 | export function getIPAddress(): Function {
6 | let ipAddr!: string;
7 | const ifaces: any = networkInterfaces();
8 | return () => {
9 | if (ipAddr !== undefined) return ipAddr;
10 |
11 | for (const dev in ifaces) {
12 | if (ipAddr) break;
13 | ifaces[dev].filter((details: any) => {
14 | if (details.family === 'IPv4' && details.internal === false) {
15 | ipAddr = details.address;
16 | }
17 | });
18 | }
19 | return ipAddr;
20 | };
21 | }
22 |
23 | export default class ReadableString extends Readable {
24 | private sent = false;
25 |
26 | constructor(private str: string | Buffer) {
27 | super();
28 | }
29 |
30 | _read() {
31 | if (!this.sent) {
32 | if (!Buffer.isBuffer(this.str))
33 | this.push(Buffer.from(this.str));
34 | else
35 | this.push(this.str);
36 | this.sent = true;
37 | } else {
38 | this.push(null);
39 | }
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/src/common/utilities/producerUtil.ts:
--------------------------------------------------------------------------------
1 | import { Kafka, Message, Producer, ProducerBatch, TopicMessages } from 'kafkajs'
2 |
3 | interface Messageformat { a: string }
4 |
5 | export default class ProducerFactory {
6 | private producer: Producer
7 |
8 | constructor(brokers: string[], clientId: string) {
9 | this.producer = this.createProducer(brokers, clientId)
10 | }
11 |
12 | public async start(): Promise {
13 | try {
14 | await this.producer.connect()
15 | } catch (error) {
16 | console.log('Error connecting the producer: ', error)
17 | }
18 | }
19 |
20 | public async shutdown(): Promise {
21 | await this.producer.disconnect()
22 | }
23 |
24 |
25 | public async sendBatch(messages: Array, topic: string): Promise {
26 | const kafkaMessages: Array = messages.map((message) => {
27 | return {
28 | value: JSON.stringify(message)
29 | }
30 | })
31 |
32 | const topicMessages: TopicMessages = {
33 | topic,
34 | messages: kafkaMessages
35 | }
36 |
37 | const batch: ProducerBatch = {
38 | topicMessages: [topicMessages]
39 | }
40 |
41 | await this.producer.sendBatch(batch)
42 | }
43 |
44 | private createProducer(brokers: string[], clientId: string) : Producer {
45 |
46 | const kafka = new Kafka({
47 | clientId,
48 | brokers
49 | })
50 |
51 | return kafka.producer()
52 | }
53 | }
--------------------------------------------------------------------------------
/src/components/Chart/index.tsx:
--------------------------------------------------------------------------------
1 | import dynamic from 'next/dynamic';
2 |
3 | export const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
4 |
--------------------------------------------------------------------------------
/src/components/Footer/index.tsx:
--------------------------------------------------------------------------------
1 | import { Box, Container, Typography, styled } from '@mui/material';
2 |
3 | const FooterWrapper = styled(Container)(
4 | ({ theme }) => `
5 | margin-top: ${theme.spacing(4)};
6 | `
7 | );
8 |
9 | function Footer() {
10 | return (
11 |
12 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 | );
27 | }
28 |
29 | export default Footer;
30 |
--------------------------------------------------------------------------------
/src/components/Label/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC, ReactNode } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { styled } from '@mui/material/styles';
4 |
5 | interface LabelProps {
6 | className?: string;
7 | color?:
8 | | 'primary'
9 | | 'black'
10 | | 'secondary'
11 | | 'error'
12 | | 'warning'
13 | | 'success'
14 | | 'info';
15 | children?: ReactNode;
16 | }
17 |
18 | const LabelWrapper = styled('span')(
19 | ({ theme }) => `
20 | background-color: ${theme.colors.alpha.black[5]};
21 | padding: ${theme.spacing(0.5, 1)};
22 | font-size: ${theme.typography.pxToRem(13)};
23 | border-radius: ${theme.general.borderRadius};
24 | display: inline-flex;
25 | align-items: center;
26 | justify-content: center;
27 | max-height: ${theme.spacing(3)};
28 |
29 | &.MuiLabel {
30 | &-primary {
31 | background-color: ${theme.colors.primary.lighter};
32 | color: ${theme.palette.primary.main}
33 | }
34 |
35 | &-black {
36 | background-color: ${theme.colors.alpha.black[100]};
37 | color: ${theme.colors.alpha.white[100]};
38 | }
39 |
40 | &-secondary {
41 | background-color: ${theme.colors.secondary.lighter};
42 | color: ${theme.palette.secondary.main}
43 | }
44 |
45 | &-success {
46 | background-color: ${theme.colors.success.lighter};
47 | color: ${theme.palette.success.main}
48 | }
49 |
50 | &-warning {
51 | background-color: ${theme.colors.warning.lighter};
52 | color: ${theme.palette.warning.main}
53 | }
54 |
55 | &-error {
56 | background-color: ${theme.colors.error.lighter};
57 | color: ${theme.palette.error.main}
58 | }
59 |
60 | &-info {
61 | background-color: ${theme.colors.info.lighter};
62 | color: ${theme.palette.info.main}
63 | }
64 | }
65 | `
66 | );
67 |
68 | const Label: FC = ({
69 | className,
70 | color = 'secondary',
71 | children,
72 | ...rest
73 | }) => {
74 | return (
75 |
76 | {children}
77 |
78 | );
79 | };
80 |
81 | Label.propTypes = {
82 | children: PropTypes.node,
83 | className: PropTypes.string,
84 | color: PropTypes.oneOf([
85 | 'primary',
86 | 'black',
87 | 'secondary',
88 | 'error',
89 | 'warning',
90 | 'success',
91 | 'info'
92 | ])
93 | };
94 |
95 | export default Label;
96 |
--------------------------------------------------------------------------------
/src/components/Link/index.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import clsx from 'clsx';
3 | import { useRouter } from 'next/router';
4 | import NextLink, { LinkProps as NextLinkProps } from 'next/link';
5 | import MuiLink, { LinkProps as MuiLinkProps } from '@mui/material/Link';
6 | import { styled } from '@mui/material/styles';
7 |
8 | // Add support for the sx prop for consistency with the other branches.
9 | const Anchor = styled('a')({});
10 |
11 | interface NextLinkComposedProps
12 | extends Omit, 'href'>,
13 | Omit {
14 | to: NextLinkProps['href'];
15 | linkAs?: NextLinkProps['as'];
16 | }
17 |
18 | export const NextLinkComposed = React.forwardRef<
19 | HTMLAnchorElement,
20 | NextLinkComposedProps
21 | >(function NextLinkComposed(props, ref) {
22 | const { to, linkAs, replace, scroll, shallow, prefetch, locale, ...other } =
23 | props;
24 |
25 | return (
26 |
36 |
37 |
38 | );
39 | });
40 |
41 | export type LinkProps = {
42 | activeClassName?: string;
43 | as?: NextLinkProps['as'];
44 | href: NextLinkProps['href'];
45 | linkAs?: NextLinkProps['as']; // Useful when the as prop is shallow by styled().
46 | noLinkStyle?: boolean;
47 | } & Omit &
48 | Omit;
49 |
50 | // A styled version of the Next.js Link component:
51 | // https://nextjs.org/docs/api-reference/next/link
52 | const Link = React.forwardRef(function Link(
53 | props,
54 | ref
55 | ) {
56 | const {
57 | activeClassName = 'active',
58 | as,
59 | className: classNameProps,
60 | href,
61 | linkAs: linkAsProp,
62 | locale,
63 | noLinkStyle,
64 | prefetch,
65 | replace,
66 | role, // Link don't have roles.
67 | scroll,
68 | shallow,
69 | ...other
70 | } = props;
71 |
72 | const router = useRouter();
73 | const pathname = typeof href === 'string' ? href : href.pathname;
74 | const className = clsx(classNameProps, {
75 | [activeClassName]: router.pathname === pathname && activeClassName
76 | });
77 |
78 | const isExternal =
79 | typeof href === 'string' &&
80 | (href.indexOf('http') === 0 || href.indexOf('mailto:') === 0);
81 |
82 | if (isExternal) {
83 | if (noLinkStyle) {
84 | return ;
85 | }
86 |
87 | return ;
88 | }
89 |
90 | const linkAs = linkAsProp || as;
91 | const nextjsProps = {
92 | to: href,
93 | linkAs,
94 | replace,
95 | scroll,
96 | shallow,
97 | prefetch,
98 | locale
99 | };
100 |
101 | if (noLinkStyle) {
102 | return (
103 |
109 | );
110 | }
111 |
112 | return (
113 |
120 | );
121 | });
122 |
123 | export default Link;
124 |
--------------------------------------------------------------------------------
/src/components/Logo/index.tsx:
--------------------------------------------------------------------------------
1 | import { Box, styled, Tooltip } from '@mui/material';
2 | import Link from 'src/components/Link';
3 |
4 | const LogoWrapper = styled(Link)(
5 | ({ theme }) => `
6 | color: ${theme.palette.text.primary};
7 | padding: ${theme.spacing(0, 1, 0, 0)};
8 | display: flex;
9 | text-decoration: none;
10 | font-weight: ${theme.typography.fontWeightBold};
11 |
12 | &:hover {
13 | text-decoration: none;
14 | }
15 | `
16 | );
17 |
18 | const LogoSignWrapper = styled(Box)(
19 | () => `
20 | width: 52px;
21 | height: 38px;
22 | margin-top: 4px;
23 | transform: scale(.8);
24 | `
25 | );
26 |
27 | const LogoSign = styled(Box)(
28 | ({ theme }) => `
29 | background: ${theme.general.reactFrameworkColor};
30 | width: 18px;
31 | height: 18px;
32 | border-radius: ${theme.general.borderRadiusSm};
33 | position: relative;
34 | transform: rotate(45deg);
35 | top: 3px;
36 | left: 17px;
37 |
38 | &:after,
39 | &:before {
40 | content: "";
41 | display: block;
42 | width: 18px;
43 | height: 18px;
44 | position: absolute;
45 | top: -1px;
46 | right: -20px;
47 | transform: rotate(0deg);
48 | border-radius: ${theme.general.borderRadiusSm};
49 | }
50 |
51 | &:before {
52 | background: ${theme.palette.primary.main};
53 | right: auto;
54 | left: 0;
55 | top: 20px;
56 | }
57 |
58 | &:after {
59 | background: ${theme.palette.secondary.main};
60 | }
61 | `
62 | );
63 |
64 | const LogoSignInner = styled(Box)(
65 | ({ theme }) => `
66 | width: 16px;
67 | height: 16px;
68 | position: absolute;
69 | top: 12px;
70 | left: 12px;
71 | z-index: 5;
72 | border-radius: ${theme.general.borderRadiusSm};
73 | background: ${theme.header.background};
74 | `
75 | );
76 |
77 | const LogoTextWrapper = styled(Box)(
78 | ({ theme }) => `
79 | padding-left: ${theme.spacing(1)};
80 | `
81 | );
82 |
83 | const VersionBadge = styled(Box)(
84 | ({ theme }) => `
85 | background: ${theme.palette.success.main};
86 | color: ${theme.palette.success.contrastText};
87 | padding: ${theme.spacing(0.4, 1)};
88 | border-radius: ${theme.general.borderRadiusSm};
89 | text-align: center;
90 | display: inline-block;
91 | line-height: 1;
92 | font-size: ${theme.typography.pxToRem(11)};
93 | `
94 | );
95 | // @ts-ignore
96 | const LogoText = styled(Box)(
97 | ({ theme }) => `
98 | font-size: ${theme.typography.pxToRem(15)};
99 | font-weight: ${theme.typography.fontWeightBold};
100 | `
101 | );
102 |
103 | function Logo() {
104 | return (
105 |
106 |
107 |
108 |
109 |
110 |
111 |
117 |
118 |
119 | 1.0
120 |
121 |
122 |
123 |
124 |
125 | );
126 | }
127 |
128 | export default Logo;
129 |
--------------------------------------------------------------------------------
/src/components/LogoSign/index.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Tooltip,
3 | Badge,
4 | TooltipProps,
5 | tooltipClasses,
6 | styled,
7 | useTheme
8 | } from '@mui/material';
9 | import Link from 'src/components/Link';
10 |
11 | const LogoWrapper = styled(Link)(
12 | ({ theme }) => `
13 | color: ${theme.palette.text.primary};
14 | display: flex;
15 | text-decoration: none;
16 | width: 0px;
17 | margin: auto;
18 | font-weight: ${theme.typography.fontWeightBold};
19 | `
20 | );
21 |
22 | const TooltipWrapper = styled(({ className, ...props }: TooltipProps) => (
23 |
24 | ))(({ theme }) => ({
25 | [`& .${tooltipClasses.tooltip}`]: {
26 | backgroundColor: theme.colors.alpha.trueWhite[100],
27 | color: theme.palette.getContrastText(theme.colors.alpha.trueWhite[100]),
28 | fontSize: theme.typography.pxToRem(12),
29 | fontWeight: 'bold',
30 | borderRadius: theme.general.borderRadiusSm,
31 | boxShadow:
32 | '0 .2rem .8rem rgba(7,9,25,.18), 0 .08rem .15rem rgba(7,9,25,.15)'
33 | },
34 | [`& .${tooltipClasses.arrow}`]: {
35 | color: theme.colors.alpha.trueWhite[100]
36 | }
37 | }));
38 |
39 | function Logo() {
40 |
41 | return (
42 |
46 |
47 |
48 |
52 |
53 |
54 |
55 | );
56 | }
57 |
58 | export default Logo;
59 |
--------------------------------------------------------------------------------
/src/components/PageTitle/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { Typography, Grid } from '@mui/material';
4 |
5 | interface PageTitleProps {
6 | heading?: string;
7 | subHeading?: string;
8 | docs?: string;
9 | }
10 |
11 | const PageTitle: FC = ({
12 | heading = '',
13 | subHeading = '',
14 | docs = '',
15 | ...rest
16 | }) => {
17 | return (
18 |
24 |
25 |
26 | {heading}
27 |
28 | {subHeading}
29 |
30 |
31 |
32 |
33 | );
34 | };
35 |
36 | PageTitle.propTypes = {
37 | heading: PropTypes.string,
38 | subHeading: PropTypes.string,
39 | docs: PropTypes.string
40 | };
41 |
42 | export default PageTitle;
43 |
--------------------------------------------------------------------------------
/src/components/PageTitleWrapper/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC, ReactNode } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { Box, Container, styled } from '@mui/material';
4 |
5 | const PageTitle = styled(Box)(
6 | ({ theme }) => `
7 | padding: ${theme.spacing(4)};
8 | `
9 | );
10 |
11 | interface PageTitleWrapperProps {
12 | children?: ReactNode;
13 | }
14 |
15 | const PageTitleWrapper: FC = ({ children }) => {
16 | return (
17 |
18 | {children}
19 |
20 | );
21 | };
22 |
23 | PageTitleWrapper.propTypes = {
24 | children: PropTypes.node.isRequired
25 | };
26 |
27 | export default PageTitleWrapper;
28 |
--------------------------------------------------------------------------------
/src/components/Scrollbar/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC, ReactNode } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { Scrollbars } from 'react-custom-scrollbars-2';
4 |
5 | import { Box, useTheme } from '@mui/material';
6 |
7 | interface ScrollbarProps {
8 | className?: string;
9 | children?: ReactNode;
10 | }
11 |
12 | const Scrollbar: FC = ({ className, children, ...rest }) => {
13 | const theme = useTheme();
14 |
15 | return (
16 | {
20 | return (
21 |
33 | );
34 | }}
35 | {...rest}
36 | >
37 | {children}
38 |
39 | );
40 | };
41 |
42 | Scrollbar.propTypes = {
43 | children: PropTypes.node,
44 | className: PropTypes.string
45 | };
46 |
47 | export default Scrollbar;
48 |
--------------------------------------------------------------------------------
/src/components/Text/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC, ReactNode } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { styled } from '@mui/material/styles';
4 | import clsx from 'clsx';
5 |
6 | interface TextProps {
7 | className?: string;
8 | color?:
9 | | 'primary'
10 | | 'secondary'
11 | | 'error'
12 | | 'warning'
13 | | 'success'
14 | | 'info'
15 | | 'black';
16 | flex?: boolean;
17 | children?: ReactNode;
18 | }
19 |
20 | const TextWrapper = styled('span')(
21 | ({ theme }) => `
22 | display: inline-block;
23 | align-items: center;
24 |
25 | &.flexItem {
26 | display: inline-flex;
27 | }
28 |
29 | &.MuiText {
30 |
31 | &-black {
32 | color: ${theme.palette.common.black}
33 | }
34 |
35 | &-primary {
36 | color: ${theme.palette.primary.main}
37 | }
38 |
39 | &-secondary {
40 | color: ${theme.palette.secondary.main}
41 | }
42 |
43 | &-success {
44 | color: ${theme.palette.success.main}
45 | }
46 |
47 | &-warning {
48 | color: ${theme.palette.warning.main}
49 | }
50 |
51 | &-error {
52 | color: ${theme.palette.error.main}
53 | }
54 |
55 | &-info {
56 | color: ${theme.palette.info.main}
57 | }
58 | }
59 | `
60 | );
61 |
62 | const Text: FC = ({
63 | className,
64 | color = 'secondary',
65 | flex,
66 | children,
67 | ...rest
68 | }) => {
69 | return (
70 |
74 | {children}
75 |
76 | );
77 | };
78 |
79 | Text.propTypes = {
80 | children: PropTypes.node,
81 | className: PropTypes.string,
82 | color: PropTypes.oneOf([
83 | 'primary',
84 | 'secondary',
85 | 'error',
86 | 'warning',
87 | 'success',
88 | 'info',
89 | 'black'
90 | ])
91 | };
92 |
93 | export default Text;
94 |
--------------------------------------------------------------------------------
/src/content/Applications/Messenger/BottomBarContent.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Avatar,
3 | Tooltip,
4 | IconButton,
5 | Box,
6 | Button,
7 | styled,
8 | InputBase,
9 | useTheme
10 | } from '@mui/material';
11 | import AttachFileTwoToneIcon from '@mui/icons-material/AttachFileTwoTone';
12 | import SendTwoToneIcon from '@mui/icons-material/SendTwoTone';
13 |
14 | const MessageInputWrapper = styled(InputBase)(
15 | ({ theme }) => `
16 | font-size: ${theme.typography.pxToRem(18)};
17 | padding: ${theme.spacing(1)};
18 | width: 100%;
19 | `
20 | );
21 |
22 | const Input = styled('input')({
23 | display: 'none'
24 | });
25 |
26 | function BottomBarContent() {
27 | const theme = useTheme();
28 |
29 | const user = {
30 | name: 'Catherine Pike',
31 | avatar: '/static/images/avatars/1.jpg'
32 | };
33 |
34 | return (
35 |
43 |
44 |
49 |
54 |
55 |
56 |
57 |
61 | 😀
62 |
63 |
64 |
65 |
66 |
71 |
72 | } variant="contained">
73 | Send
74 |
75 |
76 |
77 | );
78 | }
79 |
80 | export default BottomBarContent;
81 |
--------------------------------------------------------------------------------
/src/content/Dashboards/Tasks/ExportConfigBtn.tsx:
--------------------------------------------------------------------------------
1 | import { SyntheticEvent, useState } from 'react';
2 | import {Button} from '@mui/material';
3 |
4 |
5 | export default function ExportConfigBtn() {
6 | const [exporting, setExport] = useState(false);
7 |
8 | async function exportConfigHandler(event: SyntheticEvent) {
9 | event.preventDefault();
10 | setExport(true);
11 |
12 | console.log('Getting Config Zip…');
13 | // const openWindow = window.open('/api/kite/getPackageBuild', '_blank');
14 | fetch('/api/kite/getPackageBuild', {
15 | method: 'GET',
16 | headers: { Accept: 'application/zip' },
17 | })
18 | .then((response) => {
19 | if (!response.ok) {
20 | throw new Error('Network response was not ok');
21 | }
22 | return response.blob();
23 | })
24 | .then((blob) => {
25 | const url = window.URL.createObjectURL(new Blob([blob]));
26 | const link = document.createElement('a');
27 | link.href = url;
28 | link.setAttribute('download', 'package.zip');
29 | document.body.appendChild(link);
30 | link.click();
31 | link.remove();
32 | setExport(false);
33 | })
34 | .catch((error) => console.error(error));
35 | }
36 |
37 | return (
38 |
41 | );
42 | }
43 |
--------------------------------------------------------------------------------
/src/content/Dashboards/Tasks/PageHeader.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Typography,
3 | Button,
4 | Box,
5 | alpha,
6 | lighten,
7 | Avatar,
8 | styled
9 | } from '@mui/material';
10 | import DocumentScannerTwoToneIcon from '@mui/icons-material/DocumentScannerTwoTone';
11 | import AddAlertTwoToneIcon from '@mui/icons-material/AddAlertTwoTone';
12 |
13 | const AvatarPageTitle = styled(Avatar)(
14 | ({ theme }) => `
15 | width: ${theme.spacing(8)};
16 | height: ${theme.spacing(8)};
17 | color: ${theme.colors.primary.main};
18 | margin-right: ${theme.spacing(2)};
19 | background: ${
20 | theme.palette.mode === 'dark'
21 | ? theme.colors.alpha.trueWhite[10]
22 | : theme.colors.alpha.white[50]
23 | };
24 | box-shadow: ${
25 | theme.palette.mode === 'dark'
26 | ? '0 1px 0 ' +
27 | alpha(lighten(theme.colors.primary.main, 0.8), 0.2) +
28 | ', 0px 2px 4px -3px rgba(0, 0, 0, 0.3), 0px 5px 16px -4px rgba(0, 0, 0, .5)'
29 | : '0px 2px 4px -3px ' +
30 | alpha(theme.colors.alpha.black[100], 0.4) +
31 | ', 0px 5px 16px -4px ' +
32 | alpha(theme.colors.alpha.black[100], 0.2)
33 | };
34 | `
35 | );
36 |
37 | function PageHeader() {
38 | const user = {
39 | name: 'Catherine Pike',
40 | avatar: '/static/images/avatars/1.jpg'
41 | };
42 |
43 | return (
44 |
50 |
51 |
52 |
53 |
54 |
55 |
56 | Welcome, {user.name}!
57 |
58 |
59 | Manage your day to day tasks with style! Enjoy a well built UI
60 | system.
61 |
62 |
63 |
64 |
65 | }>
66 | Export
67 |
68 |
69 |
70 | );
71 | }
72 |
73 | export default PageHeader;
74 |
--------------------------------------------------------------------------------
/src/content/Dashboards/Tasks/ShutdownBtn.tsx:
--------------------------------------------------------------------------------
1 | import { SyntheticEvent, useState } from 'react';
2 | import { Button } from '@mui/material';
3 |
4 | interface ShutDownBtnProps {
5 | id?: string;
6 | onClick: () => void;
7 | }
8 |
9 | export default function ShutDownBtn({ id }: ShutDownBtnProps) {
10 | const [shuttingDown, setShuttingDown] = useState(false);
11 |
12 | async function disconnectHandler(event: SyntheticEvent): Promise {
13 | setShuttingDown(true);
14 | console.log('Disconnecting…');
15 | try {
16 | const response = await fetch('/api/kite/shutdown', { method: 'DELETE' });
17 | console.log(response);
18 | } catch (error) {
19 | console.error('Error occurred during shutdown:', error);
20 | }
21 | setShuttingDown(false);
22 | }
23 |
24 | return (
25 |
35 | );
36 | }
37 |
--------------------------------------------------------------------------------
/src/content/Overview/Hero/index.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | Box,
3 | Button,
4 | Container,
5 | Grid,
6 | Typography,
7 | styled
8 | } from '@mui/material';
9 |
10 | import Link from 'src/components/Link';
11 |
12 | const TypographyH1 = styled(Typography)(
13 | ({ theme }) => `
14 | font-size: ${theme.typography.pxToRem(70)};
15 | `
16 | );
17 |
18 | const TypographyH12 = styled(Typography)(
19 | ({ theme }) => `
20 | font-size: ${theme.typography.pxToRem(55)};
21 | `
22 | );
23 |
24 | const TypographyH2 = styled(Typography)(
25 | ({ theme }) => `
26 | font-size: ${theme.typography.pxToRem(22)};
27 | `
28 | );
29 |
30 | const LabelWrapper = styled(Box)(
31 | ({ theme }) => `
32 | background-color: ${theme.colors.success.main};
33 | color: ${theme.palette.success.contrastText};
34 | font-weight: bold;
35 | border-radius: 30px;
36 | text-transform: uppercase;
37 | display: inline-block;
38 | font-size: ${theme.typography.pxToRem(11)};
39 | padding: ${theme.spacing(0.5)} ${theme.spacing(1.5)};
40 | margin-bottom: ${theme.spacing(2)};
41 | `
42 | );
43 |
44 | function Hero() {
45 | return (
46 |
47 |
53 |
54 | Version 1.0.0
55 |
56 | xkite:
57 |
58 |
59 | Kafka Integrated Testing Environment
60 |
61 |
67 | A comprehensive prototyping, testing, and monitoring toolset built for Apache Kafka. Use xKite to bootstrap your next project, or install
68 | our library into an existing project. Built by (and for) developers.
69 |
70 |
78 |
87 |
88 |
89 |
93 |
94 | );
95 | }
96 |
97 | export default Hero;
98 |
--------------------------------------------------------------------------------
/src/contexts/SidebarContext.tsx:
--------------------------------------------------------------------------------
1 | import { useState, ReactNode, createContext } from 'react';
2 | type SidebarContext = {
3 | sidebarToggle: any;
4 | toggleSidebar: () => void;
5 | closeSidebar: () => void;
6 | };
7 |
8 | // eslint-disable-next-line @typescript-eslint/no-redeclare
9 | export const SidebarContext = createContext(
10 | {} as SidebarContext
11 | );
12 |
13 | type Props = {
14 | children: ReactNode;
15 | };
16 |
17 | export function SidebarProvider({ children }: Props) {
18 | const [sidebarToggle, setSidebarToggle] = useState(false);
19 | const toggleSidebar = () => {
20 | setSidebarToggle(!sidebarToggle);
21 | };
22 |
23 | const closeSidebar = () => {
24 | setSidebarToggle(false);
25 | };
26 |
27 | return (
28 |
31 | {children}
32 |
33 | );
34 | }
35 |
--------------------------------------------------------------------------------
/src/createEmotionCache.ts:
--------------------------------------------------------------------------------
1 | import createCache from '@emotion/cache';
2 |
3 | export default function createEmotionCache() {
4 | return createCache({
5 | key: 'css'
6 | });
7 | }
8 |
--------------------------------------------------------------------------------
/src/layouts/BaseLayout/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC, ReactNode } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { Box } from '@mui/material';
4 |
5 | interface BaseLayoutProps {
6 | children?: ReactNode;
7 | }
8 |
9 | const BaseLayout: FC = ({ children }) => {
10 | return (
11 |
18 | {children}
19 |
20 | );
21 | };
22 |
23 | BaseLayout.propTypes = {
24 | children: PropTypes.node
25 | };
26 |
27 | export default BaseLayout;
28 |
--------------------------------------------------------------------------------
/src/layouts/SidebarLayout/Header/index.tsx:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 |
3 | import {
4 | Box,
5 | alpha,
6 | Stack,
7 | lighten,
8 | Divider,
9 | IconButton,
10 | Tooltip,
11 | styled,
12 | useTheme
13 | } from '@mui/material';
14 | import MenuTwoToneIcon from '@mui/icons-material/MenuTwoTone';
15 | import { SidebarContext } from 'src/contexts/SidebarContext';
16 | import CloseTwoToneIcon from '@mui/icons-material/CloseTwoTone';
17 |
18 | import HeaderMenu from './Menu';
19 |
20 | const HeaderWrapper = styled(Box)(
21 | ({ theme }) => `
22 | height: ${theme.header.height};
23 | color: ${theme.header.textColor};
24 | padding: ${theme.spacing(0, 2)};
25 | right: 0;
26 | z-index: 6;
27 | background-color: ${alpha(theme.header.background, 0.95)};
28 | backdrop-filter: blur(3px);
29 | position: fixed;
30 | justify-content: space-between;
31 | width: 100%;
32 | @media (min-width: ${theme.breakpoints.values.lg}px) {
33 | left: ${theme.sidebar.width};
34 | width: auto;
35 | }
36 | `
37 | );
38 |
39 | function Header() {
40 | const { sidebarToggle, toggleSidebar } = useContext(SidebarContext);
41 | const theme = useTheme();
42 |
43 | return (
44 |
63 | }
66 | alignItems="center"
67 | spacing={2}
68 | >
69 |
70 |
71 |
72 |
79 |
80 |
81 | {!sidebarToggle ? (
82 |
83 | ) : (
84 |
85 | )}
86 |
87 |
88 |
89 |
90 |
91 | );
92 | }
93 |
94 | export default Header;
95 |
--------------------------------------------------------------------------------
/src/layouts/SidebarLayout/Sidebar/index.tsx:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 | import Scrollbar from 'src/components/Scrollbar';
3 | import { SidebarContext } from 'src/contexts/SidebarContext';
4 |
5 | import {
6 | Box,
7 | Drawer,
8 | alpha,
9 | styled,
10 | Divider,
11 | useTheme,
12 | Button,
13 | lighten,
14 | darken
15 | } from '@mui/material';
16 |
17 | import SidebarMenu from './SidebarMenu';
18 | import Logo from 'src/components/LogoSign';
19 |
20 | const SidebarWrapper = styled(Box)(
21 | ({ theme }) => `
22 | width: ${theme.sidebar.width};
23 | min-width: ${theme.sidebar.width};
24 | color: ${theme.colors.alpha.trueWhite[70]};
25 | position: relative;
26 | z-index: 7;
27 | height: 100%;
28 | padding-bottom: 68px;
29 | `
30 | );
31 |
32 | function Sidebar() {
33 | const { sidebarToggle, toggleSidebar } = useContext(SidebarContext);
34 | const closeSidebar = () => toggleSidebar();
35 | const theme = useTheme();
36 |
37 | return (
38 | <>
39 |
56 |
57 |
58 |
64 |
65 |
66 |
67 |
74 |
75 |
76 |
81 |
82 |
92 |
100 |
101 |
102 |
108 |
109 |
110 |
111 |
118 |
119 |
120 |
121 |
122 | >
123 | );
124 | }
125 |
126 | export default Sidebar;
127 |
--------------------------------------------------------------------------------
/src/layouts/SidebarLayout/index.tsx:
--------------------------------------------------------------------------------
1 | import { FC, ReactNode } from 'react';
2 | import { Box, alpha, lighten, useTheme } from '@mui/material';
3 | import PropTypes from 'prop-types';
4 |
5 | import Sidebar from './Sidebar';
6 | import Header from './Header';
7 |
8 | interface SidebarLayoutProps {
9 | children?: ReactNode;
10 | }
11 |
12 | const SidebarLayout: FC = ({ children }) => {
13 | const theme = useTheme();
14 |
15 | return (
16 | <>
17 |
44 |
45 |
46 |
58 | {children}
59 |
60 |
61 | >
62 | );
63 | };
64 |
65 | SidebarLayout.propTypes = {
66 | children: PropTypes.node
67 | };
68 |
69 | export default SidebarLayout;
70 |
--------------------------------------------------------------------------------
/src/theme/ThemeProvider.tsx:
--------------------------------------------------------------------------------
1 | import { FC, useState, createContext, useEffect } from 'react';
2 | import { ThemeProvider } from '@mui/material';
3 | import { themeCreator } from './base';
4 | import { StylesProvider } from '@mui/styles';
5 |
6 | export const ThemeContext = createContext((_themeName: string): void => {});
7 |
8 | const ThemeProviderWrapper: FC = (props) => {
9 | const [themeName, _setThemeName] = useState('GreenFieldsTheme');
10 |
11 | useEffect(() => {
12 | const curThemeName =
13 | window.localStorage.getItem('appTheme') || 'GreenFieldsTheme';
14 | _setThemeName(curThemeName);
15 | }, []);
16 |
17 | const theme = themeCreator(themeName);
18 | const setThemeName = (themeName: string): void => {
19 | window.localStorage.setItem('appTheme', themeName);
20 | _setThemeName(themeName);
21 | };
22 |
23 | return (
24 |
25 |
26 | {props.children}
27 |
28 |
29 | );
30 | };
31 |
32 | export default ThemeProviderWrapper;
33 |
--------------------------------------------------------------------------------
/src/types.ts:
--------------------------------------------------------------------------------
1 | export type state = {
2 | httpLink: string
3 | }
4 |
5 | export type interactiveNode = {
6 | key: string,
7 | id: string,
8 | type?: 'input' | 'output',
9 | data: { label: JSX.Element },
10 | position: { x: number, y: number }
11 | }
--------------------------------------------------------------------------------
/src/workers/configWorker.ts:
--------------------------------------------------------------------------------
1 | // const query = {
2 | // ksql: 'LIST STREAMS;', //optional
3 | // sql: `SELECT * FROM ridersNearMountainView EMIT CHANGES;`,
4 | // };
5 |
6 | // addEventListener('message', (event: MessageEvent) => {
7 | // postMessage(client.getData(event.data))
8 | // })
9 |
10 | // addEventListener('message', (event: MessageEvent