From c2b44db2ac9729bda4003ec89996ae1c40840d48 Mon Sep 17 00:00:00 2001
From: SleeplessOne1917 <abias1122@gmail.com>
Date: Sun, 25 Jun 2023 15:20:06 -0400
Subject: [PATCH 1/4] Only give child comments colored borders

---
 src/shared/components/comment/comment-nodes.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/shared/components/comment/comment-nodes.tsx b/src/shared/components/comment/comment-nodes.tsx
index 02e621b..495b6bb 100644
--- a/src/shared/components/comment/comment-nodes.tsx
+++ b/src/shared/components/comment/comment-nodes.tsx
@@ -79,7 +79,7 @@ export class CommentNodes extends Component<CommentNodesProps, any> {
     const maxComments = this.props.maxCommentsShown ?? this.props.nodes.length;
 
     const borderColor = this.props.depth
-      ? colorList[this.props.depth % colorList.length]
+      ? colorList[(this.props.depth - 1) % colorList.length]
       : colorList[0];
 
     return (
@@ -89,7 +89,11 @@ export class CommentNodes extends Component<CommentNodesProps, any> {
             "ms-1": !!this.props.isChild,
             "border-top border-light": !this.props.noBorder,
           })}
-          style={`border-left: 2px solid ${borderColor} !important;`}
+          style={
+            this.props.isChild
+              ? `border-left: 2px solid ${borderColor} !important;`
+              : undefined
+          }
         >
           {this.props.nodes.slice(0, maxComments).map(node => (
             <CommentNode

From d0f6fdbe4a35034bf2ba73a84807be453c234178 Mon Sep 17 00:00:00 2001
From: Jay Sitter <jay@jaysitter.com>
Date: Sun, 25 Jun 2023 19:36:19 -0400
Subject: [PATCH 2/4] fix: Remove unnecessary string interpolations

---
 src/shared/components/comment/comment-node.tsx | 2 +-
 src/shared/components/common/vote-buttons.tsx  | 4 ++--
 src/shared/components/home/emojis-form.tsx     | 2 +-
 src/shared/components/home/tagline-form.tsx    | 4 ++--
 src/shared/components/person/cake-day.tsx      | 2 +-
 src/shared/components/person/profile.tsx       | 4 ++--
 src/shared/components/post/post-listing.tsx    | 4 ++--
 7 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/shared/components/comment/comment-node.tsx b/src/shared/components/comment/comment-node.tsx
index 394de6e..4ad1538 100644
--- a/src/shared/components/comment/comment-node.tsx
+++ b/src/shared/components/comment/comment-node.tsx
@@ -312,7 +312,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
                 <PersonListing person={cv.creator} />
               </span>
               {cv.comment.distinguished && (
-                <Icon icon="shield" inline classes={`text-danger me-2`} />
+                <Icon icon="shield" inline classes="text-danger me-2" />
               )}
               {this.isPostCreator && (
                 <div className="badge text-bg-light d-none d-sm-inline me-2">
diff --git a/src/shared/components/common/vote-buttons.tsx b/src/shared/components/common/vote-buttons.tsx
index 0979918..005db8c 100644
--- a/src/shared/components/common/vote-buttons.tsx
+++ b/src/shared/components/common/vote-buttons.tsx
@@ -174,7 +174,7 @@ export class VoteButtons extends Component<VoteButtonsProps, VoteButtonsState> {
 
   render() {
     return (
-      <div className={`vote-bar col-1 pe-0 small text-center`}>
+      <div className="vote-bar col-1 pe-0 small text-center">
         <button
           type="button"
           className={`btn-animate btn btn-link p-0 ${
@@ -193,7 +193,7 @@ export class VoteButtons extends Component<VoteButtonsProps, VoteButtonsState> {
         </button>
         {showScores() ? (
           <div
-            className={`unselectable pointer text-muted px-1 post-score`}
+            className="unselectable pointer text-muted px-1 post-score"
             data-tippy-content={tippy(this.props.counts)}
           >
             {numToSI(this.props.counts.score)}
diff --git a/src/shared/components/home/emojis-form.tsx b/src/shared/components/home/emojis-form.tsx
index caf8221..149ff03 100644
--- a/src/shared/components/home/emojis-form.tsx
+++ b/src/shared/components/home/emojis-form.tsx
@@ -255,7 +255,7 @@ export class EmojiForm extends Component<EmojiFormProps, EmojiFormState> {
                         >
                           <Icon
                             icon="trash"
-                            classes={`icon-inline text-danger`}
+                            classes="icon-inline text-danger"
                           />
                         </button>
                       </div>
diff --git a/src/shared/components/home/tagline-form.tsx b/src/shared/components/home/tagline-form.tsx
index c79d955..bdbe1e6 100644
--- a/src/shared/components/home/tagline-form.tsx
+++ b/src/shared/components/home/tagline-form.tsx
@@ -71,7 +71,7 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
                       data-tippy-content={I18NextService.i18n.t("edit")}
                       aria-label={I18NextService.i18n.t("edit")}
                     >
-                      <Icon icon="edit" classes={`icon-inline`} />
+                      <Icon icon="edit" classes="icon-inline" />
                     </button>
 
                     <button
@@ -83,7 +83,7 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
                       data-tippy-content={I18NextService.i18n.t("delete")}
                       aria-label={I18NextService.i18n.t("delete")}
                     >
-                      <Icon icon="trash" classes={`icon-inline text-danger`} />
+                      <Icon icon="trash" classes="icon-inline text-danger" />
                     </button>
                   </td>
                 </tr>
diff --git a/src/shared/components/person/cake-day.tsx b/src/shared/components/person/cake-day.tsx
index ddb12be..3eeaf75 100644
--- a/src/shared/components/person/cake-day.tsx
+++ b/src/shared/components/person/cake-day.tsx
@@ -10,7 +10,7 @@ export class CakeDay extends Component<CakeDayProps, any> {
   render() {
     return (
       <div
-        className={`cake-day mx-2 d-inline-block unselectable pointer`}
+        className="cake-day mx-2 d-inline-block unselectable pointer"
         data-tippy-content={this.cakeDayTippy()}
       >
         <Icon icon="cake" classes="icon-inline" />
diff --git a/src/shared/components/person/profile.tsx b/src/shared/components/person/profile.tsx
index 70bada8..714b6be 100644
--- a/src/shared/components/person/profile.tsx
+++ b/src/shared/components/person/profile.tsx
@@ -647,12 +647,12 @@ export class Profile extends Component<
               value={this.state.banReason}
               onInput={linkEvent(this, this.handleModBanReasonChange)}
             />
-            <label className="col-form-label" htmlFor={`mod-ban-expires`}>
+            <label className="col-form-label" htmlFor="mod-ban-expires">
               {I18NextService.i18n.t("expires")}
             </label>
             <input
               type="number"
-              id={`mod-ban-expires`}
+              id="mod-ban-expires"
               className="form-control me-2"
               placeholder={I18NextService.i18n.t("number_of_days")}
               value={this.state.banExpireDays}
diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx
index ac90b0d..449f696 100644
--- a/src/shared/components/post/post-listing.tsx
+++ b/src/shared/components/post/post-listing.tsx
@@ -1235,12 +1235,12 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
                 value={this.state.banReason}
                 onInput={linkEvent(this, this.handleModBanReasonChange)}
               />
-              <label className="col-form-label" htmlFor={`mod-ban-expires`}>
+              <label className="col-form-label" htmlFor="mod-ban-expires">
                 {I18NextService.i18n.t("expires")}
               </label>
               <input
                 type="number"
-                id={`mod-ban-expires`}
+                id="mod-ban-expires"
                 className="form-control me-2"
                 placeholder={I18NextService.i18n.t("number_of_days")}
                 value={this.state.banExpireDays}

From af2013059b8717b581d178c51f36b763189d599f Mon Sep 17 00:00:00 2001
From: Dominic Mazzoni <dmazzoni@gmail.com>
Date: Sun, 25 Jun 2023 21:11:23 -0700
Subject: [PATCH 3/4] Associate NSFW label with its checkbox

---
 src/shared/components/post/post-form.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/shared/components/post/post-form.tsx b/src/shared/components/post/post-form.tsx
index 081792a..84ea77a 100644
--- a/src/shared/components/post/post-form.tsx
+++ b/src/shared/components/post/post-form.tsx
@@ -531,7 +531,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
               checked={this.state.form.nsfw}
               onChange={linkEvent(this, handlePostNsfwChange)}
             />
-            <label className="form-check-label">
+            <label className="form-check-label" htmlFor="post-nsfw">
               {I18NextService.i18n.t("nsfw")}
             </label>
           </div>

From 17710d492cc849ea7faa8ca8e34994ae7229cbaa Mon Sep 17 00:00:00 2001
From: Jay Sitter <jay@jaysitter.com>
Date: Mon, 26 Jun 2023 10:37:21 -0400
Subject: [PATCH 4/4] chore(DX): Add prettier to eslint config for use with
 editors

---
 .eslintrc.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index 81257cb..ad77740 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -3,7 +3,7 @@
   "env": {
     "browser": true
   },
-  "plugins": ["@typescript-eslint", "jsx-a11y"],
+  "plugins": ["@typescript-eslint", "jsx-a11y", "prettier"],
   "extends": [
     "eslint:recommended",
     "plugin:@typescript-eslint/recommended",
@@ -41,6 +41,7 @@
     "no-var": 0,
     "prefer-const": 1,
     "prefer-rest-params": 0,
+    "prettier/prettier": "error",
     "quote-props": 0,
     "unicorn/filename-case": 0
   }