Skip to content

Commit

Permalink
Merge pull request KelvinTegelaar#2386 from JohnDuprey/dev
Browse files Browse the repository at this point in the history 
Frontend fixes
  • Loading branch information
@JohnDuprey
JohnDuprey committed Apr 30, 2024
2 parents 459947e + ba877e4 commit def6083
Show file tree
Hide file tree
Showing 8 changed files with 147 additions and 82 deletions.
108 changes: 53 additions & 55 deletions src/App.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,15 @@
import React, { Suspense } from 'react'
import { BrowserRouter, Route, Routes, Navigate } from 'react-router-dom'
import { BrowserRouter, Route, Routes, Navigate, useLocation } from 'react-router-dom'
import { PrivateRoute, FullScreenLoading, ErrorBoundary } from 'src/components/utilities'
import 'src/scss/style.scss'
import { Helmet } from 'react-helmet-async'
import { Helmet, HelmetProvider } from 'react-helmet-async'
import Skeleton from 'react-loading-skeleton'
import TimeAgo from 'javascript-time-ago'
import en from 'javascript-time-ago/locale/en.json'
TimeAgo.addDefaultLocale(en)
import { library } from '@fortawesome/fontawesome-svg-core'
import { fas } from '@fortawesome/free-solid-svg-icons'
import routes from 'src/routes'
import { useAuthCheck } from './components/utilities/CippauthCheck'
import importsMap from './importsMap'

library.add(fas)
Expand All @@ -32,59 +31,58 @@ const Logout = React.lazy(() => import('./views/pages/login/Logout'))
const App = () => {
return (
<BrowserRouter>
<Suspense fallback={<FullScreenLoading />}>
<Helmet>
<title>CIPP</title>
</Helmet>
<Routes>
<Route exact path="/LogoutRedirect" name="LogoutRedirect" element={<PageLogOut />} />
<Route exact path="/401" name="Page 401" element={<Page401 />} />
<Route exact path="/403" name="Page 403" element={<Page403 />} />
<Route exact path="/404" name="Page 404" element={<Page404 />} />
<Route exact path="/500" name="Page 500" element={<Page500 />} />
<Route exact path="/login" name="Login" element={<Login />} />
<Route exact path="/logout" name="Logout" element={<Logout />} />
<Route
path="/"
element={
<PrivateRoute>
<DefaultLayout />
</PrivateRoute>
}
>
{routes.map((route, idx) => {
const allowedRoles = route.allowedRoles
const Routecomponent = dynamicImport(route.path)
//console.log('route', route)
//console.log('Routecomponent', Routecomponent)
return (
route.component && (
<Route
key={`route-${idx}`}
path={route.path}
exact={route.exact}
name={route.name}
element={
<PrivateRoute allowedRoles={allowedRoles}>
<Suspense fallback={<Skeleton />}>
<Helmet>
<title>CIPP - {route.name}</title>
</Helmet>
<ErrorBoundary key={route.name}>
<Routecomponent />
</ErrorBoundary>
</Suspense>
</PrivateRoute>
}
/>
<HelmetProvider>
<Suspense fallback={<FullScreenLoading />}>
<Helmet>
<title>CIPP</title>
</Helmet>
<Routes>
<Route exact path="/LogoutRedirect" name="LogoutRedirect" element={<PageLogOut />} />
<Route exact path="/401" name="Page 401" element={<Page401 />} />
<Route exact path="/403" name="Page 403" element={<Page403 />} />
<Route exact path="/404" name="Page 404" element={<Page404 />} />
<Route exact path="/500" name="Page 500" element={<Page500 />} />
<Route exact path="/login" name="Login" element={<Login />} />
<Route exact path="/logout" name="Logout" element={<Logout />} />
<Route
path="/"
element={
<PrivateRoute>
<DefaultLayout />
</PrivateRoute>
}
>
{routes.map((route, idx) => {
const allowedRoles = route.allowedRoles
const Routecomponent = dynamicImport(route.path)
//console.log('route', route)
//console.log('Routecomponent', Routecomponent)
return (
route.component && (
<Route
key={`route-${idx}`}
path={route.path}
exact={route.exact}
name={route.name}
element={
<PrivateRoute allowedRoles={allowedRoles}>
<Suspense fallback={<Skeleton />}>
<ErrorBoundary key={route.name}>
<Routecomponent />
</ErrorBoundary>
</Suspense>
</PrivateRoute>
}
/>
)
)
)
})}
<Route path="/" element={<Navigate to="/home" replace={true} />} />
</Route>
<Route path="*" name="Page 404" element={<Page404 />} />
</Routes>
</Suspense>
})}
<Route path="/" element={<Navigate to="/home" replace={true} />} />
</Route>
<Route path="*" name="Page 404" element={<Page404 />} />
</Routes>
</Suspense>
</HelmetProvider>
</BrowserRouter>
)
}
Expand Down
10 changes: 9 additions & 1 deletion src/components/contentcards/CippButtonCard.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import React from 'react'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { CCard, CCardBody, CCardFooter, CCardHeader, CCardTitle } from '@coreui/react'
import Skeleton from 'react-loading-skeleton'
import PropTypes from 'prop-types'

export default function CippButtonCard({
title,
Expand All @@ -25,3 +25,11 @@ export default function CippButtonCard({
</CCard>
)
}

CippButtonCard.propTypes = {
title: PropTypes.string.isRequired,
titleType: PropTypes.string,
CardButton: PropTypes.element.isRequired,
children: PropTypes.element.isRequired,
isFetching: PropTypes.bool.isRequired,
}
2 changes: 1 addition & 1 deletion src/components/utilities/CippCopyToClipboard.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ function CippCopyToClipboard({ text }) {
<CopyToClipboard text={text} onCopy={() => onCodeCopied()}>
<CButton
color={codeCopied ? 'success' : 'info'}
className="cipp-code-copy-button"
className="cipp-code-copy-button ms-1"
size="sm"
variant="ghost"
>
Expand Down
2 changes: 1 addition & 1 deletion src/hooks/useNavFavouriteCheck.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export const useNavFavouriteCheck = (navigation) => {
var items = []

recentPages.map((path) => {
const item = routes.find((route) => route.path === path)
const item = routes.find((route) => route.path.toLowerCase() === path.toLowerCase())
if (item?.path) {
items.push({
name: item.name,
Expand Down
46 changes: 31 additions & 15 deletions src/layout/DefaultLayout.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ import { toggleSwitcher } from 'src/store/features/switcher'
import { useHotkeys } from 'react-hotkeys-hook'
import { useMediaPredicate } from 'react-media-hook'
import { setRecentPages } from 'src/store/features/app'
import routes from 'src/routes'
import { Helmet } from 'react-helmet-async'

const DefaultLayout = () => {
const preferredTheme = useMediaPredicate('(prefers-color-scheme: dark)') ? 'impact' : 'cyberdrain'
Expand All @@ -17,6 +19,15 @@ const DefaultLayout = () => {
const dispatch = useDispatch()
const location = useLocation()

const [title, setTitle] = useState('CIPP')
useEffect(() => {
let route = routes.find((route) => route.path.toLowerCase() === location.pathname.toLowerCase())
if (route?.name) {
console.log(route)
setTitle(route.name)
}
}, [setTitle, location.pathname])

let theme
if (themePreference === 'default') {
theme = preferredTheme
Expand Down Expand Up @@ -70,24 +81,29 @@ const DefaultLayout = () => {
)

return (
<div>
<FastSwitcherModal />
<ModalRoot />
<Toasts />
<>
<Helmet>
<title>CIPP - {title}</title>
</Helmet>
<div>
<FastSwitcherModal />
<ModalRoot />
<Toasts />

<AppSidebar />
<div className="wrapper d-flex flex-column min-vh-100">
<AppHeader />
<div className="body flex-grow-1 px-xl-3">
<CContainer fluid>
<Suspense fallback={<FullScreenLoading />}>
<Outlet />
</Suspense>
</CContainer>
<AppSidebar />
<div className="wrapper d-flex flex-column min-vh-100">
<AppHeader />
<div className="body flex-grow-1 px-xl-3">
<CContainer fluid>
<Suspense fallback={<FullScreenLoading />}>
<Outlet />
</Suspense>
</CContainer>
</div>
<AppFooter />
</div>
<AppFooter />
</div>
</div>
</>
)
}

Expand Down
15 changes: 12 additions & 3 deletions src/views/cipp/app-settings/SettingsNotifications.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,11 +44,20 @@ export function SettingsNotifications() {
</CButton>
<CButton
className="me-2"
onClick={() => generateTestAlert({ text: 'Test Alert', Severity: 'Alert' })}
onClick={() =>
generateTestAlert({ text: 'Manually Generated Test Alert', Severity: 'Alert' })
}
disabled={generateAlertResult.isFetching}
>
{generateAlertResult.isFetching && <CSpinner size="sm" className="me-2" />}
{generateAlertResult.isSuccess && <FontAwesomeIcon icon={'check'} className="me-2" />}
{generateAlertResult.isFetching ? (
<CSpinner size="sm" className="me-2" />
) : (
<>
{generateAlertResult.isSuccess && (
<FontAwesomeIcon icon={'check'} className="me-2" />
)}
</>
)}
Generate Test Alert
</CButton>
</>
Expand Down
8 changes: 4 additions & 4 deletions src/views/email-exchange/tools/MailTest.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,22 +40,22 @@ const MailTest = () => {
},
{
name: 'SPF',
selector: (row) => row?.AuthResult.filter((x) => x?.Name === 'spf')[0].Status == 'pass',
selector: (row) => row?.AuthResult?.find((x) => x?.Name === 'spf')?.Status == 'pass',
cell: cellBooleanFormatter(),
},
{
name: 'DKIM',
selector: (row) => row?.AuthResult.filter((x) => x?.Name === 'dkim')[0].Status == 'pass',
selector: (row) => row?.AuthResult?.find((x) => x?.Name === 'dkim')?.Status == 'pass',
cell: cellBooleanFormatter(),
},
{
name: 'DMARC',
selector: (row) => row?.AuthResult.filter((x) => x?.Name === 'dmarc')[0].Status == 'pass',
selector: (row) => row?.AuthResult?.find((x) => x?.Name === 'dmarc')?.Status == 'pass',
cell: cellBooleanFormatter(),
},
{
name: 'Comp Auth',
selector: (row) => row?.AuthResult.filter((x) => x?.Name === 'compauth')[0].Status == 'pass',
selector: (row) => row?.AuthResult?.find((x) => x?.Name === 'compauth')?.Status == 'pass',
cell: cellBooleanFormatter(),
},
{
Expand Down
38 changes: 36 additions & 2 deletions src/views/tenant/administration/GraphExplorer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,38 @@ const GraphExplorer = () => {
}, [])

if (graphrequest.isSuccess) {
if (graphrequest.data?.Results?.length > 0) {
if (
graphrequest.data?.Metadata?.Parameters?.$select !== undefined &&
graphrequest.data?.Metadata?.Parameters?.$select !== '' &&
graphrequest.data?.Metadata?.Parameters?.$select !== null
) {
//set columns
if (graphrequest.data?.Metadata?.TenantFilter === 'AllTenants') {
QueryColumns.data.push({
name: 'Tenant',
selector: (row) => row['Tenant'],
sortable: true,
exportSelector: 'Tenant',
cell: cellGenericFormatter(),
})
QueryColumns.data.push({
name: 'CippStatus',
selector: (row) => row['CippStatus'],
sortable: true,
exportSelector: 'CippStatus',
cell: cellGenericFormatter(),
})
}
graphrequest.data?.Metadata?.Parameters?.$select.split(',')?.map((value) =>
QueryColumns.data.push({
name: value,
selector: (row) => row[`${value.toString()}`],
sortable: true,
exportSelector: value,
cell: cellGenericFormatter(),
}),
)
} else if (graphrequest.data?.Results?.length > 0) {
//set columns
Object.keys(graphrequest.data?.Results[0]).map((value) =>
QueryColumns.data.push({
Expand Down Expand Up @@ -121,7 +152,7 @@ const GraphExplorer = () => {
{
name: 'All users with email addresses',
id: '6164e239-0c9a-4a27-9049-6250bf65a3e3',
params: { endpoint: '/users', $select: 'userprincipalname,mail,proxyAddresses', $filter: '' },
params: { endpoint: '/users', $select: 'userPrincipalName,mail,proxyAddresses', $filter: '' },
isBuiltin: true,
},
{
Expand Down Expand Up @@ -248,6 +279,9 @@ const GraphExplorer = () => {
if (params?.$select) {
select = params.$select.map((p) => p.value).join(',')
}
if (params?.name) {
params.QueueNameOverride = 'Graph Explorer - ' + params.name
}
execGraphRequest({
path: 'api/ListGraphRequest',
params: {
Expand Down

0 comments on commit def6083

Please sign in to comment.