Use locale strings throughout solution

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProjectProvision.tsx

@@ -75,9 +75,9 @@ export const ProjectProvision: FC<IProjectProvisionProps> = (props) => {
                     setState({ showProvisionSettings: true })
                   }}
                 >
-                  Innstillinger
+                  {strings.Provision.SettingsMenuLabel}
                 </MenuItem>
-                <MenuItem>{strings.Provision.IdeaMenuLabel}</MenuItem>
+                <MenuItem disabled>{strings.Provision.IdeaMenuLabel}</MenuItem>
               </MenuList>
             </MenuPopover>
           </Menu>

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionDrawer/ProvisionDrawer.tsx

@@ -38,7 +38,6 @@ import { useProvisionDrawer } from './useProvisionDrawer'
 import styles from './ProvisionDrawer.module.scss'
 import { User } from './User'
 import { Guest } from './Guest'
-import { DebugModel } from './DebugModel'
 
 export const ProvisionDrawer = (props: { toast: any }) => {
   const {
@@ -60,9 +59,6 @@ export const ProvisionDrawer = (props: { toast: any }) => {
     fluentProviderId
   } = useProvisionDrawer()
 
-  // console.log(siteExists, context.column.get('name'), !!context.column.get('name').length, context.column.get('name').length)
-  // console.log('alias', context.column.get('alias'))
-
   return (
     <IdPrefixProvider value={fluentProviderId}>
       <FluentProvider theme={customLightTheme}>
@@ -170,8 +166,8 @@ export const ProvisionDrawer = (props: { toast: any }) => {
                     validationMessage={
                       context.column.get('name').length
                         ? siteExists
-                          ? 'Navnet oppgitt er ikke ledig. Prøv å endre navnet.'
-                          : 'Navnet er ledig'
+                          ? strings.Provision.SiteNameValidationErrorMessage
+                          : strings.Provision.SiteNameValidationSuccessMessage
                         : strings.Provision.SiteNameFieldDescription
                     }
                   >
@@ -294,7 +290,7 @@ export const ProvisionDrawer = (props: { toast: any }) => {
                 <DrawerHeaderTitle>{strings.Provision.DrawerLevel2HeaderText}</DrawerHeaderTitle>
                 <p>{strings.Provision.DrawerLevel2DescriptionText}</p>
                 <div className={styles.content}>
-                  {DEBUG && <DebugModel />}
+                  {/* {DEBUG && <DebugModel />} */}
                   <FieldContainer
                     iconName='PeopleTeam'
                     label={strings.Provision.TeamifyFieldLabel}

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionSettings/Commands/Commands.tsx

@@ -5,6 +5,7 @@ import React, { FC, useContext } from 'react'
 import styles from './Commands.module.scss'
 import { useCommands } from './useCommands'
 import { ProjectProvisionContext } from 'components/ProjectProvision/context'
+import strings from 'PortfolioWebPartsStrings'
 
 export const Commands: FC = () => {
   const context = useContext(ProjectProvisionContext)
@@ -16,9 +17,9 @@ export const Commands: FC = () => {
           className={styles.searchBox}
           disabled={context.state.loading || _.isEmpty(context.state.requests)}
           value={context.state.searchTerm}
-          placeholder='Søk i innstillinger'
-          aria-label='Søk i innstillinger'
-          title='Søk i innstillinger'
+          placeholder={strings.Provision.SettingsSearchLabel}
+          aria-label={strings.Provision.SettingsSearchLabel}
+          title={strings.Provision.SettingsSearchLabel}
           size='large'
           onChange={(_, { value }) => context.setState({ searchTerm: value })}
           contentAfter={{

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionSettings/Commands/useCommands.tsx

@@ -1,6 +1,7 @@
 import { ListMenuItem } from 'pp365-shared-library'
 import { useContext } from 'react'
 import { ProjectProvisionContext } from 'components/ProjectProvision/context'
+import strings from 'PortfolioWebPartsStrings'
 
 /**
  * Component logic hook for `Commands`. This hook is responsible for
@@ -10,7 +11,7 @@ export function useCommands() {
   const context = useContext(ProjectProvisionContext)
 
   const toolbarItems = [
-    new ListMenuItem(null, 'Oppdater').setIcon('ArrowSync').setOnClick(() => {
+    new ListMenuItem(null, strings.Provision.UpdateLabel).setIcon('ArrowSync').setOnClick(() => {
       context.setState({
         isRefetching: true,
         refetch: new Date().getTime()

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionSettings/ProvisionSettings.tsx

@@ -22,6 +22,7 @@ import { useProvisionSettings } from './useProvisionSettings'
 import { customLightTheme } from 'pp365-shared-library'
 import { Commands } from './Commands'
 import styles from './ProvisionSettings.module.scss'
+import strings from 'PortfolioWebPartsStrings'
 
 export const ProvisionSettings = (props: { toast: any }) => {
   const {
@@ -53,17 +54,14 @@ export const ProvisionSettings = (props: { toast: any }) => {
                   </DialogTrigger>
                 }
               >
-                Innstillinger for Bestillingsportalen
+                {strings.Provision.SettingsDialogTitle}
               </DialogTitle>
               <DialogContent className={styles.content}>
-                <div>
-                  Her har du en oversikt over alle innstillinger for Bestillingsportalen. Du kan
-                  endre innstillinger ved å klikke på redigeringsknappen til høyre for hver rad.
-                </div>
+                <div>{strings.Provision.SettingsDialogDescription}</div>
                 {context.state.isRefetching ? (
                   <Spinner
                     size='extra-tiny'
-                    label='Oppdaterer og henter innstillinger...'
+                    label={strings.Provision.SettingsDialogSpinnerLabel}
                     style={{ padding: 10, minHeight: '20px' }}
                   />
                 ) : (
@@ -91,11 +89,11 @@ export const ProvisionSettings = (props: { toast: any }) => {
                     <>
                       {context.state.searchTerm ? (
                         <div className={styles.message}>
-                          Ingen innstillinger samsvarer med søket.
+                          {strings.Provision.SettingsDialogNoSearchResultsLabel}
                         </div>
                       ) : (
                         <div className={styles.message}>
-                          Det finnes ingen innstillinger for Bestillingsportalen.
+                          {strings.Provision.SettingsDialogNoResultsLabel}
                         </div>
                       )}
                     </>

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionSettings/useColumns.tsx

@@ -11,6 +11,7 @@ import styles from './ProvisionSettings.module.scss'
 import { ProjectProvisionContext } from '../context'
 import { getFluentIcon } from 'pp365-shared-library'
 import { IRequestSettingsItem } from './types'
+import strings from 'PortfolioWebPartsStrings'
 
 export const useColumns = (toast: any): TableColumnDefinition<IRequestSettingsItem>[] => {
   const context = useContext(ProjectProvisionContext)
@@ -25,7 +26,7 @@ export const useColumns = (toast: any): TableColumnDefinition<IRequestSettingsIt
         return null
       },
       renderHeaderCell: () => {
-        return 'Innstilling'
+        return strings.Provision.SettingLabel
       },
       renderCell: (setting) => {
         return (
@@ -46,7 +47,7 @@ export const useColumns = (toast: any): TableColumnDefinition<IRequestSettingsIt
         return null
       },
       renderHeaderCell: () => {
-        return 'Beskrivelse'
+        return strings.Provision.DescriptionLabel
       },
       renderCell: (setting) => {
         return (
@@ -67,7 +68,7 @@ export const useColumns = (toast: any): TableColumnDefinition<IRequestSettingsIt
         return null
       },
       renderHeaderCell: () => {
-        return 'Verdi'
+        return strings.Provision.ValueLabel
       },
       renderCell: (setting) => {
         if (
@@ -93,7 +94,7 @@ export const useColumns = (toast: any): TableColumnDefinition<IRequestSettingsIt
               appearance='subtle'
               onClick={() => console.log(`edit request ${setting.title}`)} // Add edit functionality for settings
               disabled
-              title='Rediger'
+              title={strings.Provision.EditLabel}
               icon={getFluentIcon('Edit')}
             />
           </div>

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionSettings/useProvisionSettings.ts

@@ -49,7 +49,7 @@ export function useProvisionSettings(toast: any) {
    *
    * @param settings - settings
    */
-  function filtersettings(settings: any[]) {
+  function filterSettings(settings: any[]) {
     return settings.filter((request) =>
       _.any(Object.values(request), (value) => {
         if (Array.isArray(value) && value.length > 0) {
@@ -68,7 +68,7 @@ export function useProvisionSettings(toast: any) {
   }
 
   const settings = !context.state.loading
-    ? filtersettings(context.state.settings)
+    ? filterSettings(context.state.settings)
     : context.state.settings
 
   const fluentProviderId = useId('fp-provision-settings')

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionStatus/Commands/Commands.tsx

@@ -5,6 +5,7 @@ import React, { FC, useContext } from 'react'
 import styles from './Commands.module.scss'
 import { useCommands } from './useCommands'
 import { ProjectProvisionContext } from 'components/ProjectProvision/context'
+import strings from 'PortfolioWebPartsStrings'
 
 export const Commands: FC = () => {
   const context = useContext(ProjectProvisionContext)
@@ -16,9 +17,9 @@ export const Commands: FC = () => {
           className={styles.searchBox}
           disabled={context.state.loading || _.isEmpty(context.state.requests)}
           value={context.state.searchTerm}
-          placeholder='Søk i bestillinger'
-          aria-label='Søk i bestillinger'
-          title='Søk i bestillinger'
+          placeholder={strings.Provision.StatusSearchLabel}
+          aria-label={strings.Provision.StatusSearchLabel}
+          title={strings.Provision.StatusSearchLabel}
           size='large'
           onChange={(_, { value }) => context.setState({ searchTerm: value })}
           contentAfter={{

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionStatus/Commands/useCommands.tsx

@@ -17,7 +17,7 @@ export function useCommands() {
       .setOnClick(() => {
         // TODO: Add filter options for statuses
       }),
-    new ListMenuItem(null, 'Oppdater').setIcon('ArrowSync').setOnClick(() => {
+    new ListMenuItem(null, strings.Provision.UpdateLabel).setIcon('ArrowSync').setOnClick(() => {
       context.setState({
         isRefetching: true,
         refetch: new Date().getTime()

SharePointFramework/PortfolioWebParts/src/components/ProjectProvision/ProvisionStatus/ProvisionStatus.tsx

@@ -22,6 +22,7 @@ import { useProvisionStatus } from './useProvisionStatus'
 import { customLightTheme } from 'pp365-shared-library'
 import { Commands } from './Commands'
 import styles from './ProvisionStatus.module.scss'
+import strings from 'PortfolioWebPartsStrings'
 
 export const ProvisionStatus = (props: { toast: any }) => {
   const {
@@ -53,18 +54,14 @@ export const ProvisionStatus = (props: { toast: any }) => {
                   </DialogTrigger>
                 }
               >
-                Mine bestillinger
+                {strings.Provision.StatusDialogTitle}
               </DialogTitle>
               <DialogContent className={styles.content}>
-                <div>
-                  Her kan du se status på dine bestillinger, hvilke områdetype, status og dato for
-                  bestillingen. Det er også mulig å redigere og slette bestillinger som ikke er
-                  sendt inn.
-                </div>
+                <div>{strings.Provision.StatusDialogDescription}</div>
                 {context.state.isRefetching ? (
                   <Spinner
                     size='extra-tiny'
-                    label='Oppdaterer og henter bestillinger...'
+                    label={strings.Provision.StatusDialogSpinnerLabel}
                     style={{ padding: 10 }}
                   />
                 ) : (
@@ -92,11 +89,11 @@ export const ProvisionStatus = (props: { toast: any }) => {
                     <>
                       {context.state.searchTerm ? (
                         <div className={styles.message}>
-                          Ingen bestillinger samsvarer med søket.
+                          {strings.Provision.StatusDialogNoSearchResultsLabel}
                         </div>
                       ) : (
                         <div className={styles.message}>
-                          Du har ingen bestillinger, opprett en ny bestilling for å se status her.
+                          {strings.Provision.StatusDialogNoResultsLabel}
                         </div>
                       )}
                     </>