import { Meta, StoryObj } from "@storybook/react";
import {   columns } from "../tableComponent/columns"
import { Tables } from "../tableComponent/Table"

const meta = {
    title: 'Component/Table',
    component : Tables,
    parameters: {
        // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
        layout: 'centered',
    },
    tags: ['autodocs'],

    args:{
        data: [
            { date: new Date("2023-10-30 15:26:04"), info: '800 Cobas Status', type: 'status', onClick: () => console.log('Clicked') },
            { date: new Date("2020-01-10 05:00:04"), info: 'Incoming Cobas 800 result', type: 'result', onClick: () => console.log('Clicked') },
            // Data lainnya...
          ], // Tentukan header di sini
        columns: columns
    },
    argTypes:{
        columns: {
            accessorKey: { type: "string" }, // Ganti "string" dengan tipe data yang benar
            header: { type: "string" }
          }
    },

}satisfies Meta<typeof Tables>

export default meta;
type Story = StoryObj<typeof meta>


const getData = [
    {
      id: "2023-10-30T15:26:04Z",
      info: "Cobas 800",
      date: "2023-10-30T15:26:04",
      type: "status"
    },
    {
      id: "2023-10-28T15:26:04",
      info: "Incoming Cobas 800 Result",
      date: "2020-01-10 05:00:04",
      type: "result"
    }
  ];

export const PortServerTable = (args:Story) => {

  return (
    <div className="container mx-auto py-10">
      <Tables columns={columns} data={getData} {...args} />
    </div>
  )
}
