added tag deletion interface

src/redux/node/actions.ts

@@ -86,6 +86,12 @@ export const nodeUpdateTags = (id: INode['id'], tags: string[]) => ({
   tags,
 });
 
+export const nodeDeleteTag = (id: INode['id'], tagId: ITag['ID']) => ({
+  type: NODE_ACTIONS.DELETE_TAG,
+  id: id!,
+  tagId,
+});
+
 export const nodeSetTags = (tags: ITag[]) => ({
   type: NODE_ACTIONS.SET_TAGS,
   tags,

src/redux/node/api.ts

@@ -3,6 +3,8 @@ import { IComment, INode } from '../types';
 import { API } from '~/constants/api';
 import { COMMENTS_DISPLAY } from './constants';
 import {
+  ApiDeleteNodeTagsRequest,
+  ApiDeleteNodeTagsResult,
   ApiGetNodeRelatedRequest,
   ApiGetNodeRelatedResult,
   ApiGetNodeRequest,
@@ -101,6 +103,9 @@ export const apiPostNodeTags = ({ id, tags }: ApiPostNodeTagsRequest) =>
     .post<ApiPostNodeTagsResult>(API.NODE.UPDATE_TAGS(id), { tags })
     .then(cleanResult);
 
+export const apiDeleteNodeTag = ({ id, tagId }: ApiDeleteNodeTagsRequest) =>
+  api.delete<ApiDeleteNodeTagsResult>(API.NODE.DELETE_TAG(id, tagId)).then(cleanResult);
+
 export const apiPostNodeLike = ({ id }: ApiPostNodeLikeRequest) =>
   api.post<ApiPostNodeLikeResult>(API.NODE.POST_LIKE(id)).then(cleanResult);
 

src/redux/node/constants.ts

@@ -52,6 +52,7 @@ export const NODE_ACTIONS = {
   SET_RELATED: `${prefix}SET_RELATED`,
 
   UPDATE_TAGS: `${prefix}UPDATE_TAGS`,
+  DELETE_TAG: `${prefix}DELETE_TAG`,
   SET_TAGS: `${prefix}SET_TAGS`,
   SET_COVER_IMAGE: `${prefix}SET_COVER_IMAGE`,
 };

src/redux/node/sagas.ts

@@ -10,6 +10,7 @@ import {
 } from './constants';
 import {
   nodeCreate,
+  nodeDeleteTag,
   nodeEdit,
   nodeGotoNode,
   nodeLike,
@@ -30,6 +31,7 @@ import {
   nodeUpdateTags,
 } from './actions';
 import {
+  apiDeleteNodeTag,
   apiGetNode,
   apiGetNodeComments,
   apiGetNodeRelated,
@@ -246,6 +248,13 @@ function* onUpdateTags({ id, tags }: ReturnType<typeof nodeUpdateTags>) {
   } catch {}
 }
 
+function* onDeleteTag({ id, tagId }: ReturnType<typeof nodeDeleteTag>) {
+  try {
+    const { tags }: Unwrap<typeof apiDeleteNodeTag> = yield call(apiDeleteNodeTag, { id, tagId });
+    yield put(nodeSetTags(tags));
+  } catch {}
+}
+
 function* onCreateSaga({ node_type: type, isLab }: ReturnType<typeof nodeCreate>) {
   if (!type || !has(type, NODE_EDITOR_DIALOGS)) return;
 
@@ -385,6 +394,7 @@ export default function* nodeSaga() {
   yield takeLatest(NODE_ACTIONS.LOAD_NODE, onNodeLoad);
   yield takeLatest(NODE_ACTIONS.POST_COMMENT, onPostComment);
   yield takeLatest(NODE_ACTIONS.UPDATE_TAGS, onUpdateTags);
+  yield takeLatest(NODE_ACTIONS.DELETE_TAG, onDeleteTag);
   yield takeLatest(NODE_ACTIONS.CREATE, onCreateSaga);
   yield takeLatest(NODE_ACTIONS.EDIT, onEditSaga);
   yield takeLatest(NODE_ACTIONS.LIKE, onLikeSaga);

src/redux/node/types.ts

@@ -1,4 +1,4 @@
-import { IComment, INode } from '~/redux/types';
+import { IComment, INode, ITag } from '~/redux/types';
 import { INodeState } from '~/redux/node/reducer';
 
 export interface IEditorComponentProps {}
@@ -56,6 +56,14 @@ export type ApiPostNodeTagsResult = {
   node: INode;
 };
 
+export type ApiDeleteNodeTagsRequest = {
+  id: INode['id'];
+  tagId: ITag['ID'];
+};
+export type ApiDeleteNodeTagsResult = {
+  tags: ITag[];
+};
+
 export type ApiPostNodeLikeRequest = { id: INode['id'] };
 export type ApiPostNodeLikeResult = { is_liked: boolean };
 

src/redux/types.ts

@@ -6,7 +6,7 @@ import { CallEffect } from 'redux-saga/effects';
 import { AxiosResponse } from 'axios';
 
 export interface ITag {
-  id: number;
+  ID: number;
   title: string;
 
   data: Record<string, string>;