; + article: Article; +}; + + +export type QueryArticleArgs = { + id: Scalars['String']; +}; + +export type UpdateArticleInput = { + title?: Maybe; + content?: Maybe; + publishedAt?: Maybe; + tags?: Maybe>; + id: Scalars['Int']; +}; diff --git a/src/index.css b/src/index.css index ec2585e..5f785a8 100644 --- a/src/index.css +++ b/src/index.css @@ -11,3 +11,8 @@ code { font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; } + +a { + text-decoration: none; + color: inherit; +} diff --git a/src/index.tsx b/src/index.tsx index e7ee1e7..ae0ded6 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -4,12 +4,21 @@ import './index.css'; import "fontsource-roboto"; import App from './App'; import reportWebVitals from './reportWebVitals'; +import { client } from './commons/graphql/client'; +import { ApolloProvider } from '@apollo/client'; +import { MuiPickersUtilsProvider } from '@material-ui/pickers'; +import DateFnsUtils from "@date-io/date-fns"; +import zhLocale from "date-fns/locale/zh-CN"; ReactDOM.render( - + + + + + , - document.getElementById('root') + document.getElementById("root") ); // If you want to start measuring performance in your app, pass a function diff --git a/src/layouts/default.tsx b/src/layouts/default.tsx new file mode 100644 index 0000000..379c772 --- /dev/null +++ b/src/layouts/default.tsx @@ -0,0 +1,199 @@ +import React, { FC } from "react"; +import clsx from "clsx"; +import { + createStyles, + makeStyles, + useTheme, + Theme, +} from "@material-ui/core/styles"; +import Drawer from "@material-ui/core/Drawer"; +import AppBar from "@material-ui/core/AppBar"; +import Toolbar from "@material-ui/core/Toolbar"; +import List from "@material-ui/core/List"; +import CssBaseline from "@material-ui/core/CssBaseline"; +import Typography from "@material-ui/core/Typography"; +import Divider from "@material-ui/core/Divider"; +import IconButton from "@material-ui/core/IconButton"; +import MenuIcon from "@material-ui/icons/Menu"; +import ChevronLeftIcon from "@material-ui/icons/ChevronLeft"; +import ChevronRightIcon from "@material-ui/icons/ChevronRight"; +import ListItem from "@material-ui/core/ListItem"; +import ListItemIcon from "@material-ui/core/ListItemIcon"; +import ListItemText from "@material-ui/core/ListItemText"; +import { Link, Route, BrowserRouter, Switch } from 'react-router-dom'; +import { AddCircle, Description, LocalOffer } from '@material-ui/icons'; +import { ArticleIndex } from '../articles'; +import { ArticleEditor } from '../articles/article-editor'; +const drawerWidth = 240; + +const useStyles = makeStyles((theme: Theme) => + createStyles({ + root: { + display: "flex", + }, + appBar: { + zIndex: theme.zIndex.drawer + 1, + transition: theme.transitions.create(["width", "margin"], { + easing: theme.transitions.easing.sharp, + duration: theme.transitions.duration.leavingScreen, + }), + }, + appBarShift: { + marginLeft: drawerWidth, + width: `calc(100% - ${drawerWidth}px)`, + transition: theme.transitions.create(["width", "margin"], { + easing: theme.transitions.easing.sharp, + duration: theme.transitions.duration.enteringScreen, + }), + }, + menuButton: { + marginRight: 36, + }, + hide: { + display: "none", + }, + drawer: { + width: drawerWidth, + flexShrink: 0, + whiteSpace: "nowrap", + }, + drawerOpen: { + width: drawerWidth, + transition: theme.transitions.create("width", { + easing: theme.transitions.easing.sharp, + duration: theme.transitions.duration.enteringScreen, + }), + }, + drawerClose: { + transition: theme.transitions.create("width", { + easing: theme.transitions.easing.sharp, + duration: theme.transitions.duration.leavingScreen, + }), + overflowX: "hidden", + width: theme.spacing(7) + 1, + [theme.breakpoints.up("sm")]: { + width: theme.spacing(9) + 1, + }, + }, + toolbar: { + display: "flex", + alignItems: "center", + justifyContent: "flex-end", + padding: theme.spacing(0, 1), + // necessary for content to be below app bar + ...theme.mixins.toolbar, + }, + content: { + flexGrow: 1, + padding: theme.spacing(3), + }, + }) +); + +export const DefaultLayout: FC = ({children}) => { + const classes = useStyles(); + const theme = useTheme(); + const [open, setOpen] = React.useState(false); + + const handleDrawerOpen = () => { + setOpen(true); + }; + + const handleDrawerClose = () => { + setOpen(false); + }; + + return ( + + + + + + + + + + Mini variant drawer + + + + + + + {theme.direction === "rtl" ? ( + + ) : ( + + )} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Tags + + + + + ); +} diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx new file mode 100644 index 0000000..e06f8e4 --- /dev/null +++ b/src/layouts/index.tsx @@ -0,0 +1 @@ +export * from './default'; \ No newline at end of file