chore(inao-cem): Refactor custom components and fetch tax data (#17195)

* chore: houskeeping, split up files and make code more radable

* chore: refactor out custom components

* fix: remove imports from codeowners

* chore: remove console.log

* chore: add loading state

* chore: simplify logic

* fix: coderabbit comments

* fix: match indentation to lint

* fix: codeowners

* chore: add space to match indentation

* chore: remove the inao folder from codeowners

* chore: .

* fix: typo in path

* fix: indentation

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

libs/application/templates/inao/financial-statement-cemetery/src/dataProviders/index.ts

@@ -1,10 +1,7 @@
 import { defineTemplateApi } from '@island.is/application/types'
 import { UserProfileApi } from '@island.is/application/types'
-
-export {
-  NationalRegistryUserApi,
-  IdentityApi as IdentityApiProvider,
-} from '@island.is/application/types'
+import { IdentityApi } from '@island.is/application/types'
+export { NationalRegistryUserApi } from '@island.is/application/types'
 
 export const CurrentUserTypeProvider = defineTemplateApi({
   action: 'getUserType',
@@ -16,3 +13,9 @@ export const UserInfoApi = UserProfileApi.configure({
     catchMock: true,
   },
 })
+
+export const IdentityApiProvider = IdentityApi.configure({
+  params: {
+    includeActorInfo: true,
+  },
+})

libs/application/templates/inao/financial-statement-cemetery/src/fields/CemeteryOverview/AboutOverview.tsx

@@ -1,61 +1,61 @@
 import { GridColumn, GridRow } from '@island.is/island-ui/core'
-import { formatPhoneNumber } from '@island.is/application/ui-components'
-
 import { format as formatNationalId } from 'kennitala'
-import { m } from '../../lib/messages'
 import { sectionColumn } from './overviewStyles.css'
-import { FinancialStatementCemetery } from '../../lib/dataSchema'
 import { ValueLine } from './ValueLine'
+import { FormValue } from '@island.is/application/types'
+import { getAboutOverviewNumbers } from '../../utils/overviewUtils'
+import { m } from '../../lib/messages'
 
-export const AboutOverview = ({
-  answers,
-}: {
-  answers: FinancialStatementCemetery
-}) => {
+type Props = {
+  answers: FormValue
+}
+
+export const AboutOverview = ({ answers }: Props) => {
+  const {
+    fullName,
+    nationalId,
+    powerOfAttorneyName,
+    powerOfAttorneyNationalId,
+    email,
+    phoneNumber,
+  } = getAboutOverviewNumbers(answers)
   return (
     <>
       <GridRow>
         <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
-          <ValueLine label={m.fullName} value={answers.about.fullName} />
+          <ValueLine label={m.fullName} value={fullName} />
         </GridColumn>
         <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
           <ValueLine
             label={m.nationalId}
-            value={
-              answers.about?.nationalId
-                ? formatNationalId(answers.about.nationalId)
-                : '-'
-            }
+            value={nationalId ? nationalId : '-'}
           />
         </GridColumn>
       </GridRow>
       <GridRow>
-        {answers.about.powerOfAttorneyName ? (
+        {powerOfAttorneyName ? (
           <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
             <ValueLine
               label={m.powerOfAttorneyName}
-              value={answers.about.powerOfAttorneyName}
+              value={powerOfAttorneyName}
             />
           </GridColumn>
         ) : null}
-        {answers.about.powerOfAttorneyNationalId ? (
+        {powerOfAttorneyNationalId ? (
           <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
             <ValueLine
               label={m.powerOfAttorneyNationalId}
-              value={formatNationalId(answers.about.powerOfAttorneyNationalId)}
+              value={powerOfAttorneyNationalId}
             />
           </GridColumn>
         ) : null}
       </GridRow>
       <GridRow>
         <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
-          <ValueLine label={m.email} value={answers.about.email} />
+          <ValueLine label={m.email} value={email} />
         </GridColumn>
         <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
-          <ValueLine
-            label={m.phoneNumber}
-            value={formatPhoneNumber(answers.about.phoneNumber)}
-          />
+          <ValueLine label={m.phoneNumber} value={phoneNumber} />
         </GridColumn>
       </GridRow>
     </>

libs/application/templates/inao/financial-statement-cemetery/src/fields/CemeteryOverview/CapitalNumbersOverview.tsx

@@ -1,18 +1,19 @@
 import { Box, GridColumn, GridRow, Text } from '@island.is/island-ui/core'
-
-import { m } from '../../lib/messages'
 import { ValueLine } from './ValueLine'
 import { sectionColumn, starterColumnStyle } from './overviewStyles.css'
 import { useLocale } from '@island.is/localization'
-import { FinancialStatementCemetery } from '../../lib/dataSchema'
-import { formatCurrency } from '../../utils/helpers'
+import { FormValue } from '@island.is/application/types'
+import { getCapitalNumbersOverviewNumbers } from '../../utils/overviewUtils'
+import { m } from '../../lib/messages'
+
+type Props = {
+  answers: FormValue
+}
 
-export const CapitalNumberOverview = ({
-  answers,
-}: {
-  answers: FinancialStatementCemetery
-}) => {
+export const CapitalNumberOverview = ({ answers }: Props) => {
   const { formatMessage } = useLocale()
+  const { capitalIncome, capitalCost, totalCapital } =
+    getCapitalNumbersOverviewNumbers(answers)
   return (
     <>
       <Box className={starterColumnStyle}>
@@ -22,27 +23,17 @@ export const CapitalNumberOverview = ({
       </Box>
       <GridRow>
         <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
-          <ValueLine
-            label={m.capitalIncome}
-            value={formatCurrency(answers.capitalNumbers.capitalIncome)}
-          />
+          <ValueLine label={m.capitalIncome} value={capitalIncome} />
         </GridColumn>
-        {answers.capitalNumbers?.capitalCost ? (
+        {capitalCost ? (
           <GridColumn span={['12/12', '6/12']} className={sectionColumn}>
-            <ValueLine
-              label={m.capitalCost}
-              value={formatCurrency(answers.capitalNumbers.capitalCost)}
-            />
+            <ValueLine label={m.capitalCost} value={capitalCost} />
           </GridColumn>
         ) : null}
       </GridRow>
       <GridRow>
         <GridColumn className={sectionColumn}>
-          <ValueLine
-            isTotal
-            label={m.totalCapital}
-            value={formatCurrency(answers.capitalNumbers?.total)}
-          />
+          <ValueLine isTotal label={m.totalCapital} value={totalCapital} />
         </GridColumn>
       </GridRow>
     </>