Files
old-roraccounting/client/src/gangs/Gangs.js
2020-10-12 01:32:43 +03:00

62 lines
1.7 KiB
JavaScript

import React from 'react';
import NewGangForm from "./NewGangForm";
import axios from "axios";
import {errorToast} from "../common/errorHelpers";
import YesNoModal from "../common/YesNoModal";
import {Button} from "react-materialize";
import M from "materialize-css";
import {withRouter} from 'react-router-dom';
const Gangs = (props) => {
const gangs = props.gangs;
const setGangs = props.gangsSetter;
const deleteGang = async (id) => {
try {
const response = await axios.delete(`/api/gangs/${id}`);
if (response.status === 200 && response.data){
setGangs(response.data);
M.toast({ html: "See y'a on the other side" });
}else{
errorToast();
}
}catch (e) {
console.log(e);
errorToast();
}
}
const gangsData = gangs.map((gang, index) => {
return (
<li key={index}>
<div className="collapsible-header">
<div className="flex-row opposite-sides-content">
<div className="flex-col">
<div>{ gang.name }</div>
<div className="grey-text">{ `${gang.about || '[no about]'}${gang.chip_name} (${gang.chip_code})`}</div>
</div>
<Button flat className="push" icon="edit" onClick={() => props.history.push(`/gangs/${gang.id}`)} />
<YesNoModal
body={"Maan, y'a sure about this?"}
yesAction={() => deleteGang(gang.id)}
triggerNode={<Button disabled flat node="button" icon="delete" />} />
</div>
</div>
</li>
)
});
return (
<div className="container">
<NewGangForm newGangsSetter={setGangs} />
<ul className="collapsible">
{ gangsData }
</ul>
</div>
)
}
export default withRouter(Gangs);