🔍 fix: USE_REDIS condition, Markdown list counter, code highlights (danny-avila#3806)

* fix: markdown rehype highlight accidental removal

* fix: USE_REDIS condition check

* fix: markdown list counter

Author: danny-avila

api/cache/clearPendingReq.js

@@ -35,7 +35,7 @@ const clearPendingReq = async ({ userId, cache: _cache }) => {
     return;
   }
 
-  const key = `${USE_REDIS ? namespace : ''}:${userId ?? ''}`;
+  const key = `${isEnabled(USE_REDIS) ? namespace : ''}:${userId ?? ''}`;
   const currentReq = +((await cache.get(key)) ?? 0);
 
   if (currentReq && currentReq >= 1) {

api/server/socialLogins.js

@@ -9,6 +9,7 @@ const {
   discordLogin,
   facebookLogin,
 } = require('~/strategies');
+const { isEnabled } = require('~/server/utils');
 const { logger } = require('~/config');
 
 /**
@@ -40,7 +41,7 @@ const configureSocialLogins = (app) => {
       resave: false,
       saveUninitialized: false,
     };
-    if (process.env.USE_REDIS) {
+    if (isEnabled(process.env.USE_REDIS)) {
       const client = new Redis(process.env.REDIS_URI);
       client
         .on('error', (err) => logger.error('ioredis error:', err))

client/src/components/Chat/Messages/Content/Markdown.tsx

@@ -109,12 +109,11 @@ const cursor = ' ';
 
 type TContentProps = {
   content: string;
-  isEdited?: boolean;
   showCursor?: boolean;
   isLatestMessage: boolean;
 };
 
-const Markdown = memo(({ content = '', isEdited, showCursor, isLatestMessage }: TContentProps) => {
+const Markdown = memo(({ content = '', showCursor, isLatestMessage }: TContentProps) => {
   const LaTeXParsing = useRecoilValue<boolean>(store.LaTeXParsing);
 
   const isInitializing = content === '';
@@ -147,10 +146,6 @@ const Markdown = memo(({ content = '', isEdited, showCursor, isLatestMessage }:
     );
   }
 
-  if (isEdited === true || !isLatestMessage) {
-    rehypePlugins.pop();
-  }
-
   return (
     <ReactMarkdown
       remarkPlugins={[supersub, remarkGfm, [remarkMath, { singleDollarTextMath: true }]]}

client/src/components/Chat/Messages/Content/MessageContent.tsx

@@ -84,12 +84,7 @@ const DisplayMessage = ({ text, isCreatedByUser, message, showCursor }: TDisplay
         )}
       >
         {!isCreatedByUser ? (
-          <Markdown
-            content={text}
-            isEdited={message.isEdited}
-            showCursor={showCursorState}
-            isLatestMessage={isLatestMessage}
-          />
+          <Markdown content={text} showCursor={showCursorState} isLatestMessage={isLatestMessage} />
         ) : (
           <>{text}</>
         )}

client/src/components/Chat/Messages/Content/Part.tsx

@@ -41,12 +41,7 @@ const DisplayMessage = ({ text, isCreatedByUser = false, message, showCursor }:
       )}
     >
       {!isCreatedByUser ? (
-        <Markdown
-          content={text}
-          isEdited={message.isEdited}
-          showCursor={showCursorState}
-          isLatestMessage={isLatestMessage}
-        />
+        <Markdown content={text} showCursor={showCursorState} isLatestMessage={isLatestMessage} />
       ) : (
         <>{text}</>
       )}

client/src/style.css

@@ -1945,10 +1945,12 @@ button.scroll-convo {
 .markdown ol > li {
   position: relative;
   padding-left: 0.375em;
+  counter-increment: list-counter;
 }
 
 .prose ol > li::marker,
 .markdown ol > li::marker {
+  content: counter(list-counter) ". ";
   color: var(--tw-prose-counters);
   font-weight: 400;
 }
@@ -1957,11 +1959,33 @@ button.scroll-convo {
 .prose ol ol,
 .markdown ol ol {
   list-style-type: lower-alpha;
+  counter-reset: list-counter-alpha;
+}
+
+.prose ol ol > li,
+.markdown ol ol > li {
+  counter-increment: list-counter-alpha;
+}
+
+.prose ol ol > li::marker,
+.markdown ol ol > li::marker {
+  content: counter(list-counter-alpha, lower-alpha) ". ";
 }
 
 .prose ol ol ol,
 .markdown ol ol ol {
   list-style-type: lower-roman;
+  counter-reset: list-counter-roman;
+}
+
+.prose ol ol ol > li,
+.markdown ol ol ol > li {
+  counter-increment: list-counter-roman;
+}
+
+.prose ol ol ol > li::marker,
+.markdown ol ol ol > li::marker {
+  content: counter(list-counter-roman, lower-roman) ". ";
 }
 
 /* Unordered lists */
@@ -2025,6 +2049,28 @@ button.scroll-convo {
   color: currentColor;
 }
 
+/* Reset counter for new sections */
+.prose h1 + ol,
+.prose h2 + ol,
+.prose h3 + ol,
+.prose h4 + ol,
+.prose h5 + ol,
+.prose h6 + ol,
+.markdown h1 + ol,
+.markdown h2 + ol,
+.markdown h3 + ol,
+.markdown h4 + ol,
+.markdown h5 + ol,
+.markdown h6 + ol {
+  counter-reset: list-counter;
+}
+
+/* Reset counter after unordered lists */
+.prose ul + ol,
+.markdown ul + ol {
+  counter-reset: list-counter;
+}
+
 /* Keyframes */
 
 @keyframes slideFromLeftToRightAndFade {