feat: upgraded to tw v4

This commit is contained in:
=
2025-10-09 22:37:42 +05:30
parent 2da35b389d
commit 7b0a51f5cf
669 changed files with 2856 additions and 3143 deletions
@@ -302,7 +302,7 @@ export const CommitDetailsTab = ({
<span className="text-sm font-medium text-white">
Roll back to this commit
</span>
<span className="whitespace-normal break-words text-xs leading-snug text-gray-400">
<span className="text-xs leading-snug break-words whitespace-normal text-gray-400">
Return this folder to its exact state at the time of this commit,
discarding all other changes made after it
</span>
@@ -317,7 +317,7 @@ export const CommitDetailsTab = ({
<div className="flex items-center space-x-3">
<div className="flex flex-col">
<span className="text-sm font-medium text-white">Revert changes</span>
<span className="whitespace-normal break-words text-xs leading-snug text-gray-400">
<span className="text-xs leading-snug break-words whitespace-normal text-gray-400">
Will restore to the previous version of affected resources
</span>
</div>
@@ -330,7 +330,7 @@ export const CommitDetailsTab = ({
</PageHeader>
<div className="flex w-full flex-col rounded-lg border border-mineshaft-600 bg-mineshaft-900 pt-4">
<div className="mx-4 flex items-center justify-between border-b border-mineshaft-400 pb-4">
<h3 className="text-lg font-semibold text-mineshaft-100">Commit Changes</h3>
<h3 className="text-lg font-medium text-mineshaft-100">Commit Changes</h3>
</div>
<div className="flex flex-col overflow-hidden px-4">
<div className="thin-scrollbar overflow-y-auto py-4">
@@ -339,7 +339,7 @@ export const CommitDetailsTab = ({
) : (
<EmptyState
title="No changes found."
className="h-full pb-0 pt-28"
className="h-full pt-28 pb-0"
icon={faCodeCommit}
/>
)}
@@ -221,7 +221,7 @@ export const RollbackPreviewTab = (): JSX.Element => {
{deepRollback && nestedFolderChanges.length > 0 && (
<>
<div className="border-b border-mineshaft-600 bg-mineshaft-800 px-4 py-2">
<span className="text-sm font-semibold text-white">Child folders to be restored</span>
<span className="text-sm font-medium text-white">Child folders to be restored</span>
</div>
{nestedFolderChanges.map((folder) => (
<div
@@ -297,7 +297,7 @@ export const RollbackPreviewTab = (): JSX.Element => {
};
return (
<div className="mx-auto flex w-full max-w-7xl justify-center bg-bunker-800 pb-4 pt-2 text-white">
<div className="mx-auto flex w-full max-w-7xl justify-center bg-bunker-800 pt-2 pb-4 text-white">
<ProjectPermissionCan
renderGuardBanner
I={ProjectPermissionCommitsActions.PerformRollback}
@@ -230,8 +230,8 @@ const renderJsonWithDiffs = (
const getLineClass = (different: boolean) => {
if (!different) return "flex";
return isOldVersion
? "flex bg-red-500/50 rounded-sm text-red-300"
: "flex bg-green-500/50 rounded-sm text-green-300";
? "flex bg-red-500/50 rounded-xs text-red-300"
: "flex bg-green-500/50 rounded-xs text-green-300";
};
const prefix = isDifferent ? (isOldVersion ? " -" : " +") : " ";
@@ -253,7 +253,7 @@ const renderJsonWithDiffs = (
return (
<div key={reactKey} className={getLineClass(isDifferent)}>
<div className="w-4 flex-shrink-0">{prefix}</div>
<div className="w-4 shrink-0">{prefix}</div>
<div>
{indent}
{keyName && <span>{keyDisplay}</span>}
@@ -267,7 +267,7 @@ const renderJsonWithDiffs = (
if (isArray(obj) && obj.length === 0) {
return (
<div key={reactKey} className={getLineClass(isDifferent)}>
<div className="w-4 flex-shrink-0">{prefix}</div>
<div className="w-4 shrink-0">{prefix}</div>
<div>
{indent}
{keyName && <span>{keyDisplay}</span>}
@@ -281,7 +281,7 @@ const renderJsonWithDiffs = (
if (isObject(obj) && Object.keys(obj).length === 0) {
return (
<div key={reactKey} className={getLineClass(isDifferent)}>
<div className="w-4 flex-shrink-0">{prefix}</div>
<div className="w-4 shrink-0">{prefix}</div>
<div>
{indent}
{keyName && <span>{keyDisplay}</span>}
@@ -320,7 +320,7 @@ const renderJsonWithDiffs = (
return (
<div key={reactKey}>
<div className={getLineClass(isContainerAddedOrRemoved)}>
<div className="w-4 flex-shrink-0">
<div className="w-4 shrink-0">
{isContainerAddedOrRemoved ? (isOldVersion ? " -" : " +") : " "}
</div>
<div>
@@ -353,7 +353,7 @@ const renderJsonWithDiffs = (
})}
<div className={getLineClass(isContainerAddedOrRemoved)}>
<div className="w-4 flex-shrink-0">
<div className="w-4 shrink-0">
{isContainerAddedOrRemoved ? (isOldVersion ? " -" : " +") : " "}
</div>
<div>
@@ -372,7 +372,7 @@ const renderJsonWithDiffs = (
return (
<div key={reactKey}>
<div className={getLineClass(isContainerAddedOrRemoved)}>
<div className="w-4 flex-shrink-0">
<div className="w-4 shrink-0">
{isContainerAddedOrRemoved ? (isOldVersion ? " -" : " +") : " "}
</div>
<div>
@@ -406,7 +406,7 @@ const renderJsonWithDiffs = (
})}
<div className={getLineClass(isContainerAddedOrRemoved)}>
<div className="w-4 flex-shrink-0">
<div className="w-4 shrink-0">
{isContainerAddedOrRemoved ? (isOldVersion ? " -" : " +") : " "}
</div>
<div>
@@ -420,7 +420,7 @@ const renderJsonWithDiffs = (
return (
<div key={reactKey} className={getLineClass(isDifferent)}>
<div className="w-4 flex-shrink-0">{prefix}</div>
<div className="w-4 shrink-0">{prefix}</div>
<div>
{indent}
{keyDisplay}
@@ -439,7 +439,7 @@ const formatAddedJson = (json: JsonValue): JSX.Element => {
const lineKey = `added-${line.slice(0, 30)}-${lineIndex}`;
return (
<div key={lineKey} className="flex">
<div className="w-4 flex-shrink-0">+</div>
<div className="w-4 shrink-0">+</div>
<div>{line}</div>
</div>
);
@@ -456,7 +456,7 @@ const formatDeletedJson = (json: JsonValue): JSX.Element => {
const lineKey = `deleted-${line.slice(0, 30)}-${lineIndex}`;
return (
<div key={lineKey} className="flex">
<div className="w-4 flex-shrink-0">-</div>
<div className="w-4 shrink-0">-</div>
<div>{line}</div>
</div>
);
@@ -522,7 +522,7 @@ export const SecretVersionDiffView = ({
}
oldVersionContent = (
<div className="w-fit min-w-[100%] font-mono text-sm">
<div className="w-fit min-w-full font-mono text-sm">
{renderJsonWithDiffs(
cleanOldVersion,
diffPaths,
@@ -538,7 +538,7 @@ export const SecretVersionDiffView = ({
</div>
);
newVersionContent = (
<div className="w-fit min-w-[100%] font-mono text-sm">
<div className="w-fit min-w-full font-mono text-sm">
{renderJsonWithDiffs(
cleanNewVersion,
diffPaths,
@@ -578,19 +578,19 @@ export const SecretVersionDiffView = ({
if (item.isDeleted) {
textStyle = "line-through text-red-300";
changeBadge = (
<span className="ml-2 whitespace-nowrap rounded-md bg-mineshaft-600 px-2 py-0.5 text-xs font-medium">
<span className="ml-2 rounded-md bg-mineshaft-600 px-2 py-0.5 text-xs font-medium whitespace-nowrap">
{isSecret ? "Secret" : "Folder"} Deleted
</span>
);
} else if (item.isAdded) {
changeBadge = (
<span className="ml-2 whitespace-nowrap rounded-md bg-mineshaft-600 px-2 py-0.5 text-xs font-medium">
<span className="ml-2 rounded-md bg-mineshaft-600 px-2 py-0.5 text-xs font-medium whitespace-nowrap">
{isSecret ? "Secret" : "Folder"} Added
</span>
);
} else if (item.isUpdated) {
changeBadge = (
<span className="ml-2 whitespace-nowrap rounded-md bg-mineshaft-600 px-2 py-0.5 text-xs font-medium">
<span className="ml-2 rounded-md bg-mineshaft-600 px-2 py-0.5 text-xs font-medium whitespace-nowrap">
{isSecret ? "Secret" : "Folder"} Updated
</span>
);
@@ -644,14 +644,14 @@ export const SecretVersionDiffView = ({
<div className="flex gap-3">
<div
ref={oldContainerRef}
className="thin-scrollbar max-h-96 flex-1 overflow-auto whitespace-pre"
className="max-h-96 thin-scrollbar flex-1 overflow-auto whitespace-pre"
>
{oldVersionContent}
</div>
<div className="max-h-96 w-[0.05rem] self-stretch bg-mineshaft-600" />
<div
ref={newContainerRef}
className="thin-scrollbar max-h-96 flex-1 overflow-auto whitespace-pre"
className="max-h-96 thin-scrollbar flex-1 overflow-auto whitespace-pre"
>
{newVersionContent}
</div>