Function openCardDetailsModal

website/src/scripts/modal.ts:1022–1099

({
  title,
  description,
  previewIcon = "📄",
  previewText = "",
  metaHtml = "",
  tagsHtml = "",
  actionsHtml = "",
  detailsHtml = "",
  contentClassName = "modal-card-details",
  trigger,
}: OpenCardDetailsRequest)

}

export function openCardDetailsModal({
  title,
  description,
  previewIcon = "📄",
  previewText = "",
  metaHtml = "",
  tagsHtml = "",
  actionsHtml = "",
  detailsHtml = "",
  contentClassName = "modal-card-details",
  trigger,
}: OpenCardDetailsRequest): void {
  const modal = document.getElementById("file-modal");
  const modalTitle = document.getElementById("modal-title");
  const closeBtn = document.getElementById("close-modal");
  const modalBody = getModalBody();

  if (!modal || !modalTitle || !modalBody) return;

  triggerElement = trigger || (document.activeElement as HTMLElement);
  if (!originalDocumentTitle) {
    originalDocumentTitle = document.title;
  }

  currentFilePath = null;
  currentFileContent = null;
  currentFileType = "details";
  currentViewMode = "raw";
  hideSkillFileSwitcher();

  modal.classList.add("details-mode");
  modalTitle.textContent = title;
  document.title = `${title} | Awesome GitHub Copilot`;

  const content = ensureDivContent(contentClassName);
  if (!content) return;

  content.innerHTML =
    detailsHtml ||
    `
      <div class="resource-details-body modal-card-details-body">
        <div class="resource-details-preview">
          <div class="resource-details-preview-icon" aria-hidden="true">${escapeHtml(previewIcon)}</div>
          ${
            previewText
              ? `<p class="resource-details-preview-text">${escapeHtml(previewText)}</p>`
              : ""
          }
        </div>
        <div class="resource-details-content">
          <p class="resource-details-description">${escapeHtml(description)}</p>
          ${
            metaHtml
              ? `<div class="resource-meta resource-details-meta">${metaHtml}</div>`
              : ""
          }
          ${
            tagsHtml