import {
  MasterDetailTable,
  PanelContainer,
  SpaceSelector,
  useCredentials,
  useDevtoolsState
} from "./chunk-VBEJ3GU4.mjs";

// src/panels/halo/CredentialsPanel/CredentialsPanel.tsx
import React, { useMemo } from "react";
import { Format } from "@dxos/echo/internal";
import { Toolbar } from "@dxos/react-ui";
var CredentialsPanel = (props) => {
  const state = useDevtoolsState();
  const space = props.space ?? state.space;
  const credentials = useCredentials({
    spaceKey: state.haloSpaceKey ?? space?.key
  });
  const properties = useMemo(() => [
    {
      name: "id",
      format: Format.TypeFormat.DID,
      tooltip: true,
      size: 120
    },
    {
      name: "issuer",
      format: Format.TypeFormat.DID,
      tooltip: true,
      size: 120
    },
    {
      name: "type",
      format: Format.TypeFormat.String,
      size: 380
    },
    {
      name: "issuanceDate",
      format: Format.TypeFormat.DateTime,
      title: "issued",
      size: 194
    }
  ], []);
  const data = useMemo(() => credentials.map((credential) => ({
    id: credential.id?.toString() ?? "",
    issuer: credential.issuer.toString(),
    type: credential.subject.assertion["@type"],
    issuanceDate: credential.issuanceDate,
    _original: credential
  })), [
    credentials
  ]);
  return /* @__PURE__ */ React.createElement(PanelContainer, {
    toolbar: props.space ? void 0 : /* @__PURE__ */ React.createElement(Toolbar.Root, null, /* @__PURE__ */ React.createElement(SpaceSelector, null))
  }, /* @__PURE__ */ React.createElement(MasterDetailTable, {
    properties,
    data,
    detailsTransform: (d) => d._original,
    detailsPosition: "bottom"
  }));
};

// src/panels/halo/CredentialsPanel/index.ts
var CredentialsPanel_default = CredentialsPanel;
export {
  CredentialsPanel_default as default
};
//# sourceMappingURL=CredentialsPanel-TU7JYKPV.mjs.map
