update tanstak file managment table

src/app/styles/file-moderation-modal.scss

@@ -0,0 +1,127 @@
+@use './variable.scss' as v;
+
+.file-moderation-modal {
+	padding: 1.5rem;
+	min-width: 400px;
+
+	&__title {
+		font-size: 1.5rem;
+		font-weight: bold;
+		margin-bottom: 1rem;
+	}
+
+	&__content {
+		display: flex;
+		flex-direction: column;
+		gap: 1rem;
+	}
+
+	&__info-section,
+	&__status-section,
+	&__status-change-section {
+		border-bottom: 1px solid #e5e7eb;
+		padding-bottom: 0.75rem;
+	}
+
+	&__label,
+	&__status-label,
+	&__status-change-label {
+		display: block;
+		font-size: 0.875rem;
+		font-weight: 500;
+		color: #374151;
+	}
+
+	&__label {
+		margin-bottom: 0.25rem;
+	}
+
+	&__status-label {
+		margin-bottom: 0.25rem;
+	}
+
+	&__status-change-label {
+		margin-bottom: 0.5rem;
+	}
+
+	&__value {
+		color: #111827;
+		word-break: break-word;
+	}
+
+	&__actions {
+		display: flex;
+		justify-content: flex-end;
+		gap: 0.75rem;
+		padding-top: 1rem;
+	}
+
+	&__button {
+		padding: 0.5rem 1rem;
+		border-radius: 0.25rem;
+		transition: all 0.2s;
+		cursor: pointer;
+		border: none;
+		font-size: 0.875rem;
+
+		&:disabled {
+			cursor: not-allowed;
+		}
+	}
+
+	&__button-cancel {
+		@extend .file-moderation-modal__button;
+		color: #374151;
+		background-color: #f3f4f6;
+
+		&:hover:not(:disabled) {
+			background-color: #e5e7eb;
+		}
+	}
+
+	&__button-save {
+		@extend .file-moderation-modal__button;
+		color: white;
+		background-color: #3b82f6;
+
+		&:hover:not(:disabled) {
+			background-color: #2563eb;
+		}
+
+		&:disabled {
+			background-color: #93c5fd;
+		}
+	}
+}
+
+.status-badge {
+	padding: 0.25rem 0.5rem;
+	border-radius: 9999px;
+	font-size: 0.75rem;
+	font-weight: 500;
+	display: inline-block;
+
+	&--blocked {
+		@extend .status-badge;
+		background-color: #fee2e2;
+		color: #991b1b;
+	}
+
+	&--moderation {
+		@extend .status-badge;
+		background-color: #fef3c7;
+		color: #92400e;
+	}
+
+	&--approved {
+		@extend .status-badge;
+		background-color: #dcfce7;
+		color: #166534;
+	}
+
+	&--default {
+		@extend .status-badge;
+		background-color: #f3f4f6;
+		color: #374151;
+	}
+}

src/app/styles/global-styles.scss

@@ -1,6 +1,7 @@
 @use './variable.scss' as v;
 @use './edit-permissions-modal.scss';
 @use './animation.scss';
+@use './file-moderation-modal.scss';
 
 :root {
 	--primary-color: #2563eb;