show contacts leases in contact list & page

src/contacts/components/ContactReadonly.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import ContactTemplate from "@/contacts/components/templates/ContactTemplate";
 import GreenBox from "@/components/content/GreenBox";
-import type { Contact } from "@/types";
+import type { Contact } from "@/contacts/types";
 type Props = {
   contact: Contact;
 };

src/contacts/components/ContactsListPage.tsx

@@ -27,7 +27,7 @@ import { getRouteById, Routes } from "@/root/routes";
 import { getContactList, getIsFetching } from "@/contacts/selectors";
 import { withContactAttributes } from "@/components/attributes/ContactAttributes";
 import { getUserActiveServiceUnit } from "@/usersPermissions/selectors";
-import type { ContactList } from "@/contacts/types";
+import type { ContactList, ContactRow, ContactsActiveLease } from "@/contacts/types";
 import type { Attributes, Methods as MethodsType } from "types";
 import type { RootState } from "@/root/types";
 import type { UserServiceUnit } from "@/usersPermissions/types";
@@ -346,6 +346,15 @@ class ContactListPage extends Component<Props, State> {
       });
     }
 
+    if (isFieldAllowedToRead(contactAttributes, ContactFieldPaths.ACTIVE_LEASES)) {
+      columns.push({
+        key: 'contacts_active_leases',
+        text: ContactFieldTitles.ACTIVE_LEASES,
+        renderer: (_val: ContactsActiveLease, row: ContactRow) => (row.contacts_active_leases || []).map((activeLease) => activeLease.lease_identifier).join(', ') || '',
+        sortable: false
+      });
+    }
+
     return columns;
   };
   handleSortingChange = ({

src/contacts/components/forms/ContactForm.tsx

@@ -24,6 +24,7 @@ import { getUserActiveServiceUnit } from "@/usersPermissions/selectors";
 import type { Attributes } from "types";
 import type { RootState } from "@/root/types";
 import type { UserServiceUnit } from "@/usersPermissions/types";
+import { ContactsActiveLease } from "@/contacts/types";
 type Props = {
   attributes: Attributes;
   change: (...args: Array<any>) => any;
@@ -302,6 +303,20 @@ class ContactForm extends Component<Props> {
                 </Authorization>
               </Column>
             </Row>
+            <Row>
+            <Column small={12} medium={6} large={4}>
+                <Authorization allow={isFieldAllowedToRead(attributes, ContactFieldPaths.ACTIVE_LEASES)}>
+                  <>
+                  <FormTextTitle uiDataKey={getUiDataContactKey(ContactFieldPaths.ACTIVE_LEASES)}>
+                    {ContactFieldTitles.ACTIVE_LEASES}
+                  </FormTextTitle>
+                  <FormText>
+                    {(initialValues.contacts_active_leases || []).map((val: ContactsActiveLease) => val.lease_identifier).join(', ') || '-'}
+                  </FormText>
+                  </>
+                </Authorization>
+              </Column>
+            </Row>
           </FormWrapperRight>
         </FormWrapper>
       </form>;

src/contacts/components/templates/ContactTemplate.tsx

@@ -13,6 +13,7 @@ import { getFieldOptions, getLabelOfOption, isFieldAllowedToRead } from "@/util/
 import { getAttributes } from "@/contacts/selectors";
 import { ContactTypes } from "@/contacts/enums";
 import type { Attributes } from "types";
+import { ContactsActiveLease } from "@/contacts/types";
 type Props = {
   attributes: Attributes;
   contact: Record<string, any> | null | undefined;
@@ -264,6 +265,18 @@ const ContactTemplate = ({
             </Authorization>
           </Column>
         </Row>
+        <Row>
+          <Column>
+            <Authorization allow={isFieldAllowedToRead(attributes, ContactFieldPaths.ACTIVE_LEASES)}>
+              <>
+              <FormTextTitle uiDataKey={getUiDataContactKey(ContactFieldPaths.ACTIVE_LEASES)}>
+                {ContactFieldTitles.ACTIVE_LEASES}
+              </FormTextTitle>
+              <FormText>{(contact.contacts_active_leases || []).map((val: ContactsActiveLease) => val.lease_identifier).join(', ') || '-'}</FormText>
+              </>
+            </Authorization>
+          </Column>
+        </Row>
       </FormWrapperRight>
     </FormWrapper>;
 };

src/contacts/enums.ts

@@ -17,6 +17,7 @@ export const ContactTypes = {
  * @enum {string}
  */
 export const ContactFieldPaths = {
+  ACTIVE_LEASES: 'contacts_active_leases',
   ADDRESS: 'address',
   ADDRESS_PROTECTION: 'address_protection',
   AUDIT_LOG: 'audit_log',
@@ -51,6 +52,7 @@ export const ContactFieldPaths = {
  * @enum {string}
  */
 export const ContactFieldTitles = {
+  ACTIVE_LEASES: 'Vuokraukset',
   ADDRESS: 'Katuosoite',
   ADDRESS_PROTECTION: 'Turvakielto',
   AUDIT_LOG: 'Muutoshistoria',

src/contacts/types.ts

@@ -41,4 +41,11 @@ export type HideEditModeAction = Action<string, void>;
 export type ShowEditModeAction = Action<string, void>;
 export type HideContactModalAction = Action<string, void>;
 export type ShowContactModalAction = Action<string, void>;
-export type ReceiveContactModalSettingsAction = Action<string, ContactModalSettings>;
+export type ReceiveContactModalSettingsAction = Action<string, ContactModalSettings>;
+export type ContactsActiveLease = {
+  lease_id: number;
+  lease_identifier: string;
+}
+export type ContactRow = {
+  contacts_active_leases?: Array<ContactsActiveLease>;
+}