@plteam/chat-ui/dist/views/leftContainer/useThreadsGroupedList.js

CUI Kit is a free and open-source library for creating AI assistant chat interfaces, built with React, Material UI, and TypeScript

import * as React from 'react';
import { sortByDesc } from '../../utils/arrayUtils/arraySort';
import moment from 'moment';
import { arrayPluck } from '../../utils/arrayUtils/arrayPluck';
import { useLocalizationContext } from '../core/LocalizationContext';
import { langReplace } from '../../locale/langReplace';
import { capitalizeFirstLetter } from '../../utils/stringUtils/capitalizeFirstLetter';
export const useThreadsGroupedList = (threads) => {
    const [threadGroups, setThreadGroups] = React.useState({});
    const locale = useLocalizationContext();
    React.useEffect(() => {
        const basicGroups = {
            today: {
                id: 'today',
                timestamp: moment().startOf('day').unix(),
                label: locale.historyToday,
            },
            yesterday: {
                id: 'yesterday',
                timestamp: moment().subtract(1, 'days').startOf('day').unix(),
                label: locale.historyYesterday,
            },
            last7Days: {
                id: 'last7Days',
                timestamp: moment().subtract(7, 'days').startOf('day').unix(),
                label: langReplace(locale.historyPreviousNDays, { days: 7 }),
            },
            last30Days: {
                id: 'last30Days',
                timestamp: moment().subtract(30, 'days').startOf('day').unix(),
                label: langReplace(locale.historyPreviousNDays, { days: 30 }),
            },
        };
        const basicKeys = Object.keys(basicGroups);
        const startOfYear = moment().startOf('year').unix();
        const results = {};
        threads.forEach((item) => {
            const timestamp = item.timestamp.value;
            if (timestamp) {
                const basicGroupKey = basicKeys.find(v => timestamp >= basicGroups[v].timestamp);
                if (basicGroupKey) {
                    results[basicGroupKey] = { ...basicGroups[basicGroupKey] };
                }
                else if (timestamp >= startOfYear) {
                    const month = moment.unix(timestamp).startOf('month');
                    const monthEn = capitalizeFirstLetter(month.locale('en').format('MMMM'));
                    results[monthEn] = {
                        label: locale[`history${monthEn}`],
                        timestamp: month.unix(),
                        id: monthEn,
                    };
                }
                else {
                    const year = moment.unix(timestamp).startOf('year');
                    const yearLang = year.format('YYYY');
                    const yearKey = `year${yearLang}`;
                    results[yearKey] = {
                        label: yearLang,
                        timestamp: year.unix(),
                        id: yearKey,
                    };
                }
            }
            else {
                results['other'] = {
                    label: 'Other',
                    timestamp: 0,
                    id: 'Other',
                };
            }
        });
        if (JSON.stringify(results) !== JSON.stringify(threadGroups)) {
            setThreadGroups({ ...results });
        }
    }, [arrayPluck(threads, 'id').join(',')]);
    return React.useMemo(() => {
        const groupsValues = sortByDesc(Object.values(threadGroups), 'timestamp');
        const threadsInGroup = [];
        threads.forEach((thread) => {
            threadsInGroup.push({
                groupKey: groupsValues.find(v => v.timestamp <= thread.time)?.id ?? '',
                thread,
                time: thread.time,
            });
        });
        sortByDesc(threadsInGroup, 'time');
        return { groupsValues, threadsInGroup };
    }, [threadGroups, threads]);
};