quartz/quartz/components/_GithubSource.tsx

import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
import style from "./styles/_githubSource.scss"

// @ts-ignore
import { classNames } from "../util/lang"

interface GithubSourceOptions {
  repoLink: string
  branch: string
}

const defaultOptions: GithubSourceOptions = {
  repoLink: "github.com",
  branch: "v4",
}

export default ((opts?: Partial<GithubSourceOptions>) => {
  // Merge options with defaults
  const options: GithubSourceOptions = { ...defaultOptions, ...opts }
  const GithubSource: QuartzComponent = ({ displayClass, fileData }: QuartzComponentProps) => {
    return (
      <div class={classNames(displayClass, "github-source")}>
        <h3>Инструменты</h3>
        <ul>
          <li>
            <a
              href={`${options?.repoLink}/blob/${options?.branch}/${fileData.filePath!.replace(/^content\//, "")}`}
              className="external"
            >
              ✏️ Редактировать
            </a>
          </li>
          <li>
            <a
              href={`${options?.repoLink}/commits/${options?.branch}/${fileData.filePath!.replace(/^content\//, "")}`}
              className="external"
            >
              🕒 История изменений
            </a>
          </li>
          <li>
            <a
              href={`${options?.repoLink}/blame/${options?.branch}/${fileData.filePath!.replace(/^content\//, "")}`}
              className="external"
            >
              🧑‍💻 Авторы
            </a>
          </li>
        </ul>
      </div>
    )
  }
  GithubSource.css = style
  return GithubSource
}) satisfies QuartzComponentConstructor