Skip to content

Commit 228c626

Browse files
Remove bootswatch and add reactstrap
1 parent c01089e commit 228c626

File tree

7 files changed

+138
-94
lines changed

7 files changed

+138
-94
lines changed

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,12 @@
1414
"@types/react-router-dom": "^5.3.2",
1515
"axios": ">=0.21.2",
1616
"@types/classnames": "^2.2.10",
17-
"@types/jquery": "^3.5.1",
1817
"bootstrap": "^5.1.3",
1918
"classnames": "^2.2.6",
2019
"lodash": "^4.17.15",
2120
"moment": "^2.24.0",
21+
"react-transition-group": "^4.4.1",
22+
"reactstrap": "^9.0.1",
2223
"react": "^17.0.2",
2324
"react-dom": "^17.0.2",
2425
"react-router-dom": "^5.3.0",

src/App.tsx

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,6 @@ const App = () => (
2323
</Route>
2424
</Switch>
2525
</main>
26-
<footer className="footer">
27-
<div className="container">
28-
<p className="text-center">SivaLabs &copy; 2022</p>
29-
</div>
30-
</footer>
3126
</div>
3227
);
3328

src/bootswatch.min.css

Lines changed: 0 additions & 12 deletions
This file was deleted.

src/components/layout/NavBar.tsx

Lines changed: 61 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,16 @@
1-
import React from "react";
2-
import { NavLink } from "react-router-dom";
1+
import {
2+
Collapse, DropdownItem, DropdownMenu,
3+
DropdownToggle,
4+
Nav,
5+
Navbar,
6+
NavbarBrand,
7+
NavbarToggler,
8+
NavItem,
9+
NavLink,
10+
UncontrolledDropdown
11+
} from "reactstrap";
312
import AuthService from "../../services/AuthService";
13+
import React from "react";
414

515
const NavBar = () => {
616
const authService = new AuthService()
@@ -13,63 +23,59 @@ const NavBar = () => {
1323
let authenticatedLinks;
1424
const user = authService.getCurrentUser();
1525
if (user.access_token) {
16-
authenticatedLinks = (
17-
<ul className="navbar-nav mb-2 mb-md-0">
18-
<li className="nav-item">
19-
<NavLink className="nav-link" to="/links/new">
20-
<i className="fas fa-plus-circle"/> Add Link
21-
</NavLink>
22-
</li>
23-
<li className="nav-item dropdown">
24-
<NavLink className="nav-link dropdown-toggle" to="#" id="navbarDropdown" role="button"
25-
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
26-
<i className="fas fa-user"/> <span>{user.user.name}</span>
27-
</NavLink>
28-
<div className="dropdown-menu">
29-
<NavLink className="dropdown-item" to="/logout" onClick={logoutHandler}>
30-
<i className="fas fa-sign-out-alt"/> Logout
31-
</NavLink>
32-
</div>
33-
</li>
34-
</ul>
35-
);
26+
authenticatedLinks = (<Nav className="" navbar>
27+
<NavItem>
28+
<NavLink href="/links/new">
29+
<i className="fas fa-plus-circle"/> Add Link
30+
</NavLink>
31+
</NavItem>
32+
33+
<UncontrolledDropdown inNavbar nav>
34+
<DropdownToggle caret nav>
35+
<i className="fas fa-user"/> <span>{user.user.name}</span>
36+
</DropdownToggle>
37+
<DropdownMenu right>
38+
<DropdownItem onClick={logoutHandler}>
39+
<i className="fas fa-sign-out-alt"/> Logout
40+
</DropdownItem>
41+
</DropdownMenu>
42+
</UncontrolledDropdown>
43+
</Nav>);
3644
} else {
37-
authenticatedLinks = (
38-
<ul className="navbar-nav mb-2 mb-md-0">
39-
<li className="nav-item">
40-
<NavLink className="nav-link" to="/login">
41-
Login
42-
</NavLink>
43-
</li>
44-
<li className="nav-item">
45-
<NavLink className="nav-link" to="/registration">
46-
Register
47-
</NavLink>
48-
</li>
49-
</ul>
50-
);
45+
authenticatedLinks = (<Nav className="" navbar>
46+
<NavItem>
47+
<NavLink href="/login">
48+
Login
49+
</NavLink>
50+
</NavItem>
51+
<NavItem>
52+
<NavLink href="/registration">
53+
Register
54+
</NavLink>
55+
</NavItem>
56+
</Nav>);
5157
}
5258
return (
53-
<nav className="navbar navbar-expand-md navbar-dark fixed-top bg-primary">
54-
<div className="container">
55-
<NavLink className="navbar-brand" to="/">
59+
<div>
60+
<Navbar
61+
color="primary"
62+
container="xl"
63+
dark
64+
expand="md"
65+
fixed="top"
66+
full
67+
light>
68+
<NavbarBrand href="/">
5669
DevZone
57-
</NavLink>
58-
<button className="navbar-toggler" type="button" data-bs-toggle="collapse"
59-
data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false"
60-
aria-label="Toggle navigation">
61-
<span className="navbar-toggler-icon"></span>
62-
</button>
63-
64-
<div className="collapse navbar-collapse" id="navbarCollapse">
65-
<ul className="navbar-nav me-auto mb-2 mb-md-0">
66-
67-
</ul>
70+
</NavbarBrand>
71+
<NavbarToggler onClick={function noRefCheck() {
72+
}}/>
73+
<Collapse navbar>
74+
<Nav className="me-auto"/>
6875
{authenticatedLinks}
69-
</div>
70-
</div>
71-
</nav>
72-
);
73-
};
76+
</Collapse>
77+
</Navbar>
78+
</div>);
79+
}
7480

7581
export default NavBar;

src/index.css

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,11 @@
1-
/* Sticky footer styles
2-
-------------------------------------------------- */
31
html {
42
position: relative;
53
min-height: 100%;
64
}
75
body {
8-
/* Margin bottom by footer height */
96
padding-top: 80px;
10-
margin-bottom: 80px;
11-
}
12-
.footer {
13-
position: absolute;
14-
bottom: 0;
15-
width: 100%;
16-
/* Set the fixed height of the footer here */
17-
height: 60px;
18-
line-height: 60px; /* Vertically center the text there */
19-
background-color: #f5f5f5;
207
}
218

229
a:link {
2310
text-decoration: none;
24-
font-weight: bolder;
2511
}

src/index.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,7 @@ import ReactDOM from "react-dom";
33
import {BrowserRouter as Router} from "react-router-dom";
44
import App from "./App";
55
import "@fortawesome/fontawesome-free/css/all.css";
6-
//import "bootstrap/dist/css/bootstrap.min.css";
7-
import "./bootswatch.min.css";
8-
import 'bootstrap/dist/js/bootstrap.bundle.min';
6+
import "bootstrap/dist/css/bootstrap.min.css";
97
import "./index.css";
108

119
ReactDOM.render(

yarn.lock

Lines changed: 74 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1165,7 +1165,7 @@
11651165
dependencies:
11661166
regenerator-runtime "^0.13.4"
11671167

1168-
"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.13", "@babel/runtime@^7.12.5", "@babel/runtime@^7.16.3", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
1168+
"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.13", "@babel/runtime@^7.12.5", "@babel/runtime@^7.16.3", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
11691169
version "7.16.3"
11701170
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.16.3.tgz#b86f0db02a04187a3c17caa77de69840165d42d5"
11711171
integrity sha512-WBwekcqacdY2e9AF/Q7WLFUWmdJGJTkbjqTjoMDgXkVZ3ZRUvOPsLb5KdwISoQVsbP+DQzVZW4Zhci0DvpbNTQ==
@@ -1545,6 +1545,11 @@
15451545
schema-utils "^2.6.5"
15461546
source-map "^0.7.3"
15471547

1548+
"@popperjs/core@^2.6.0":
1549+
version "2.11.0"
1550+
resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.0.tgz#6734f8ebc106a0860dff7f92bf90df193f0935d7"
1551+
integrity sha512-zrsUxjLOKAzdewIDRWy9nsV1GQsKBCWaGwsZQlCgr6/q+vjyZhFgqedLfFBuI9anTPEUT4APq9Mu0SZBTzIcGQ==
1552+
15481553
"@rollup/plugin-node-resolve@^7.1.1":
15491554
version "7.1.3"
15501555
resolved "https://registry.yarnpkg.com/@rollup/plugin-node-resolve/-/plugin-node-resolve-7.1.3.tgz#80de384edfbd7bfc9101164910f86078151a3eca"
@@ -3424,7 +3429,7 @@ class-utils@^0.3.5:
34243429
isobject "^3.0.0"
34253430
static-extend "^0.1.1"
34263431

3427-
classnames@*, classnames@^2.2.6:
3432+
classnames@*, classnames@^2.2.3, classnames@^2.2.6:
34283433
version "2.3.1"
34293434
resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
34303435
integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
@@ -4305,6 +4310,14 @@ dom-converter@^0.2.0:
43054310
dependencies:
43064311
utila "~0.4"
43074312

4313+
dom-helpers@^5.0.1:
4314+
version "5.2.1"
4315+
resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902"
4316+
integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==
4317+
dependencies:
4318+
"@babel/runtime" "^7.8.7"
4319+
csstype "^3.0.2"
4320+
43084321
dom-serializer@0:
43094322
version "0.2.2"
43104323
resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51"
@@ -7208,7 +7221,7 @@ loglevel@^1.6.8:
72087221
resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.8.0.tgz#e7ec73a57e1e7b419cb6c6ac06bf050b67356114"
72097222
integrity sha512-G6A/nJLRgWOuuwdNuA6koovfEV1YpqqAG4pRUlFaz3jj2QNZ8M4vBqnVA+HBTmU/AMNUtlOsMmSpF6NyOjztbA==
72107223

7211-
loose-envify@^1.1.0, loose-envify@^1.2.0, loose-envify@^1.3.1, loose-envify@^1.4.0:
7224+
loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.2.0, loose-envify@^1.3.1, loose-envify@^1.4.0:
72127225
version "1.4.0"
72137226
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
72147227
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -9019,6 +9032,21 @@ pretty-format@^27.0.0, pretty-format@^27.4.2:
90199032
ansi-styles "^5.0.0"
90209033
react-is "^17.0.1"
90219034

9035+
primeflex@^3.1.0:
9036+
version "3.1.0"
9037+
resolved "https://registry.yarnpkg.com/primeflex/-/primeflex-3.1.0.tgz#2beef527e788981b823e5969752a87d7b72447ee"
9038+
integrity sha512-q8QutEO59eu79nJVyMFDcpdokiCIk79Rn6Y9NwxpiIp5rxRjNCacH2N7gM+ondQjvYnuj6LLOK8dEVx1J2i7Lw==
9039+
9040+
primeicons@^4.1.0:
9041+
version "4.1.0"
9042+
resolved "https://registry.yarnpkg.com/primeicons/-/primeicons-4.1.0.tgz#19eaef8ef5594b0006358ae64e738d03e167c9bb"
9043+
integrity sha512-uEv2pSPk1zQCfaB2VgnUfnUxxlGryYi+5rbdxmZBBt5v9S/pscIQYS5YDLxsQZ7D9jn5c76+Tx5wX/2J1nK6sA==
9044+
9045+
primereact@^7.0.1:
9046+
version "7.0.1"
9047+
resolved "https://registry.yarnpkg.com/primereact/-/primereact-7.0.1.tgz#4aa4750320c71c457e6cf76de6a185e4a9e1065b"
9048+
integrity sha512-Mq3gc7VXn5xk0vapMui4utjO5AYxdH5PN4ShK6AM3/CQEcv0hWpolqHfHxX5HytaHWLvnzXcWDw/iDCwCV8BmA==
9049+
90229050
process-nextick-args@~2.0.0:
90239051
version "2.0.1"
90249052
resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
@@ -9062,7 +9090,7 @@ prompts@^2.0.1:
90629090
kleur "^3.0.3"
90639091
sisteransi "^1.0.5"
90649092

9065-
prop-types@^15.6.2, prop-types@^15.7.2:
9093+
prop-types@^15.5.8, prop-types@^15.6.2, prop-types@^15.7.2:
90669094
version "15.7.2"
90679095
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
90689096
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -9277,6 +9305,11 @@ react-error-overlay@^6.0.9:
92779305
resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.9.tgz#3c743010c9359608c375ecd6bc76f35d93995b0a"
92789306
integrity sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew==
92799307

9308+
react-fast-compare@^3.0.1:
9309+
version "3.2.0"
9310+
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb"
9311+
integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==
9312+
92809313
react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1:
92819314
version "16.13.1"
92829315
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -9287,6 +9320,14 @@ react-is@^17.0.1:
92879320
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
92889321
integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
92899322

9323+
react-popper@^2.2.4:
9324+
version "2.2.5"
9325+
resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-2.2.5.tgz#1214ef3cec86330a171671a4fbcbeeb65ee58e96"
9326+
integrity sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==
9327+
dependencies:
9328+
react-fast-compare "^3.0.1"
9329+
warning "^4.0.2"
9330+
92909331
react-refresh@^0.8.3:
92919332
version "0.8.3"
92929333
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"
@@ -9387,6 +9428,16 @@ [email protected]:
93879428
optionalDependencies:
93889429
fsevents "^2.1.3"
93899430

9431+
react-transition-group@^4.4.1, react-transition-group@^4.4.2:
9432+
version "4.4.2"
9433+
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.2.tgz#8b59a56f09ced7b55cbd53c36768b922890d5470"
9434+
integrity sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==
9435+
dependencies:
9436+
"@babel/runtime" "^7.5.5"
9437+
dom-helpers "^5.0.1"
9438+
loose-envify "^1.4.0"
9439+
prop-types "^15.6.2"
9440+
93909441
react@^17.0.2:
93919442
version "17.0.2"
93929443
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
@@ -9395,6 +9446,18 @@ react@^17.0.2:
93959446
loose-envify "^1.1.0"
93969447
object-assign "^4.1.1"
93979448

9449+
reactstrap@^9.0.1:
9450+
version "9.0.1"
9451+
resolved "https://registry.yarnpkg.com/reactstrap/-/reactstrap-9.0.1.tgz#a6b205861f3e83da55063bc04ba1a069e969f21d"
9452+
integrity sha512-89VOv7SRlAlpS7RwXhzOQkSWkuhBR8LBsPGfNHifNL3WhtNP9y1sBdTcTYyH1ee2QtI8zRdwD0T5I/blHiwemg==
9453+
dependencies:
9454+
"@babel/runtime" "^7.12.5"
9455+
"@popperjs/core" "^2.6.0"
9456+
classnames "^2.2.3"
9457+
prop-types "^15.5.8"
9458+
react-popper "^2.2.4"
9459+
react-transition-group "^4.4.2"
9460+
93989461
read-pkg-up@^7.0.1:
93999462
version "7.0.1"
94009463
resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-7.0.1.tgz#f3a6135758459733ae2b95638056e1854e7ef507"
@@ -11203,6 +11266,13 @@ walker@^1.0.7, walker@~1.0.5:
1120311266
dependencies:
1120411267
makeerror "1.0.12"
1120511268

11269+
warning@^4.0.2:
11270+
version "4.0.3"
11271+
resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
11272+
integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==
11273+
dependencies:
11274+
loose-envify "^1.0.0"
11275+
1120611276
watchpack-chokidar2@^2.0.1:
1120711277
version "2.0.1"
1120811278
resolved "https://registry.yarnpkg.com/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz#38500072ee6ece66f3769936950ea1771be1c957"

0 commit comments

Comments
 (0)