correct the misspelled three and add file(link) support

js/src/admin/components/SettingsPage.js

@@ -99,7 +99,7 @@ export default class AutoPostBadgePage extends ExtensionPage {
           name="tierTree"
           className="FormControl autopost"
           placeholder="fas fa-bullhorn"
-          bidi={this.setting('justoverclock-auto-post-count-badge.levelTree')}
+          bidi={this.setting('justoverclock-auto-post-count-badge.levelThree')}
         />
         <Button onclick={this.saveSettings.bind(this)} className="Button Button--primary autopost">
           <i className="fas fa-save autopost" />
@@ -327,10 +327,10 @@ export default class AutoPostBadgePage extends ExtensionPage {
         </div>
         <input
           type="text"
-          name="badgeTree"
+          name="badgeThree"
           className="FormControl autopost"
           placeholder="The Talker"
-          bidi={this.setting('justoverclock-auto-post-count-badge.badgeTree')}
+          bidi={this.setting('justoverclock-auto-post-count-badge.badgeThree')}
         />
         <Button onclick={this.saveSettings.bind(this)} className="Button Button--primary autopost">
           <i className="fas fa-save autopost" />

js/src/forum/components/PostCountBadge.js

@@ -7,6 +7,15 @@ export default class PostCountBadge extends Component {
     const userPosts = this.attrs.posts;
     const userClass = this.attrs.userClass;
     const userBadgeLabel = this.attrs.label;
+
+    const isFontAwesome = /^fa/.test(userClass);
+    const isFile = /^link:/.test(userClass);
+
+    const badgeIcon = isFontAwesome ? (
+      <i class={userClass + ' autopost'} />
+    ) : isFile ? (
+      <img class='autopost' src={userClass.replace('link:', '')} width="26" height="26" alt={userBadgeLabel} />
+    ) : <i class='fas fa-xmark autopost' />;
     return (
       <span>
         <Tooltip
@@ -15,7 +24,7 @@ export default class PostCountBadge extends Component {
           })}
         >
           <span className="auto-badge">
-            <i class={userClass + ' autopost'} />
+            {badgeIcon}
             {userBadgeLabel}
           </span>
         </Tooltip>

less/forum.less

@@ -11,3 +11,10 @@ span.auto-badge {
   }
 }
 
+span.auto-badge img {
+    position: relative;
+    left: -4px;
+    top: 4px;
+    border: 1.3px solid rgba(90,147,233,0.2);
+    border-radius: 5px;
+}

locale/en.yml

@@ -14,8 +14,8 @@ justoverclock-auto-post-count-badge:
     levelOne-help: paste here the fontawesome icon that u want to show for tier 1 (e.g. "fas fa-square")
     levelTwo: Change icon for tier 2 - "The Newbie"
     levelTwo-help: paste here the fontawesome icon that u want to show for tier 2 (e.g. "fas fa-square")
-    levelTree: Change icon for tier 3 - "The Talker"
-    levelTree-help: paste here the fontawesome icon that u want to show for tier 3 (e.g. "fas fa-square")
+    levelThree: Change icon for tier 3 - "The Talker"
+    levelThree-help: paste here the fontawesome icon that u want to show for tier 3 (e.g. "fas fa-square")
     levelFour: Change icon for tier 4 - "The Teacher"
     levelFour-help: paste here the fontawesome icon that u want to show for tier 4 (e.g. "fas fa-square")
     levelFive: Change icon for tier 5 - "The Monster!"