Skip to content

Commit e2c6b9d

Browse files
author
Philipp Karlsson
committed
fixing navigation and github pages
1 parent d013f9d commit e2c6b9d

File tree

6 files changed

+45
-48
lines changed

6 files changed

+45
-48
lines changed

‎showcase/package.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,17 @@
1212
"@types/node": "^18.13.0",
1313
"@types/react": "^16.8.0",
1414
"@types/react-dom": "^16.8.0",
15+
"gh-pages": "^5.0.0",
1516
"react": "^16.8.0",
1617
"react-dom": "^16.8.0",
1718
"react-scripts": "^5.0.1",
1819
"typescript": "^4.9.5"
1920
},
21+
"homepage": "https://linked-planet.github.io/ui-kit-ts",
2022
"scripts": {
2123
"start": "npm run generate && react-scripts start",
2224
"build": "npm run generate && install-local-dependencies && react-scripts build",
25+
"deploy": "gh-pages -d build",
2326
"reload": "npm install && install-local-dependencies",
2427
"generate": "node copySources.js",
2528
"eject": "react-scripts eject",

‎showcase/public/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
manifest.json provides metadata used when your web app is installed on a
1515
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
1616
-->
17-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
17+
<link rel="manifest" href="%PUBLIC_URL%/asset-manifest.json" />
1818
<!--
1919
Notice the use of %PUBLIC_URL% in the tags above.
2020
It will be replaced with the URL of the `public` folder during the build.
@@ -24,7 +24,7 @@
2424
work correctly both with client-side routing and a non-root public URL.
2525
Learn how to configure a non-root public URL by running `npm run build`.
2626
-->
27-
<title>UI-Kit-TS</title>
27+
<title>UI-Kit-TS2</title>
2828
</head>
2929
<body>
3030
<noscript>You need to enable JavaScript to run this app.</noscript>

‎showcase/public/showcase-sources.txt‎

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -727,8 +727,6 @@ function FormShowcase(props: ShowcaseProps) {
727727
favoriteColorCreatable: string
728728
}
729729

730-
const colors: string[] = ["BLUE", "RED"]
731-
732730
const initFormData = {
733731
name: "Carl",
734732
readonlyField: "Read-only Field",
@@ -885,7 +883,6 @@ function FormShowcase(props: ShowcaseProps) {
885883
export default FormShowcase;
886884
import React from "react";
887885
import ShowcaseWrapperItem, {ShowcaseProps} from "../../ShowcaseWrapperItem";
888-
import Flag from "@atlaskit/flag";
889886
import ArrowDownIcon from "@atlaskit/icon/glyph/arrow-down";
890887
import BulletListIcon from "@atlaskit/icon/glyph/bullet-list";
891888
import CheckCircleIcon from "@atlaskit/icon/glyph/check-circle";
@@ -1203,7 +1200,7 @@ function PaginationShowcase(props: ShowcaseProps) {
12031200
defaultSelectedIndex={0}
12041201
max={10}
12051202
selectedIndex={selectedPage}
1206-
onChange={(event, page, analyticsEvent) => setSelectedPage(page-1)}
1203+
onChange={(event, page) => setSelectedPage(page-1)}
12071204
/>
12081205
)
12091206
// endregion: pagination
@@ -1398,13 +1395,6 @@ function TableTreeShowcase(props: ShowcaseProps) {
13981395
description: string
13991396
}
14001397

1401-
interface BookTreeItem {
1402-
id: string
1403-
content: BookData
1404-
children: TableTreeItem[]
1405-
hasChildren: boolean
1406-
}
1407-
14081398
interface TableTreeItem {
14091399
id: string
14101400
title: string

‎showcase/src/App.tsx‎

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import React from 'react';
2-
import { PageLayout, Content, Main } from "@atlaskit/page-layout"
2+
import {Content, Main, PageLayout} from "@atlaskit/page-layout"
33
import ShowcaseTopNavigation from "./components/ShowcaseTopNavigation";
44
import ShowcaseLeftSidebar from "./components/ShowcaseLeftSidebar";
5-
import {HashRouter, Routes, Route, Navigate} from "react-router-dom";
5+
import {HashRouter, Navigate, Route, Routes} from "react-router-dom";
66
import IntroPage from "./page/IntroPage";
77
import NotFoundPage from "./page/NotFoundPage";
88
import UtilsPage from "./page/UtilsPage";
@@ -13,46 +13,46 @@ function App() {
1313
require("./custom.css")
1414

1515
return (
16-
<div className="App">
17-
<PageLayout>
18-
<ShowcaseTopNavigation />
19-
<Content>
20-
<ShowcaseLeftSidebar />
16+
<HashRouter>
17+
<div className="App">
18+
<PageLayout>
19+
<ShowcaseTopNavigation/>
20+
<Content>
21+
<ShowcaseLeftSidebar/>
2122

22-
<Main>
23-
<div style={{
24-
margin: "50px 50px",
25-
display: "flex",
26-
flexDirection: "column"
27-
}}>
28-
<HashRouter>
23+
<Main>
24+
<div style={{
25+
margin: "50px 50px",
26+
display: "flex",
27+
flexDirection: "column"
28+
}}>
2929
<Routes>
3030
<Route
3131
path="/"
3232
element={<Navigate to="/intro"/>}
33-
/>
33+
/>
3434
<Route
3535
path="/intro"
36-
element={<IntroPage />}
37-
/>
36+
element={<IntroPage/>}
37+
/>
3838
<Route
3939
path="/wrappers"
40-
element={<WrappersPage />}
41-
/>
40+
element={<WrappersPage/>}
41+
/>
4242
<Route
4343
path="/utils"
44-
element={<UtilsPage />}
45-
/>
44+
element={<UtilsPage/>}
45+
/>
4646
<Route
47-
element={<NotFoundPage />}
48-
/>
47+
element={<NotFoundPage/>}
48+
/>
4949
</Routes>
50-
</HashRouter>
51-
</div>
52-
</Main>
53-
</Content>
54-
</PageLayout>
55-
</div>
50+
</div>
51+
</Main>
52+
</Content>
53+
</PageLayout>
54+
</div>
55+
</HashRouter>
5656
);
5757
}
5858

‎showcase/src/components/ShowcaseTopNavigation.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from "react";
22
import {TopNavigation} from "@atlaskit/page-layout";
33
import {AtlassianNavigation, CustomProductHome, PrimaryButton, Profile} from "@atlaskit/atlassian-navigation";
4-
4+
import {useNavigate} from "react-router";
55
export const ProfileIcon = () => {
66
return (
77
<img
@@ -17,19 +17,21 @@ export const ProfileIcon = () => {
1717
}
1818

1919
function ShowcaseTopNavigation() {
20+
const navigation = useNavigate()
21+
2022
return (
2123
<TopNavigation isFixed>
2224
<AtlassianNavigation
2325
label=""
2426
primaryItems={
2527
[
26-
<PrimaryButton onClick={() => window.location.href = "/#/intro"}><span>Intro</span></PrimaryButton>,
27-
<PrimaryButton onClick={() => window.location.href = "/#/wrappers"}><span>Wrappers</span></PrimaryButton>,
28-
<PrimaryButton onClick={() => window.location.href = "/#/utils"}><span>Utils</span></PrimaryButton>,
28+
<PrimaryButton onClick={() => navigation("/intro")}><span>Intro</span></PrimaryButton>,
29+
<PrimaryButton onClick={() => navigation("/wrappers")}><span>Wrappers</span></PrimaryButton>,
30+
<PrimaryButton onClick={() => navigation("/utils")}><span>Utils</span></PrimaryButton>,
2931
]
3032
}
3133
renderProductHome={() => <CustomProductHome siteTitle="UI-Kit-TS" iconUrl="./images/logo.png" logoAlt=""
32-
onClick={() => window.location.href = "/#/intro"}
34+
onClick={() => navigation("/utils")}
3335
logoUrl="images/logo.png" iconAlt=""/>}
3436
renderProfile={() => <Profile tooltip="" href="https://github.com/linked-planet/ui-kit-ts" target="_blank" icon={<ProfileIcon/>}/>}
3537
/>

‎showcase/src/page/NotFoundPage.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,18 @@
11
import React from "react";
22
import EmptyState from "@atlaskit/empty-state";
33
import Button from "@atlaskit/button";
4+
import {useNavigate} from "react-router";
45

56
function NotFoundPage() {
7+
const navigation = useNavigate()
68

79
return (
810
<EmptyState
911
header="404 - Not found"
1012
description={<span>The page you were looking for doesn't exist...</span>}
1113
primaryAction={
1214
<Button
13-
onClick={() => window.location.href="/"}
15+
onClick={() => navigation("/")}
1416
appearance="primary"
1517
>Back to start</Button>
1618
}

0 commit comments

Comments
 (0)