@c-rex/templates 0.1.26 → 0.1.28

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@c-rex/templates",
-    "version": "0.1.26",
+    "version": "0.1.28",
     "type": "module",
     "files": [
         "src"

package/src/articles/wrapper.tsx

@@ -6,11 +6,12 @@ import { LeftSidebar } from "@c-rex/components/left-sidebar";
 import { RightSidebar } from "@c-rex/components/right-sidebar";
 import { Breadcrumb } from "@c-rex/components/breadcrumb";
 import { RenderArticle } from "@c-rex/components/render-article";
-import { articleInfoItemType, DocumentsType, Favorite } from "@c-rex/types";
+import { articleInfoItemType, DocumentsType } from "@c-rex/types";
 import { AvailableVersionsInterface, TreeOfContent } from "@c-rex/interfaces";
 import { Separator } from "@c-rex/ui/separator";
 import { ArrowBigLeft, PanelRight, ArrowBigRight, FileSearchIcon, X, Search } from "lucide-react";
-import { SearchInput } from "../../../components/src/navbar/search-input";
+import { SearchInput } from "../../../components/src/search-input";
+
 import { useMultiSidebar } from "@c-rex/ui/sidebar";
 import { Button } from "@c-rex/ui/button";
 import { useQueryState } from "nuqs";
@@ -106,36 +107,36 @@ export const ArticleWrapper = ({
                     <RenderArticle htmlContent={htmlContent} contentLang={articleLang} />
 
                     {/*
-                    <div className="absolute top-0 right-0 flex flex-col gap-2 items-end">
-                        {favoritesList.map((item) => (
-                            <div
-                                key={item.id}
-                                className={cn(
-                                    "group h-8 cursor-pointer w-4 hover:w-40 transition-all duration-300 relative",
-                                    `bg-${item.color}`,
-                                    item.id == id ? "rounded-r-sm" : "rounded-sm"
-                                )}
-                            >
-                                {item.id == id && (
-                                    <div className={cn(
-                                        "absolute -left-[16px] top-1/2 -translate-y-1/2 h-8 border-t-[16px] border-t-transparent border-b-[16px] border-b-transparent border-r-[16px]",
-                                        `border-r-${item.color}`,
-                                    )} />
-                                )}
-                                <a
-                                    href={`../topics/${item.id}`}
-                                    className="flex items-center justify-end h-8 opacity-0 group-hover:opacity-100 text-primary-foreground transition-all duration-300 text-right px-2"
+                        <div className="absolute top-0 right-0 flex flex-col gap-2 items-end">
+                            {favoritesList.map((item) => (
+                                <div
+                                    key={item.id}
+                                    className={cn(
+                                        "group h-8 cursor-pointer w-4 hover:w-40 transition-all duration-300 relative",
+                                        `bg-${item.color}`,
+                                        item.id == id ? "rounded-r-sm" : "rounded-sm"
+                                    )}
                                 >
-                                    <span
-                                        className="text-right text-ellipsis overflow-hidden whitespace-nowrap"
-                                        title={item.label}
+                                    {item.id == id && (
+                                        <div className={cn(
+                                            "absolute -left-[16px] top-1/2 -translate-y-1/2 h-8 border-t-[16px] border-t-transparent border-b-[16px] border-b-transparent border-r-[16px]",
+                                            `border-r-${item.color}`,
+                                        )} />
+                                    )}
+                                    <a
+                                        href={`../topics/${item.id}`}
+                                        className="flex items-center justify-end h-8 opacity-0 group-hover:opacity-100 text-primary-foreground transition-all duration-300 text-right px-2"
                                     >
-                                        {item.label}
-                                    </span>
-                                </a>
-                            </div>
-                        ))}
-                    </div>
+                                        <span
+                                            className="text-right text-ellipsis overflow-hidden whitespace-nowrap"
+                                            title={item.label}
+                                        >
+                                            {item.label}
+                                        </span>
+                                    </a>
+                                </div>
+                            ))}
+                        </div>
                     */}
                 </div>
 

package/src/home/layout.tsx

@@ -3,7 +3,6 @@ import { PageWrapper } from "@c-rex/components/page-wrapper";
 import { OperatorType, WildCardType } from "@c-rex/types";
 import { InformationUnitsService } from "@c-rex/services";
 import { informationUnitsResponse } from "@c-rex/interfaces";
-import { SearchProvider } from "@c-rex/contexts/search";
 import { CrexSDK } from "@c-rex/core/sdk";
 
 interface HomeProps {
@@ -57,7 +56,7 @@ export const HomeLayout = async ({ searchParams }: HomeProps) => {
     }
 
     return (
-        <PageWrapper title="" pageType="HOME">
+        <PageWrapper>
             <HomePage data={data} />
         </PageWrapper>
     );

package/src/home/page.tsx

@@ -7,7 +7,7 @@ import { parseAsBoolean, parseAsInteger, parseAsString, useQueryStates } from 'n
 import { informationUnitsResponse } from "@c-rex/interfaces";
 import { Button } from "@c-rex/ui/button";
 import { Badge } from "@c-rex/ui/badge";
-import { ResultList } from "@c-rex/components/result-list";
+import { ResultContainer } from "@c-rex/components/result-container";
 import { DialogFilter } from "@c-rex/components/dialog-filter";
 import { AutoComplete } from "@c-rex/components/autocomplete";
 import { DEVICE_OPTIONS, OPERATOR_OPTIONS } from "@c-rex/constants";
@@ -366,7 +366,7 @@ export const HomePage: FC<HomePageProps> = ({ data }) => {
                 </Sheet>
 
                 <div className="flex-1">
-                    <ResultList
+                    <ResultContainer
                         items={data.items}
                         pagination={data.pageInfo}
                     />

package/src/home/page2.tsx

@@ -7,7 +7,7 @@ import { parseAsBoolean, parseAsInteger, parseAsString, useQueryStates } from 'n
 import { informationUnitsResponse } from "@c-rex/interfaces";
 import { Button } from "@c-rex/ui/button";
 import { Badge } from "@c-rex/ui/badge";
-import { ResultList } from "@c-rex/components/result-list";
+import { ResultContainer } from "@c-rex/components/result-container";
 import { DialogFilter } from "@c-rex/components/dialog-filter";
 import { AutoComplete } from "@c-rex/components/autocomplete";
 import { DEVICE_OPTIONS, OPERATOR_OPTIONS } from "@c-rex/constants";
@@ -373,7 +373,7 @@ export const HomePage: FC<HomePageProps> = ({ data }) => {
                 </Sheet>
 
                 <div className="flex-1">
-                    <ResultList
+                    <ResultContainer
                         items={data.items}
                         pagination={data.pageInfo}
                     />

package/src/layout.tsx

@@ -8,8 +8,10 @@ import { cookies } from "next/headers";
 import { CrexSDK } from "@c-rex/core/sdk";
 import { getIssuerMetadata } from "@c-rex/core/OIDC";
 import { resolveUILanguage, resolveContentLanguage } from "./utils";
-import { LanguageService } from "@c-rex/services";
-import { CONTENT_LANG_KEY, UI_LANG_KEY } from "@c-rex/constants";
+import { informationUnitsLanguagesServer } from "@c-rex/services/server-requests";
+import { UI_LANG_KEY } from "@c-rex/constants";
+import { transformLanguageData } from "@c-rex/utils";
+import { getSearchSettingsFromCookie } from "@c-rex/components/search-settings-store";
 
 interface DefaultRootLayoutProps {
     children: React.ReactNode;
@@ -23,15 +25,15 @@ export const DefaultRootLayout = async ({ children }: DefaultRootLayoutProps) =>
     const uiLangCookie = cookieStore.get(UI_LANG_KEY)?.value ?? null;
     const clientConfigs = sdk.getClientConfig();
     const serverConfigs = sdk.getServerConfig();
-    const languageService = new LanguageService()
-    const contentLangCookie = cookieStore.get(CONTENT_LANG_KEY)?.value ?? null;
+    const searchSettings = getSearchSettingsFromCookie(cookieStore.get("c-rex-search-settings")?.value);
 
     sdk.updateConfigProp('OIDC', {
         ...serverConfigs.OIDC,
         issuerMetadata: metadata
     });
 
-    const availableLanguages = await languageService.getLanguagesAndCountries();
+    const data = await informationUnitsLanguagesServer();
+    const availableLanguages = transformLanguageData(data as { value: string; score: number; }[]);
 
     const uiLang = resolveUILanguage({
         uiLangCookie,
@@ -39,7 +41,7 @@ export const DefaultRootLayout = async ({ children }: DefaultRootLayoutProps) =>
     });
 
     const contentLang = resolveContentLanguage({
-        contentLangCookie,
+        contentLangCookie: searchSettings.language,
         availableLanguages,
         defaultLang: clientConfigs.languageSwitcher.default
     });
@@ -66,4 +68,4 @@ export const DefaultRootLayout = async ({ children }: DefaultRootLayoutProps) =>
             </html>
         </NuqsAdapter>
     );
-}
+};

package/src/utils.ts

@@ -46,4 +46,4 @@ export const resolveContentLanguage = ({
     if (hasLang) return browserLang;
 
     return defaultLang;
-}
+}

package/src/collectors/BaseArticleCollector.ts

@@ -1,289 +0,0 @@
-import { DirectoryNodesService, InformationUnitsService } from "@c-rex/services";
-import { CollectionContext, CollectionResult, DirectoryNodes, informationUnitsItems, informationUnitsResponseItem } from "@c-rex/interfaces";
-import * as cheerio from "cheerio"
-import { articleInfoItemType, metaTags } from "@c-rex/types";
-
-
-export abstract class BaseArticleCollector {
-    protected informationService = new InformationUnitsService();
-    protected directoryNodeService = new DirectoryNodesService();
-
-    private collectVersions: boolean = false;
-    private collectDocument: boolean = false;
-    private collectArticleInfo: boolean = false;
-    private collectDocumentInfo: boolean = false;
-    private additionalTasks: Map<string, (context: CollectionContext) => Promise<any>> = new Map();
-    private collectHtmlContent: boolean = false;
-
-    async collect(id: string): Promise<CollectionResult> {
-        const informationUnitsItem = await this.getInformationUnit(id);
-        const rootNode = await this.getRootNode(informationUnitsItem.directoryNodes);
-
-        if (!rootNode) throw new Error("Root node not found");
-
-        const context: CollectionContext = {
-            id,
-            informationUnitsItem,
-            rootNode
-        };
-
-        this.configureTasks();
-
-        const tasks = await this.buildTasks(context);
-        const results = await Promise.all(tasks);
-        return this.buildResult(context, this.processResults(results));
-    }
-
-    protected abstract configureTasks(): void;
-
-
-    protected withVersions(): this {
-        this.collectVersions = true;
-        return this;
-    }
-
-    protected withDocument(): this {
-        this.collectDocument = true;
-        return this;
-    }
-
-    protected withHtmlContent(): this {
-        this.collectHtmlContent = true;
-        return this;
-    }
-
-    protected withArticleInfo(): this {
-        this.collectArticleInfo = true;
-        return this;
-    }
-
-    protected withDocumentInfo(): this {
-        this.collectDocumentInfo = true;
-        return this;
-    }
-
-    protected withCustomTask(name: string, task: (context: CollectionContext) => Promise<any>): this {
-        this.additionalTasks.set(name, task);
-        return this;
-    }
-
-    private async buildTasks(context: CollectionContext): Promise<Array<{ name: string, result: any }>> {
-        const tasks: Array<{ name: string, task: () => Promise<any> }> = [];
-
-        if (this.collectVersions) {
-            tasks.push({
-                name: 'articleVersions',
-                task: () => this.getArticleVersions(context)
-            });
-
-            tasks.push({
-                name: 'documentVersions',
-                task: () => this.getDocumentVersions(context)
-            });
-        }
-
-        if (this.collectDocument) {
-            tasks.push({
-                name: 'document',
-                task: () => this.getDocument(context)
-            });
-        }
-
-        if (this.collectHtmlContent) {
-            tasks.push({
-                name: 'htmlContent',
-                task: () => this.getHtmlContent(context)
-            });
-        }
-
-        for (const [name, taskFn] of this.additionalTasks) {
-            tasks.push({
-                name,
-                task: () => taskFn(context)
-            });
-        }
-
-        return Promise.all(
-            tasks.map(async ({ name, task }) => ({
-                name,
-                result: await task()
-            }))
-        );
-    }
-
-    private processResults(results: Array<{ name: string, result: any }>): Record<string, any> {
-        return results.reduce((acc, { name, result }) => {
-            acc[name] = result;
-            return acc;
-        }, {} as Record<string, any>);
-    }
-
-    protected async getInformationUnit(id: string) {
-        return await this.informationService.getItem({
-            id,
-            shouldGetAllFields: true
-        });
-    }
-
-    protected async getDocument(context: CollectionContext) {
-        if (context.rootNode.informationUnits[0]) {
-            const infoId = context.rootNode.informationUnits[0].shortId;
-            return await this.informationService.getItem({
-                id: infoId!,
-                shouldGetAllFields: true
-            });
-        }
-        return null;
-    }
-
-    protected async getRootNode(directoryNodes: DirectoryNodes[]): Promise<DirectoryNodes | null> {
-        if (directoryNodes.length === 0 || !directoryNodes[0]) {
-            return null;
-        }
-
-        let id = directoryNodes[0].shortId;
-        let response = await this.directoryNodeService.getItem(id);
-
-        if (!response.ancestors || response.ancestors.length === 0) {
-            return response;
-        }
-
-        const noHasInfo = !response.informationUnits?.[0];
-        const notHasLabel = !response.labels?.[0];
-
-        if (noHasInfo || notHasLabel) return null
-        if (response.ancestors == undefined) return null
-        if (response.ancestors[0] == undefined) return null
-
-        const lastIndex = response.ancestors[0].length - 1;
-
-        if (response.ancestors[0][lastIndex] == undefined) return null
-
-        id = response.ancestors[0][lastIndex].shortId;
-        response = await this.directoryNodeService.getItem(id);
-
-        return response;
-    }
-
-    protected async getHtmlContent(context: CollectionContext): Promise<string> {
-        throw new Error("getHtmlContent must be implemented by subclass");
-    }
-
-    protected async getArticleVersions(context: CollectionContext): Promise<informationUnitsResponseItem[]> {
-        throw new Error("getArticleVersions must be implemented by subclass");
-    }
-
-    protected async getDocumentVersions(context: CollectionContext): Promise<informationUnitsResponseItem[]> {
-        throw new Error("getDocumentVersions must be implemented by subclass");
-    }
-
-    protected splitHtmlContentAndTags(html: string): { metaTags: metaTags, articleHtml: string } {
-        const $ = cheerio.load(html)
-
-        const metaTags = $("meta").map((_, el) => {
-            const name = $(el).attr("name")
-            const content = $(el).attr("content")
-            return name && content ? { name, content } : null
-        }).get().filter(Boolean)
-
-        const articleHtml = $("main").html() || ""
-
-        return {
-            metaTags,
-            articleHtml,
-        }
-    }
-
-    protected buildResult(context: CollectionContext, data: Record<string, any>): CollectionResult {
-        const { metaTags, articleHtml } = this.splitHtmlContentAndTags(data.htmlContent);
-        const result: CollectionResult = {
-            articleHtml: articleHtml,
-            metaTags: metaTags,
-            document: data.document,
-            article: context.informationUnitsItem,
-            rootNode: context.rootNode,
-            articleAvailableVersions: data.articleVersions || [],
-            documentAvailableVersions: data.documentVersions || [],
-        }
-
-        if (this.collectArticleInfo) {
-            result['articleInfo'] = this.processArticleInfo(context.informationUnitsItem)
-        }
-
-        if (this.collectDocumentInfo) {
-            result['documentInfo'] = this.processArticleInfo(data.document)
-        }
-
-        return {
-            ...result,
-            ...data
-        };
-    }
-
-    protected processArticleInfo = (
-        informationUnit: informationUnitsItems,
-        excludeKeys: string[] = ['shortId', 'id']
-    ): articleInfoItemType[] => {
-        const result: articleInfoItemType[] = [];
-
-        Object.entries(informationUnit).forEach(([key, value]) => {
-
-            if (excludeKeys.includes(key) || value === null || value === undefined) {
-                return;
-            }
-
-            const processedValue = processValue(value);
-
-            if (processedValue !== null) {
-                result.push({
-                    label: key,
-                    value: processedValue
-                });
-            }
-        });
-
-        return result;
-    };
-}
-
-const processValue = (value: any): string | null => {
-
-    if (Array.isArray(value)) {
-        if (value.length === 0) return null;
-
-
-        if (value.length === 1) {
-            return processSingleValue(value[0]);
-        }
-
-
-        const processedValues = value
-            .map(item => processSingleValue(item))
-            .filter(item => item !== null);
-
-        return processedValues.length > 0 ? processedValues.join(", ") : null;
-    }
-
-    return processSingleValue(value);
-};
-
-const processSingleValue = (item: any): string | null => {
-
-    if (item === null || item === undefined) {
-        return null;
-    }
-
-    if (typeof item === 'object') {
-        if ('shortId' in item || 'id' in item) {
-            return null;
-        }
-
-        if ('value' in item && item.value !== null && item.value !== undefined) {
-            return String(item.value);
-        }
-
-        return null;
-    }
-
-    return String(item);
-};

package/src/collectors/DocumentArticleCollector.ts

@@ -1,73 +0,0 @@
-import { BaseArticleCollector } from './BaseArticleCollector';
-import { CollectionContext, informationUnitsResponseItem } from "@c-rex/interfaces";
-import { RenditionsService } from "@c-rex/services";
-import { DocumentsType } from '@c-rex/types';
-import { getFileRenditions } from '@c-rex/utils';
-
-export class DocumentArticleCollector extends BaseArticleCollector {
-    private renditionService = new RenditionsService();
-
-    protected configureTasks(): void {
-        this.withVersions()
-            .withDocument()
-            .withHtmlContent()
-            .withArticleInfo()
-            .withDocumentInfo()
-            .withCustomTask('attachments', this.getAttachments.bind(this))
-    }
-
-    protected async getHtmlContent(context: CollectionContext): Promise<string> {
-        if (!context.rootNode.childNodes[0]) {
-            return "";
-        }
-        const directoryId = context.rootNode.childNodes[0].shortId;
-        const response = await this.directoryNodeService.getItem(directoryId);
-
-        const infoId = response.informationUnits[0]?.shortId as string
-        const childInformationUnit = await this.informationService.getItem({
-            id: infoId
-        });
-
-        return await this.renditionService.getHTMLRendition({
-            renditions: childInformationUnit.renditions
-        });
-    }
-
-    protected async getDocumentVersions(context: CollectionContext): Promise<informationUnitsResponseItem[]> {
-        const versions = await this.informationService.getList({
-            restrict: [`versionOf.shortId=${context.informationUnitsItem.versionOf.shortId}`],
-            fields: ["renditions", "class", "languages", "labels"],
-        })
-
-        return versions.items;
-    }
-
-    protected async getArticleVersions(context: CollectionContext): Promise<informationUnitsResponseItem[]> {
-        if (!context.rootNode.childNodes[0]) {
-            return [];
-        }
-        const directoryId = context.rootNode.childNodes[0].shortId;
-        const response = await this.directoryNodeService.getItem(directoryId);
-
-        const infoId = response.informationUnits[0]?.shortId as string
-        const childInformationUnit = await this.informationService.getItem({
-            id: infoId
-        });
-
-        const versions = await this.informationService.getList({
-            restrict: [`versionOf.shortId=${childInformationUnit.versionOf.shortId}`],
-            fields: ["renditions", "class", "languages", "labels"],
-        })
-
-        return versions.items;
-    }
-
-    private async getAttachments(context: CollectionContext): Promise<DocumentsType> {
-        const rootNodeInfoID = context.rootNode.informationUnits[0]?.shortId as string
-        const childInformationUnit = await this.informationService.getItem({
-            id: rootNodeInfoID
-        });
-
-        return getFileRenditions({ renditions: childInformationUnit.renditions });
-    }
-}

package/src/collectors/TopicArticleCollector.ts

@@ -1,57 +0,0 @@
-import { BaseArticleCollector } from './BaseArticleCollector';
-import { CollectionContext, informationUnitsResponseItem } from "@c-rex/interfaces";
-import { RenditionsService } from "@c-rex/services";
-import { DocumentsType } from '@c-rex/types';
-import { getFileRenditions } from '@c-rex/utils';
-
-export class TopicArticleCollector extends BaseArticleCollector {
-    private renditionService = new RenditionsService();
-
-    protected configureTasks(): void {
-        this.withVersions()
-            .withDocument()
-            .withHtmlContent()
-            .withArticleInfo()
-            .withDocumentInfo()
-            .withCustomTask('attachments', this.getAttachments.bind(this))
-
-    }
-
-    protected async getHtmlContent(context: CollectionContext): Promise<string> {
-        return await this.renditionService.getHTMLRendition({
-            renditions: context.informationUnitsItem.renditions
-        });
-    }
-
-    protected async getDocumentVersions(context: CollectionContext): Promise<informationUnitsResponseItem[]> {
-        const rootNodeInfoID = context.rootNode.informationUnits[0]?.shortId as string
-        const childInformationUnit = await this.informationService.getItem({
-            id: rootNodeInfoID
-        });
-
-        const versions = await this.informationService.getList({
-            restrict: [`versionOf.shortId=${childInformationUnit.versionOf.shortId}`],
-            fields: ["renditions", "class", "languages", "labels"],
-        })
-
-        return versions.items;
-    }
-
-    protected async getArticleVersions(context: CollectionContext): Promise<informationUnitsResponseItem[]> {
-        const versions = await this.informationService.getList({
-            restrict: [`versionOf.shortId=${context.informationUnitsItem.versionOf.shortId}`],
-            fields: ["renditions", "class", "languages", "labels"],
-        })
-
-        return versions.items;
-    }
-
-    private async getAttachments(context: CollectionContext): Promise<DocumentsType> {
-        const rootNodeInfoID = context.rootNode.informationUnits[0]?.shortId as string
-        const childInformationUnit = await this.informationService.getItem({
-            id: rootNodeInfoID
-        });
-
-        return getFileRenditions({ renditions: childInformationUnit.renditions });
-    }
-}

package/src/home/components/filter-sidebar.tsx

@@ -1,105 +0,0 @@
-"use client";
-
-import React, { FC } from "react";
-import { useTranslations } from 'next-intl'
-import { Check, ChevronDown } from "lucide-react"
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@c-rex/ui/collapsible";
-import {
-    SidebarContent,
-    SidebarGroup,
-    SidebarGroupContent,
-    SidebarGroupLabel,
-    SidebarHeader,
-    SidebarMenu,
-    SidebarMenuSub,
-    SidebarMenuSubButton,
-    SidebarMenuSubItem
-} from "@c-rex/ui/sidebar";
-import { useBreakpoint } from "@c-rex/ui/hooks";
-import { DEVICE_OPTIONS } from "@c-rex/constants";
-import { SheetContent, SheetHeader } from "@c-rex/ui/sheet";
-
-interface FilterSidebarProps {
-    tags: { [key: string]: any[] }
-    totalItemCount: number
-    updateFilterParam: (key: string, item: any) => void
-}
-
-export const FilterSidebar: FC<FilterSidebarProps> = ({ tags, totalItemCount, updateFilterParam }) => {
-    const t = useTranslations();
-    const device = useBreakpoint();
-    const isMobile = device !== null && (device === DEVICE_OPTIONS.MOBILE);
-
-    if (Object.keys(tags).length === 0) return null;
-
-    const content = (
-        <SidebarContent className="!gap-0">
-
-            {Object.entries(tags).map(([key, value]: any) => (
-
-                <Collapsible defaultOpen key={key} className="py-0 group/collapsible">
-                    <SidebarGroup>
-
-                        <SidebarGroupLabel asChild className="hover:bg-sidebar-accent text-sidebar-accent-foreground text-sm font-bold">
-                            <CollapsibleTrigger className="!h-9">
-                                {t(`filter.tags.${key}`)}
-                                <ChevronDown className="ml-auto transition-transform group-data-[state=open]/collapsible:rotate-180" />
-                            </CollapsibleTrigger>
-                        </SidebarGroupLabel>
-
-                        <CollapsibleContent>
-                            <SidebarGroupContent>
-                                <SidebarMenu>
-                                    <SidebarMenuSub>
-                                        {value.map((item: any) => (
-                                            <SidebarMenuSubItem key={item.shortId}>
-                                                <SidebarMenuSubButton
-                                                    className="cursor-pointer"
-                                                    isActive={item.active}
-                                                    onClick={() => updateFilterParam(key, item)}
-                                                >
-                                                    {item.label} ({item.hits}/{item.total})
-                                                    {item.active && <Check className="ml-2" />}
-                                                </SidebarMenuSubButton>
-                                            </SidebarMenuSubItem>
-                                        ))}
-                                    </SidebarMenuSub>
-                                </SidebarMenu>
-                            </SidebarGroupContent>
-                        </CollapsibleContent>
-                    </SidebarGroup>
-                </Collapsible>
-            ))}
-        </SidebarContent>
-    )
-
-    if (isMobile) {
-        return (
-
-            <SheetContent
-                side="left"
-                className="!pt-6 !px-2 w-[400px] overflow-y-auto"
-            >
-                <SheetHeader className="justify-center items-end font-bold">
-                    {t("filter.filters")}
-                    <span className="text-xs text-muted-foreground leading-5">
-                        {totalItemCount} {t("results.results")}
-                    </span>
-                </SheetHeader>
-                {content}
-            </SheetContent>
-        )
-    }
-
-    return (
-        <div className="w-60 lg:w-80 bg-sidebar rounded-md border pb-4">
-            <SidebarHeader className="justify-center items-end font-bold">
-                {t("filter.filters")}
-                <span className="text-xs text-muted-foreground leading-5">
-                    {totalItemCount} {t("results.results")}
-                </span>
-            </SidebarHeader>
-            {content}
-        </div>
-    );
-};