Skip to content

Commit

Permalink
Fixed issues with create and edit
Browse files Browse the repository at this point in the history
  • Loading branch information
@ericsoderberghp
ericsoderberghp committed Jul 8, 2020
1 parent ae05c5a commit 6696c71
Show file tree
Hide file tree
Showing 6 changed files with 224 additions and 149 deletions.
26 changes: 24 additions & 2 deletions funcs/roadmaps/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ exports.roadmaps = (req, res) => {
res.set('Access-Control-Allow-Origin', '*');

if (req.method === 'OPTIONS') {
res.set('Access-Control-Allow-Methods', 'GET, POST, PUT');
res.set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
res.set('Access-Control-Allow-Headers', 'Content-Type, Authorization');
res.set('Access-Control-Max-Age', '3600');
res.status(204).send('');
Expand Down Expand Up @@ -72,7 +72,7 @@ exports.roadmaps = (req, res) => {
delete roadmap.password;
res.status(200).type('json').send(JSON.stringify(roadmap));
})
.catch((e) => res.status(400).send(e.message));
.catch((e) => res.status(404).send(e.message));
}

if (req.method === 'POST') {
Expand Down Expand Up @@ -141,5 +141,27 @@ exports.roadmaps = (req, res) => {
.catch((e) => res.status(400).send(e.message));
}

if (req.method === 'DELETE') {
const parts = req.url.split('/');
const id = decodeURIComponent(parts[1]);
const password = getPassword();
const file = bucket.file(`${id}.json`);

return file
.download()
.then((data) => {
const roadmap = JSON.parse(data[0]);
if (
roadmap.password &&
(!password || !checkPassword(roadmap, password))
) {
return res.header('WWW-Authenticate', 'Basic').status(401).send();
}

return file.delete().then(() => res.status(200).send());
})
.catch((e) => res.status(400).send(e.message));
}

res.status(405).send();
};
218 changes: 122 additions & 96 deletions src/ItemEdit.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
import { Calendar, Close } from 'grommet-icons';
import { update } from './data';
import Status from './Status';
import Auth from './Auth';

const defaultItem = { name: '', section: '', target: '', status: '', url: '' };
const statusOptions = ['ready', 'in progress', 'done', 'none'];
Expand All @@ -23,6 +24,36 @@ const ItemEdit = ({ index, roadmap, onChange, onDone }) => {
index >= 0 ? roadmap.items[index] : defaultItem,
);
const [changing, setChanging] = useState();
const [auth, setAuth] = useState();

const submit = (password) => {
setChanging(true);
setAuth(false);

const nextRoadmap = JSON.parse(JSON.stringify(roadmap));
const nextItem = { ...value };
delete nextItem.index;
if (nextItem.status === 'none') delete nextItem.status;
if (!nextItem.url) delete nextItem.url;
if (index >= 0) nextRoadmap.items[index] = nextItem;
else nextRoadmap.items.unshift(nextItem);
// add section, if needed
if (!nextRoadmap.sections.find((s) => nextItem.section)) {
nextRoadmap.sections.push(nextItem.section);
}

update(nextRoadmap, password)
.then(() => {
setChanging(false);
onChange(nextRoadmap);
onDone();
if (index >= 0) onDone();
})
.catch((status) => {
if (status === 401) setAuth(true);
else onDone();
});
};

return (
<Layer position="center" onEsc={onDone}>
Expand All @@ -31,111 +62,106 @@ const ItemEdit = ({ index, roadmap, onChange, onDone }) => {
<Button icon={<Close />} onClick={onDone} />
</Header>
<Box pad={{ horizontal: 'large', vertical: 'small' }} width="large">
<Form
value={value}
onChange={setValue}
onSubmit={() => {
setChanging(true);
const nextRoadmap = JSON.parse(JSON.stringify(roadmap));
const nextItem = { ...value };
delete nextItem.index;
if (nextItem.status === 'none') delete nextItem.status;
if (!nextItem.url) delete nextItem.url;
if (index >= 0) nextRoadmap.items[index] = nextItem;
else nextRoadmap.items.unshift(nextItem);
update(nextRoadmap).then(() => {
setChanging(false);
onChange(nextRoadmap);
if (index >= 0) onDone();
});
}}
>
<Box
direction="row-responsive"
align="center"
justify="between"
gap="small"
margin={{ bottom: 'medium' }}
>
<FormField
name="section"
htmlFor="section"
required
margin="none"
{auth ? (
<Auth onChange={submit} />
) : (
<Form value={value} onChange={setValue} onSubmit={() => submit()}>
<Box
direction="row-responsive"
align="center"
justify="between"
gap="small"
margin={{ bottom: 'medium' }}
>
<TextInput
<FormField
name="section"
id="section"
placeholder="Section"
suggestions={Array.from(
new Set(roadmap.items.map((i) => i.section)),
)}
onSelect={() => {} /* TODO */}
/>
</FormField>
<FormField name="target" htmlFor="target" required margin="none">
{/* replace with DateInput soon! */}
<TextInput
htmlFor="section"
required
margin="none"
>
<TextInput
name="section"
id="section"
placeholder="Section"
suggestions={Array.from(
new Set(roadmap.items.map((i) => i.section)),
)}
onSelect={() => {} /* TODO */}
/>
</FormField>
<FormField
name="target"
id="target"
placeholder="yyyy-mm-dd"
icon={<Calendar />}
reverse
htmlFor="target"
required
margin="none"
>
{/* replace with DateInput soon! */}
<TextInput
name="target"
id="target"
placeholder="yyyy-mm-dd"
icon={<Calendar />}
reverse
/>
</FormField>
<FormField name="status" htmlFor="status" margin="none">
<RadioButtonGroup
name="status"
id="status"
direction="row"
gap="none"
options={statusOptions}
>
{(option, { checked, hover }) => (
<Status value={option} active={checked} />
)}
</RadioButtonGroup>
</FormField>
</Box>
<FormField name="name" htmlFor="name" required>
<TextInput
name="name"
id="name"
size="large"
placeholder="Label"
/>
</FormField>
<FormField name="status" htmlFor="status" margin="none">
<RadioButtonGroup
name="status"
id="status"
direction="row"
gap="none"
options={statusOptions}
>
{(option, { checked, hover }) => (
<Status value={option} active={checked} />
)}
</RadioButtonGroup>
<FormField
name="note"
htmlFor="note"
margin={{ bottom: 'medium' }}
>
<TextArea name="note" id="note" placeholder="Note" />
</FormField>
</Box>
<FormField name="name" htmlFor="name" required>
<TextInput
name="name"
id="name"
size="large"
placeholder="Label"
/>
</FormField>
<FormField name="note" htmlFor="note" margin={{ bottom: 'medium' }}>
<TextArea name="note" id="note" placeholder="Note" />
</FormField>

<FormField name="url" htmlFor="url">
<TextInput name="url" id="url" placeholder="URL" />
</FormField>
<Footer margin={{ vertical: 'medium' }}>
<Button
type="submit"
primary
label={index >= 0 ? 'Update' : 'Add'}
disabled={changing}
/>
{index >= 0 && (
<FormField name="url" htmlFor="url">
<TextInput name="url" id="url" placeholder="URL" />
</FormField>
<Footer margin={{ vertical: 'medium' }}>
<Button
label="Delete"
onClick={() => {
setChanging(true);
const nextRoadmap = JSON.parse(JSON.stringify(roadmap));
nextRoadmap.items.splice(index, 1);
update(nextRoadmap).then(() => {
setChanging(false);
onChange(nextRoadmap);
if (index >= 0) onDone();
});
}}
type="submit"
primary
label={index >= 0 ? 'Update' : 'Add'}
disabled={changing}
/>
)}
</Footer>
</Form>
{index >= 0 && (
<Button
label="Delete"
onClick={() => {
setChanging(true);
const nextRoadmap = JSON.parse(JSON.stringify(roadmap));
nextRoadmap.items.splice(index, 1);
update(nextRoadmap).then(() => {
setChanging(false);
onChange(nextRoadmap);
if (index >= 0) onDone();
});
}}
/>
)}
</Footer>
</Form>
)}
</Box>
</Box>
</Layer>
Expand Down
8 changes: 6 additions & 2 deletions src/Roadmap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,8 +47,9 @@ const Roadmap = ({ identifier, onClose }) => {
.then(setRoadmap)
.catch((status) => {
if (status === 401) setAuth(true);
if (status === 404) onClose();
});
}, [identifier, password]);
}, [identifier, onClose, password]);

useEffect(() => {
if (roadmap) document.title = roadmap.name;
Expand Down Expand Up @@ -284,7 +285,10 @@ const Roadmap = ({ identifier, onClose }) => {
{editRoadmap && (
<RoadmapEdit
roadmap={roadmap}
onChange={setRoadmap}
onChange={(nextRoadmap) => {
if (nextRoadmap) setRoadmap(nextRoadmap);
else onClose();
}}
onDone={() => setEditRoadmap(false)}
/>
)}
Expand Down
15 changes: 7 additions & 8 deletions src/RoadmapEdit.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {
TextInput,
} from 'grommet';
import { Close, Down, Up } from 'grommet-icons';
import { update } from './data';
import { delet, update } from './data';
import Auth from './Auth';

const RoadmapEdit = ({ roadmap, onChange, onDone }) => {
Expand Down Expand Up @@ -126,14 +126,13 @@ const RoadmapEdit = ({ roadmap, onChange, onDone }) => {
/>
<Button
label="Delete"
disabled
onClick={() => {
// setChanging(true);
// delete(roadmap).then(() => {
// setChanging(false);
// onChange(undefined);
// onDone();
// });
setChanging(true);
delet(roadmap).then(() => {
setChanging(false);
onChange(undefined);
onDone();
});
}}
/>
</Footer>
Expand Down
Loading

0 comments on commit 6696c71

Please sign in to comment.