Setting: Colorear IDS

3 files changed, 21 insertions, 7 deletions

diff --git a/src/App.js b/src/App.js
index 04a2726..4301b5c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -72,7 +72,8 @@ class App extends Component {
       autoUpdateThreads: true,
       showAvatars: true,
       postPassword: this.genPassword(),
-      embedYoutube: true
+      embedYoutube: true,
+      colorifyIDs: true
     };
     if (lsSettings === null) {
       localStorage.setItem("settings", JSON.stringify(defaultSettings));
diff --git a/src/Post.js b/src/Post.js
index d18f89c..3d75f36 100644
--- a/src/Post.js
+++ b/src/Post.js
@@ -219,6 +219,7 @@ class Post extends Component {
     if (user_id === "CAP_USER*") {
       starColor = "blue";
       icon = "check circle";
+      user_id = "Usuario verificado";
     } else if (isMine) {
       starColor = "olive";
     } else if (user_id === "???T") {
@@ -273,6 +274,8 @@ class Post extends Component {
       .showAvatars;
     let settingEmbedYoutube = JSON.parse(localStorage.getItem("settings"))
       .embedYoutube;
+    let settingColorifyIDs = JSON.parse(localStorage.getItem("settings"))
+      .colorifyIDs;
 
     return (
       <Comment inverted={nightMode}>
@@ -304,10 +307,10 @@ class Post extends Component {
             </div>
             <div>
               <Icon name={icon} color={starColor} />
-              {user_id === "CAP_USER*" ? (
-                "Usuario verificado"
-              ) : (
+              {settingColorifyIDs ? (
                 <span style={{ color: idColor }}>{user_id}</span>
+              ) : (
+                user_id
               )}
               {isMine ? " (Tú)" : null}
             </div>
diff --git a/src/Settings.js b/src/Settings.js
index 8d187ae..efc8995 100644
--- a/src/Settings.js
+++ b/src/Settings.js
@@ -35,7 +35,8 @@ class SettingsModal extends Component {
       autoUpdateThreads: true,
       showAvatars: true,
       postPassword: "",
-      embedYoutube: true
+      embedYoutube: true,
+      colorifyIDs: true
     };
     this.handleChange = this.handleChange.bind(this);
     this.toggleSetting = this.toggleSetting.bind(this);
@@ -52,7 +53,8 @@ class SettingsModal extends Component {
       autoUpdateThreads: settings.autoUpdateThreads,
       showAvatars: settings.showAvatars,
       postPassword: settings.postPassword,
-      embedYoutube: settings.embedYoutube
+      embedYoutube: settings.embedYoutube,
+      colorifyIDs: settings.colorifyIDs
     });
   }
 
@@ -88,7 +90,8 @@ class SettingsModal extends Component {
       notifyOnThread,
       postPassword,
       showAvatars,
-      embedYoutube
+      embedYoutube,
+      colorifyIDs
     } = this.state;
     return (
       <Modal trigger={this.props.trigger} size="tiny" centered={false}>
@@ -112,6 +115,13 @@ class SettingsModal extends Component {
               onChange={this.toggleSetting}
               className="settingCheckbox"
             />
+            <Checkbox
+              label="Colorear ID's de Posts"
+              checked={colorifyIDs}
+              name="colorifyIDs"
+              onChange={this.toggleSetting}
+              className="settingCheckbox"
+            />
             <Header as="h4" dividing>
               Comportamiento
             </Header>