diff --git a/frontend/src/pages/secret-manager/CommitsPage/CommitsPage.tsx b/frontend/src/pages/secret-manager/CommitsPage/CommitsPage.tsx
index 406a1b112..591c03d4d 100644
--- a/frontend/src/pages/secret-manager/CommitsPage/CommitsPage.tsx
+++ b/frontend/src/pages/secret-manager/CommitsPage/CommitsPage.tsx
@@ -52,7 +52,7 @@ export const CommitsPage = () => {
title="Commits"
description="Track, inspect, and restore your secrets and folders with confidence. View the complete history of changes made to your environment, examine specific modifications at each commit point, and preview the exact impact before rolling back to previous states."
/>
-
+
Secret Snapshots have been officially renamed to Commits. Going forward, all secret
changes will be tracked as Commits. If you made changes before this update, you can
diff --git a/frontend/src/pages/secret-manager/CommitsPage/components/CommitHistoryTab/CommitHistoryTab.tsx b/frontend/src/pages/secret-manager/CommitsPage/components/CommitHistoryTab/CommitHistoryTab.tsx
index 8f529ba86..58191f389 100644
--- a/frontend/src/pages/secret-manager/CommitsPage/components/CommitHistoryTab/CommitHistoryTab.tsx
+++ b/frontend/src/pages/secret-manager/CommitsPage/components/CommitHistoryTab/CommitHistoryTab.tsx
@@ -1,29 +1,17 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
import {
faArrowDownWideShort,
faArrowUpWideShort,
+ faCodeCommit,
faCopy,
faSearch
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { format, formatDistanceToNow } from "date-fns";
+import { formatDistanceToNow } from "date-fns";
-import { Button, Input, Spinner } from "@app/components/v2";
+import { Button, ContentLoader, EmptyState, IconButton, Input } from "@app/components/v2";
import { CopyButton } from "@app/components/v2/CopyButton";
-import { useGetFolderCommitHistory } from "@app/hooks/api/folderCommits";
-
-interface CommitActorMetadata {
- email?: string;
- name?: string;
-}
-
-interface Commit {
- id: string;
- message: string;
- createdAt: string;
- actorType: string;
- actorMetadata?: CommitActorMetadata;
-}
+import { Commit, useGetFolderCommitHistory } from "@app/hooks/api/folderCommits";
const formatTimeAgo = (timestamp: string): string => {
return formatDistanceToNow(new Date(timestamp), { addSuffix: true });
@@ -40,58 +28,40 @@ const CommitItem = ({
onSelectCommit: (commitId: string, tab: string) => void;
}) => {
return (
-