From e1e06014f38bc5a3878d206e99e352e04f6fccc9 Mon Sep 17 00:00:00 2001 From: Remi Blom-Ohlsen Date: Tue, 5 Nov 2024 13:46:44 +0100 Subject: [PATCH 1/2] Add various fixes and adjustments to ProjectStatus --- .github/workflows/ci-releases.yml | 9 ++-- .../ProjectWebParts/package.json | 2 +- .../ProjectInformation/ProjectInformation.tsx | 2 +- .../Commands/usePublishReport.ts | 4 +- .../Commands/useToolbarItems.tsx | 27 +++++++--- .../EditProjectStatusPanel.tsx | 1 + .../ProjectStatus/Header/useHeader.ts | 10 +--- .../PublishedStatus/PublishedStatus.tsx | 22 +++----- .../src/components/ProjectStatus/reducer.ts | 46 ++++++++++++++++- .../src/components/ProjectStatus/types.ts | 11 ++++ .../ProjectStatus/useProjectStatus.ts | 2 +- .../useProjectStatusDataFetch.ts | 4 +- .../ProjectWebParts/src/loc/nb-no.js | 6 +-- .../src/components/WebPartTitle/index.tsx | 51 ++++++++++--------- 14 files changed, 129 insertions(+), 68 deletions(-) diff --git a/.github/workflows/ci-releases.yml b/.github/workflows/ci-releases.yml index 661ef7ebd..1a9886caa 100644 --- a/.github/workflows/ci-releases.yml +++ b/.github/workflows/ci-releases.yml @@ -4,15 +4,14 @@ on: push: branches: - releases/1.10 - - feat/instrument paths: - - "SharePointFramework/**" - - "Install/**" - - "Templates/**" + - 'SharePointFramework/**' + - 'Install/**' + - 'Templates/**' - .github/workflows/ci-releases.yml env: - SP_URL: "https://puzzlepart.sharepoint.com/sites/pp365" + SP_URL: 'https://puzzlepart.sharepoint.com/sites/pp365' CI_CERT_BASE64: ${{ secrets.CI_CERT_BASE64 }} CI_TENANT: ${{ secrets.CI_TENANT }} CI_CLIENT_ID: ${{ secrets.CI_CLIENT_ID }} diff --git a/SharePointFramework/ProjectWebParts/package.json b/SharePointFramework/ProjectWebParts/package.json index be8c14e23..e95f58b37 100644 --- a/SharePointFramework/ProjectWebParts/package.json +++ b/SharePointFramework/ProjectWebParts/package.json @@ -11,7 +11,7 @@ "watch": "concurrently \"npm run serve\" \"livereload './dist/*.js' -e 'js' -w 250\"", "prewatch": "node node_modules/pzl-spfx-tasks --pre-watch --loglevel silent", "postwatch": "node node_modules/pzl-spfx-tasks --post-watch --loglevel silent", - "serve": "concurrently \"gulp serve-deprecated --locale=nb-no --nobrowser\"", + "serve": "concurrently \"gulp serve-deprecated --locale=nb-no --nobrowser NODE --max-old-space-size=8192\"", "build": "gulp bundle --ship && gulp package-solution --ship", "postversion": "tsc && npm publish", "lint": "eslint --ext .ts,.tsx ./src --color --fix --config ../.eslintrc.yaml && npm run prettier", diff --git a/SharePointFramework/ProjectWebParts/src/components/ProjectInformation/ProjectInformation.tsx b/SharePointFramework/ProjectWebParts/src/components/ProjectInformation/ProjectInformation.tsx index fb7a2002e..e4f8416b6 100644 --- a/SharePointFramework/ProjectWebParts/src/components/ProjectInformation/ProjectInformation.tsx +++ b/SharePointFramework/ProjectWebParts/src/components/ProjectInformation/ProjectInformation.tsx @@ -46,7 +46,7 @@ export const ProjectInformation: FC = (props) => { return ( - + {props.title && }
{context.state.error && ( - new ListMenuItem(formatDate(report.created, true), null) + new ListMenuItem(formatDate(report.publishedDate ?? report.modified, true), null) .setIcon( - report.published ? bundleIcon(CheckboxCheckedFilled, CheckboxCheckedRegular) : '' + report.published + ? bundleIcon(CheckboxCheckedFilled, CheckboxCheckedRegular) + : bundleIcon(DraftsFilled, DraftsRegular) ) .makeCheckable({ name: 'report', - value: formatDate(report.created, true) + value: formatDate(report.publishedDate ?? report.modified, true) }) .setOnClick(() => { SPDataAdapter.portalDataService @@ -123,7 +131,14 @@ export function useToolbarItems() { }) }) ), - { report: [formatDate(state.selectedReport?.created, true)] } + { + report: [ + formatDate( + state.selectedReport?.publishedDate ?? state.selectedReport?.modified, + true + ) + ] + } ), state.selectedReport && new ListMenuItem( diff --git a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/EditStatusPanel/EditProjectStatusPanel.tsx b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/EditStatusPanel/EditProjectStatusPanel.tsx index 9e656d905..5c59330a4 100644 --- a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/EditStatusPanel/EditProjectStatusPanel.tsx +++ b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/EditStatusPanel/EditProjectStatusPanel.tsx @@ -21,6 +21,7 @@ export const EditStatusPanel: FC = () => { dataAdapter={SPDataAdapter} submit={submit} hiddenFields={['Title']} + onLightDismissClick={onDismiss} onDismiss={onDismiss} /> ) diff --git a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/Header/useHeader.ts b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/Header/useHeader.ts index 2903f6563..03d1d8c96 100644 --- a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/Header/useHeader.ts +++ b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/Header/useHeader.ts @@ -1,6 +1,4 @@ -import moment from 'moment' import { useProjectStatusContext } from '../context' -import { format } from '@fluentui/react' import strings from 'ProjectWebPartsStrings' /** @@ -10,13 +8,7 @@ import strings from 'ProjectWebPartsStrings' */ export function useHeader() { const context = useProjectStatusContext() - const formattedDate = context.state.selectedReport - ? moment( - context.state.selectedReport.publishedDate ?? context.state.selectedReport.created - ).format('DD.MM.YYYY') - : null - const title = strings.ProjectInformationStatusReportHeaderText - const description = format(strings.ProjectInformationStatusReportHeaderDescription, formattedDate) + const description = context.state?.reportStatus return { title, description } } diff --git a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/PublishedStatus/PublishedStatus.tsx b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/PublishedStatus/PublishedStatus.tsx index 157f859fa..cdec6efa1 100644 --- a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/PublishedStatus/PublishedStatus.tsx +++ b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/PublishedStatus/PublishedStatus.tsx @@ -1,28 +1,20 @@ -import strings from 'ProjectWebPartsStrings' import { WebPartTitle } from 'pp365-shared-library' import React, { FC } from 'react' import { useProjectStatusContext } from '../context' import styles from '../ProjectStatus.module.scss' import { CheckmarkSquare24Filled } from '@fluentui/react-icons' -import { Shimmer } from '@fluentui/react' export const PublishedStatus: FC = () => { - const { state } = useProjectStatusContext() + const context = useProjectStatusContext() return ( - - {state.selectedReport?.published ? ( -
-
- -
- -
- ) : ( -
- +
+ {context.state.selectedReport?.published && ( +
+
)} - + +
) } diff --git a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/reducer.ts b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/reducer.ts index 142e5e931..4e7df3cc9 100644 --- a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/reducer.ts +++ b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/reducer.ts @@ -3,8 +3,10 @@ import { createAction, createReducer } from '@reduxjs/toolkit' import _ from 'lodash' import { IUserMessageProps } from 'pp365-shared-library/lib/components/UserMessage/types' import { SectionModel, StatusReport } from 'pp365-shared-library/lib/models' -import { getUrlParam } from 'pp365-shared-library/lib/util' +import { formatDate, getUrlParam } from 'pp365-shared-library/lib/util' import { FetchDataResult, IProjectStatusState } from './types' +import strings from 'ProjectWebPartsStrings' +import { format } from '@fluentui/react' /** * `INIT_DATA`: Dispatched by `useProjectStatusDataFetch` when data is loaded @@ -69,6 +71,11 @@ export const OPEN_PANEL = createAction('OPEN */ export const CLOSE_PANEL = createAction('CLOSE_PANEL') +/** + * `REFETCH_DATA`: Dispatched by ... + */ +export const REFETCH_DATA = createAction('REFETCH_DATA') + /** * The initial state for the project status reducer. */ @@ -79,7 +86,8 @@ export const initialState: IProjectStatusState = { columnConfig: [], reportFields: [] }, - persistedSectionData: {} + persistedSectionData: {}, + refetch: new Date().getTime() } /** @@ -98,6 +106,18 @@ const createProjectStatusReducer = createReducer(initialState, { state.mostRecentReportId = _.first(payload.data.reports)?.id ?? 0 state.userHasAdminPermission = payload.data.userHasAdminPermission state.isDataLoaded = true + + if (payload.initialSelectedReport.published) { + state.reportStatus = format( + strings.PublishedStatusReport, + formatDate(payload.initialSelectedReport?.publishedDate) + ) + } else { + state.reportStatus = format( + strings.NotPublishedStatusReport, + formatDate(payload.initialSelectedReport?.modified) + ) + } }, [REPORT_PUBLISHING.type]: (state: IProjectStatusState) => { state.isPublishing = true @@ -112,6 +132,7 @@ const createProjectStatusReducer = createReducer(initialState, { state.data = { ...state.data, reports } state.selectedReport = payload.updatedReport state.userMessage = payload.message + state.refetch = new Date().getTime() state.isPublishing = false }, REPORT_PUBLISH_ERROR: ( @@ -127,6 +148,11 @@ const createProjectStatusReducer = createReducer(initialState, { state.selectedReport = _.first(reports) state.sourceUrl = decodeURIComponent(getUrlParam('Source') ?? '') state.mostRecentReportId = state.selectedReport?.id ?? 0 + state.refetch = new Date().getTime() + state.reportStatus = format( + strings.PublishedStatusReport, + formatDate(state.selectedReport?.publishedDate) + ) }, [REPORT_DELETE_ERROR.type]: ( state: IProjectStatusState, @@ -143,6 +169,18 @@ const createProjectStatusReducer = createReducer(initialState, { ) state.selectedReport = payload.report state.isDataLoaded = true + + if (payload.report.published) { + state.reportStatus = format( + strings.PublishedStatusReport, + formatDate(payload.report?.publishedDate) + ) + } else { + state.reportStatus = format( + strings.NotPublishedStatusReport, + formatDate(payload.report?.modified) + ) + } }, [PERSIST_SECTION_DATA.type]: ( state: IProjectStatusState, @@ -161,6 +199,10 @@ const createProjectStatusReducer = createReducer(initialState, { }, [CLOSE_PANEL.type]: (state: IProjectStatusState) => { state.activePanel = null + state.refetch = new Date().getTime() + }, + [REFETCH_DATA.type]: (state: IProjectStatusState) => { + state.refetch = new Date().getTime() } }) diff --git a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/types.ts b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/types.ts index a23585e92..4c4ea7b3c 100644 --- a/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/types.ts +++ b/SharePointFramework/ProjectWebParts/src/components/ProjectStatus/types.ts @@ -90,6 +90,17 @@ export interface IProjectStatusState extends IBaseWebPartComponentState = async * `useEffect` with an empty dependency array. * * @param props Component properties for `ProjectStatus` + * @param refetch Timestamp for refetch. Changes to this variable refetches the data in `useEffect` * @param dispatch Dispatcer */ export const useProjectStatusDataFetch = ( props: IProjectStatusProps, + refetch: number, dispatch: React.Dispatch ) => { useEffect(() => { fetchData(props).then((data) => dispatch(INIT_DATA(data))) - }, []) + }, [refetch]) } diff --git a/SharePointFramework/ProjectWebParts/src/loc/nb-no.js b/SharePointFramework/ProjectWebParts/src/loc/nb-no.js index c6a5be229..4c8dc0b84 100644 --- a/SharePointFramework/ProjectWebParts/src/loc/nb-no.js +++ b/SharePointFramework/ProjectWebParts/src/loc/nb-no.js @@ -148,7 +148,7 @@ define([], function () { NoPropertiesMessage: 'Det finnes ingen informasjon om prosjektet. Trykk på _Rediger prosjektinformasjon_ for å fortsette.', NoReportsFoundTitle: 'Ingen rapporter funnet', NoStatusReportsMessage: 'Det er ennå ikke rapportert status for prosjektet. Hvis du er eier av området, kan du rapportere status ved å klikke på _Ny statusrapport_ i menyen over.', - NotPublishedStatusReport: 'Ikke publisert', + NotPublishedStatusReport: 'Kladd, sist endret {0}', OpportunityMatrixGroupName: 'Mulighetsmatrise', OverrideHeadersLabel: 'Overstyr overskrifter for {0}x{0}', ParentProjectsGroupName: 'Overordnede prosjekter', @@ -171,7 +171,7 @@ define([], function () { ProjectDeliveriesGroupName: 'Prosjektleveranser (beta)', ProjectInformationDataFetchErrorText: 'En feil oppsto under henting av prosjektinformasjon.', ProjectInformationStatusReportHeaderText: 'Statusrapport', - ProjectInformationStatusReportHeaderDescription: 'Publisert {0}', + ProjectInformationStatusReportHeaderDescription: 'Publisert ({0})', ProjectLabel: 'Prosjekt', ProjectPhasesChangePhaseError: 'En feil oppsto under endring av fase. Vennligst prøv igjen eller kontakt en administrator.', ProjectPhasesFetchDataError: 'Du har ikke tilgang til å se denne webdelen.

Du må enten ha tilgang til porteføljeområdet, eller så må prosjektet være fristilt fra porteføljeområdet.', @@ -186,7 +186,7 @@ define([], function () { ProjecttimelineGroupName: 'Prosjekttidslinje', ProjectTimelineItemInfo: '{0} - prosjektets tidsforløp', ProjectTimelineListInfoText: 'Her listes listeelementene for prosjektet. Her kan du redigere og legge til nye elementer. Dette vil synkroniseres til listen på hubområdet. For å zoome inn/ut i tidslinje: ALT+Musehjul', - PublishedStatusReport: 'Publisert', + PublishedStatusReport: 'Publisert ({0})', PublishReportButtonLabel: 'Publiser', PublishReportButtonDescription: 'Publiserer den valgte statusrapporten.', PublishReportButtonDescriptionNoPermission: 'Du har ikke tilgang til å publisere denne statusrapporten.', diff --git a/SharePointFramework/shared-library/src/components/WebPartTitle/index.tsx b/SharePointFramework/shared-library/src/components/WebPartTitle/index.tsx index a2a28ff3d..c48ac2ed6 100644 --- a/SharePointFramework/shared-library/src/components/WebPartTitle/index.tsx +++ b/SharePointFramework/shared-library/src/components/WebPartTitle/index.tsx @@ -1,10 +1,11 @@ import React, { FC } from 'react' -import { InfoLabel } from '@fluentui/react-components' +import { FluentProvider, IdPrefixProvider, InfoLabel, useId } from '@fluentui/react-components' import { IWebPartTitleProps } from './types' import styles from './WebPartTitle.module.scss' import strings from 'SharedLibraryStrings' import { format } from '@fluentui/react' import { Fluent } from '../Fluent' +import { customLightTheme } from '../../util' /** * Renders a web part title with an optional tooltip. @@ -16,28 +17,32 @@ import { Fluent } from '../Fluent' * @returns The rendered component. */ export const WebPartTitle: FC = (props) => { + const fluentProviderId = useId('fp-webpart-title') + return ( - - - {props.description && ( -
- - } - /> -
- )} -
+ + + + {props?.description && ( +
+ + } + /> +
+ )} +
+
) } From 4a95fee3aac0b61a8c4bf02de487053b3a7e5f32 Mon Sep 17 00:00:00 2001 From: Remi Blom-Ohlsen Date: Tue, 5 Nov 2024 13:53:43 +0100 Subject: [PATCH 2/2] Changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e11d16057..7f9a31ae0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ Sjekk ut [release notes](./releasenotes/1.10.0.md) for høydepunkter og mer deta ### Forbedringer - Mulighetsmatrise har fått samme tilpasningsmuligheter som Risikomatrise, inkluderer overstyring av farger og konfigurasjon +- Forbedret prosjektstatus siden slik at det er tydeligere hva som er publisert og når. Samt bedre indikasjon på kladd. I tillegg er det gjort en rekke forbedringer på opprettelse, publisering og redigering av prosjektstatus, slik at man unngår å måtte laste inn side på nytt for å se endringer alle elementer på siden. [#1574](https://github.com/Puzzlepart/prosjektportalen365/issues/1574) ### Feilrettinger