Skip to content

Commit 5fa13e9

Browse files
author
Jay (CIS-A2K)
committed
Link documentation page and phab projects
Bug: T285632 Change-Id: I5f814599abf6a6a26a5f5c72a6b7c9aa268f2709
1 parent f374207 commit 5fa13e9

File tree

3 files changed

+155
-39
lines changed

3 files changed

+155
-39
lines changed

‎src/App.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import './App.css';
99
import Backdrop from '@material-ui/core/Backdrop';
1010
import CircularProgress from '@material-ui/core/CircularProgress';
1111
import { makeStyles } from '@material-ui/core/styles';
12-
import { Paper, Typography } from '@material-ui/core';
1312

1413
const useStyles = makeStyles((theme) => ({
1514
backdrop: {

‎src/components/AboutDialog.js‎

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
import React from 'react';
2+
import { withStyles } from '@material-ui/core/styles';
3+
import Button from '@material-ui/core/Button';
4+
import Dialog from '@material-ui/core/Dialog';
5+
import MuiDialogTitle from '@material-ui/core/DialogTitle';
6+
import MuiDialogContent from '@material-ui/core/DialogContent';
7+
import IconButton from '@material-ui/core/IconButton';
8+
import CloseIcon from '@material-ui/icons/Close';
9+
import Typography from '@material-ui/core/Typography';
10+
11+
const styles = (theme) => ({
12+
root: {
13+
margin: 0,
14+
padding: theme.spacing(2),
15+
},
16+
closeButton: {
17+
position: 'absolute',
18+
right: theme.spacing(1),
19+
top: theme.spacing(1),
20+
color: theme.palette.grey[500],
21+
},
22+
});
23+
24+
const DialogTitle = withStyles(styles)((props) => {
25+
const { children, classes, onClose, ...other } = props;
26+
return (
27+
<MuiDialogTitle disableTypography className={classes.root} {...other}>
28+
<Typography variant="h6">{children}</Typography>
29+
{onClose ? (
30+
<IconButton aria-label="close" className={classes.closeButton} onClick={onClose}>
31+
<CloseIcon />
32+
</IconButton>
33+
) : null}
34+
</MuiDialogTitle>
35+
);
36+
});
37+
38+
const DialogContent = withStyles((theme) => ({
39+
root: {
40+
padding: theme.spacing(2),
41+
},
42+
}))(MuiDialogContent);
43+
44+
function AboutDialog({ isOpen, setOpen }) {
45+
46+
const handleClose = () => {
47+
setOpen(false);
48+
};
49+
50+
return (
51+
<div>
52+
<Dialog onClose={handleClose} aria-labelledby="customized-dialog-title" open={isOpen}>
53+
<DialogTitle id="customized-dialog-title" onClose={handleClose}>
54+
About
55+
</DialogTitle>
56+
<DialogContent dividers>
57+
<Typography gutterBottom>
58+
Bodh is a tool that helps users to add statements to Wikidata lexemes, senses and forms and edit them, if required. <br />
59+
The tool was developed as an assignment from <a href="https://meta.wikimedia.org/wiki/CIS-A2K" target="_blank" rel="noreferrer">CIS-A2K</a>.
60+
</Typography>
61+
<br />
62+
<Typography variant="h5">
63+
Credit
64+
</Typography>
65+
<ul>
66+
<li>
67+
<a href="https://www.wikidata.org/wiki/User:Magnus_Manske" target="_blank" rel="noreferrer">Magnus Manske</a> <small>(Inspiration from him Tabernacle tool)</small>
68+
</li>
69+
<li>
70+
<a href="https://www.wikidata.org/wiki/User:Tito_(CIS-A2K)" target="_blank" rel="noreferrer">Tito (CIS-A2K)</a> <small>(Cordinator)</small>
71+
</li>
72+
<li>
73+
<a href="https://www.wikidata.org/wiki/User:Bodhisattwa_(CIS-A2K)" target="_blank" rel="noreferrer">Bodhisattwa (CIS-A2K)</a> <small>(Wikidata guide)</small>
74+
</li>
75+
<li>
76+
<a href="https://www.wikidata.org/wiki/User:Jay_(CIS-A2K)" target="_blank" rel="noreferrer">Jay (CIS-A2K)</a> <small>(Developer intern)</small>
77+
</li>
78+
</ul>
79+
<Typography gutterBottom>
80+
This tool is released under MIT license.
81+
</Typography>
82+
<br />
83+
<Button
84+
variant="outlined"
85+
color="primary"
86+
href="https://www.wikidata.org/wiki/Wikidata:Bodh"
87+
target="_blank"
88+
rel="noreferrer"
89+
>
90+
Read documention
91+
</Button>
92+
<Button
93+
variant="outlined"
94+
color="secondary"
95+
href="https://phabricator.wikimedia.org/project/profile/5166/"
96+
target="_blank"
97+
rel="noreferrer"
98+
style={{ marginLeft: '6px' }}
99+
>
100+
Report the bug
101+
</Button>
102+
</DialogContent>
103+
</Dialog>
104+
</div>
105+
);
106+
}
107+
108+
export default AboutDialog;

‎src/components/Header.js‎

Lines changed: 47 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useSelector, useDispatch } from 'react-redux'
22

3-
import React, { useEffect } from 'react';
3+
import React, { useEffect, useState } from 'react';
44
import { makeStyles } from '@material-ui/core/styles';
55
import AppBar from '@material-ui/core/AppBar';
66
import Toolbar from '@material-ui/core/Toolbar';
@@ -11,6 +11,9 @@ import MenuItem from '@material-ui/core/MenuItem';
1111
import FormHelperText from '@material-ui/core/FormHelperText';
1212
import FormControl from '@material-ui/core/FormControl';
1313
import Select from '@material-ui/core/Select';
14+
import Tooltip from '@material-ui/core/Tooltip';
15+
16+
import AboutDialog from './AboutDialog';
1417

1518
import { setProfile, setInputLang } from './../actions';
1619
import { allowedInputLanguage } from './../util';
@@ -23,6 +26,7 @@ const useStyles = makeStyles((theme) => ({
2326

2427
function Header() {
2528
const classes = useStyles();
29+
const [ isOpen, setOpen ] = useState(false)
2630
const [ currentUser, inputLanguage ] = useSelector( s => [ s.currentUser, s.inputLanguage] )
2731
const dispatch = useDispatch()
2832

@@ -35,45 +39,50 @@ function Header() {
3539
}, [ dispatch ] )
3640

3741
return (
38-
<AppBar position="static" style={{ lineHeight: 'normal' }}>
39-
<Toolbar>
40-
<div style={{ display: 'flex', flexDirection: 'column' }}>
41-
<Typography variant="h4" style={{ padding: 0 }}>
42-
<a href="/" style={{ color: 'white', textDecoration: 'none' }}>बोध</a>
43-
</Typography>
44-
<span style={{ fontSize: '0.7rem', margin: 0, padding: 0 }}>A tool that adds statements to lexemes, senses and forms.</span>
45-
</div>
46-
<div style={{ marginLeft: 'auto' }}>
47-
{currentUser ?
48-
<>
49-
<Typography style={{ display: "inline" }}>Logged in as {currentUser} </Typography>
42+
<>
43+
<AppBar position="static" style={{ lineHeight: 'normal' }}>
44+
<Toolbar>
45+
<div style={{ display: 'flex', flexDirection: 'column' }}>
46+
<Typography variant="h4" style={{ padding: 0 }}>
47+
<a href="/" style={{ color: 'white', textDecoration: 'none' }}>बोध</a>
48+
</Typography>
49+
<span style={{ fontSize: '0.7rem', margin: 0, padding: 0 }}>A tool that adds statements to lexemes, senses and forms.</span>
50+
</div>
51+
<div style={{ marginLeft: 'auto' }}>
52+
{currentUser ?
53+
<>
54+
<Typography style={{ display: "inline" }}>Logged in as {currentUser} </Typography>
55+
<Button variant="contained" color="secondary" style={{ backgroundColor: 'orange' }}>
56+
<a href="https://bodh-backend.toolforge.org/logout" style={{ color: 'white' }}>Logout</a>
57+
</Button>
58+
</>
59+
:
5060
<Button variant="contained" color="secondary" style={{ backgroundColor: 'orange' }}>
51-
<a href="https://bodh-backend.toolforge.org/logout" style={{ color: 'white' }}>Logout</a>
61+
<a href="https://bodh-backend.toolforge.org/login" style={{ color: 'white' }}>Login</a>
5262
</Button>
53-
</>
54-
:
55-
<Button variant="contained" color="secondary" style={{ backgroundColor: 'orange' }}>
56-
<a href="https://bodh-backend.toolforge.org/login" style={{ color: 'white' }}>Login</a>
57-
</Button>
58-
}
59-
</div>
60-
<div >
61-
<Button href="https://www.wikidata.org/wiki/Wikidata:bodh" target="_blank">
62-
<GroupIcon style={{ color: 'white' }}/>
63-
</Button>
64-
</div>
65-
{currentUser ?
66-
<FormControl>
67-
<Select className={classes.clrWhite} value={inputLanguage} onChange={handleInputLangChange}>
68-
{allowedInputLanguage().map( (lang) => {
69-
return <MenuItem value={lang}>{lang}</MenuItem>
70-
})}
71-
</Select>
72-
<FormHelperText className={classes.clrWhite}>Input language</FormHelperText>
73-
</FormControl>
74-
: null }
75-
</Toolbar>
76-
</AppBar>
63+
}
64+
</div>
65+
<div >
66+
<Tooltip title="About" placement="bottom">
67+
<Button onClick={() => setOpen(true)}>
68+
<GroupIcon style={{ color: 'white' }}/>
69+
</Button>
70+
</Tooltip>
71+
</div>
72+
{currentUser ?
73+
<FormControl>
74+
<Select className={classes.clrWhite} value={inputLanguage} onChange={handleInputLangChange}>
75+
{allowedInputLanguage().map( (lang) => {
76+
return <MenuItem value={lang}>{lang}</MenuItem>
77+
})}
78+
</Select>
79+
<FormHelperText className={classes.clrWhite}>Input language</FormHelperText>
80+
</FormControl>
81+
: null }
82+
</Toolbar>
83+
</AppBar>
84+
<AboutDialog isOpen={isOpen} setOpen={setOpen} />
85+
</>
7786
)
7887

7988
}

0 commit comments

Comments
 (0)