Skip to content

Commit 5ad8098

Browse files
mrholekmrholek
committed
refactor: update app components structure
1 parent 5cee527 commit 5ad8098

File tree

8 files changed

+384
-6
lines changed

8 files changed

+384
-6
lines changed

‎src/_nav.js

Lines changed: 321 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,321 @@
1+
import React from 'react'
2+
import CIcon from '@coreui/icons-react'
3+
import { NavLink } from 'react-router-dom'
4+
5+
const _nav = [
6+
{
7+
_component: 'CNavItem',
8+
as: NavLink,
9+
anchor: 'Dashboard',
10+
to: '/dashboard',
11+
icon: <CIcon name="cil-speedometer" customClasses="nav-icon" />,
12+
badge: {
13+
color: 'info',
14+
text: 'NEW',
15+
},
16+
},
17+
{
18+
_component: 'CNavTitle',
19+
anchor: 'Theme',
20+
},
21+
{
22+
_component: 'CNavItem',
23+
as: NavLink,
24+
anchor: 'Colors',
25+
to: '/theme/colors',
26+
icon: <CIcon name="cil-drop" customClasses="nav-icon" />,
27+
},
28+
{
29+
_component: 'CNavItem',
30+
as: NavLink,
31+
anchor: 'Typography',
32+
to: '/theme/typography',
33+
icon: <CIcon name="cil-pencil" customClasses="nav-icon" />,
34+
},
35+
{
36+
_component: 'CNavTitle',
37+
anchor: 'Components',
38+
},
39+
{
40+
_component: 'CNavGroup',
41+
as: NavLink,
42+
anchor: 'Base',
43+
to: '/to',
44+
icon: <CIcon name="cil-puzzle" customClasses="nav-icon" />,
45+
items: [
46+
{
47+
_component: 'CNavItem',
48+
as: NavLink,
49+
anchor: 'Accordion',
50+
to: '/base/accordion',
51+
},
52+
{
53+
_component: 'CNavItem',
54+
as: NavLink,
55+
anchor: 'Breadcrumb',
56+
to: '/base/breadcrumbs',
57+
},
58+
{
59+
_component: 'CNavItem',
60+
as: NavLink,
61+
anchor: 'Cards',
62+
to: '/base/cards',
63+
},
64+
{
65+
_component: 'CNavItem',
66+
as: NavLink,
67+
anchor: 'Carousel',
68+
to: '/base/carousels',
69+
},
70+
{
71+
_component: 'CNavItem',
72+
as: NavLink,
73+
anchor: 'Collapse',
74+
to: '/base/collapses',
75+
},
76+
{
77+
_component: 'CNavItem',
78+
as: NavLink,
79+
anchor: 'List group',
80+
to: '/base/list-groups',
81+
},
82+
{
83+
_component: 'CNavItem',
84+
as: NavLink,
85+
anchor: 'Navs & Tabs',
86+
to: '/base/navs',
87+
},
88+
{
89+
_component: 'CNavItem',
90+
as: NavLink,
91+
anchor: 'Pagination',
92+
to: '/base/paginations',
93+
},
94+
{
95+
_component: 'CNavItem',
96+
as: NavLink,
97+
anchor: 'Popovers',
98+
to: '/base/popovers',
99+
},
100+
{
101+
_component: 'CNavItem',
102+
as: NavLink,
103+
anchor: 'Progress',
104+
to: '/base/progress',
105+
},
106+
{
107+
_component: 'CNavItem',
108+
as: NavLink,
109+
anchor: 'Spinners',
110+
to: '/base/spinners',
111+
},
112+
{
113+
_component: 'CNavItem',
114+
as: NavLink,
115+
anchor: 'Tables',
116+
to: '/base/tables',
117+
},
118+
{
119+
_component: 'CNavItem',
120+
as: NavLink,
121+
anchor: 'Tooltips',
122+
to: '/base/tooltips',
123+
},
124+
],
125+
},
126+
{
127+
_component: 'CNavGroup',
128+
anchor: 'Buttons',
129+
icon: <CIcon name="cil-cursor" customClasses="nav-icon" />,
130+
items: [
131+
{
132+
_component: 'CNavItem',
133+
as: NavLink,
134+
anchor: 'Buttons',
135+
to: '/buttons/buttons',
136+
},
137+
{
138+
_component: 'CNavItem',
139+
as: NavLink,
140+
anchor: 'Buttons groups',
141+
to: '/buttons/button-groups',
142+
},
143+
{
144+
_component: 'CNavItem',
145+
as: NavLink,
146+
anchor: 'Dropdowns',
147+
to: '/buttons/dropdowns',
148+
},
149+
],
150+
},
151+
{
152+
_component: 'CNavGroup',
153+
anchor: 'Forms',
154+
icon: <CIcon name="cil-notes" customClasses="nav-icon" />,
155+
items: [
156+
{
157+
_component: 'CNavItem',
158+
as: NavLink,
159+
anchor: 'Form Control',
160+
to: '/forms/form-control',
161+
},
162+
{
163+
_component: 'CNavItem',
164+
as: NavLink,
165+
anchor: 'Select',
166+
to: '/forms/select',
167+
},
168+
{
169+
_component: 'CNavItem',
170+
as: NavLink,
171+
anchor: 'Checks & Radios',
172+
to: '/forms/checks-radios',
173+
},
174+
{
175+
_component: 'CNavItem',
176+
as: NavLink,
177+
anchor: 'Range',
178+
to: '/forms/range',
179+
},
180+
{
181+
_component: 'CNavItem',
182+
as: NavLink,
183+
anchor: 'Input Group',
184+
to: '/forms/input-group',
185+
},
186+
{
187+
_component: 'CNavItem',
188+
as: NavLink,
189+
anchor: 'Floating Labels',
190+
to: '/forms/floating-labels',
191+
},
192+
{
193+
_component: 'CNavItem',
194+
as: NavLink,
195+
anchor: 'Layout',
196+
to: '/forms/layout',
197+
},
198+
{
199+
_component: 'CNavItem',
200+
as: NavLink,
201+
anchor: 'Validation',
202+
to: '/forms/validation',
203+
},
204+
],
205+
},
206+
{
207+
_component: 'CNavItem',
208+
as: NavLink,
209+
anchor: 'Charts',
210+
to: '/charts',
211+
icon: <CIcon name="cil-chart-pie" customClasses="nav-icon" />,
212+
},
213+
{
214+
_component: 'CNavGroup',
215+
anchor: 'Icons',
216+
icon: <CIcon name="cil-star" customClasses="nav-icon" />,
217+
items: [
218+
{
219+
_component: 'CNavItem',
220+
as: NavLink,
221+
anchor: 'CoreUI Free',
222+
to: '/icons/coreui-icons',
223+
badge: {
224+
color: 'success',
225+
text: 'NEW',
226+
},
227+
},
228+
{
229+
_component: 'CNavItem',
230+
as: NavLink,
231+
anchor: 'CoreUI Flags',
232+
to: '/icons/flags',
233+
},
234+
{
235+
_component: 'CNavItem',
236+
as: NavLink,
237+
anchor: 'CoreUI Brands',
238+
to: '/icons/brands',
239+
},
240+
],
241+
},
242+
{
243+
_component: 'CNavGroup',
244+
anchor: 'Notifications',
245+
icon: <CIcon name="cil-bell" customClasses="nav-icon" />,
246+
items: [
247+
{
248+
_component: 'CNavItem',
249+
as: NavLink,
250+
anchor: 'Alerts',
251+
to: '/notifications/alerts',
252+
},
253+
{
254+
_component: 'CNavItem',
255+
as: NavLink,
256+
anchor: 'Badges',
257+
to: '/notifications/badges',
258+
},
259+
{
260+
_component: 'CNavItem',
261+
as: NavLink,
262+
anchor: 'Modal',
263+
to: '/notifications/modals',
264+
},
265+
{
266+
_component: 'CNavItem',
267+
as: NavLink,
268+
anchor: 'Toasts',
269+
to: '/notifications/toasts',
270+
},
271+
],
272+
},
273+
{
274+
_component: 'CNavItem',
275+
as: NavLink,
276+
anchor: 'Widgets',
277+
to: '/widgets',
278+
icon: <CIcon name="cil-calculator" customClasses="nav-icon" />,
279+
badge: {
280+
color: 'info',
281+
text: 'NEW',
282+
},
283+
},
284+
{
285+
_component: 'CNavTitle',
286+
anchor: 'Extras',
287+
},
288+
{
289+
_component: 'CNavGroup',
290+
anchor: 'Pages',
291+
icon: <CIcon name="cil-star" customClasses="nav-icon" />,
292+
items: [
293+
{
294+
_component: 'CNavItem',
295+
as: NavLink,
296+
anchor: 'Login',
297+
to: '/login',
298+
},
299+
{
300+
_component: 'CNavItem',
301+
as: NavLink,
302+
anchor: 'Register',
303+
to: '/register',
304+
},
305+
{
306+
_component: 'CNavItem',
307+
as: NavLink,
308+
anchor: 'Error 404',
309+
to: '/404',
310+
},
311+
{
312+
_component: 'CNavItem',
313+
as: NavLink,
314+
anchor: 'Error 500',
315+
to: '/500',
316+
},
317+
],
318+
},
319+
]
320+
321+
export default _nav

‎src/components/AppContent.js

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import React, { Suspense } from 'react'
2+
import { Redirect, Route, Switch } from 'react-router-dom'
3+
import { CContainer, CSpinner } from '@coreui/react'
4+
5+
// routes config
6+
import routes from '../routes'
7+
8+
const AppContent = () => {
9+
return (
10+
<CContainer lg>
11+
<Suspense fallback={<CSpinner color="primary" />}>
12+
<Switch>
13+
{routes.map((route, idx) => {
14+
return (
15+
route.component && (
16+
<Route
17+
key={idx}
18+
path={route.path}
19+
exact={route.exact}
20+
name={route.name}
21+
render={(props) => (
22+
<>
23+
<route.component {...props} />
24+
</>
25+
)}
26+
/>
27+
)
28+
)
29+
})}
30+
<Redirect from="/" to="/dashboard" />
31+
</Switch>
32+
</Suspense>
33+
</CContainer>
34+
)
35+
}
36+
37+
export default React.memo(AppContent)

‎src/components/AppHeader.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,9 @@ import {
1313
} from '@coreui/react'
1414
import CIcon from '@coreui/icons-react'
1515

16-
import { AppBreadcrumb, AppHeaderDropdown } from '../containers/index'
16+
import { AppBreadcrumb } from './index'
17+
18+
import { AppHeaderDropdown } from './header/index'
1719

1820
const AppHeader = () => {
1921
const dispatch = useDispatch()

‎src/components/AppSidebar.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
import CIcon from '@coreui/icons-react'
1313

1414
// sidebar nav config
15-
import navigation from '../containers/_nav'
15+
import navigation from '../_nav'
1616

1717
const AppSidebar = () => {
1818
const dispatch = useDispatch()

‎src/components/header/index.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import AppHeaderDropdown from './AppHeaderDropdown'
2+
3+
export { AppHeaderDropdown }

0 commit comments

Comments
 (0)