diff --git a/libs/portals/my-pages/social-insurance-maintenance/src/lib/messages.ts b/libs/portals/my-pages/social-insurance-maintenance/src/lib/messages.ts
index f90f69b54bab..233106923711 100644
--- a/libs/portals/my-pages/social-insurance-maintenance/src/lib/messages.ts
+++ b/libs/portals/my-pages/social-insurance-maintenance/src/lib/messages.ts
@@ -122,9 +122,9 @@ export const m = defineMessages({
id: 'sp.social-insurance-maintenance:income-plan-link-text',
defaultMessage: 'Hvað er tekjuáætlun?',
},
- incomePlanTemporarilyUnavailable: {
- id: 'sp.social-insurance-maintenance:income-plan-temporarily-unavailable',
+ paymentPlanTemporarilyUnavailable: {
+ id: 'sp.social-insurance-maintenance:payment-plan-temporarily-unavailable',
defaultMessage:
- 'Bráðabirgðatekjuáætlun 2025 verður tilbúin seinni part desember',
+ 'Bráðabirgðagreiðsluáætlun 2025 verður tilbúin seinni part desember',
},
})
diff --git a/libs/portals/my-pages/social-insurance-maintenance/src/screens/PaymentPlan/PaymentPlan.tsx b/libs/portals/my-pages/social-insurance-maintenance/src/screens/PaymentPlan/PaymentPlan.tsx
index 35e746a9b6c0..fd05bd116943 100644
--- a/libs/portals/my-pages/social-insurance-maintenance/src/screens/PaymentPlan/PaymentPlan.tsx
+++ b/libs/portals/my-pages/social-insurance-maintenance/src/screens/PaymentPlan/PaymentPlan.tsx
@@ -1,27 +1,76 @@
-import { Box, Divider, Stack, Text } from '@island.is/island-ui/core'
+import {
+ AlertMessage,
+ Box,
+ Divider,
+ Stack,
+ Text,
+} from '@island.is/island-ui/core'
import { useLocale, useNamespaces } from '@island.is/localization'
import { Problem } from '@island.is/react-spa/shared'
import {
- FootNote,
- IntroHeader,
+ IntroWrapper,
LinkButton,
UserInfoLine,
amountFormat,
m as coreMessages,
} from '@island.is/portals/my-pages/core'
import { m } from '../../lib/messages'
-import { useGetPreviousPaymentsQuery } from './PaymentPlan.generated'
import { PaymentGroupTable } from '../../components'
+import { useEffect, useState } from 'react'
+import { useFeatureFlagClient } from '@island.is/react/feature-flags'
+import { useGetPreviousPaymentsLazyQuery } from './PaymentPlan.generated'
const PaymentPlan = () => {
useNamespaces('sp.social-insurance-maintenance')
const { formatMessage } = useLocale()
- const { data, loading, error } = useGetPreviousPaymentsQuery()
+ const [displayPaymentPlan, setDisplayPaymentPlan] = useState(false)
+ const [query, { data, loading, error }] = useGetPreviousPaymentsLazyQuery()
+
+ const featureFlagClient = useFeatureFlagClient()
+ useEffect(() => {
+ const isFlagEnabled = async () => {
+ const ffEnabled = await featureFlagClient.getValue(
+ `isServicePortalPaymentPlan2025Enabled`,
+ false,
+ )
+ if (ffEnabled) {
+ setDisplayPaymentPlan(ffEnabled as boolean)
+ }
+ }
+ isFlagEnabled()
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [])
+
+ useEffect(() => {
+ if (displayPaymentPlan) {
+ query()
+ }
+ }, [displayPaymentPlan])
+
+ if (!displayPaymentPlan) {
+ return (
+
+
+
+ )
+ }
return (
- {
serviceProviderTooltip={formatMessage(
coreMessages.socialInsuranceTooltip,
)}
- />
- {error && !loading ? (
-
- ) : !error && !loading && !data?.socialInsurancePayments ? (
-
- ) : (
- <>
-
-
-
-
-
-
-
+ >
+ {error && !loading ? (
+
+ ) : !error && !loading && !data?.socialInsurancePayments ? (
+
+ ) : (
+ <>
+
+
+
+
+
+
+
-
- {formatMessage(coreMessages.period)}
-
+
+ {formatMessage(coreMessages.period)}
+
-
-
-
-
- {formatMessage(m.maintenanceFooter)}
- {formatMessage(m.maintenanceFooterLink, {
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- link: (str: any) => (
-
- ),
- })}
-
-
- >
- )}
-
+
+
+
+
+ {formatMessage(m.maintenanceFooter)}
+ {formatMessage(m.maintenanceFooterLink, {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ link: (str: any) => (
+
+ ),
+ })}
+
+
+ >
+ )}
+
)
}