diff --git a/packages/app/src/app/overmind/namespaces/comments/state.ts b/packages/app/src/app/overmind/namespaces/comments/state.ts
index 68d4af8a697..4ed9f3a32f4 100644
--- a/packages/app/src/app/overmind/namespaces/comments/state.ts
+++ b/packages/app/src/app/overmind/namespaces/comments/state.ts
@@ -1,5 +1,6 @@
 import { CommentsFilterOption } from '@codesandbox/common/lib/types';
 import { CommentFragment, CommentWithRepliesFragment } from 'app/graphql/types';
+import isToday from 'date-fns/isToday';
 import { Derive } from 'app/overmind';
 
 export const OPTIMISTIC_COMMENT_ID = 'OptimisticCommentId';
@@ -27,6 +28,13 @@ type State = {
       }>;
     }
   >;
+  currentCommentsByDate: Derive<
+    State,
+    {
+      today: CommentFragment[];
+      prev: CommentFragment[];
+    }
+  >;
   multiCommentsSelector: {
     ids: string[];
     x: number;
@@ -128,4 +136,24 @@ export const state: State = {
         return [];
     }
   },
+  currentCommentsByDate({ currentComments }) {
+    return currentComments.reduce(
+      (acc, comment) => {
+        if (
+          isToday(new Date(comment.insertedAt)) ||
+          isToday(new Date(comment.updatedAt))
+        ) {
+          acc.today.push(comment);
+        } else {
+          acc.prev.push(comment);
+        }
+
+        return acc;
+      },
+      {
+        today: [],
+        prev: [],
+      }
+    );
+  },
 };
diff --git a/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/Comment.tsx b/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/Comment.tsx
index cdb10b30db1..ba33113f58c 100644
--- a/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/Comment.tsx
+++ b/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/Comment.tsx
@@ -67,6 +67,17 @@ export const Comment = React.memo<{
         });
       }}
     >
+      <Link
+        variant="muted"
+        css={css({
+          paddingBottom: 2,
+          display: 'block',
+        })}
+      >
+        {comment.references[0]
+          ? comment.references[0].metadata.path
+          : 'General'}
+      </Link>
       <Stack align="flex-start" justify="space-between" marginBottom={4}>
         <AvatarBlock comment={comment} />
         <Stack align="center">
@@ -118,11 +129,6 @@ export const Comment = React.memo<{
           borderColor: 'sideBar.border',
         })}
       >
-        {comment.references[0] && (
-          <Link style={{ color: '#3793E0' }}>
-            {comment.references[0].metadata.path}
-          </Link>
-        )}
         <Text block css={truncateText} marginBottom={2}>
           {comment.content}
         </Text>
diff --git a/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/index.tsx b/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/index.tsx
index 0d26a408c99..109b22f0e87 100644
--- a/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/index.tsx
+++ b/packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/Comments/index.tsx
@@ -23,6 +23,7 @@ export const Comments: React.FC = () => {
         currentComments,
         currentCommentId,
         multiCommentsSelector,
+        currentCommentsByDate,
       },
     },
     actions: { comments: commentsActions },
@@ -111,9 +112,26 @@ export const Comments: React.FC = () => {
               overflow: 'auto',
             }}
           >
-            {currentComments.map(comment => (
-              <Comment key={comment.id} comment={comment} />
-            ))}
+            {currentCommentsByDate.today.length ? (
+              <>
+                <Text size={3} weight="bold" block margin={2}>
+                  Today
+                </Text>
+                {currentCommentsByDate.today.map(comment => (
+                  <Comment key={comment.id} comment={comment} />
+                ))}
+              </>
+            ) : null}
+            {currentCommentsByDate.prev.length ? (
+              <>
+                <Text size={3} weight="bold" block margin={2} marginTop={4}>
+                  Earlier
+                </Text>
+                {currentCommentsByDate.prev.map(comment => (
+                  <Comment key={comment.id} comment={comment} />
+                ))}
+              </>
+            ) : null}
           </List>
         ) : null}
       </div>