Updated item routes with itemId as parameter

src/components/Items/ItemForm.js

@@ -39,7 +39,9 @@ function ItemForm(props) {
     <Panel bsStyle={bsStyle}>
       <Panel.Body>
         <FormProvider {...methods}>
-          {item && <input name="_id" type="hidden" ref={register} />}
+          {item && item._id && (
+            <input name="_id" type="hidden" ref={register} />
+          )}
           <TextFieldGroup
             registerOptions={{ required: true }}
             name="name"

src/components/Items/ItemTable.js

@@ -42,13 +42,13 @@ function ItemTable(props) {
   const editItem = useFetcher(ItemResource.updateShape());
   const deleteItem = useFetcher(ItemResource.deleteShape());
 
-  const [isCreatingItem, setCreatingItem] = useState(false);
   const [editedItem, setEditedItem] = useState();
 
-  const onSubmitForm = isCreatingItem ? createItem : editItem;
-  const onClosingForm = isCreatingItem
-    ? () => setCreatingItem(false)
-    : () => setEditedItem(undefined);
+  const onSubmitForm =
+    editedItem && editedItem._id
+      ? (params, body) => editItem({ ...params, _id: editedItem._id }, body)
+      : createItem;
+  const onClosingForm = () => setEditedItem(undefined);
 
   const samples = useResource(SampleResource.listShape(), { investigationId });
   const columns = [
@@ -148,10 +148,11 @@ function ItemTable(props) {
             onClick={async () => {
               try {
                 setAlert(undefined);
-                await deleteItem(
-                  { investigationId, parcelId },
-                  { _id: item._id }
-                );
+                await deleteItem({
+                  investigationId,
+                  parcelId,
+                  _id: item._id,
+                });
                 onItemChange();
                 setAlert({ type: 'success', message: 'Item removed.' });
               } catch (error) {
@@ -173,7 +174,7 @@ function ItemTable(props) {
   ];
   return (
     <Grid fluid>
-      {isParcelEditable && (isCreatingItem || editedItem) && (
+      {isParcelEditable && editedItem && (
         <Row>
           <ItemForm
             item={editedItem}
@@ -212,9 +213,7 @@ function ItemTable(props) {
               icon: 'plus',
               disabled: !isParcelEditable,
               bsStyle: 'primary',
-              onClick: () => {
-                setCreatingItem(true);
-              },
+              onClick: () => setEditedItem({}),
             },
           ]}
         />

src/resources/item.js

@@ -21,17 +21,17 @@ export default class ItemResource extends Resource {
   static url(params) {
     const { sessionId } = store.getState().user;
     const { investigationId, parcelId } = params;
-    return `${ICATPLUS.server}/tracking/${sessionId}/investigation/id/${investigationId}/parcel/id/${parcelId}/item`;
-  }
 
-  static listUrl(params) {
-    return this.url(params);
+    return `${
+      ICATPLUS.server
+    }/tracking/${sessionId}/investigation/id/${investigationId}/parcel/id/${parcelId}/item/${this.pk(
+      params
+    )}`;
   }
 
-  static deleteShape() {
-    return {
-      ...super.deleteShape(),
-      fetch: (params, body) => this.fetch('delete', this.url(params), body),
-    };
+  static listUrl(params) {
+    const { sessionId } = store.getState().user;
+    const { investigationId, parcelId } = params;
+    return `${ICATPLUS.server}/tracking/${sessionId}/investigation/id/${investigationId}/parcel/id/${parcelId}/item`;
   }
 }