feat: update reviewer.

Author: cangzhang

package.json

@@ -163,7 +163,7 @@
     "style-loader": "^2.0.0",
     "svg-inline-loader": "^0.8.2",
     "ts-loader": "^8.0.5",
-    "typescript": "^4.0.3",
+    "typescript": "^4.1.2",
     "webpack": "4",
     "webpack-cli": "^4.0.0"
   },

src/codingServer.ts

@@ -614,6 +614,52 @@ export class CodingServer {
     }
   }
 
+  public async addMRReviewers(iid: string, ids: number[]): Promise<number[]> {
+    const { repoApiPrefix } = await this.getApiPrefix();
+    const tasks: Promise<CodingResponse>[] = ids.map((id) => {
+      return got
+        .post(`${repoApiPrefix}/merge/${iid}/reviewers`, {
+          searchParams: {
+            user_id: id,
+            access_token: this._session?.accessToken,
+          },
+        })
+        .json();
+    });
+    const result: PromiseSettledResult<CodingResponse>[] = await Promise.allSettled(tasks);
+    const fulfilled = ids.reduce((res, cur, idx) => {
+      if (result[idx].status === `fulfilled`) {
+        res = res.concat(cur);
+      }
+
+      return res;
+    }, [] as number[]);
+    return fulfilled;
+  }
+
+  public async removeMRReviewers(iid: string, ids: number[]): Promise<number[]> {
+    const { repoApiPrefix } = await this.getApiPrefix();
+    const tasks: Promise<CodingResponse>[] = ids.map((id) => {
+      return got
+        .delete(`${repoApiPrefix}/merge/${iid}/reviewers`, {
+          searchParams: {
+            user_id: id,
+            access_token: this._session?.accessToken,
+          },
+        })
+        .json();
+    });
+    const result: PromiseSettledResult<CodingResponse>[] = await Promise.allSettled(tasks);
+    const fulfilled = ids.reduce((res, cur, idx) => {
+      if (result[idx].status === `fulfilled`) {
+        res = res.concat(cur);
+      }
+
+      return res;
+    }, [] as number[]);
+    return fulfilled;
+  }
+
   get loggedIn() {
     return this._loggedIn;
   }

src/panel.ts

@@ -122,21 +122,43 @@ export class Panel {
               const getActivitiesRes = await this._codingSrv.getMRActivities(args);
               this.replyMessage(message, getActivitiesRes.data);
               break;
-            case 'mr.update.addReviewer': {
+            case 'mr.update.reviewers': {
               try {
+                const [iid, selected]: [string, number[]] = args;
                 const {
                   data: { list: memberList },
                 } = await codingSrv.getProjectMembers();
-                const list = memberList.map((i) => ({
-                  label: i.user.name,
-                  description: i.user.global_key,
-                }));
+                const list = memberList
+                  .filter((i) => i.user.global_key !== codingSrv.session?.user?.global_key)
+                  .map((i) => ({
+                    label: i.user.name,
+                    description: i.user.global_key,
+                    picked: selected.includes(i.user.id),
+                    userId: i.user.id,
+                  }));
                 const selection = await vscode.window.showQuickPick(list, {
                   canPickMany: true,
+                  ignoreFocusOut: true,
                 });
+
                 if (!selection) {
                   return;
                 }
+
+                const s = selection.map((i) => i.userId);
+                const added = s.filter((i) => !selected.includes(i));
+                const removed = selected.filter((i) => !s.includes(i));
+                const tasks = [];
+                if (added.length) {
+                  tasks.push(codingSrv.addMRReviewers(iid, added));
+                }
+                if (removed.length) {
+                  tasks.push(codingSrv.removeMRReviewers(iid, removed));
+                }
+
+                await Promise.all(tasks);
+                const resp = await codingSrv.getMRReviewers(iid);
+                this.broadcast(command, resp.data);
               } catch (err) {}
               break;
             }

src/tsconfig.json

@@ -2,7 +2,7 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "es2019",
-    "lib": ["ES2019", "dom"],
+    "lib": ["es2019", "dom", "es2020"],
     "outDir": "../out",
     "sourceMap": true,
     "strict": true,

tsconfig.json

@@ -5,7 +5,7 @@
     "outDir": "out/webviews",
     "module": "esnext",
     "target": "es5",
-    "lib": ["es6", "dom", "esnext.asynciterable"],
+    "lib": ["es2020", "es6", "dom", "esnext.asynciterable"],
     "sourceMap": true,
     "allowJs": true,
     "jsx": "react",
@@ -21,7 +21,7 @@
     "allowSyntheticDefaultImports": true,
     "paths": {
       "webviews/*": ["webviews/*"],
-      "src/*": ["src/*"],
+      "src/*": ["src/*"]
     }
   },
   "include": ["webviews", "types"]

webviews/components/Reviewers.tsx

@@ -1,12 +1,10 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import styled from 'styled-components';
 import { view } from '@risingstack/react-easy-state';
 
 import appStore from 'webviews/store/appStore';
 import { Avatar, AuthorLink } from 'webviews/components/User';
-import PlusIcon from 'webviews/assets/plus.svg';
-import CheckIcon from 'webviews/assets/check.svg';
-import DeleteIcon from 'webviews/assets/delete.svg';
+import EditIcon from 'webviews/assets/edit.svg';
 
 const Title = styled.div`
   margin-top: 15px;
@@ -21,10 +19,6 @@ const Item = styled(FlexCenter)`
   padding: 5px 0;
   justify-content: space-between;
 
-  :hover {
-    cursor: pointer;
-  }
-
   a:first-child {
     margin-right: 5px;
   }
@@ -51,24 +45,24 @@ const IconButton = styled.button`
     fill: var(--vscode-foreground);
   }
 `;
-const Check = styled(CheckIcon)`
-  svg path {
-    fill: var(--vscode-button-background);
-  }
-`;
 
 function Reviewers() {
-  const { reviewers } = appStore;
+  const { reviewers, currentMR } = appStore;
   const { reviewers: rReviewers = [], volunteer_reviewers: volunteerReviewers = [] } = reviewers;
   const allReviewers = [...rReviewers, ...volunteerReviewers];
-  const { addReviewers } = appStore;
+  const { updateReviewers } = appStore;
+
+  const onUpdateReviewer = useCallback(() => {
+    const list = allReviewers.map((i) => i.reviewer.id);
+    updateReviewers(currentMR.iid, list);
+  }, [allReviewers]);
 
   return (
     <div>
       <Title>
         Reviewers
-        <IconButton onClick={addReviewers}>
-          <PlusIcon />
+        <IconButton onClick={onUpdateReviewer}>
+          <EditIcon />
         </IconButton>
       </Title>
       {allReviewers.map((r) => {
@@ -78,10 +72,7 @@ function Reviewers() {
               <Avatar for={r.reviewer} />
               <AuthorLink for={r.reviewer} />
             </FlexCenter>
-            {r.value === 100 && <Check />}
-            <IconButton>
-              <DeleteIcon />
-            </IconButton>
+            {r.value === 100 && `👍`}
           </Item>
         );
       })}

webviews/hooks/messageTransferHook.tsx

@@ -27,14 +27,14 @@ export default function messageTransferHook() {
           updateMRActivities(res);
           break;
         }
-        case actions.UPDATE_MR_REVIEWERS: {
-          updateMRReviewers(res);
-          break;
-        }
         case actions.MR_UPDATE_COMMENTS: {
           updateMRComments(res);
           break;
         }
+        case actions.MR_UPDATE_REVIEWERS: {
+          res && updateMRReviewers(res);
+          break;
+        }
         default:
           break;
       }

webviews/store/appStore.ts

@@ -113,10 +113,10 @@ const appStore = store({
     appStore.comments.push([result] as any);
     return result;
   },
-  async addReviewers() {
+  async updateReviewers(iid: string, list: number[]) {
     const result = await vscode.postMessage({
-      command: actions.MR_ADD_REVIEWER,
-      args: {},
+      command: actions.MR_UPDATE_REVIEWERS,
+      args: [iid, list],
     });
     return result;
   },

webviews/store/constants.ts

@@ -5,11 +5,10 @@ export enum actions {
   MR_APPROVE = `mr.approve`,
   MR_DISAPPROVE = `mr.disapprove`,
   MR_MERGE = `mr.merge`,
-  UPDATE_MR_REVIEWERS = `mr.update.reviewers`,
   MR_UPDATE_TITLE = `mr.update.title`,
   MR_UPDATE_COMMENTS = `mr.udpate.comments`,
   MR_ADD_COMMENT = `mr.add.comment`,
   MR_GET_ACTIVITIES = `mr.get.activities`,
   MR_TOGGLE_LOADING = `mr.update.toggleLoading`,
-  MR_ADD_REVIEWER = `mr.update.addReviewer`,
+  MR_UPDATE_REVIEWERS = `mr.update.reviewers`,
 }

yarn.lock

@@ -7317,10 +7317,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@^4.0.3:
-  version "4.0.3"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.0.3.tgz#153bbd468ef07725c1df9c77e8b453f8d36abba5"
-  integrity sha512-tEu6DGxGgRJPb/mVPIZ48e69xCn2yRmCgYmDugAVwmJ6o+0u1RI18eO7E7WBTLYLaEVVOhwQmcdhQHweux/WPg==
+typescript@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.1.2.tgz#6369ef22516fe5e10304aae5a5c4862db55380e9"
+  integrity sha512-thGloWsGH3SOxv1SoY7QojKi0tc+8FnOmiarEGMbd/lar7QOEd3hvlx3Fp5y6FlDUGl9L+pd4n2e+oToGMmhRQ==
 
 typical@^5.0.0, typical@^5.2.0:
   version "5.2.0"