add: real doclinks, add code example styling

This commit is contained in:
hsjobeki 2022-12-03 16:16:26 +01:00
parent 33250208c5
commit d220297933

View File

@ -13,6 +13,11 @@ import LocalLibraryIcon from "@mui/icons-material/LocalLibrary";
import InputIcon from "@mui/icons-material/Input";
import { DocItem } from "../../types/nix";
import CodeIcon from "@mui/icons-material/Code";
// import hljs from "highlight.js";
// needed for nextjs to import the classes of github theme
import "highlight.js/styles/github.css";
interface PreviewProps {
docItem: DocItem;
}
@ -22,6 +27,10 @@ export const Preview = (props: PreviewProps) => {
const { name, description, category, example, fn_type } = docItem;
const prefix = category.split(/([\/.])/gm).at(4);
const libName = category
.match(/(?:[a-zA-Z]*)\.nix/gm)?.[0]
?.replace(".nix", "");
const docsRef = `https://nixos.org/manual/nixpkgs/stable/#function-library-lib.${libName}.${name}`;
return (
<Box sx={{ p: 1, width: "100%" }}>
<Typography variant="h2">{`${prefix}.${name}`}</Typography>
@ -39,7 +48,7 @@ export const Preview = (props: PreviewProps) => {
secondary={description}
/>
<ListItemSecondaryAction>
<Link href={"#"}>View Docs</Link>
<Link href={docsRef}>View Docs</Link>
</ListItemSecondaryAction>
</ListItem>
<ListItem>