25 lines
918 B
TypeScript
25 lines
918 B
TypeScript
import type { ReactNode } from "react";
|
|
import { sitePath, type DirectoryModel } from "@/lib/cookbook-pages";
|
|
|
|
export default function ModelHeader({ model, actions }: { model: DirectoryModel; actions?: ReactNode }) {
|
|
return (
|
|
<>
|
|
<a className="recipe-back" href={sitePath("/cookbook")}>
|
|
← All recipes
|
|
</a>
|
|
<header className="recipe-model-header">
|
|
<img src={sitePath(`/assets/logos/${model.logo}.webp`)} alt="" width="48" height="48" />
|
|
<div>
|
|
<p className="recipe-publisher">{model.provider}</p>
|
|
<h1>{model.title}</h1>
|
|
<p className="recipe-model-task">{model.tags.join(" · ")}</p>
|
|
{!model.model.startsWith("./") && (
|
|
<a href={`https://huggingface.co/${model.model}`}>View on Hugging Face ↗</a>
|
|
)}
|
|
</div>
|
|
<div className="recipe-model-actions">{actions}</div>
|
|
</header>
|
|
</>
|
|
);
|
|
}
|