36 lines
883 B
JavaScript
36 lines
883 B
JavaScript
import React from 'react';
|
|
import forceArray from 'force-array';
|
|
|
|
import { FormGroup, Input, FormLabel, ViewContainer, StatusLoader } from 'joyent-ui-toolkit';
|
|
import Item from './item';
|
|
|
|
export default ({ instances, loading, handleChange = () => null, handleSubmit }) => {
|
|
const _instances = forceArray(instances);
|
|
|
|
const items = _instances.map((instance, i, all) => (
|
|
<Item
|
|
key={instance.id}
|
|
{...instance}
|
|
last={all.length - 1 === i}
|
|
first={!i}
|
|
/>
|
|
));
|
|
|
|
const _loading = (!items.length && loading) ? (
|
|
<ViewContainer center>
|
|
<StatusLoader />
|
|
</ViewContainer>
|
|
) : null;
|
|
|
|
return (
|
|
<form onSubmit={() => handleSubmit(ctx => handleChange(ctx))}>
|
|
<FormGroup name="filter" reduxForm>
|
|
<FormLabel>Filter instances</FormLabel>
|
|
<Input />
|
|
</FormGroup>
|
|
{_loading}
|
|
{items}
|
|
</form>
|
|
);
|
|
};
|