Merge pull request #410 from AdamWillford/react

Commit "List Sharepoint Sites" page

src/_nav.js

@@ -272,7 +272,7 @@ const _nav = [
  {
  component: CNavItem,
  name: 'Documentation',
- href: 'https://github.com/KelvinTegelaar/CIPP',
+ href: 'https://cipp.app',
  },
  {
  component: CNavItem,

src/routes.js

@@ -8,6 +8,7 @@ const AddUser = React.lazy(() => import('./views/identity/administration/AddUser
 const EditUser = React.lazy(() => import('./views/identity/administration/EditUser'))
 const ViewUser = React.lazy(() => import('./views/identity/administration/ViewUser'))
 const Groups = React.lazy(() => import('./views/identity/administration/Groups'))
+const EditGroup = React.lazy(() => import('./views/identity/administration/EditGroup'))
 const Devices = React.lazy(() => import('./views/identity/reports/Devices'))
 const MFAReport = React.lazy(() => import('./views/identity/reports/MFAReport'))
 const Tenants = React.lazy(() => import('./views/tenant/administration/Tenants'))
@@ -70,6 +71,8 @@ const routes = [
  { path: '/identity/administration', name: 'Administration' },
  { path: '/identity/administration/users', name: 'Users', component: Users },
  { path: '/identity/administration/groups', name: 'Groups', component: Groups },
+ { path: '/identity/administration/EditGroup', name: 'Edit Group', component: EditGroup },
+
  {
  path: '/identity/administration/offboarding-wizard',
  name: 'Offboarding Wizard',

src/store/modules/identity.js

@@ -52,12 +52,21 @@ const initialState = {
  loading: false,
  loaded: false,
  },
+ sharepoint: {
+ list: [],
+ loading: false,
+ loaded: false,
+ },
 }
 
 const USERS_LOAD = 'users/USERS_LOAD'
 const USERS_LOAD_SUCCESS = 'users/USERS_LOAD_SUCCESS'
 const USERS_LOAD_ERROR = 'users/USERS_LOAD_ERROR'
 
+const SHAREPOINT_LOAD = 'sharepoint/SHAREPOINT_LOAD'
+const SHAREPOINT_LOAD_SUCCESS = 'sharepoint/SHAREPOINT_LOAD_SUCCESS'
+const SHAREPOINT_LOAD_ERROR = 'sharepoint/SHAREPOINT_LOAD_ERROR'
+
 const GROUPS_LOAD = 'groups/GROUPS_LOAD'
 const GROUPS_LOAD_SUCCESS = 'groups/GROUPS_LOAD_SUCCESS'
 const GROUPS_LOAD_ERROR = 'groups/GROUPS_LOAD_ERROR'
@@ -433,6 +442,35 @@ export default function reducer(state = initialState, action = {}) {
  error: action.error,
  },
  }
+ case SHAREPOINT_LOAD:
+ return {
+ ...state,
+ sharepoint: {
+ ...state.sharepoint,
+ loading: true,
+ loaded: false,
+ },
+ }
+ case SHAREPOINT_LOAD_SUCCESS:
+ return {
+ ...state,
+ sharepoint: {
+ ...state.sharepoint,
+ loading: false,
+ loaded: true,
+ list: action.result,
+ },
+ }
+ case SHAREPOINT_LOAD_ERROR:
+ return {
+ ...state,
+ sharepoint: {
+ ...state.sharepoint,
+ loading: false,
+ loaded: false,
+ error: action.error,
+ },
+ }
  default:
  return state
  }
@@ -448,6 +486,16 @@ export function listUsers({ tenant }) {
  }
 }
 
+export function listSharepointSites({ tenant }) {
+ return {
+ types: [SHAREPOINT_LOAD, SHAREPOINT_LOAD_SUCCESS, SHAREPOINT_LOAD_ERROR],
+ promise: (client) =>
+ client
+ .get('/api/ListSites?type=SharePointSiteUsage&Tenantfilter=' + tenant.defaultDomainName)
+ .then((result) => result.data),
+ }
+}
+
 export function listGroups({ tenant }) {
  return {
  types: [GROUPS_LOAD, GROUPS_LOAD_SUCCESS, GROUPS_LOAD_ERROR],

src/views/identity/administration/EditGroup.js

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const EditGroup = () => {
+ return <div>Edit Group</div>
+}
+
+export default EditGroup

src/views/teams-share/sharepoint/SharepointList.js

@@ -1,9 +1,122 @@
-import React from 'react'
+import React, { useEffect } from 'react'
+import { CDropdown, CDropdownItem, CDropdownMenu, CDropdownToggle, CSpinner } from '@coreui/react'
+import TenantSelector from 'src/components/cipp/TenantSelector'
+import BootstrapTable from 'react-bootstrap-table-next'
+import ToolkitProvider, { Search } from 'react-bootstrap-table2-toolkit'
+import paginationFactory from 'react-bootstrap-table2-paginator'
+import { useDispatch, useSelector } from 'react-redux'
+import { Link } from 'react-router-dom'
+import { cilSettings, cilUser } from '@coreui/icons'
+import CIcon from '@coreui/icons-react'
+import { listSharepointSites } from '../../../store/modules/identity'
+
+const { SearchBar } = Search
+
+const pagination = paginationFactory()
+
+const dropdown = (cell, row, rowIndex, formatExtraData) => {
+ return (
+ <CDropdown>
+ <CDropdownToggle color="primary">...</CDropdownToggle>
+ <CDropdownMenu>
+ <CDropdownItem href="#">
+ <Link className="dropdown-item" to="/identity/administration/EditGroup">
+ <CIcon icon={cilSettings} className="me-2" />
+ Edit Site Members
+ </Link>
+ </CDropdownItem>
+ </CDropdownMenu>
+ </CDropdown>
+ )
+}
+
+const columns = [
+ {
+ text: 'Display Name',
+ dataField: 'displayName',
+ sort: true,
+ },
+ {
+ text: 'UPN',
+ dataField: 'UPN',
+ sort: true,
+ },
+ {
+ text: 'Last Active',
+ dataField: 'LastActive',
+ sort: true,
+ },
+ {
+ text: 'File Count',
+ dataField: 'FileCount',
+ sort: true,
+ },
+ {
+ text: 'Used (GB)',
+ dataField: 'UsedGB',
+ sort: true,
+ },
+ {
+ text: 'Allocated',
+ dataField: 'Allocated',
+ },
+ {
+ text: 'URL',
+ dataField: 'URL',
+ sort: true,
+ },
+ {
+ text: 'Action',
+ formatter: dropdown,
+ },
+]
+
+const SharepointList = () => {
+ const dispatch = useDispatch()
+ const tenant = useSelector((state) => state.app.currentTenant)
+ const sharepoint = useSelector((state) => state.identity.sharepoint)
+
+ useEffect(() => {
+ async function load() {
+ if (Object.keys(tenant).length !== 0) {
+ dispatch(listSharepointSites({ tenant: tenant }))
+ }
+ }
+
+ load()
+ }, [])
+
+ const action = (tenant) => {
+ dispatch(listSharepointSites({ tenant: tenant }))
+ }
 
-const SharepointList = (props) => {
  return (
  <div>
- <h3>SharepointList</h3>
+ <TenantSelector action={action} />
+ <hr />
+ <div className="bg-white rounded p-5">
+ <h3>Sharepoint Site List</h3>
+ {Object.keys(tenant).length === 0 && <span>Select a tenant to get started.</span>}
+ {!sharepoint.loaded && sharepoint.loading && <CSpinner />}
+ {sharepoint.loaded && !sharepoint.loading && Object.keys(tenant).length !== 0 && (
+ <ToolkitProvider keyField="url" columns={columns} data={sharepoint.list} search>
+ {(props) => (
+ <div>
+ {/* eslint-disable-next-line react/prop-types */}
+ <SearchBar {...props.searchProps} />
+ <hr />
+ {/*eslint-disable */}
+ <BootstrapTable
+ {...props.baseProps}
+ pagination={pagination}
+ wrapperClasses="table-responsive"
+ />
+ {/*eslint-enable */}
+ </div>
+ )}
+ </ToolkitProvider>
+ )}
+ </div>
  </div>
  )
 }