|
1 | 1 | import { Group, Box, Button, Text, Stack } from "@mantine/core"; |
2 | 2 | import Link from "next/link"; |
3 | | -import { IconArrowRight, IconArrowLeft, IconPencil } from "@tabler/icons-react"; |
| 3 | +import { |
| 4 | + IconArrowRight, |
| 5 | + IconArrowLeft, |
| 6 | + IconPencil, |
| 7 | + IconBug, |
| 8 | +} from "@tabler/icons-react"; |
4 | 9 | import { DocMetadata } from "@/docs-collection-types"; |
5 | 10 |
|
| 11 | +function buildIssueUrl(currentPage: DocMetadata): string { |
| 12 | + const repoBase = |
| 13 | + currentPage.type === "local-doc" |
| 14 | + ? "https://github.com/prometheus/docs" |
| 15 | + : `https://github.com/${currentPage.owner}/${currentPage.repo}`; |
| 16 | + |
| 17 | + const title = encodeURIComponent(`docs: Issue with "${currentPage.title}"`); |
| 18 | + const body = encodeURIComponent( |
| 19 | + `**Page:** https://prometheus.io/docs/${currentPage.slug}/\n\n**Describe the issue:**\n\n` |
| 20 | + ); |
| 21 | + |
| 22 | + return `${repoBase}/issues/new?title=${title}&body=${body}`; |
| 23 | +} |
| 24 | + |
6 | 25 | export default function PrevNextEditButtons({ |
7 | 26 | currentPage, |
8 | 27 | }: { |
@@ -47,35 +66,53 @@ export default function PrevNextEditButtons({ |
47 | 66 | </Button> |
48 | 67 | )} |
49 | 68 | </Box> |
50 | | - <Button |
51 | | - flex="0 1 40%" |
52 | | - maw="40%" |
53 | | - component="a" |
54 | | - href={ |
55 | | - currentPage.type === "local-doc" |
56 | | - ? `https://github.com/prometheus/docs/blob/main/docs/${currentPage.slug}.md` |
57 | | - : `https://github.com/${currentPage.owner}/${ |
58 | | - currentPage.repo |
59 | | - }/blob/main/docs/${currentPage.slug |
60 | | - .split("/") |
61 | | - .slice(currentPage.slugPrefix.split("/").length + 1) |
62 | | - .join("/")}.md` |
63 | | - } |
64 | | - target="_blank" |
65 | | - variant="subtle" |
66 | | - color="var(--mantine-color-text)" |
67 | | - h={80} |
68 | | - leftSection={<IconPencil size={18} stroke={1.5} />} |
69 | | - fw="normal" |
70 | | - visibleFrom="xs" |
71 | | - > |
72 | | - <Text inherit hiddenFrom="md"> |
73 | | - Edit |
74 | | - </Text> |
75 | | - <Text inherit visibleFrom="md"> |
76 | | - Edit this page |
77 | | - </Text> |
78 | | - </Button> |
| 69 | + <Group gap="xs"> |
| 70 | + <Button |
| 71 | + component="a" |
| 72 | + href={ |
| 73 | + currentPage.type === "local-doc" |
| 74 | + ? `https://github.com/prometheus/docs/blob/main/docs/${currentPage.slug}.md` |
| 75 | + : `https://github.com/${currentPage.owner}/${ |
| 76 | + currentPage.repo |
| 77 | + }/blob/main/docs/${currentPage.slug |
| 78 | + .split("/") |
| 79 | + .slice(currentPage.slugPrefix.split("/").length + 1) |
| 80 | + .join("/")}.md` |
| 81 | + } |
| 82 | + target="_blank" |
| 83 | + variant="subtle" |
| 84 | + color="var(--mantine-color-text)" |
| 85 | + h={80} |
| 86 | + leftSection={<IconPencil size={18} stroke={1.5} />} |
| 87 | + fw="normal" |
| 88 | + visibleFrom="xs" |
| 89 | + > |
| 90 | + <Text inherit hiddenFrom="md"> |
| 91 | + Edit |
| 92 | + </Text> |
| 93 | + <Text inherit visibleFrom="md"> |
| 94 | + Edit this page |
| 95 | + </Text> |
| 96 | + </Button> |
| 97 | + <Button |
| 98 | + component="a" |
| 99 | + href={buildIssueUrl(currentPage)} |
| 100 | + target="_blank" |
| 101 | + variant="subtle" |
| 102 | + color="var(--mantine-color-text)" |
| 103 | + h={80} |
| 104 | + leftSection={<IconBug size={18} stroke={1.5} />} |
| 105 | + fw="normal" |
| 106 | + visibleFrom="xs" |
| 107 | + > |
| 108 | + <Text inherit hiddenFrom="md"> |
| 109 | + Issue |
| 110 | + </Text> |
| 111 | + <Text inherit visibleFrom="md"> |
| 112 | + Report an issue |
| 113 | + </Text> |
| 114 | + </Button> |
| 115 | + </Group> |
79 | 116 | <Box flex="0 1 40%" maw="40%" ta="right"> |
80 | 117 | {currentPage.next && ( |
81 | 118 | <Button |
|
0 commit comments