diff options
Diffstat (limited to 'webui/src/layout')
-rw-r--r-- | webui/src/layout/CommentInput/CommentInput.tsx | 107 | ||||
-rw-r--r-- | webui/src/layout/CurrentIdentity.graphql | 8 | ||||
-rw-r--r-- | webui/src/layout/CurrentIdentity.tsx | 31 | ||||
-rw-r--r-- | webui/src/layout/Header.tsx | 50 | ||||
-rw-r--r-- | webui/src/layout/IfLoggedIn.tsx | 14 | ||||
-rw-r--r-- | webui/src/layout/index.tsx | 18 |
6 files changed, 0 insertions, 228 deletions
diff --git a/webui/src/layout/CommentInput/CommentInput.tsx b/webui/src/layout/CommentInput/CommentInput.tsx deleted file mode 100644 index 86cc7dbb..00000000 --- a/webui/src/layout/CommentInput/CommentInput.tsx +++ /dev/null @@ -1,107 +0,0 @@ -import React, { useState, useEffect } from 'react'; - -import Tab from '@material-ui/core/Tab'; -import Tabs from '@material-ui/core/Tabs'; -import TextField from '@material-ui/core/TextField'; -import { makeStyles } from '@material-ui/core/styles'; - -import Content from 'src/components/Content'; - -/** - * Styles - */ -const useStyles = makeStyles((theme) => ({ - container: { - margin: theme.spacing(2, 0), - padding: theme.spacing(0, 2, 2, 2), - }, - textarea: {}, - tabContent: { - margin: theme.spacing(2, 0), - }, - preview: { - borderBottom: `solid 3px ${theme.palette.grey['200']}`, - minHeight: '5rem', - }, -})); - -type TabPanelProps = { - children: React.ReactNode; - value: number; - index: number; -} & React.HTMLProps<HTMLDivElement>; -function TabPanel({ children, value, index, ...props }: TabPanelProps) { - return ( - <div - role="tabpanel" - hidden={value !== index} - id={`editor-tabpanel-${index}`} - aria-labelledby={`editor-tab-${index}`} - {...props} - > - {value === index && children} - </div> - ); -} - -const a11yProps = (index: number) => ({ - id: `editor-tab-${index}`, - 'aria-controls': `editor-tabpanel-${index}`, -}); - -type Props = { - inputProps?: any; - loading: boolean; - onChange: (comment: string) => void; -}; - -/** - * Component for issue comment input - * - * @param inputProps Reset input value - * @param loading Disable input when component not ready yet - * @param onChange Callback to return input value changes - */ -function CommentInput({ inputProps, loading, onChange }: Props) { - const [input, setInput] = useState<string>(''); - const [tab, setTab] = useState(0); - const classes = useStyles(); - - useEffect(() => { - if (inputProps) setInput(inputProps.value); - }, [inputProps]); - - useEffect(() => { - onChange(input); - }, [input, onChange]); - - return ( - <div> - <Tabs value={tab} onChange={(_, t) => setTab(t)}> - <Tab label="Write" {...a11yProps(0)} /> - <Tab label="Preview" {...a11yProps(1)} /> - </Tabs> - <div className={classes.tabContent}> - <TabPanel value={tab} index={0}> - <TextField - fullWidth - label="Comment" - placeholder="Leave a comment" - className={classes.textarea} - multiline - value={input} - variant="filled" - rows="4" // TODO: rowsMin support - onChange={(e: any) => setInput(e.target.value)} - disabled={loading} - /> - </TabPanel> - <TabPanel value={tab} index={1} className={classes.preview}> - <Content markdown={input} /> - </TabPanel> - </div> - </div> - ); -} - -export default CommentInput; diff --git a/webui/src/layout/CurrentIdentity.graphql b/webui/src/layout/CurrentIdentity.graphql deleted file mode 100644 index 2794a40f..00000000 --- a/webui/src/layout/CurrentIdentity.graphql +++ /dev/null @@ -1,8 +0,0 @@ -query CurrentIdentity { - repository { - userIdentity { - displayName - avatarUrl - } - } -} diff --git a/webui/src/layout/CurrentIdentity.tsx b/webui/src/layout/CurrentIdentity.tsx deleted file mode 100644 index 8cd3585b..00000000 --- a/webui/src/layout/CurrentIdentity.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; - -import Avatar from '@material-ui/core/Avatar'; -import { makeStyles } from '@material-ui/core/styles'; - -import { useCurrentIdentityQuery } from './CurrentIdentity.generated'; - -const useStyles = makeStyles((theme) => ({ - displayName: { - marginLeft: theme.spacing(2), - }, -})); - -const CurrentIdentity = () => { - const classes = useStyles(); - const { loading, error, data } = useCurrentIdentityQuery(); - - if (error || loading || !data?.repository?.userIdentity) return null; - - const user = data.repository.userIdentity; - return ( - <> - <Avatar src={user.avatarUrl ? user.avatarUrl : undefined}> - {user.displayName.charAt(0).toUpperCase()} - </Avatar> - <div className={classes.displayName}>{user.displayName}</div> - </> - ); -}; - -export default CurrentIdentity; diff --git a/webui/src/layout/Header.tsx b/webui/src/layout/Header.tsx deleted file mode 100644 index b0fae3cc..00000000 --- a/webui/src/layout/Header.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import React from 'react'; -import { Link } from 'react-router-dom'; - -import AppBar from '@material-ui/core/AppBar'; -import Toolbar from '@material-ui/core/Toolbar'; -import { makeStyles } from '@material-ui/core/styles'; - -import CurrentIdentity from './CurrentIdentity'; - -const useStyles = makeStyles((theme) => ({ - offset: { - ...theme.mixins.toolbar, - }, - filler: { - flexGrow: 1, - }, - appTitle: { - ...theme.typography.h6, - color: 'white', - textDecoration: 'none', - display: 'flex', - alignItems: 'center', - }, - logo: { - height: '42px', - marginRight: theme.spacing(2), - }, -})); - -function Header() { - const classes = useStyles(); - - return ( - <> - <AppBar position="fixed" color="primary"> - <Toolbar> - <Link to="/" className={classes.appTitle}> - <img src="/logo.svg" className={classes.logo} alt="git-bug" /> - git-bug - </Link> - <div className={classes.filler}></div> - <CurrentIdentity /> - </Toolbar> - </AppBar> - <div className={classes.offset} /> - </> - ); -} - -export default Header; diff --git a/webui/src/layout/IfLoggedIn.tsx b/webui/src/layout/IfLoggedIn.tsx deleted file mode 100644 index 9f4a7576..00000000 --- a/webui/src/layout/IfLoggedIn.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; - -import { useCurrentIdentityQuery } from './CurrentIdentity.generated'; - -type Props = { children: () => React.ReactNode }; -const IfLoggedIn = ({ children }: Props) => { - const { loading, error, data } = useCurrentIdentityQuery(); - - if (error || loading || !data?.repository?.userIdentity) return null; - - return <>{children()}</>; -}; - -export default IfLoggedIn; diff --git a/webui/src/layout/index.tsx b/webui/src/layout/index.tsx deleted file mode 100644 index 42a0cfc1..00000000 --- a/webui/src/layout/index.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; - -import CssBaseline from '@material-ui/core/CssBaseline'; - -import Header from './Header'; - -type Props = { children: React.ReactNode }; -function Layout({ children }: Props) { - return ( - <> - <CssBaseline /> - <Header /> - {children} - </> - ); -} - -export default Layout; |