regression: red and green color backgrounds (#8456)

packages/constants/src/cycle.ts

@@ -29,7 +29,7 @@ export const CYCLE_STATUS: {
     i18n_title: "project_cycles.status.completed",
     color: "#16A34A",
     textColor: "text-success-primary",
-    bgColor: "bg-green-50",
+    bgColor: "bg-success-subtle",
   },
   {
     i18n_label: "project_cycles.status.draft",

packages/constants/src/dashboard.ts

@@ -44,8 +44,8 @@ export const DURATION_FILTER_OPTIONS: {
 // random background colors for project cards
 export const PROJECT_BACKGROUND_COLORS = [
   "bg-gray-500/20",
-  "bg-success-primary",
-  "bg-danger-primary",
+  "bg-success-subtle",
+  "bg-danger-subtle",
   "bg-orange-500/20",
   "bg-blue-500/20",
   "bg-yellow-500/20",

packages/constants/src/module.ts

@@ -52,14 +52,14 @@ export const MODULE_STATUS: {
     value: "completed",
     color: MODULE_STATUS_COLORS.completed,
     textColor: "text-success-primary",
-    bgColor: "bg-green-100",
+    bgColor: "bg-success-subtle",
   },
   {
     i18n_label: "project_modules.status.cancelled",
     value: "cancelled",
     color: MODULE_STATUS_COLORS.cancelled,
     textColor: "text-danger-primary",
-    bgColor: "bg-red-50",
+    bgColor: "bg-danger-subtle",
   },
 ];
 

packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx

@@ -90,7 +90,7 @@ export function BubbleMenuLinkSelector(props: Props) {
           {editor.getAttributes("link").href ? (
             <button
               type="button"
-              className="grid place-items-center rounded-xs p-1 text-danger-primary hover:bg-danger-primary transition-all"
+              className="grid place-items-center rounded-xs p-1 text-danger-primary hover:bg-danger-subtle-hover transition-all"
               onClick={(e) => {
                 unsetLinkEditor(editor);
                 e.stopPropagation();

packages/editor/src/core/extensions/code/code-block-node-view.tsx

@@ -41,7 +41,7 @@ export function CodeBlockComponent({ node }: Props) {
           className={cn(
             "group/button hidden group-hover/code:flex items-center justify-center absolute top-2 right-2 z-10 size-8 rounded-md bg-layer-1 border border-subtle transition duration-150 ease-in-out backdrop-blur-sm",
             {
-              "bg-success-primary hover:bg-success-primary active:bg-success-primary": copied,
+              "bg-success-subtle hover:bg-success-subtle-1 active:bg-success-subtle-1": copied,
             }
           )}
           onClick={copyToClipboard}

packages/editor/src/core/extensions/custom-image/components/uploader.tsx

@@ -168,7 +168,8 @@ export function CustomImageUploader(props: CustomImageUploaderProps) {
     [uploadFile, editor, getPos]
   );
 
-  const isErrorState = failedToLoadImage || hasDuplicationFailed;
+  // const isErrorState = failedToLoadImage || hasDuplicationFailed;
+  const isErrorState = true;
 
   const borderColor =
     selected && editor.isEditable && !isErrorState
@@ -212,10 +213,10 @@ export function CustomImageUploader(props: CustomImageUploaderProps) {
           "bg-layer-3-hover text-secondary": draggedInside && editor.isEditable && !isErrorState,
           "text-accent-secondary bg-accent-primary/10 hover:bg-accent-primary/10 hover:text-accent-secondary":
             selected && editor.isEditable && !isErrorState,
-          "text-danger-primary cursor-default": isErrorState,
-          "hover:text-danger-primary hover:bg-danger-primary": isErrorState && editor.isEditable,
-          "bg-danger-primary": isErrorState && selected,
-          "hover:bg-danger-primary": isErrorState && selected && editor.isEditable,
+          "text-danger-primary bg-danger-subtle cursor-default": isErrorState,
+          "hover:text-danger-primary hover:bg-danger-subtle-hover": isErrorState && editor.isEditable,
+          "bg-danger-subtle-selected": isErrorState && selected,
+          "hover:bg-danger-subtle-active": isErrorState && selected && editor.isEditable,
         }
       )}
       style={borderColor ? { borderColor } : undefined}
@@ -236,9 +237,9 @@ export function CustomImageUploader(props: CustomImageUploaderProps) {
           type="button"
           onClick={handleRetryClick}
           className={cn(
-            "flex items-center gap-1 px-2 py-1 font-medium text-danger-primary rounded-md transition-all duration-200 ease-in-out hover:bg-danger-primary hover:text-danger-primary",
+            "flex items-center gap-1 px-2 py-1 font-medium text-danger-primary rounded-md transition-all duration-200 ease-in-out hover:bg-danger-subtle-hover",
             {
-              "hover:bg-danger-primary": selected,
+              "hover:bg-danger-subtle-hover": selected,
             }
           )}
           title="Retry duplication"

packages/propel/src/banner/helper.tsx

@@ -14,8 +14,8 @@ export const bannerSizeStyling = {
 // TODO: update this with new color once its implemented
 // Banner variant styling
 export const bannerStyling: IBannerStyling = {
-  success: "bg-success-primary",
-  error: "bg-danger-primary",
+  success: "bg-success-subtle",
+  error: "bg-danger-subtle",
   warning: "bg-yellow-500/10",
   info: "bg-blue-500/10",
 };

packages/propel/src/toolbar/toolbar.tsx

@@ -129,7 +129,7 @@ const buttonVariants = {
   outline:
     "border border-accent-strong text-accent-primary bg-transparent hover:bg-accent-primary/10 focus:bg-accent-primary/20",
   ghost: "text-secondary hover:bg-surface-2 focus:bg-surface-2",
-  destructive: "bg-red-500 text-on-color hover:bg-red-600 focus:bg-red-600",
+  destructive: "bg-danger-primary text-on-color hover:bg-danger-primary-hover focus:bg-danger-primary-selected",
 };
 
 const ToolbarSubmitButton = React.forwardRef(function ToolbarSubmitButton(

packages/types/src/issues.ts

@@ -2,7 +2,7 @@ import type { ICycle } from "./cycle";
 import type { TIssue } from "./issues/issue";
 import type { IModule } from "./module";
 import type { IProjectLite } from "./project";
-import type { IStateLite } from "./state";
+import type { TStateGroups } from "./state";
 import type { IUserLite } from "./users";
 import type {
   IIssueDisplayProperties,
@@ -11,7 +11,7 @@ import type {
   TIssueGroupingFilters,
   TIssueOrderByOptions,
 } from "./view-props";
-import type { IWorkspaceLite, Properties } from "./workspace";
+import type { IWorkspaceLite } from "./workspace";
 
 export interface IIssueCycle {
   id: string;
@@ -39,23 +39,6 @@ export interface IIssueModule {
   workspace: string;
 }
 
-export interface IIssueParent {
-  description: any;
-  id: string;
-  name: string;
-  priority: string | null;
-  project_detail: IProjectLite;
-  sequence_id: number;
-  start_date: string | null;
-  state_detail: IStateLite;
-  target_date: string | null;
-}
-
-export interface IIssueLink {
-  title: string;
-  url: string;
-}
-
 export interface ILinkDetails {
   created_at: Date;
   created_by: string;
@@ -65,37 +48,11 @@ export interface ILinkDetails {
   url: string;
 }
 
-export interface ISubIssuesState {
-  backlog: number;
-  unstarted: number;
-  started: number;
-  completed: number;
-  cancelled: number;
-}
-
 export interface ISubIssueResponse {
-  state_distribution: ISubIssuesState;
+  state_distribution: Record<TStateGroups, number>;
   sub_issues: TIssue[];
 }
 
-export interface BlockeIssueDetail {
-  id: string;
-  name: string;
-  sequence_id: number;
-  project_detail: IProjectLite;
-}
-
-export type IssuePriorities = {
-  id: string;
-  created_at: Date;
-  updated_at: Date;
-  uuid: string;
-  properties: Properties;
-  created_by: number;
-  updated_by: number;
-  user: string;
-};
-
 export interface IIssueLabel {
   id: string;
   name: string;
@@ -145,31 +102,6 @@ export interface IIssueActivity {
   workspace_detail?: IWorkspaceLite;
 }
 
-export interface IIssueLite {
-  id: string;
-  name: string;
-  project_id: string;
-  start_date?: string | null;
-  target_date?: string | null;
-  workspace__slug: string;
-}
-
-export interface IIssueAttachment {
-  asset: string;
-  attributes: {
-    name: string;
-    size: number;
-  };
-  created_at: string;
-  created_by: string;
-  id: string;
-  issue: string;
-  project: string;
-  updated_at: string;
-  updated_by: string;
-  workspace: string;
-}
-
 export type TIssuePriorities = "urgent" | "high" | "medium" | "low" | "none";
 
 export interface ViewFlags {
@@ -208,15 +140,6 @@ export interface IIssueMap {
   [key: string]: TIssue;
 }
 
-export interface IIssueListRow {
-  id: string;
-  groupId: string;
-  type: "HEADER" | "NO_ISSUES" | "QUICK_ADD" | "ISSUE";
-  name?: string;
-  icon?: React.ReactElement | undefined;
-  payload?: Partial<TIssue>;
-}
-
 export interface ILayoutDisplayFiltersOptions {
   display_properties: (keyof IIssueDisplayProperties)[];
   display_filters: {

packages/types/src/issues/issue.ts

@@ -73,7 +73,7 @@ export type TBaseIssue = {
   is_intake?: boolean;
 };
 
-export type IssueRelation = {
+type IssueRelation = {
   id: string;
   name: string;
   project_id: string;
@@ -182,7 +182,7 @@ export interface IPublicIssue extends Pick<
   vote_items: IPublicVote[];
 }
 
-export type TPublicIssueResponseResults =
+type TPublicIssueResponseResults =
   | IPublicIssue[]
   | {
       [key: string]: {

packages/ui/src/form-fields/password/helper.tsx

@@ -54,11 +54,11 @@ export const getFragmentColor = (fragmentIndex: number, activeFragments: number)
 
   switch (activeFragments) {
     case 1:
-      return "bg-red-500";
+      return "bg-danger-primary";
     case 2:
       return "bg-orange-500";
     case 3:
-      return "bg-green-500";
+      return "bg-success-primary";
     default:
       return "bg-layer-1";
   }

packages/ui/src/form-fields/textarea.tsx

@@ -47,7 +47,7 @@ const TextArea = React.forwardRef(function TextArea(
           "px-3 py-2": textAreaSize === "sm",
           "p-3": textAreaSize === "md",
           "border-danger-strong": hasError,
-          "bg-red-100": hasError && mode === "primary",
+          "bg-danger-subtle": hasError && mode === "primary",
         },
         className
       )}

packages/ui/src/modals/alert-modal.tsx

@@ -42,7 +42,7 @@ const BUTTON_VARIANTS: Record<TModalVariant, TButtonVariant> = {
 };
 
 const VARIANT_CLASSES: Record<TModalVariant, string> = {
-  danger: "bg-danger-primary text-danger-primary",
+  danger: "bg-danger-subtle text-danger-primary",
   primary: "bg-accent-primary/20 text-accent-primary",
 };