import { fireEvent, render } from '@testing-library/svelte';
import { describe, expect, it, vi } from "vitest";
import NameItemEditor from '$lib/components/NameItemEditor.svelte';

const testUser = {
    admin: true,
exp: 1757067123,
iat: 1757063523,
id: "admin",
}
const testCrimesList = [
			{
				name: 'model-A',
				lastModified: '2025-08-28T09:44:12.453Z',
				etag: '558f35716f6af953f9bb5d75f6d77e6a',
				size: 8947140,
				prefix: '7596e4d5-c51f-482d-a4aa-ff76434305fc',
				show_button: true
			},
			{
				name: 'model-z',
				lastModified: '2025-08-28T10:37:20.142Z',
				etag: '43e3989c32c4682bee407baaf83b6fa0',
				size: 35788560,
				prefix: '7596e4d5-c51f-482d-a4aa-ff76434305fc',
				show_button: true
			}
		];

const testVorgangsList = [
    {
vorgangName: "vorgang-1",
vorgangPIN: "pin-123",
vorgangToken: "c322f26f-8c5e-4cb9-94b3-b5433bf5109e"
 },
 {
vorgangName: "vorgang-2",
vorgangPIN: "pin-2",
vorgangToken: "cb0051bc-5f38-47b8-943c-9352d4d9c984"
 }

]

const baseData = {
  user: testUser,
    vorgang: testVorgangsList[0],
    vorgangList: testVorgangsList,
    crimesList: testCrimesList,
    url: URL,
    crimeNames: [ "modell-A" ],
}

const testCrimesListIndex = 0;
const testItem = baseData.crimesList[testCrimesListIndex];
    const editedName = baseData.crimeNames[testCrimesListIndex];
    const currentName =  testItem.name;
    const onSave = vi.fn();
    const onDelete = vi.fn();

describe('Button-Anzeige mit Icons', () => {
    const baseProps = {list: baseData.crimesList, editedName, currentName, onDelete, onSave}
  it('zeigt Edit/Delete Buttons initial', () => {
    const { getByTestId, queryByTestId } = render(NameItemEditor, {
      props:  baseProps

    });

    expect(getByTestId('edit-button')).toBeInTheDocument();
    expect(getByTestId('delete-button')).toBeInTheDocument();
    expect(queryByTestId('commit-button')).toBeNull();
    expect(queryByTestId('cancel-button')).toBeNull();
  });

  it('zeigt Commit/Cancel Buttons nach Klick auf Edit', async () => {
    const { getByTestId, queryByTestId } = render(NameItemEditor, {
      props: baseProps
    });

    await fireEvent.click(getByTestId('edit-button'));

    expect(getByTestId('commit-button')).toBeInTheDocument();
    expect(getByTestId('cancel-button')).toBeInTheDocument();
        expect(queryByTestId('edit-button')).toBeNull();
    expect(queryByTestId('delete-button')).toBeNull();
  });


});