From 5b52a6e8d17c5beca090e753439770860415b52f Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Mon, 14 Apr 2025 14:22:32 +0300
Subject: [PATCH] feat: predefined values more organized (#9752)

---
 .../LegalValueLabel/LegalValueLabel.tsx             | 13 ++++++++++---
 .../RestrictiveLegalValues.tsx                      | 13 ++++++-------
 2 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/LegalValueLabel/LegalValueLabel.tsx b/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/LegalValueLabel/LegalValueLabel.tsx
index c121066401..022f90d0ff 100644
--- a/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/LegalValueLabel/LegalValueLabel.tsx
+++ b/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/LegalValueLabel/LegalValueLabel.tsx
@@ -7,6 +7,7 @@ import {
 import type React from 'react';
 import { FormControlLabel } from '@mui/material';
 import { Highlighter } from 'component/common/Highlighter/Highlighter';
+import { Truncator } from 'component/common/Truncator/Truncator';
 
 interface ILegalValueTextProps {
     legal: ILegalValue;
@@ -35,9 +36,15 @@ export const LegalValueLabel = ({
                             </Highlighter>
                         </StyledValue>
                         <StyledDescription>
-                            <Highlighter search={filter}>
-                                {legal.description}
-                            </Highlighter>
+                            <Truncator
+                                title={legal.description}
+                                arrow
+                                lines={1}
+                            >
+                                <Highlighter search={filter}>
+                                    {legal.description}
+                                </Highlighter>
+                            </Truncator>
                         </StyledDescription>
                     </>
                 }
diff --git a/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/RestrictiveLegalValues/RestrictiveLegalValues.tsx b/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/RestrictiveLegalValues/RestrictiveLegalValues.tsx
index 991b34052a..9bf64dd6e7 100644
--- a/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/RestrictiveLegalValues/RestrictiveLegalValues.tsx
+++ b/frontend/src/component/common/NewConstraintAccordion/ConstraintAccordionEdit/ConstraintAccordionEditBody/RestrictiveLegalValues/RestrictiveLegalValues.tsx
@@ -51,8 +51,8 @@ export const getIllegalValues = (
 };
 
 const StyledValuesContainer = styled('div')(({ theme }) => ({
-    display: 'flex',
-    flexWrap: 'wrap',
+    display: 'grid',
+    gridTemplateColumns: 'repeat(auto-fill, 120px)',
     gap: theme.spacing(1),
     padding: theme.spacing(2),
     border: `1px solid ${theme.palette.divider}`,
@@ -178,7 +178,9 @@ export const RestrictiveLegalValues = ({
                                 Boolean(values)
                             }
                             show={
-                                <StyledValuesContainer sx={{ border: 0 }}>
+                                <StyledValuesContainer
+                                    sx={{ border: 0, paddingTop: 0 }}
+                                >
                                     {values.map((value) => {
                                         return (
                                             <Chip
@@ -191,13 +193,10 @@ export const RestrictiveLegalValues = ({
                                 </StyledValuesContainer>
                             }
                         />
-                        <ConstraintValueSearch
-                            filter={filter}
-                            setFilter={setFilter}
-                        />
                     </>
                 }
             />
+            <ConstraintValueSearch filter={filter} setFilter={setFilter} />
             <StyledValuesContainer>
                 {filteredValues.map((match) => (
                     <LegalValueLabel