feat: add slack ID in user model

https://youtrack.weseek.co.jp/issue/GW-7697
- Try to add input for slack ID in user page
- Add slack ID in user model
- Retrieve slack ID from current user info

packages/app/src/client/services/PersonalContainer.js

@@ -30,6 +30,7 @@ export default class PersonalContainer extends Container {
       uploadedPictureSrc: this.getUploadedPictureSrc(this.appContainer.currentUser),
       externalAccounts: [],
       apiToken: '',
+      slackId: '',
     };
 
   }
@@ -114,6 +115,13 @@ export default class PersonalContainer extends Container {
     this.setState({ email: inputValue });
   }
 
+  /**
+   * Change Slack ID
+   */
+  changeSlackId(inputValue) {
+    this.setState({ slackId: inputValue });
+  }
+
   /**
    * Change isEmailPublished
    */
@@ -147,6 +155,7 @@ export default class PersonalContainer extends Container {
         email: this.state.email,
         isEmailPublished: this.state.isEmailPublished,
         lang: this.state.lang,
+        slackId: this.state.slackId,
       });
       const { updatedUser } = response.data;
 
@@ -155,6 +164,7 @@ export default class PersonalContainer extends Container {
         email: updatedUser.email,
         isEmailPublished: updatedUser.isEmailPublished,
         lang: updatedUser.lang,
+        slackId: updatedUser.slackId,
       });
     }
     catch (err) {

packages/app/src/components/Me/BasicInfoSettings.jsx

@@ -79,6 +79,18 @@ class BasicInfoSettings extends React.Component {
             )}
           </div>
         </div>
+        <div className="form-group row">
+          <label htmlFor="userForm[slackId]" className="text-left text-md-right col-md-3 col-form-label">{t('Slack ID')}</label>
+          <div className="col-md-6">
+            <input
+              className="form-control"
+              type="text"
+              name="userForm[slackId]"
+              defaultValue={personalContainer.state.slackId}
+              onChange={(e) => { personalContainer.changeSlackId(e.target.value) }}
+            />
+          </div>
+        </div>
 
         <div className="form-group row">
           <label className="text-left text-md-right col-md-3 col-form-label">{t('Disclose E-mail')}</label>

packages/app/src/server/models/user.js

@@ -47,6 +47,7 @@ module.exports = function(crowi) {
     name: { type: String },
     username: { type: String, required: true, unique: true },
     email: { type: String, unique: true, sparse: true },
+    slackId: { type: String },
     // === Crowi settings
     // username: { type: String, index: true },
     // email: { type: String, required: true, index: true },

packages/app/src/server/routes/apiv3/personal-setting.js

@@ -79,6 +79,7 @@ module.exports = (crowi) => {
       body('email').isEmail(),
       body('lang').isString().isIn(listLocaleIds()),
       body('isEmailPublished').isBoolean(),
+      body('slackId').optional().isString(),
     ],
     imageType: [
       body('isGravatarEnabled').isBoolean(),
@@ -221,6 +222,7 @@ module.exports = (crowi) => {
       user.email = req.body.email;
       user.lang = req.body.lang;
       user.isEmailPublished = req.body.isEmailPublished;
+      user.slackId = req.body.slackId;
 
       const updatedUser = await user.save();
       req.i18n.changeLanguage(req.body.lang);