Merge pull request #67 from blockscout/private-tag-edit

add edit private tag method

pages/api/account/private-tags/address/[id].ts

@@ -2,8 +2,16 @@ import type { NextApiRequest } from 'next'
 
 import handler from 'pages/api/utils/handler';
 
-const getUrl = (req: NextApiRequest) => `/account/v1/user/tags/address/${ req.query.id }`
+const getUrl = (req: NextApiRequest) => {
+  let url = `/account/v1/user/tags/address/${ req.query.id }`;
+  if (req.method === 'PUT') {
+    const params = { address_hash: req.query.address_hash as string, name: req.query.name as string };
+    const searchParams = new URLSearchParams(params);
+    url += `?${ searchParams.toString() }`
+  }
+  return url;
+}
 
-const addressDeleteHandler = handler(getUrl, [ 'DELETE' ]);
+const addressDeleteHandler = handler(getUrl, [ 'DELETE', 'PUT' ]);
 
 export default addressDeleteHandler;

pages/api/account/private-tags/transaction/[id].ts

@@ -2,8 +2,16 @@ import type { NextApiRequest } from 'next'
 
 import handler from 'pages/api/utils/handler';
 
-const getUrl = (req: NextApiRequest) => `/account/v1/user/tags/transaction/${ req.query.id }`
+const getUrl = (req: NextApiRequest) => {
+  let url = `/account/v1/user/tags/transaction/${ req.query.id }`;
+  if (req.method === 'PUT') {
+    const params = { transaction_hash: req.query.transaction_hash as string, name: req.query.name as string };
+    const searchParams = new URLSearchParams(params);
+    url += `?${ searchParams.toString() }`
+  }
+  return url;
+}
 
-const transactionDeleteHandler = handler(getUrl, [ 'DELETE' ]);
+const transactionDeleteHandler = handler(getUrl, [ 'DELETE', 'PUT' ]);
 
 export default transactionDeleteHandler;

pages/api/utils/handler.ts

@@ -2,7 +2,7 @@ import type { NextApiRequest, NextApiResponse } from 'next'
 
 import fetch from './fetch';
 
-type Methods = 'GET' | 'POST' | 'DELETE';
+type Methods = 'GET' | 'POST' | 'PUT' | 'DELETE';
 
 export default function handler<TRes>(getUrl: (_req: NextApiRequest) => string, allowedMethods: Array<Methods>) {
   return async(_req: NextApiRequest, res: NextApiResponse<TRes>) => {
@@ -18,6 +18,13 @@ export default function handler<TRes>(getUrl: (_req: NextApiRequest) => string,
       })
       const data = await response.json() as TRes;
 
+      res.status(200).json(data)
+    } else if (allowedMethods.includes('PUT') && _req.method === 'PUT') {
+      const response = await fetch(getUrl(_req), {
+        method: 'PUT',
+      })
+      const data = await response.json() as TRes;
+
       res.status(200).json(data)
     } else if (allowedMethods.includes('DELETE') && _req.method === 'DELETE') {
       const response = await fetch(getUrl(_req), { method: 'DELETE' });

ui/privateTags/AddressModal/AddressForm.tsx

@@ -38,10 +38,20 @@ const AddressForm: React.FC<Props> = ({ data, onClose }) => {
   const queryClient = useQueryClient();
 
   const { mutate } = useMutation((formData: Inputs) => {
-    return fetch('/api/account/private-tags/address', { method: 'POST', body: JSON.stringify({
+    let mutationFunction;
+    const requestParams = {
       name: formData?.tag,
       address_hash: formData?.address,
-    }) })
+    }
+    if (data) {
+      // edit tag
+      const params = new URLSearchParams(requestParams);
+      mutationFunction = () => fetch(`/api/account/private-tags/address/${ data.id }?${ params.toString() }`, { method: 'PUT' })
+    } else {
+      // add tag
+      mutationFunction = () => fetch('/api/account/private-tags/address', { method: 'POST', body: JSON.stringify(requestParams) })
+    }
+    return mutationFunction();
   }, {
     onError: () => {
       // eslint-disable-next-line no-console
@@ -57,7 +67,6 @@ const AddressForm: React.FC<Props> = ({ data, onClose }) => {
 
   const onSubmit: SubmitHandler<Inputs> = (formData) => {
     setPending(true);
-    // api method for editing is not implemented now!!!
     mutate(formData);
   };
 

ui/privateTags/TransactionModal/TransactionForm.tsx

@@ -39,10 +39,20 @@ const TransactionForm: React.FC<Props> = ({ data, onClose }) => {
   const queryClient = useQueryClient();
 
   const { mutate } = useMutation((formData: Inputs) => {
-    return fetch('/api/account/private-tags/transaction', { method: 'POST', body: JSON.stringify({
+    let mutationFunction;
+    const requestParams = {
       name: formData?.tag,
       transaction_hash: formData?.transaction,
-    }) })
+    }
+    if (data) {
+      // edit tag
+      const params = new URLSearchParams(requestParams);
+      mutationFunction = () => fetch(`/api/account/private-tags/transaction/${ data.id }?${ params.toString() }`, { method: 'PUT' })
+    } else {
+      // add tag
+      mutationFunction = () => fetch('/api/account/private-tags/transaction', { method: 'POST', body: JSON.stringify(requestParams) })
+    }
+    return mutationFunction();
   }, {
     onError: () => {
       // eslint-disable-next-line no-console