Co-authored-by: Vadim Smirnov <smirnou.vadzim@gmail.com> Co-authored-by: zakariasaad <zakaria.elas@gmail.com> Co-authored-by: Vilfred Sikker <vilfredsikker@gmail.com> Co-authored-by: olivermrbl <oliver@mrbltech.com>
46 lines
1.1 KiB
JavaScript
46 lines
1.1 KiB
JavaScript
import React from "react"
|
|
import { Flex, Text } from "theme-ui"
|
|
import CodeBox from "./code-box"
|
|
|
|
const EndpointContainer = ({ endpoints }) => {
|
|
if (!endpoints) return null
|
|
|
|
return (
|
|
<CodeBox header="ENDPOINTS">
|
|
<Flex
|
|
py={2}
|
|
sx={{
|
|
flexDirection: "column",
|
|
}}
|
|
>
|
|
{endpoints.map((e, i) => {
|
|
const method = e.method.toUpperCase()
|
|
const endpoint = e.endpoint
|
|
return (
|
|
<Flex
|
|
key={i}
|
|
sx={{ fontSize: "0", fontFamily: "monospace", px: "3", py: "2" }}
|
|
>
|
|
<Text
|
|
variant={`labels.${method}`}
|
|
sx={{
|
|
width: "55px",
|
|
textAlign: "right",
|
|
}}
|
|
mr={2}
|
|
>
|
|
{method}
|
|
</Text>
|
|
<Text sx={{ color: "dark" }}>
|
|
{endpoint.replace(/{(.*?)}/g, ":$1")}
|
|
</Text>
|
|
</Flex>
|
|
)
|
|
})}
|
|
</Flex>
|
|
</CodeBox>
|
|
)
|
|
}
|
|
|
|
export default EndpointContainer
|