58 lines
1.3 KiB
JavaScript
58 lines
1.3 KiB
JavaScript
import usePage from '../../hooks/usePage';
|
|
import Store from '../../store';
|
|
import * as actions from '../../store/actions';
|
|
import * as selectors from '../../store/selectors';
|
|
|
|
import Content from '../ui/Content';
|
|
import List from '../ui/List';
|
|
import VirtualScroll from '../ui/VirtualScroll';
|
|
|
|
const ListEntry = ({ list, ...props }) => (
|
|
<div
|
|
{...props}
|
|
className="p-4 border-solid dark:border-gray-800 border-b cursor-pointer dark:text-gray-200"
|
|
>
|
|
<span className="text-md">{list.name}</span>
|
|
</div>
|
|
);
|
|
|
|
const AllLists = ({ onSelect }) => {
|
|
const lists = Store.useState(selectors.getLists);
|
|
|
|
return (
|
|
<VirtualScroll
|
|
data={lists}
|
|
totalCount={lists.length}
|
|
style={{ height: '100%', width: '100%' }}
|
|
itemContent={(i, list) => (
|
|
<ListEntry list={list} onClick={() => onSelect(list)} onClose={() => onSelect(null)} />
|
|
)}
|
|
/>
|
|
);
|
|
};
|
|
|
|
const Lists = ({ selected }) => {
|
|
usePage({
|
|
title: 'Lists',
|
|
});
|
|
|
|
return (
|
|
<Content visible={true} className="p-4 dark:bg-black">
|
|
<List className="h-full w-full">
|
|
{/*selected && (*/}
|
|
<AllLists
|
|
onSelect={list => {
|
|
/*
|
|
actions.setSelectedList(list);
|
|
actions.setPageById('list-detail');
|
|
*/
|
|
}}
|
|
/>
|
|
{/*)}*/}
|
|
</List>
|
|
</Content>
|
|
);
|
|
};
|
|
|
|
export default Lists;
|