78 lines
1.9 KiB
TypeScript
78 lines
1.9 KiB
TypeScript
import { h } from 'preact';
|
|
import { useState, useEffect } from 'preact/hooks';
|
|
import { connect } from 'unistore/preact'
|
|
|
|
import http from './../http';
|
|
import AcpOffer from './../components/acp.offer';
|
|
|
|
import { Status } from './../../../api/src/offers';
|
|
|
|
function Item({ item, ws }) {
|
|
const statuses = Object.entries(Status).map(([label, value]) => (
|
|
<option value={value}>{label}</option>
|
|
));
|
|
|
|
function onChange(e) {
|
|
console.log(item.id, e.target.value);
|
|
}
|
|
|
|
return (
|
|
<div key={item.id}>
|
|
<a href={item.listing.data.uri} target="_blank" >
|
|
<h4>{item.listing.data.release.description}</h4>
|
|
</a>
|
|
<h5 class='alt-text'>{item.total}</h5>
|
|
<h5>{item.status}</h5>
|
|
<select onChange={onChange}>
|
|
{statuses}
|
|
</select>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function SellerGroup(group) {
|
|
return (
|
|
<div class="bundle">
|
|
<section>
|
|
<h2>{group.username} - {group.seller}</h2>
|
|
<h3>{group.offers.length} offers</h3>
|
|
<h4>Ships: {group.mentionsAustralia && 'AU'} {group.mentionsWorldwide && 'WORLD'}</h4>
|
|
</section>
|
|
|
|
<div class='items'>
|
|
{group.offers.map(i => <Item item={i} />)}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function Home() {
|
|
const [offers, setOffers] = useState([]);
|
|
|
|
useEffect(() => {
|
|
async function getOffers() {
|
|
const [error, offers] = await http.getOffersAcp();
|
|
if (error) return console.error(error);
|
|
setOffers(offers);
|
|
}
|
|
getOffers();
|
|
}, []);
|
|
|
|
if (!offers.length) {
|
|
return (
|
|
<div class={'offers'}>
|
|
loading...
|
|
</div>
|
|
);
|
|
}
|
|
|
|
|
|
return (
|
|
<div class='bundles'>
|
|
{offers.map(SellerGroup)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Home;
|