Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | 61x 61x 36x 36x 2x 61x 460x 396x | import React from 'react';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import Link from '@material-ui/core/Link';
import Button from '@material-ui/core/Button';
import TextField from '@material-ui/core/TextField';
import { makeStyles } from '@material-ui/core/styles'
const useStyles = makeStyles((theme) => ({
gridStyle:{
[theme.breakpoints.down('xs')]: {
paddingBottom: '8px',
},
},
typoStyle: {
fontWeight:'400',
[theme.breakpoints.down('xs')]: {
fontSize: '0.875rem',
},
},
}))
export const ProjectRepositorySection = ({ repositoryUrl,setDisplayState,linkStyles }) => {
const classes = useStyles()
return (
<Grid container direction="row" alignItems="center" style={{ paddingBottom: '32px' }}>
<Grid item xs={12} sm={3} className={classes.gridStyle} >
<Typography variant='h6' className={classes.typoStyle}>Project Repository URL:</Typography>
</Grid>
<Grid item xs={10} sm={7} data-cy='grid-repository-url'>
<Link variant='body1' className={classes.typoStyle} href={repositoryUrl} >{repositoryUrl}</Link>
</Grid>
<Grid item xs={2}>
<Link id="change-url" component="button" variant='body1' onClick={()=>setDisplayState('ProjectUrl')} underline='always' style={linkStyles} >change</Link>
</Grid>
</Grid>
)
}
export const ProjectRepositoryInput = ({ handleEnter, repositoryUrl,setRepositoryUrl, topicSearchError, handleSubmit }) => {
return (
<>
<Grid item style={{ padding: '16px 0px' }} xs={12}>
<Typography variant='h6'>Project Repository URL</Typography>
</Grid>
<Grid data-cy='grid-repository'>
<TextField id="repository-url" onKeyPress={handleEnter} value={repositoryUrl} onChange={e => setRepositoryUrl(e.target.value)} variant="outlined" placeholder="https://github.com/hackforla/example" fullWidth />
</Grid>
<Grid item xs={12} sm={12} style={{ padding: '20px', width: '100%', margin: '0 auto' }}>
{topicSearchError}
<Grid align='center'><Button onClick={handleSubmit} id='projectButton'>Find Project</Button></Grid>
</Grid>
</>
)
}
|