import AssetsList from "@/components/AssetsList";
import { defineUI, useModal } from "queenjs";
import { any } from "vue-types";
import Item from "./MaterialItem";
import { PageListController } from "@queenjs/controllers";

export default defineUI({
  slots: {
    Item,
  },
  props: {
    ListCtrl: any<PageListController<any, any>>().isRequired,
  },
  emits: ["preview"],
  setup(props, { emit, slots }) {
    const modal = useModal();
    return () => {
      return (
        <div>
          <AssetsList
            control={props.ListCtrl}
            item={(record: any) => (
              <slots.Item
                use="select"
                record={record}
                onUse={() => {
                  modal.submit(record);
                }}
                onPreview={() => emit("preview", record)}
              />
            )}
          />
        </div>
      );
    };
  },
});
