diff --git a/src/apps/admin/src/lib/models/MobileTableColumn.model.ts b/src/apps/admin/src/lib/models/MobileTableColumn.model.ts
index 4f24b98a4..01229aa43 100644
--- a/src/apps/admin/src/lib/models/MobileTableColumn.model.ts
+++ b/src/apps/admin/src/lib/models/MobileTableColumn.model.ts
@@ -4,5 +4,5 @@
import { TableColumn } from '~/libs/ui'
export interface MobileTableColumn<T> extends TableColumn<T> {
- readonly mobileType?: 'label'
+ readonly mobileType?: 'label' | 'last-value'
}
diff --git a/src/apps/copilots/src/copilots.routes.tsx b/src/apps/copilots/src/copilots.routes.tsx
index d06bd80ba..9d5921211 100644
--- a/src/apps/copilots/src/copilots.routes.tsx
+++ b/src/apps/copilots/src/copilots.routes.tsx
@@ -23,16 +23,19 @@ export const childRoutes = [
route: '/',
},
{
+ authRequired: true,
element: <CopilotsRequests />,
id: 'CopilotRequests',
route: '/requests',
},
{
+ authRequired: true,
element: <CopilotsRequestForm />,
id: 'CopilotRequestForm',
route: '/requests/new',
},
{
+ authRequired: true,
element: <CopilotsRequests />,
id: 'CopilotRequestDetails',
route: '/requests/:requestId',
@@ -54,10 +57,8 @@ export const copilotRoutesMap = childRoutes.reduce((allRoutes, route) => (
export const copilotsRoutes: ReadonlyArray<PlatformRoute> = [
{
- authRequired: true,
children: [
...childRoutes,
-
],
domain: AppSubdomain.copilots,
element: <CopilotsApp />,
diff --git a/src/apps/copilots/src/pages/copilot-opportunity-details/index.tsx b/src/apps/copilots/src/pages/copilot-opportunity-details/index.tsx
index 4caffd9d5..9d1fd8b21 100644
--- a/src/apps/copilots/src/pages/copilot-opportunity-details/index.tsx
+++ b/src/apps/copilots/src/pages/copilot-opportunity-details/index.tsx
@@ -1,5 +1,6 @@
import { FC, useEffect, useState } from 'react'
import { useNavigate, useParams } from 'react-router-dom'
+import moment from 'moment'
import {
ContentLayout,
@@ -60,6 +61,17 @@ const CopilotOpportunityDetails: FC<{}> = () => {
<span className={styles.infoValue}>{opportunity?.status}</span>
</div>
</div>
+ <div className={styles.infoColumn}>
+ <IconOutline.PlayIcon className={styles.icon} />
+ <div className={styles.infoText}>
+ <span className={styles.infoHeading}>Start Date</span>
+ <span className={styles.infoValue}>
+ {moment(opportunity?.startDate)
+ .format('MMM D, YYYY')}
+
+ </span>
+ </div>
+ </div>
<div className={styles.infoColumn}>
<IconOutline.CalendarIcon className={styles.icon} />
<div className={styles.infoText}>
diff --git a/src/apps/copilots/src/pages/copilot-opportunity-list/index.tsx b/src/apps/copilots/src/pages/copilot-opportunity-list/index.tsx
index 927073d6d..9db5aa8bf 100644
--- a/src/apps/copilots/src/pages/copilot-opportunity-list/index.tsx
+++ b/src/apps/copilots/src/pages/copilot-opportunity-list/index.tsx
@@ -13,6 +13,7 @@ import {
import { CopilotOpportunity } from '../../models/CopilotOpportunity'
import { copilotRoutesMap } from '../../copilots.routes'
import { CopilotOpportunitiesResponse, useCopilotOpportunities } from '../../services/copilot-opportunities'
+import { ProjectTypeLabels } from '../../constants'
import styles from './styles.module.scss'
@@ -20,7 +21,12 @@ const tableColumns: TableColumn<CopilotOpportunity>[] = [
{
label: 'Title',
propertyName: 'projectName',
- type: 'text',
+ renderer: (copilotOpportunity: CopilotOpportunity) => (
+ <div className={styles.title}>
+ {copilotOpportunity.projectName}
+ </div>
+ ),
+ type: 'element',
},
{
label: 'Status',
@@ -33,6 +39,7 @@ const tableColumns: TableColumn<CopilotOpportunity>[] = [
type: 'element',
},
{
+ isSortable: false,
label: 'Skills Required',
propertyName: 'skills',
renderer: (copilotOpportunity: CopilotOpportunity) => (
@@ -49,7 +56,12 @@ const tableColumns: TableColumn<CopilotOpportunity>[] = [
{
label: 'Type',
propertyName: 'type',
- type: 'text',
+ renderer: (copilotOpportunity: CopilotOpportunity) => (
+ <div className={styles.type}>
+ {ProjectTypeLabels[copilotOpportunity.projectType]}
+ </div>
+ ),
+ type: 'element',
},
{
label: 'Starting Date',
@@ -62,7 +74,7 @@ const tableColumns: TableColumn<CopilotOpportunity>[] = [
type: 'text',
},
{
- label: 'Hours per week needed',
+ label: 'Hours/Week',
propertyName: 'numHoursPerWeek',
type: 'number',
},
@@ -80,7 +92,10 @@ const CopilotOpportunityList: FC<{}> = () => {
data: opportunities, isValidating, size, setSize,
}: CopilotOpportunitiesResponse = useCopilotOpportunities()
- const tableData = useMemo(() => opportunities, [opportunities])
+ const tableData = useMemo(() => opportunities.map(opportunity => ({
+ ...opportunity,
+ type: ProjectTypeLabels[opportunity.projectType] ?? '',
+ })), [opportunities])
function loadMore(): void {
setSize(size + 1)
@@ -103,6 +118,7 @@ const CopilotOpportunityList: FC<{}> = () => {
moreToLoad={isValidating || opportunities.length > 0}
onLoadMoreClick={loadMore}
onRowClick={handleRowClick}
+ removeDefaultSort
/>
{opportunitiesLoading && (
<LoadingSpinner overlay />
diff --git a/src/apps/copilots/src/pages/copilot-opportunity-list/styles.module.scss b/src/apps/copilots/src/pages/copilot-opportunity-list/styles.module.scss
index 64dbfeba1..c52c395ac 100644
--- a/src/apps/copilots/src/pages/copilot-opportunity-list/styles.module.scss
+++ b/src/apps/copilots/src/pages/copilot-opportunity-list/styles.module.scss
@@ -3,6 +3,7 @@
.skillsContainer {
display: flex;
flex-wrap: wrap;
+ overflow: auto;
gap: 8px;
}
@@ -11,7 +12,7 @@
color: #333;
padding: 4px 8px;
border-radius: 10px;
- white-space: nowrap;
+ white-space: break-spaces;
font-size: 14px;
}
@@ -26,4 +27,8 @@
.activeStatus {
color: green;
-}
\ No newline at end of file
+}
+
+.type {
+ white-space: nowrap;
+}
diff --git a/src/apps/copilots/src/services/copilot-opportunities.ts b/src/apps/copilots/src/services/copilot-opportunities.ts
index 718f0fb92..8cc72745a 100644
--- a/src/apps/copilots/src/services/copilot-opportunities.ts
+++ b/src/apps/copilots/src/services/copilot-opportunities.ts
@@ -71,7 +71,7 @@ export type CopilotOpportunityResponse = SWRResponse<CopilotOpportunity, Copilot
* @returns {CopilotOpportunityResponse} - The response containing the copilot request data.
*/
export const useCopilotOpportunity = (opportunityId?: string): CopilotOpportunityResponse => {
- const url = opportunityId ? buildUrl(`${baseUrl}/copilots/opportunities/${opportunityId}`) : undefined
+ const url = opportunityId ? buildUrl(`${baseUrl}/copilot/opportunity/${opportunityId}`) : undefined
const fetcher = (urlp: string): Promise<CopilotOpportunity> => xhrGetAsync<CopilotOpportunity>(urlp)
.then(copilotOpportunityFactory)
diff --git a/src/libs/ui/lib/components/table/Table.tsx b/src/libs/ui/lib/components/table/Table.tsx
index 161d72d58..af302b8b1 100644
--- a/src/libs/ui/lib/components/table/Table.tsx
+++ b/src/libs/ui/lib/components/table/Table.tsx
@@ -102,6 +102,11 @@ const Table: <T extends { [propertyName: string]: any }>(props: TableProps<T>) =
function toggleSort(fieldName: string): void {
+ const col = props.columns.find(c => c.propertyName === fieldName)
+
+ // if sortable is false, we return
+ if (col?.isSortable === false) return
+
// if we don't have anything to sort by, we shouldn't be here
if (!sort && !props.removeDefaultSort) {
return
@@ -129,7 +134,7 @@ const Table: <T extends { [propertyName: string]: any }>(props: TableProps<T>) =
const headerRow: Array<JSX.Element> = displayColumns
.map((col, index) => {
- const isSortable: boolean = !!col.propertyName
+ const isSortable: boolean = !!col.propertyName && col.isSortable !== false
const isCurrentlySorted: boolean = isSortable && col.propertyName === sort?.fieldName
const colorClass: string = isCurrentlySorted ? 'black-100' : 'black-60'
const sortableClass: string | undefined = isSortable ? styles.sortable : undefined
@@ -151,7 +156,7 @@ const Table: <T extends { [propertyName: string]: any }>(props: TableProps<T>) =
</Tooltip>
</div>
)}
- {!props.disableSorting && (
+ {!props.disableSorting && isSortable && (
<TableSort
iconClass={colorClass}
isCurrentlySorted={isCurrentlySorted}
diff --git a/src/libs/ui/lib/components/table/table-column.model.ts b/src/libs/ui/lib/components/table/table-column.model.ts
index c5090fd9b..3421f9a11 100644
--- a/src/libs/ui/lib/components/table/table-column.model.ts
+++ b/src/libs/ui/lib/components/table/table-column.model.ts
@@ -11,4 +11,5 @@ export interface TableColumn<T> {
readonly isExpand?: boolean
readonly colSpan?: number
readonly type: TableCellType
+ readonly isSortable?: boolean
}
diff --git a/src/libs/ui/lib/components/table/table-functions/table.functions.ts b/src/libs/ui/lib/components/table/table-functions/table.functions.ts
index 4aacef0d8..6c98b2857 100644
--- a/src/libs/ui/lib/components/table/table-functions/table.functions.ts
+++ b/src/libs/ui/lib/components/table/table-functions/table.functions.ts
@@ -53,11 +53,11 @@ export function getSorted<T extends { [propertyName: string]: any }>(
if (sortColumn.type === 'date') {
return sortedData
- .sort((a: T, b: T) => sortNumbers(
- (a[sort.fieldName] as Date).getTime(),
- (b[sort.fieldName] as Date).getTime(),
- sort.direction,
- ))
+ .sort((a: T, b: T) => {
+ const aDate = new Date(a[sort.fieldName])
+ const bDate = new Date(b[sort.fieldName])
+ return sortNumbers(aDate.getTime(), bDate.getTime(), sort.direction)
+ })
}
return sortedData