Skip to content
This repository was archived by the owner on Oct 5, 2022. It is now read-only.

Commit c153e4b

Browse files
imsergiyimsergiy
committed
feat: hub/dash context separation
1 parent a96e2ac commit c153e4b

19 files changed

+369
-62
lines changed

‎.github/workflows/deploy-hub.yml

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
name: "Deploy Hub"
2+
on:
3+
push:
4+
branches:
5+
- master
6+
jobs:
7+
build:
8+
if: "!startsWith(github.event.head_commit.message, 'chore')"
9+
runs-on: ubuntu-latest
10+
strategy:
11+
matrix:
12+
node-version: [12.x]
13+
steps:
14+
- uses: actions/checkout@v1
15+
- name: Use Node.js ${{ matrix.node-version }}
16+
uses: actions/setup-node@v1
17+
with:
18+
node-version: ${{ matrix.node-version }}
19+
- name: Install Packages
20+
run: npm ci
21+
- name: Create Build
22+
run: npm run hub-build
23+
- name: Deploy Build
24+
uses: JamesIves/github-pages-deploy-action@releases/v3
25+
with:
26+
ACCESS_TOKEN: ${{ secrets.JINA_DEV_BOT }}
27+
BRANCH: gh-pages
28+
FOLDER: build
29+
REPOSITORY_NAME: jina-ai/jina-hub

‎.github/workflows/deploy.yml

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
name: CD
1+
name: "Deploy Dashboard"
22
on:
33
push:
44
branches:
@@ -19,7 +19,7 @@ jobs:
1919
- name: Install Packages
2020
run: npm ci
2121
- name: Create Build
22-
run: npm run build
22+
run: npm run dashboard-build
2323
- name: Deploy Build
2424
uses: JamesIves/github-pages-deploy-action@releases/v3
2525
with:

‎.github/workflows/hacktoberfest.yml

-17
This file was deleted.

‎package.json

+4
Original file line numberDiff line numberDiff line change
@@ -76,8 +76,12 @@
7676
},
7777
"scripts": {
7878
"start": "react-scripts start",
79+
"dashboard-dev":"REACT_APP_TARGET=dashboard react-scripts start",
80+
"hub-dev":"REACT_APP_TARGET=hub react-scripts start",
7981
"start_dev-server": "node dev-resources/testServer.js",
8082
"build": "CI=false react-scripts build",
83+
"hub-build":"CI=false REACT_APP_TARGET=hub react-scripts build",
84+
"dashboard-build":"CI=false REACT_APP_TARGET=dashboard react-scripts build",
8185
"test": "react-scripts test",
8286
"eject": "react-scripts eject",
8387
"predeploy": "npm run build",

‎public/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
work correctly both with client-side routing and a non-root public URL.
4343
Learn how to configure a non-root public URL by running `npm run build`.
4444
-->
45-
<title>Jina Dashboard</title>
45+
<title>Jina</title>
4646
</head>
4747

4848
<body>

‎src/App.css

+2-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ code {
1818
}
1919

2020
.main-sidebar {
21-
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25) !important;
21+
box-shadow: 0 0 5px rgba(0, 0, 0, 0.25) !important;
2222
border-radius: 0em 1.25em 1.25em 0em !important;
2323
overflow: hidden;
2424
}
@@ -679,6 +679,7 @@ code {
679679
}
680680

681681
.cookies-banner {
682+
z-index: 6;
682683
position: fixed;
683684
padding: 1.25em;
684685
bottom: 0;

‎src/App.test.js

-9
This file was deleted.

‎src/App.tsx ‎src/apps/Dashboard.tsx

+8-10
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,19 @@
11
import React from "react";
22
import { HashRouter as Router, Route } from "react-router-dom";
33

4-
import routes from "./routes";
5-
import withTracker from "./withTracker";
4+
import { dashboardRoutes as routes } from "../routes";
5+
import withTracker from "../withTracker";
66

7-
import "bootstrap/dist/css/bootstrap.min.css";
8-
import "./assets/main.scss";
9-
import "./App.css";
107
import { ErrorBoundary } from "react-error-boundary";
11-
import { FallbackPage } from "./views/FallbackPage";
12-
import { Store } from "./flux";
8+
import { FallbackPage } from "../views/FallbackPage";
9+
import { Store } from "../flux";
1310

14-
const App = () => {
11+
const Dashboard = () => {
12+
document.title="Jina Dashboard";
1513
return (
1614
<Router basename={"/"}>
1715
<div>
18-
{routes.map((route, index) => {
16+
{routes.map((route:any, index:number) => {
1917
return (
2018
<Route
2119
key={index}
@@ -41,4 +39,4 @@ const App = () => {
4139
);
4240
};
4341

44-
export { App };
42+
export { Dashboard };

‎src/apps/Hub.tsx

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React from "react";
2+
import { HashRouter as Router, Route } from "react-router-dom";
3+
4+
import { hubRoutes as routes } from "../routes";
5+
import withTracker from "../withTracker";
6+
7+
import "bootstrap/dist/css/bootstrap.min.css";
8+
import "../assets/main.scss";
9+
import "../App.css";
10+
import { ErrorBoundary } from "react-error-boundary";
11+
import { FallbackPage } from "../views/FallbackPage";
12+
import { Store } from "../flux";
13+
14+
const Hub = () => {
15+
document.title = "Jina Hub";
16+
return (
17+
<Router basename={"/"}>
18+
<div>
19+
{routes.map((route: any, index: number) => {
20+
return (
21+
<Route
22+
key={index}
23+
path={route.path}
24+
exact={route.exact}
25+
component={withTracker((props: any) => {
26+
return (
27+
<route.layout {...props} {...route.props}>
28+
<ErrorBoundary
29+
FallbackComponent={FallbackPage}
30+
onReset={() => Store.init()}
31+
>
32+
<route.component {...props} />
33+
</ErrorBoundary>
34+
</route.layout>
35+
);
36+
})}
37+
/>
38+
);
39+
})}
40+
</div>
41+
</Router>
42+
);
43+
};
44+
45+
export { Hub };

‎src/components/Layout/MainNavbar/ConnectionIndicator.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import React from "react";
33
import { NavItem, NavLink, Badge } from "shards-react";
44

55
type Props = {
6-
connected: boolean;
7-
reconnect: () => void;
6+
connected?: boolean;
7+
reconnect?: () => void;
88
};
99

1010
function ConnectionIndicator({ connected, reconnect }: Props) {

‎src/components/Layout/MainNavbar/MainNavbar.tsx

+15-4
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { NavbarSpacer } from "./NavbarSpacer";
66
import { NavbarToggle } from "./NavbarToggle";
77
import { ConnectionIndicator } from "./ConnectionIndicator";
88
import { UserActions } from "./UserActions";
9+
import {NavLogo} from './NavLogo';
910

1011
type User = {
1112
displayName: string;
@@ -23,11 +24,13 @@ type User = {
2324
type Props = {
2425
usesAuth: boolean;
2526
usesConnection: boolean;
26-
connected: boolean;
27+
connected?: boolean;
2728
logOut: () => void;
28-
toggleSidebar: () => void;
29-
reconnect: () => void;
29+
toggleSidebar?: () => void;
30+
reconnect?: () => void;
3031
user: User | null;
32+
hideSidebarToggle?:boolean;
33+
showLogo?:boolean;
3134
};
3235

3336
function MainNavbar({
@@ -38,6 +41,8 @@ function MainNavbar({
3841
reconnect,
3942
connected,
4043
user,
44+
hideSidebarToggle,
45+
showLogo
4146
}: Props) {
4247
const [userActionsVisible, setUserActionsVisible] = useState(false);
4348
function toggleUserActions() {
@@ -47,6 +52,9 @@ function MainNavbar({
4752
<div className="main-navbar">
4853
<Container fluid className="p-0">
4954
<Navbar type="light" className="align-items-stretch flex-md-nowrap p-0 px-2">
55+
{
56+
showLogo && <NavLogo/>
57+
}
5058
<NavbarSpacer />
5159
<Nav navbar className="flex-row">
5260
{usesConnection && (
@@ -64,7 +72,10 @@ function MainNavbar({
6472
/>
6573
)}
6674
</Nav>
67-
<NavbarToggle toggleSidebar={toggleSidebar} />
75+
{
76+
!hideSidebarToggle&&
77+
<NavbarToggle toggleSidebar={toggleSidebar} />
78+
}
6879
</Navbar>
6980
</Container>
7081
</div>

‎src/components/Layout/MainNavbar/NavLogo.tsx

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import React from "react";
2+
// @ts-ignore
3+
import { NavbarBrand } from "shards-react";
4+
5+
function NavLogo() {
6+
return (
7+
<NavbarBrand href="#" style={{ lineHeight: "25px" }}>
8+
<div className="d-table m-auto">
9+
<img
10+
id="main-logo"
11+
className="d-inline-block align-top mr-1 ml-3"
12+
style={{ maxWidth: "25px" }}
13+
src="/icon.png"
14+
alt="Jina"
15+
/>
16+
</div>
17+
</NavbarBrand>
18+
);
19+
}
20+
21+
export { NavLogo };

‎src/components/Layout/MainNavbar/NavbarToggle.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from "react";
22

33
type Props = {
4-
toggleSidebar: () => void;
4+
toggleSidebar?: () => void;
55
};
66

77
function NavbarToggle({ toggleSidebar }: Props) {

‎src/index.tsx

+17-4
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,25 @@
11
import React from "react";
22
import ReactDOM from "react-dom";
3-
import { App } from "./App";
43
import { ThemeProvider } from "emotion-theming";
54
import { theme } from "./theme";
65

6+
import "bootstrap/dist/css/bootstrap.min.css";
7+
import "./assets/main.scss";
8+
import "./App.css";
9+
10+
let App;
11+
12+
if (process.env.REACT_APP_TARGET === "dashboard") {
13+
const { Dashboard } = require("./apps/Dashboard");
14+
App = Dashboard;
15+
} else {
16+
const { Hub } = require("./apps/Hub");
17+
App = Hub;
18+
}
19+
720
ReactDOM.render(
8-
<ThemeProvider theme={theme}>
9-
<App />
10-
</ThemeProvider>,
21+
<ThemeProvider theme={theme}>
22+
<App />
23+
</ThemeProvider>,
1124
document.getElementById("root")
1225
);

0 commit comments

Comments
 (0)