Move Swagger-Link to Header

This commit is contained in:
2025-07-22 17:36:13 +02:00
parent c3eb42449f
commit 74feb160c0
2 changed files with 25 additions and 22 deletions

View File

@@ -6,12 +6,11 @@ import {
AccordionSummary, Button, ColorPaletteProp,
DialogContent,
DialogTitle, Input,
Link, Modal, ModalDialog, Stack
Modal, ModalDialog
} from "@mui/joy";
import './Settings.css';
import * as React from "react";
import {createContext, Dispatch, ReactNode, useContext, useEffect, useState} from "react";
import {Article} from '@mui/icons-material';
import {TrangaSettings} from "../../apiClient/data-contracts.ts";
import {ApiContext} from "../../apiClient/ApiContext.tsx";
import NotificationConnectors from "./NotificationConnectors.tsx";
@@ -75,9 +74,6 @@ export default function Settings({setApiUri} : {setApiUri: Dispatch<React.SetSta
<ChapterNamingScheme />
<NotificationConnectors />
</AccordionGroup>
<Stack spacing={2} direction="row">
<Link target={"_blank"} href={Api.baseUrl + "/swagger"}><Article />Swagger Doc</Link>
</Stack>
</DialogContent>
</ModalDialog>
</Modal>

View File

@@ -1,27 +1,34 @@
import Sheet from "@mui/joy/Sheet";
import {Box, Link, Stack, Typography} from "@mui/joy";
import {ReactElement} from "react";
import {Link, Stack, Typography} from "@mui/joy";
import {ReactElement, useContext} from "react";
import './Header.css';
import { GitHub } from "@mui/icons-material";
import {Article, GitHub} from "@mui/icons-material";
import {ApiContext} from "./apiClient/ApiContext.tsx";
export default function Header({children} : {children? : ReactElement<any, any> | ReactElement<any,any>[] | undefined}) : ReactElement {
const Api = useContext(ApiContext);
return (
<Sheet className={"header"}>
<Stack direction={"row"} spacing={2} sx={{width: "100%", alignItems: "center"}}>
{children}
<Box sx={{flexGrow: 1}} />
<img src={"/blahaj.png"} style={{cursor: "grab", maxHeight: "100%"}}/>
<Typography level={"h2"} sx={{
background: "linear-gradient(110deg, var(--joy-palette-primary-solidBg), var(--joy-palette-success-400))",
WebkitBackgroundClip: "text",
WebkitTextFillColor: "transparent",
fontWeight: "bold",
cursor: "default"
}}>Tranga</Typography>
<Box sx={{flexGrow: 1}} />
<Link target={"_blank"} href={"https://github.com/C9Glax/tranga"} color={"neutral"} height={"min-content"} ><GitHub /> Server</Link>
<Link target={"_blank"} href={"https://github.com/C9Glax/tranga-website"} color={"neutral"} height={"min-content"} ><GitHub /> Website</Link>
<Stack direction={"row"} spacing={2} sx={{width: "100%", alignItems: "center", justifyContent: "space-between"}} useFlexGap>
<Stack sx={{flexGrow: 1, flexBasis: 1}} direction={"row"} spacing={2}>
{children}
</Stack>
<Stack sx={{flexGrow: 1, height: "100%", flexBasis: 1, justifyContent: "center"}} direction={"row"}>
<img src={"/blahaj.png"} style={{cursor: "grab", maxHeight: "100%"}}/>
<Typography level={"h2"} sx={{
background: "linear-gradient(110deg, var(--joy-palette-primary-solidBg), var(--joy-palette-success-400))",
WebkitBackgroundClip: "text",
WebkitTextFillColor: "transparent",
fontWeight: "bold",
cursor: "default"
}}>Tranga</Typography>
</Stack>
<Stack sx={{flexGrow: 1, flexBasis: 1, justifyContent: "flex-end"}} direction={"row"} spacing={2}>
<Link target={"_blank"} href={"https://github.com/C9Glax/tranga"} color={"neutral"} height={"min-content"} ><GitHub /> Server</Link>
<Link target={"_blank"} href={"https://github.com/C9Glax/tranga-website"} color={"neutral"} height={"min-content"} ><GitHub /> Website</Link>
<Link target={"_blank"} href={Api.baseUrl + "/swagger"} color={"neutral"} height={"min-content"} ><Article />Swagger</Link>
</Stack>
</Stack>
</Sheet>
);