From 64484375e37b43018f26720b043df082ec85adf6 Mon Sep 17 00:00:00 2001
From: Radoslav Zeman <19418224+radoslavzeman@users.noreply.github.com>
Date: Thu, 19 Sep 2024 14:43:23 +0200
Subject: [PATCH] #1344 Display File List always as rows variant (#1345)

* #1344 Display File List always as rows variant

* #1344 Fix ts error
---
 next/components/common/FileList/FileList.tsx  | 60 ++++---------------
 next/components/sections/AccordionSection.tsx | 10 +---
 next/components/sections/FileListSection.tsx  |  3 +-
 3 files changed, 16 insertions(+), 57 deletions(-)

diff --git a/next/components/common/FileList/FileList.tsx b/next/components/common/FileList/FileList.tsx
index 48ebb1949..af34ab3e7 100644
--- a/next/components/common/FileList/FileList.tsx
+++ b/next/components/common/FileList/FileList.tsx
@@ -2,8 +2,7 @@ import { Typography } from '@bratislava/component-library'
 import cn from 'utils/cn'
 
 import FileCardWrapper from '@/components/cards/FileCardWrapper'
-import ResponsiveCarousel from '@/components/common/Carousel/ResponsiveCarousel'
-import { Enum_Componentsectionsfilelist_Variant, FileItemBlockFragment } from '@/services/graphql'
+import { FileItemBlockFragment } from '@/services/graphql'
 
 export type TFileSection = {
   category?: string
@@ -16,7 +15,6 @@ export type FileListProps = {
   className?: string
   fileSections?: TFileSection[]
   hideCategory?: boolean
-  variantFileList?: Enum_Componentsectionsfilelist_Variant
 }
 
 /**
@@ -24,14 +22,7 @@ export type FileListProps = {
  */
 
 // TODO remove grouping by category
-const FileList = ({
-  className,
-  title,
-  text,
-  fileSections,
-  hideCategory,
-  variantFileList,
-}: FileListProps) => {
+const FileList = ({ className, title, text, fileSections, hideCategory }: FileListProps) => {
   return (
     <div className={cn('', className)}>
       {title || text ? (
@@ -48,43 +39,18 @@ const FileList = ({
             {fileSection.category && !hideCategory && (
               <Typography type="h2">{fileSection.category}</Typography>
             )}
-            {variantFileList === 'rows' && (
-              <ul className="mt-4 flex flex-col rounded-lg border-2 py-2 lg:mt-6">
-                {fileSection?.files.map((file, fileIndex) => (
-                  // eslint-disable-next-line react/no-array-index-key
-                  <li key={fileIndex} className="w-full">
-                    <FileCardWrapper
-                      fileItem={file}
-                      variant={variantFileList}
-                      hideBottomDivider={fileIndex === fileSection.files.length - 1}
-                    />
-                  </li>
-                ))}
-              </ul>
-            )}
-            {variantFileList === 'grid' && (
-              <div>
-                <div
-                  className="mt-6 hidden grid-cols-3 gap-8 lg:grid"
-                  data-cy="file-wrapper-desktop"
-                >
-                  {fileSection?.files.map((file, fileIndex) => (
-                    // eslint-disable-next-line react/no-array-index-key
-                    <div key={fileIndex} className="w-full">
-                      <FileCardWrapper fileItem={file} />
-                    </div>
-                  ))}
-                </div>
-                <div className="lg:hidden" data-cy="file-wrapper-mobile">
-                  <ResponsiveCarousel
-                    items={fileSection?.files.map((file, fileIndex) => (
-                      // eslint-disable-next-line react/no-array-index-key
-                      <FileCardWrapper key={fileIndex} fileItem={file} />
-                    ))}
+            <ul className="mt-4 flex flex-col rounded-lg border-2 py-2 lg:mt-6">
+              {fileSection?.files.map((file, fileIndex) => (
+                // eslint-disable-next-line react/no-array-index-key
+                <li key={fileIndex} className="w-full">
+                  <FileCardWrapper
+                    fileItem={file}
+                    variant="rows"
+                    hideBottomDivider={fileIndex === fileSection.files.length - 1}
                   />
-                </div>
-              </div>
-            )}
+                </li>
+              ))}
+            </ul>
           </div>
         )
       })}
diff --git a/next/components/sections/AccordionSection.tsx b/next/components/sections/AccordionSection.tsx
index 396c201ab..499d0f212 100644
--- a/next/components/sections/AccordionSection.tsx
+++ b/next/components/sections/AccordionSection.tsx
@@ -7,10 +7,7 @@ import FileList from '@/components/common/FileList/FileList'
 import Institution from '@/components/common/Institution_Deprecated/Institution_Deprecated'
 import NarrowText from '@/components/common/NarrowText/NarrowText'
 import Markdown from '@/components/formatting/Markdown/Markdown'
-import {
-  AccordionSectionFragment,
-  Enum_Componentsectionsfilelist_Variant,
-} from '@/services/graphql'
+import { AccordionSectionFragment } from '@/services/graphql'
 import { isDefined } from '@/utils/isDefined'
 import { groupByCategory, parsePageLink } from '@/utils/pageUtils_Deprecated'
 import { isPresent } from '@/utils/utils'
@@ -71,10 +68,7 @@ const AccordionSection = ({ section }: AccordionSectionProps) => {
                     <Markdown content={item.content} variant="accordion" />
                   </NarrowText>
                   {item.fileList?.length ? (
-                    <FileList
-                      fileSections={[{ files: item.fileList.filter(isDefined) }]}
-                      variantFileList={Enum_Componentsectionsfilelist_Variant.Rows}
-                    />
+                    <FileList fileSections={[{ files: item.fileList.filter(isDefined) }]} />
                   ) : null}
                   {link?.url && link.title && (
                     <Button href={link.url || '#'} variant="category-link">
diff --git a/next/components/sections/FileListSection.tsx b/next/components/sections/FileListSection.tsx
index 6d3eb6d40..a449b5556 100644
--- a/next/components/sections/FileListSection.tsx
+++ b/next/components/sections/FileListSection.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
 import FileList from '@/components/common/FileList/FileList'
-import { Enum_Componentsectionsfilelist_Variant, FileListSectionFragment } from '@/services/graphql'
+import { FileListSectionFragment } from '@/services/graphql'
 import { groupByCategoryFileList } from '@/utils/pageUtils_Deprecated'
 import { isPresent } from '@/utils/utils'
 
@@ -16,7 +16,6 @@ const FileListSection = ({ section }: FileListSectionProps) => {
       title={section.title}
       text={section.text}
       hideCategory={!!section.title || !!section.text}
-      variantFileList={section.variantFileList ?? Enum_Componentsectionsfilelist_Variant.Grid}
       fileSections={groupByCategoryFileList(section.fileList?.filter(isPresent) ?? [])}
     />
   )