refactor: apply PR requested changes

src/components/collection/Collection.tsx

@@ -76,7 +76,7 @@ const Collection = ({ id }: Props) => {
           canPublish={canPublish}
           isPublished={
             isLoadingPublishedEntry ||
-            (!!itemPublishEntry && !isErrorPublishedEntry)
+            (Boolean(itemPublishEntry) && !isErrorPublishedEntry)
           }
           currentMember={currentMember}
         />

src/components/collection/summary/SummaryDetails.tsx

@@ -127,11 +127,9 @@ const SummaryDetails: React.FC<SummaryDetailsProps> = ({
     ?.filter((c) => c.category.type === CategoryType.Discipline)
     ?.map((c) => c.category);
 
-  let langValue = langs[DEFAULT_LANG];
-  if (collection.lang in langs) {
-    // @ts-ignore
-    langValue = langs[collection.lang];
-  }
+  const langKey = collection.lang in langs ? collection.lang : DEFAULT_LANG;
+  // @ts-ignore
+  const langValue = langs[langKey];
 
   return (
     <Grid

src/components/filters/CategoryFilter.tsx

@@ -7,14 +7,13 @@ import {
   buildSearchFilterCategoryId,
   buildSearchFilterPopperButtonId,
 } from '../../config/selectors';
-import { Filter } from './Filter';
+import { Filter, FilterProps } from './Filter';
 
-type FilterProps = {
+type CategoryFilterProps = {
   category: string;
   title: string;
   options?: Category[];
-  // IDs of selected options.
-  selectedOptions: string[];
+  selectedOptionIds: FilterProps['selectedOptionIds'];
   onOptionChange: (key: string, newValue: boolean) => void;
   onClearOptions: () => void;
   isLoading: boolean;
@@ -27,9 +26,9 @@ export function CategoryFilter({
   onOptionChange,
   onClearOptions,
   options,
-  selectedOptions,
+  selectedOptionIds,
   isLoading,
-}: FilterProps) {
+}: CategoryFilterProps) {
   const { t: translateCategories } = useCategoriesTranslation();
 
   return (
@@ -39,7 +38,7 @@ export function CategoryFilter({
       title={title}
       isLoading={isLoading}
       options={options?.map((c) => [c.id, translateCategories(c.name)])}
-      selectedOptions={selectedOptions}
+      selectedOptionIds={selectedOptionIds}
       onOptionChange={onOptionChange}
       onClearOptions={onClearOptions}
     />

src/components/filters/Filter.tsx

@@ -8,10 +8,9 @@ import { useLibraryTranslation } from '../../config/i18n';
 import LIBRARY from '../../langs/constants';
 import { FilterPopper, FilterPopperProps } from './FilterPopper';
 
-type FilterProps = {
+export type FilterProps = {
   title: string;
-  // IDs of selected options.
-  selectedOptions: string[];
+  selectedOptionIds: string[];
   isLoading?: boolean;
   onClearOptions: FilterPopperProps['onClearOptions'];
   onOptionChange: FilterPopperProps['onOptionChange'];
@@ -20,10 +19,9 @@ type FilterProps = {
   options?: FilterPopperProps['options'];
 };
 
-// eslint-disable-next-line import/prefer-default-export
 export const Filter = ({
   title,
-  selectedOptions,
+  selectedOptionIds,
   isLoading,
   onClearOptions,
   onOptionChange,
@@ -85,24 +83,24 @@ export const Filter = ({
         whiteSpace="nowrap"
         width="100%"
         textAlign="left"
-        color={selectedOptions.length ? 'black' : 'gray'}
+        color={selectedOptionIds.length ? 'black' : 'gray'}
         variant="h6"
         textOverflow="ellipsis"
         overflow="hidden"
       >
-        {options?.find((o) => o[0] === selectedOptions[0])?.[1] ??
+        {options?.find((o) => o[0] === selectedOptionIds[0])?.[1] ??
           t(LIBRARY.FILTER_DROPDOWN_NO_FILTER)}
       </Typography>
 
-      {selectedOptions.length > 1 && (
+      {selectedOptionIds.length > 1 && (
         <Box
           style={{
             color: GRAASP_COLOR,
             fontSize: 14,
             fontWeight: 'bold',
           }}
         >
-          {`+${selectedOptions.length - 1}`}
+          {`+${selectedOptionIds.length - 1}`}
         </Box>
       )}
     </Button>
@@ -128,7 +126,7 @@ export const Filter = ({
         open={showPopper}
         options={options}
         anchorEl={popperAnchor.current}
-        selectedOptions={selectedOptions}
+        selectedOptionIds={selectedOptionIds}
         onOptionChange={onOptionChange}
         onClearOptions={onClearOptions}
       />

src/components/filters/FilterHeader.tsx

@@ -172,7 +172,7 @@ const FilterHeader: FC<FilterHeaderProps> = ({
       category={CategoryType.Level}
       title={translateCategories(CategoryType.Level)}
       options={levelList}
-      selectedOptions={selectedLevelOptions}
+      selectedOptionIds={selectedLevelOptions}
       onOptionChange={onFilterChanged}
       onClearOptions={() => onClearCategory(levelList?.map((l) => l.id))}
       isLoading={isCategoriesLoading}
@@ -182,15 +182,15 @@ const FilterHeader: FC<FilterHeaderProps> = ({
       category={CategoryType.Discipline}
       title={translateCategories(CategoryType.Discipline)}
       options={disciplineList}
-      selectedOptions={selectedDisciplineOptions}
+      selectedOptionIds={selectedDisciplineOptions}
       onOptionChange={onFilterChanged}
       onClearOptions={() => onClearCategory(disciplineList?.map((d) => d.id))}
       isLoading={isCategoriesLoading}
     />,
     <LangFilter
       key={CategoryType.Language}
       title={t(LIBRARY.SEARCH_FILTER_LANG_TITLE)}
-      selectedOptions={langs}
+      selectedOptionIds={langs}
       setLangs={setLangs}
     />,
   ];

src/components/filters/FilterPopper.tsx

@@ -33,8 +33,7 @@ export type FilterPopperProps = {
   open: boolean;
   anchorEl: HTMLElement | null;
   options?: [k: string, v: string][];
-  // IDs of selected options.
-  selectedOptions: string[];
+  selectedOptionIds: string[];
   onOptionChange: (id: string, newSelected: boolean) => void;
   onClearOptions: () => void;
 };
@@ -46,7 +45,7 @@ export const FilterPopper = React.forwardRef<HTMLDivElement, FilterPopperProps>(
       anchorEl,
       onOptionChange,
       open,
-      selectedOptions,
+      selectedOptionIds,
       onClearOptions,
     },
     ref,
@@ -67,7 +66,7 @@ export const FilterPopper = React.forwardRef<HTMLDivElement, FilterPopperProps>(
           <Grow {...TransitionProps}>
             <StyledPopper>
               {options?.sort(compare).map(([k, v], idx) => {
-                const isSelected = selectedOptions.includes(k);
+                const isSelected = selectedOptionIds.includes(k);
                 return (
                   <Stack
                     key={k}

src/components/filters/LangFilter.tsx

@@ -4,26 +4,25 @@ import {
   SEARCH_FILTER_LANG_ID,
   SEARCH_FILTER_POPPER_LANG_ID,
 } from '../../config/selectors';
-import { Filter } from './Filter';
+import { Filter, FilterProps } from './Filter';
 
 type LangFilterProps = {
   title: string;
-  // IDs of selected options.
-  selectedOptions: string[];
+  selectedOptionIds: FilterProps['selectedOptionIds'];
   setLangs: (langs: string[]) => void;
 };
 
 // eslint-disable-next-line react/function-component-definition
 export function LangFilter({
   title,
-  selectedOptions,
+  selectedOptionIds,
   setLangs,
 }: LangFilterProps) {
   const onLangChange = (option: string) => {
-    if (selectedOptions.includes(option)) {
-      setLangs(selectedOptions.filter((l) => l !== option));
+    if (selectedOptionIds.includes(option)) {
+      setLangs(selectedOptionIds.filter((l) => l !== option));
     } else {
-      setLangs([...selectedOptions, option]);
+      setLangs([...selectedOptionIds, option]);
     }
   };
 
@@ -36,7 +35,7 @@ export function LangFilter({
       id={SEARCH_FILTER_LANG_ID}
       title={title}
       options={Object.entries(langs)}
-      selectedOptions={selectedOptions}
+      selectedOptionIds={selectedOptionIds}
       onOptionChange={onLangChange}
       onClearOptions={clearLang}
       buttonId={SEARCH_FILTER_POPPER_LANG_ID}