Skip to content

Commit

Permalink
fix: separate user and repo in save form, update splash
Browse files Browse the repository at this point in the history
  • Loading branch information
ajmacdonald committed May 31, 2019
1 parent 5d042b1 commit b41a8db
Show file tree
Hide file tree
Showing 7 changed files with 156 additions and 119 deletions.
1 change: 1 addition & 0 deletions src/FileUpload.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@ class FileUpload extends Component {
<ControlLabel></ControlLabel>
<FormControl
componentClass="textarea"
style={{height: '100px'}}
value={this.state.xmlText}
placeholder="Paste your XML here"
onChange={this.handleTextChange}
Expand Down
145 changes: 77 additions & 68 deletions src/Save.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,68 +11,17 @@ if ($ === undefined) {
}

import React, {Fragment, Component} from 'react'
import { Modal, Button, Form, HelpBlock, FormControl, FormGroup, ControlLabel } from 'react-bootstrap';
import { Modal, Grid, Row, Col, Button, Form, HelpBlock, FormControl, FormGroup, ControlLabel } from 'react-bootstrap';

import VerifyRepo from './VerifyRepo.js'
import SaveToPath from './SaveToPath.js'

const SavedDialog = ({closedCB}) => {
return (
<Fragment>
<Modal.Header>Document Saved</Modal.Header>
<Modal.Body>Your document has been saved.</Modal.Body>
<Modal.Footer>
<Button onClick={closedCB} bsStyle="success">Ok</Button>
</Modal.Footer>
</Fragment>
)
}

const SaveForm = ({handleRepoChangeCB, handlePathChangeCB, saveFileCB, saveFileAsPullRequestCB, cancelCB, repo, path}) => {
return (
<Fragment>
<Modal.Header>Save to Repository</Modal.Header>
<Modal.Body>
<Form>
<FormGroup controlId="repo" validationState={null}>
<ControlLabel>Repository Path</ControlLabel>
<FormControl
type="text"
value={repo}
onChange={handleRepoChangeCB}/>
<HelpBlock>[GitHub-user-ID]/[GitHub-repository] (e.g., jchartrand/cheeses)</HelpBlock>
</FormGroup>
<FormGroup controlId="path" validationState={null}>
<ControlLabel>File Path</ControlLabel>
<FormControl
type="text"
value={path}
onChange={handlePathChangeCB} />
<HelpBlock>The repository path to which to save (e.g., french/basque/SaintSauveur.xml)</HelpBlock>
</FormGroup>
</Form>
</Modal.Body>
<Modal.Footer>
<Button onClick={cancelCB}>
Cancel
</Button>
<Button
onClick={saveFileCB}
bsStyle="success"
>Save</Button>
<Button
onClick={saveFileAsPullRequestCB}
bsStyle="success"
>Save As Pull Request</Button>
</Modal.Footer>
</Fragment>
)
}

class SaveCmp extends Component {
constructor(props) {
super(props);
this.handleChange = this.handleChange.bind(this);
this.saveFile = this.saveFile.bind(this);
this.saveFileAsPR = this.saveFileAsPR.bind(this);
}

componentWillMount() {
Expand All @@ -81,6 +30,7 @@ class SaveCmp extends Component {

resetState() {
this.setState({
user: this.props.user,
repo: this.props.repo,
path: this.props.path,
usePR: false,
Expand All @@ -94,6 +44,17 @@ class SaveCmp extends Component {
// handles changes passed up from the form
handleChange(name, value) {
this.setState({[name]: value});
switch(name) {
case 'path':
this.props.handlePathChange(value);
break;
case 'user':
this.props.handleRepoChange(value+'/'+this.state.repo);
break;
case 'repo':
this.props.handleRepoChange(this.state.user+'/'+value);
break;
}
}

// action on button click in form
Expand All @@ -107,7 +68,8 @@ class SaveCmp extends Component {
}

saved() {
this.setState({saved: true})
this.props.handleSaved(this.state.user+'/'+this.state.repo, this.state.path);
this.setState({saved: true});
}

// callback passed to VerifyRepo
Expand All @@ -121,30 +83,76 @@ class SaveCmp extends Component {
}

render() {
const {repo, path, usePR, message, submitted, repoVerified, saved} = this.state;
const {user, repo, path, usePR, message, submitted, repoVerified, saved} = this.state;
const handleClose = this.props.handleClose;
const handleRepoChange = this.props.handleRepoChange;
const handlePathChange = this.props.handlePathChange;
const getDocument = this.props.getDocument;
if (saved) {
return (
<SavedDialog closedCB={handleClose}/>
<Fragment>
<Modal.Header>Save to Repository</Modal.Header>
<Modal.Body>
<h4>Document Saved</h4>
<p>Your document has been saved.</p>
</Modal.Body>
<Modal.Footer>
<Button onClick={handleClose} bsStyle="success">Ok</Button>
</Modal.Footer>
</Fragment>
)
} else if (!submitted) {
return (
<SaveForm
handleRepoChangeCB={(e)=>{let val = e.target.value; this.handleChange('repo', val); handleRepoChange(val);}}
handlePathChangeCB={(e)=>{let val = e.target.value; this.handleChange('path', val); handlePathChange(val);}}
repo={repo}
path={path}
saveFileCB={this.saveFile.bind(this)}
saveFileAsPullRequestCB={this.saveFileAsPR.bind(this)}
cancelCB={handleClose}
/>
<Fragment>
<Modal.Header>Save to Repository</Modal.Header>
<Modal.Body>
<Form>
<Grid fluid>
<Row>
<h4>Repository Path</h4>
<Col sm={6}>
<FormGroup controlId="user" validationState={null}>
<ControlLabel>GitHub User</ControlLabel>
<FormControl
type="text"
value={user}
onChange={(e)=>{this.handleChange('user', e.target.value)}}/>
</FormGroup>
</Col>
<Col sm={6}>
<FormGroup controlId="repo" validationState={null}>
<ControlLabel>Repository Name</ControlLabel>
<FormControl
type="text"
value={repo}
onChange={(e)=>{this.handleChange('repo', e.target.value)}}/>
</FormGroup>
</Col>
</Row>
<Row>
<h4>File Path</h4>
<Col sm={12}>
<FormGroup controlId="path" validationState={null}>
<FormControl
type="text"
value={path}
onChange={(e)=>{this.handleChange('path', e.target.value)}}/>
<HelpBlock>The file (and folder) path to which to save (e.g., french/basque/SaintSauveur.xml)</HelpBlock>
</FormGroup>
</Col>
</Row>
</Grid>
</Form>
</Modal.Body>
<Modal.Footer>
<Button onClick={handleClose}>Cancel</Button>
<Button onClick={this.saveFile} bsStyle="success">Save</Button>
<Button onClick={this.saveFileAsPR} bsStyle="success">Save As Pull Request</Button>
</Modal.Footer>
</Fragment>
)
} else if (submitted && !repoVerified) {
return (
<VerifyRepo
user={user}
repo={repo}
path={path}
verifiedCB={this.repoVerified.bind(this)}
Expand All @@ -154,6 +162,7 @@ class SaveCmp extends Component {
} else if (submitted) {
return (
<SaveToPath
user={user}
repo={repo}
path={path}
getDocument={getDocument}
Expand Down
42 changes: 26 additions & 16 deletions src/SaveToPath.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,9 @@ import { Modal, Button } from 'react-bootstrap';

const ErrorModal = ({cancel, error}) => (
<Fragment>
<Modal.Header>An error occurred</Modal.Header>
<Modal.Header>Save to Repository</Modal.Header>
<Modal.Body>
<h4>An error occurred</h4>
<p>{error}</p>
</Modal.Body>
<Modal.Footer>
Expand All @@ -19,12 +20,13 @@ const ErrorModal = ({cancel, error}) => (

const ConfirmModal = ({cancel, title, body, ok}) => (
<Fragment>
<Modal.Header>{title}</Modal.Header>
<Modal.Header>Save to Repository</Modal.Header>
<Modal.Body>
<h4>{title}</h4>
<p>{body}</p>
</Modal.Body>
<Modal.Footer>
<Button onClick={cancel} bsStyle="danger">
<Button onClick={cancel}>
Cancel
</Button>
<Button
Expand All @@ -35,11 +37,11 @@ const ConfirmModal = ({cancel, title, body, ok}) => (
</Fragment>
)

const CheckingModal = () => (
const StatusModal = ({status}) => (
<Fragment>
<Modal.Header>Checking your file...</Modal.Header>
<Modal.Header>Save to Repository</Modal.Header>
<Modal.Body>
<p></p>
<p>{status}</p>
</Modal.Body>
</Fragment>
)
Expand All @@ -56,6 +58,7 @@ class SaveToPath extends Component {
error: null,
checkingPath: null,
pathHasBeenChecked: null,
saving: null,
branch: 'master',
commitMessage: 'Saved by CWRC-Writer',
prTitle: 'Request made from CWRC-Writer',
Expand All @@ -64,45 +67,50 @@ class SaveToPath extends Component {

componentDidMount() {
this.setState({checkingPath: true})
cwrcGit.getDoc(this.props.repo, 'master', this.props.path).then(
cwrcGit.getDoc(this.getFullRepoPath, 'master', this.props.path).then(
(result)=>{
this.setState({
checkingPath: false,
doesPathExist: true,
pathHasBeenChecked: true
pathHasBeenChecked: true,
saving: false
})
return result;
},
(error)=>{
error.status === 404 ? this.setState({
checkingPath: false,
doesPathExist: false,
pathHasBeenChecked: true
pathHasBeenChecked: true,
saving: false
}): this.displayError(error)
return error
})
}

getFullRepoPath() {
return this.props.user+'/'+this.props.repo;
}

complete = () => {
this.resetComponent()
this.props.savedCB()
//this.props.promiseResolve()
}

cancel = () => {
this.resetComponent()
this.props.cancelCB()
//this.props.promiseReject()
}

displayError = (error) => {
this.setState({error: error.statusText})
this.setState({error: error.statusText, saving: false})
}

save = () => {
this.setState({saving: true});
const document = this.props.getDocument();
this.props.usePR ?
cwrcGit.saveAsPullRequest(this.props.repo, this.props.path, document, this.state.prBranch, this.state.commitMessage, this.state.prTitle).then(
cwrcGit.saveAsPullRequest(this.getFullRepoPath(), this.props.path, document, this.state.prBranch, this.state.commitMessage, this.state.prTitle).then(
(result) => this.complete(),
(error) => {
if (error.statusText === 'Internal Server Error') {
Expand All @@ -111,7 +119,7 @@ class SaveToPath extends Component {
this.displayError(error)
}
) :
cwrcGit.saveDoc(this.props.repo, this.props.path, document, this.state.branch, this.state.commitMessage).then(
cwrcGit.saveDoc(this.getFullRepoPath(), this.props.path, document, this.state.branch, this.state.commitMessage).then(
(result) => this.complete(),
(error) => {
if (error.statusText === 'Not Found') {
Expand All @@ -124,14 +132,16 @@ class SaveToPath extends Component {
}

render() {
const {pathHasBeenChecked, doesPathExist, error, checkingPath} = this.state
const {pathHasBeenChecked, doesPathExist, error, checkingPath, saving} = this.state

if (error) {
return <ErrorModal
error = {error}
cancel = {this.cancel.bind(this)}/>
} else if (saving) {
return <StatusModal status='Saving your file...' />
} else if (checkingPath) {
return <CheckingModal/>
return <StatusModal status='Checking your file...' />
} else if (doesPathExist) {
return <ConfirmModal
title='File Exists'
Expand Down
Loading

0 comments on commit b41a8db

Please sign in to comment.