use-format-tree-data.test.ts

import { renderHook } from '@testing-library/react-hooks';
import { describe, expect, it } from 'vitest';

import { useTreeFormatData } from './useFormatTreeData';

interface DataSample {
  id: string;
  name: string;
  rootGroup: boolean;
  parentGroupId?: string | null;
  subGroups: DataSample[];
}

const inputData: DataSample[] = [
  {
    id: '1',
    name: 'Group 1',
    parentGroupId: null,
    rootGroup: true,
    subGroups: [],
  },
  {
    id: '2',
    name: 'Group 2',
    parentGroupId: '1',
    rootGroup: false,
    subGroups: [],
  },
  {
    id: '3',
    name: 'Group 3',
    parentGroupId: '1',
    rootGroup: false,
    subGroups: [],
  },
  {
    id: '4',
    name: 'Group 4',
    parentGroupId: '2',
    rootGroup: false,
    subGroups: [],
  },
];

const options = { childrenKey: 'subGroups', parentIdKey: 'parentGroupId' };

describe('useTreeFormatData', () => {
  it('should format flat data into a tree structure', () => {
    const { result } = renderHook(() =>
      useTreeFormatData<DataSample>(inputData, options),
    );
    const tree = result.current;

    expect(tree).toEqual([
      {
        id: '1',
        name: 'Group 1',
        rootGroup: true,
        parentGroupId: null,
        subGroups: [
          {
            id: '2',
            name: 'Group 2',
            parentGroupId: '1',
            rootGroup: false,
            subGroups: [
              {
                id: '4',
                name: 'Group 4',
                parentGroupId: '2',
                rootGroup: false,
                subGroups: [],
              },
            ],
          },
          {
            id: '3',
            name: 'Group 3',
            parentGroupId: '1',
            rootGroup: false,
            subGroups: [],
          },
        ],
      },
    ]);
  });
});