thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

Merge branch 'develop' of https://github.com/makeplane/plane into feat/frontend/notifications

Browse Source
This commit is contained in:
Dakshesh Jain 2023-07-17 18:32:36 +05:30
commit b080b3047c
211 changed files with 734 additions and 832 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
apiserver/plane/api/serializers/notification.py
View File

@ -4,7 +4,6 @@ from .user import UserLiteSerializer
from plane.db.models import Notification from plane.db.models import Notification
class NotificationSerializer(BaseSerializer): class NotificationSerializer(BaseSerializer):
triggered_by_details = UserLiteSerializer(read_only=True, source="triggered_by") triggered_by_details = UserLiteSerializer(read_only=True, source="triggered_by")
class Meta: class Meta:

1
apiserver/plane/api/views/issue.py
View File

@ -45,7 +45,6 @@ from plane.api.serializers import (
IssueLiteSerializer, IssueLiteSerializer,
IssueAttachmentSerializer, IssueAttachmentSerializer,
IssueSubscriberSerializer, IssueSubscriberSerializer,
ProjectMemberSerializer,
ProjectMemberLiteSerializer, ProjectMemberLiteSerializer,
) )
from plane.api.permissions import ( from plane.api.permissions import (

3
apiserver/plane/api/views/notification.py
View File

@ -216,6 +216,7 @@ class UnreadNotificationEndpoint(BaseAPIView):
watching_notification_count = Notification.objects.filter( watching_notification_count = Notification.objects.filter(
workspace__slug=slug, workspace__slug=slug,
receiver_id=request.user.id, receiver_id=request.user.id,
read_at__isnull=True,
entity_identifier__in=IssueSubscriber.objects.filter( entity_identifier__in=IssueSubscriber.objects.filter(
workspace__slug=slug, subscriber_id=request.user.id workspace__slug=slug, subscriber_id=request.user.id
).values_list("issue_id", flat=True), ).values_list("issue_id", flat=True),
@ -225,6 +226,7 @@ class UnreadNotificationEndpoint(BaseAPIView):
my_issues_count = Notification.objects.filter( my_issues_count = Notification.objects.filter(
workspace__slug=slug, workspace__slug=slug,
receiver_id=request.user.id, receiver_id=request.user.id,
read_at__isnull=True,
entity_identifier__in=IssueAssignee.objects.filter( entity_identifier__in=IssueAssignee.objects.filter(
workspace__slug=slug, assignee_id=request.user.id workspace__slug=slug, assignee_id=request.user.id
).values_list("issue_id", flat=True), ).values_list("issue_id", flat=True),
@ -234,6 +236,7 @@ class UnreadNotificationEndpoint(BaseAPIView):
created_issues_count = Notification.objects.filter( created_issues_count = Notification.objects.filter(
workspace__slug=slug, workspace__slug=slug,
receiver_id=request.user.id, receiver_id=request.user.id,
read_at__isnull=True,
entity_identifier__in=Issue.objects.filter( entity_identifier__in=Issue.objects.filter(
workspace__slug=slug, created_by=request.user workspace__slug=slug, created_by=request.user
).values_list("pk", flat=True), ).values_list("pk", flat=True),

10
apiserver/plane/bgtasks/issue_activites_task.py
View File

@ -1028,10 +1028,14 @@ def issue_activity(
actor = User.objects.get(pk=actor_id) actor = User.objects.get(pk=actor_id)
project = Project.objects.get(pk=project_id) project = Project.objects.get(pk=project_id)
issue = Issue.objects.filter(pk=issue_id).first()
if issue is not None: try:
issue = Issue.objects.get(pk=issue_id)
issue.updated_at = timezone.now() issue.updated_at = timezone.now()
issue.save() issue.save(update_fields=["updated_at"])
except Exception as e:
pass
if subscriber: if subscriber:
# add the user to issue subscriber # add the user to issue subscriber

1
apiserver/plane/db/models/issue.py
View File

@ -28,7 +28,6 @@ class IssueManager(models.Manager):
| models.Q(issue_inbox__status=2) | models.Q(issue_inbox__status=2)
| models.Q(issue_inbox__isnull=True) | models.Q(issue_inbox__isnull=True)
) )
.filter(archived_at__isnull=True)
.exclude(archived_at__isnull=False) .exclude(archived_at__isnull=False)
) )

2
apps/app/components/account/email-code-form.tsx
View File

@ -136,6 +136,7 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
}} }}
error={errors.email} error={errors.email}
placeholder="Enter your email address..." placeholder="Enter your email address..."
className="border-custom-border-300"
/> />
</div> </div>
@ -151,6 +152,7 @@ export const EmailCodeForm = ({ handleSignIn }: any) => {
}} }}
error={errors.token} error={errors.token}
placeholder="Enter code..." placeholder="Enter code..."
className="border-custom-border-300"
/> />
<button <button
type="button" type="button"

2
apps/app/components/account/email-password-form.tsx
View File

@ -71,6 +71,7 @@ export const EmailPasswordForm: React.FC<Props> = ({ onSubmit }) => {
}} }}
error={errors.email} error={errors.email}
placeholder="Enter your email address..." placeholder="Enter your email address..."
className="border-custom-border-300"
/> />
</div> </div>
<div className="space-y-1"> <div className="space-y-1">
@ -84,6 +85,7 @@ export const EmailPasswordForm: React.FC<Props> = ({ onSubmit }) => {
}} }}
error={errors.password} error={errors.password}
placeholder="Enter your password..." placeholder="Enter your password..."
className="border-custom-border-300"
/> />
</div> </div>
<div className="text-right text-xs"> <div className="text-right text-xs">

1
apps/app/components/account/email-reset-password-form.tsx
View File

@ -78,6 +78,7 @@ export const EmailResetPasswordForm: React.FC<Props> = ({ setIsResettingPassword
}} }}
error={errors.email} error={errors.email}
placeholder="Enter registered email address.." placeholder="Enter registered email address.."
className="border-custom-border-300"
/> />
</div> </div>
<div className="mt-5 flex flex-col-reverse sm:flex-row items-center gap-2"> <div className="mt-5 flex flex-col-reverse sm:flex-row items-center gap-2">

2
apps/app/components/analytics/custom-analytics/create-update-analytics-modal.tsx
View File

@ -111,7 +111,7 @@ export const CreateUpdateAnalyticsModal: React.FC<Props> = ({ isOpen, handleClos
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-200 bg-custom-background-100 px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
<div> <div>
<Dialog.Title <Dialog.Title

2
apps/app/components/analytics/custom-analytics/graph/custom-tooltip.tsx
View File

@ -31,7 +31,7 @@ export const CustomTooltip: React.FC<Props> = ({ datum, analytics, params }) =>
} }
return ( return (
<div className="flex items-center gap-2 rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs"> <div className="flex items-center gap-2 rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
<span <span
className="h-3 w-3 rounded" className="h-3 w-3 rounded"
style={{ style={{

2
apps/app/components/analytics/custom-analytics/sidebar.tsx
View File

@ -185,7 +185,7 @@ export const AnalyticsSidebar: React.FC<Props> = ({
<div <div
className={`px-5 py-2.5 flex items-center justify-between space-y-2 ${ className={`px-5 py-2.5 flex items-center justify-between space-y-2 ${
fullScreen fullScreen
? "border-l border-custom-border-300 md:h-full md:border-l md:border-custom-border-300 md:space-y-4 overflow-hidden md:flex-col md:items-start md:py-5" ? "border-l border-custom-border-200 md:h-full md:border-l md:border-custom-border-200 md:space-y-4 overflow-hidden md:flex-col md:items-start md:py-5"
: "" : ""
}`} }`}
> >

8
apps/app/components/analytics/custom-analytics/table.tsx
View File

@ -37,9 +37,9 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
<div className="flow-root"> <div className="flow-root">
<div className="overflow-x-auto"> <div className="overflow-x-auto">
<div className="inline-block min-w-full align-middle"> <div className="inline-block min-w-full align-middle">
<table className="min-w-full divide-y divide-custom-border-300 whitespace-nowrap border-y border-custom-border-300"> <table className="min-w-full divide-y divide-custom-border-200 whitespace-nowrap border-y border-custom-border-200">
<thead className="bg-custom-background-80"> <thead className="bg-custom-background-80">
<tr className="divide-x divide-custom-border-300 text-sm text-custom-text-100"> <tr className="divide-x divide-custom-border-200 text-sm text-custom-text-100">
<th scope="col" className="py-3 px-2.5 text-left font-medium"> <th scope="col" className="py-3 px-2.5 text-left font-medium">
{ANALYTICS_X_AXIS_VALUES.find((v) => v.value === params.x_axis)?.label} {ANALYTICS_X_AXIS_VALUES.find((v) => v.value === params.x_axis)?.label}
</th> </th>
@ -80,11 +80,11 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
)} )}
</tr> </tr>
</thead> </thead>
<tbody className="divide-y divide-custom-border-300"> <tbody className="divide-y divide-custom-border-200">
{barGraphData.data.map((item, index) => ( {barGraphData.data.map((item, index) => (
<tr <tr
key={`table-row-${index}`} key={`table-row-${index}`}
className="divide-x divide-custom-border-300 text-xs text-custom-text-200" className="divide-x divide-custom-border-200 text-xs text-custom-text-200"
> >
<td <td
className={`flex items-center gap-2 whitespace-nowrap py-2 px-2.5 font-medium ${ className={`flex items-center gap-2 whitespace-nowrap py-2 px-2.5 font-medium ${

6
apps/app/components/analytics/project-modal.tsx
View File

@ -155,7 +155,7 @@ export const AnalyticsProjectModal: React.FC<Props> = ({ isOpen, onClose }) => {
} ${isOpen ? "right-0" : "-right-full"} duration-300 transition-all`} } ${isOpen ? "right-0" : "-right-full"} duration-300 transition-all`}
> >
<div <div
className={`flex h-full flex-col overflow-hidden border-custom-border-300 bg-custom-background-100 text-left ${ className={`flex h-full flex-col overflow-hidden border-custom-border-200 bg-custom-background-100 text-left ${
fullScreen ? "rounded-lg border" : "border-l" fullScreen ? "rounded-lg border" : "border-l"
}`} }`}
> >
@ -186,12 +186,12 @@ export const AnalyticsProjectModal: React.FC<Props> = ({ isOpen, onClose }) => {
</div> </div>
</div> </div>
<Tab.Group as={Fragment}> <Tab.Group as={Fragment}>
<Tab.List as="div" className="space-x-2 border-b border-custom-border-300 p-5 pt-0"> <Tab.List as="div" className="space-x-2 border-b border-custom-border-200 p-5 pt-0">
{tabsList.map((tab) => ( {tabsList.map((tab) => (
<Tab <Tab
key={tab} key={tab}
className={({ selected }) => className={({ selected }) =>
`rounded-3xl border border-custom-border-300 px-4 py-2 text-xs hover:bg-custom-background-80 ${ `rounded-3xl border border-custom-border-200 px-4 py-2 text-xs hover:bg-custom-background-80 ${
selected ? "bg-custom-background-80" : "" selected ? "bg-custom-background-80" : ""
}` }`
} }

4
apps/app/components/analytics/scope-and-demand/demand.tsx
View File

@ -10,7 +10,7 @@ type Props = {
}; };
export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => ( export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => (
<div className="space-y-3 rounded-[10px] border border-custom-border-300 p-3"> <div className="space-y-3 rounded-[10px] border border-custom-border-200 p-3">
<h5 className="text-xs text-red-500">DEMAND</h5> <h5 className="text-xs text-red-500">DEMAND</h5>
<div> <div>
<h4 className="text-custom-text-100 text-base font-medium">Total open tasks</h4> <h4 className="text-custom-text-100 text-base font-medium">Total open tasks</h4>
@ -50,7 +50,7 @@ export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => (
); );
})} })}
</div> </div>
<div className="!mt-6 flex w-min items-center gap-2 whitespace-nowrap rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs"> <div className="!mt-6 flex w-min items-center gap-2 whitespace-nowrap rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
<p className="flex items-center gap-1 text-custom-text-200"> <p className="flex items-center gap-1 text-custom-text-200">
<PlayIcon className="h-4 w-4 -rotate-90" aria-hidden="true" /> <PlayIcon className="h-4 w-4 -rotate-90" aria-hidden="true" />
<span>Estimate Demand:</span> <span>Estimate Demand:</span>

2
apps/app/components/analytics/scope-and-demand/leaderboard.tsx
View File

@ -10,7 +10,7 @@ type Props = {
}; };
export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => ( export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => (
<div className="p-3 border border-custom-border-300 rounded-[10px]"> <div className="p-3 border border-custom-border-200 rounded-[10px]">
<h6 className="text-base font-medium">{title}</h6> <h6 className="text-base font-medium">{title}</h6>
{users.length > 0 ? ( {users.length > 0 ? (
<div className="mt-3 space-y-3"> <div className="mt-3 space-y-3">

6
apps/app/components/analytics/scope-and-demand/scope.tsx
View File

@ -8,9 +8,9 @@ type Props = {
}; };
export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => ( export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
<div className="rounded-[10px] border border-custom-border-300"> <div className="rounded-[10px] border border-custom-border-200">
<h5 className="p-3 text-xs text-green-500">SCOPE</h5> <h5 className="p-3 text-xs text-green-500">SCOPE</h5>
<div className="divide-y divide-custom-border-300"> <div className="divide-y divide-custom-border-200">
<div> <div>
<h6 className="px-3 text-base font-medium">Pending issues</h6> <h6 className="px-3 text-base font-medium">Pending issues</h6>
{defaultAnalytics.pending_issue_user.length > 0 ? ( {defaultAnalytics.pending_issue_user.length > 0 ? (
@ -27,7 +27,7 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
); );
return ( return (
<div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs"> <div className="rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
<span className="font-medium text-custom-text-200"> <span className="font-medium text-custom-text-200">
{assignee {assignee
? assignee.assignees__first_name + " " + assignee.assignees__last_name ? assignee.assignees__first_name + " " + assignee.assignees__last_name

4
apps/app/components/analytics/scope-and-demand/year-wise-issues.tsx
View File

@ -15,7 +15,7 @@ export const AnalyticsYearWiseIssues: React.FC<Props> = ({ defaultAnalytics }) =
const quarterMonthsList = [startMonth, startMonth + 1, startMonth + 2]; const quarterMonthsList = [startMonth, startMonth + 1, startMonth + 2];
return ( return (
<div className="py-3 border border-custom-border-300 rounded-[10px]"> <div className="py-3 border border-custom-border-200 rounded-[10px]">
<h1 className="px-3 text-base font-medium">Issues closed in a year</h1> <h1 className="px-3 text-base font-medium">Issues closed in a year</h1>
{defaultAnalytics.issue_completed_month_wise.length > 0 ? ( {defaultAnalytics.issue_completed_month_wise.length > 0 ? (
<LineGraph <LineGraph
@ -43,7 +43,7 @@ export const AnalyticsYearWiseIssues: React.FC<Props> = ({ defaultAnalytics }) =
margin={{ top: 20 }} margin={{ top: 20 }}
enableSlices="x" enableSlices="x"
sliceTooltip={(datum) => ( sliceTooltip={(datum) => (
<div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs"> <div className="rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
{datum.slice.points[0].data.yFormatted} {datum.slice.points[0].data.yFormatted}
<span className="text-custom-text-200"> issues closed in </span> <span className="text-custom-text-200"> issues closed in </span>
{datum.slice.points[0].data.xFormatted} {datum.slice.points[0].data.xFormatted}

2
apps/app/components/auth-screens/not-authorized-view.tsx
View File

@ -22,7 +22,7 @@ export const NotAuthorizedView: React.FC<Props> = ({ actionButton, type }) => {
return ( return (
<DefaultLayout> <DefaultLayout>
<div className="flex h-full w-full flex-col items-center justify-center gap-y-5 bg-custom-background-90 text-center"> <div className="flex h-full w-full flex-col items-center justify-center gap-y-5 bg-custom-background-100 text-center">
<div className="h-44 w-72"> <div className="h-44 w-72">
<Image <Image
src={type === "project" ? ProjectNotAuthorizedImg : WorkspaceNotAuthorizedImg} src={type === "project" ? ProjectNotAuthorizedImg : WorkspaceNotAuthorizedImg}

2
apps/app/components/auth-screens/project/join-project.tsx
View File

@ -41,7 +41,7 @@ export const JoinProject: React.FC = () => {
}; };
return ( return (
<div className="flex h-full w-full flex-col items-center justify-center gap-y-5 bg-custom-background-90 text-center"> <div className="flex h-full w-full flex-col items-center justify-center gap-y-5 bg-custom-background-100 text-center">
<div className="h-44 w-72"> <div className="h-44 w-72">
<Image src={JoinProjectImg} height="176" width="288" alt="JoinProject" /> <Image src={JoinProjectImg} height="176" width="288" alt="JoinProject" />
</div> </div>

19
apps/app/components/automation/auto-archive-automation.tsx
View File

@ -28,11 +28,11 @@ export const AutoArchiveAutomation: React.FC<Props> = ({ projectDetails, handleC
handleClose={() => setmonthModal(false)} handleClose={() => setmonthModal(false)}
handleChange={handleChange} handleChange={handleChange}
/> />
<div className="flex flex-col gap-7 px-6 py-5 rounded-[10px] border border-brand-base bg-brand-base"> <div className="flex flex-col gap-7 px-6 py-5 rounded-[10px] border border-custom-border-100 bg-custom-background-90">
<div className="flex items-center justify-between gap-x-8 gap-y-2 "> <div className="flex items-center justify-between gap-x-8 gap-y-2">
<div className="flex flex-col gap-2.5"> <div className="flex flex-col gap-2.5">
<h4 className="text-lg font-semibold">Auto-archive closed issues</h4> <h4 className="text-lg font-semibold">Auto-archive closed issues</h4>
<p className="text-sm text-brand-secondary"> <p className="text-sm text-custom-text-200">
Plane will automatically archive issues that have been completed or cancelled for the Plane will automatically archive issues that have been completed or cancelled for the
configured time period. configured time period.
</p> </p>
@ -52,17 +52,12 @@ export const AutoArchiveAutomation: React.FC<Props> = ({ projectDetails, handleC
<div className="w-1/2 text-base font-medium"> <div className="w-1/2 text-base font-medium">
Auto-archive issues that are closed for Auto-archive issues that are closed for
</div> </div>
<div className="w-1/2 "> <div className="w-1/2">
<CustomSelect <CustomSelect
value={projectDetails?.archive_in} value={projectDetails?.archive_in}
customButton={ label={`${projectDetails?.archive_in} ${
<button className="flex w-full items-center justify-between gap-1 rounded-md border border-brand-base shadow-sm duration-300 text-brand-secondary hover:text-brand-base hover:bg-brand-surface-2 focus:outline-none px-3 py-2 text-sm text-left"> projectDetails?.archive_in === 1 ? "Month" : "Months"
{`${projectDetails?.archive_in} ${ }`}
projectDetails?.archive_in === 1 ? "Month" : "Months"
}`}
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</button>
}
onChange={(val: number) => { onChange={(val: number) => {
handleChange({ archive_in: val }); handleChange({ archive_in: val });
}} }}

67
apps/app/components/automation/auto-close-automation.tsx
View File

@ -77,11 +77,11 @@ export const AutoCloseAutomation: React.FC<Props> = ({ projectDetails, handleCha
handleChange={handleChange} handleChange={handleChange}
/> />
<div className="flex flex-col gap-7 px-6 py-5 rounded-[10px] border border-brand-base bg-brand-base"> <div className="flex flex-col gap-7 px-6 py-5 rounded-[10px] border border-custom-border-100 bg-custom-background-90">
<div className="flex items-center justify-between gap-x-8 gap-y-2 "> <div className="flex items-center justify-between gap-x-8 gap-y-2 ">
<div className="flex flex-col gap-2.5"> <div className="flex flex-col gap-2.5">
<h4 className="text-lg font-semibold">Auto-close inactive issues</h4> <h4 className="text-lg font-semibold">Auto-close inactive issues</h4>
<p className="text-sm text-brand-secondary"> <p className="text-sm text-custom-text-200">
Plane will automatically close the issues that have not been updated for the Plane will automatically close the issues that have not been updated for the
configured time period. configured time period.
</p> </p>
@ -102,17 +102,12 @@ export const AutoCloseAutomation: React.FC<Props> = ({ projectDetails, handleCha
<div className="w-1/2 text-base font-medium"> <div className="w-1/2 text-base font-medium">
Auto-close issues that are inactive for Auto-close issues that are inactive for
</div> </div>
<div className="w-1/2 "> <div className="w-1/2">
<CustomSelect <CustomSelect
value={projectDetails?.close_in} value={projectDetails?.close_in}
customButton={ label={`${projectDetails?.close_in} ${
<button className="flex w-full items-center justify-between gap-1 rounded-md border border-brand-base shadow-sm duration-300 text-brand-secondary hover:text-brand-base hover:bg-brand-surface-2 focus:outline-none px-3 py-2 text-sm text-left"> projectDetails?.close_in === 1 ? "Month" : "Months"
{`${projectDetails?.close_in} ${ }`}
projectDetails?.close_in === 1 ? "Month" : "Months"
}`}
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</button>
}
onChange={(val: number) => { onChange={(val: number) => {
handleChange({ close_in: val }); handleChange({ close_in: val });
}} }}
@ -143,42 +138,34 @@ export const AutoCloseAutomation: React.FC<Props> = ({ projectDetails, handleCha
value={ value={
projectDetails?.default_state ? projectDetails?.default_state : defaultState projectDetails?.default_state ? projectDetails?.default_state : defaultState
} }
customButton={ label={
<button <div className="flex items-center gap-2">
className={`flex w-full items-center justify-between gap-1 rounded-md border border-brand-base shadow-sm duration-300 text-brand-secondary hover:text-brand-base hover:bg-brand-surface-2 focus:outline-none px-3 py-2 text-sm text-left ${ {selectedOption ? (
!multipleOptions ? "opacity-60" : "" getStateGroupIcon(selectedOption.group, "16", "16", selectedOption.color)
}`} ) : currentDefaultState ? (
> getStateGroupIcon(
<div className="flex items-center gap-2"> currentDefaultState.group,
{selectedOption ? ( "16",
getStateGroupIcon(selectedOption.group, "16", "16", selectedOption.color) "16",
) : currentDefaultState ? ( currentDefaultState.color
getStateGroupIcon( )
currentDefaultState.group, ) : (
"16", <Squares2X2Icon className="h-3.5 w-3.5 text-custom-text-200" />
"16",
currentDefaultState.color
)
) : (
<Squares2X2Icon className="h-3.5 w-3.5 text-custom-text-200" />
)}
{selectedOption?.name
? selectedOption.name
: currentDefaultState?.name ?? (
<span className="text-custom-text-200">State</span>
)}
</div>
{multipleOptions && (
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
)} )}
</button> {selectedOption?.name
? selectedOption.name
: currentDefaultState?.name ?? (
<span className="text-custom-text-200">State</span>
)}
</div>
} }
onChange={(val: string) => { onChange={(val: string) => {
handleChange({ default_state: val }); handleChange({ default_state: val });
}} }}
options={options} options={options}
disabled={!multipleOptions} disabled={!multipleOptions}
dropdownWidth="w-full" width="w-full"
input
/> />
</div> </div>
</div> </div>

4
apps/app/components/breadcrumbs/index.tsx
View File

@ -17,7 +17,7 @@ const Breadcrumbs = ({ children }: BreadcrumbsProps) => {
<div className="flex items-center"> <div className="flex items-center">
<button <button
type="button" type="button"
className="group grid h-7 w-7 flex-shrink-0 cursor-pointer place-items-center rounded border border-custom-sidebar-border-100 text-center text-sm hover:bg-custom-sidebar-background-90" className="group grid h-7 w-7 flex-shrink-0 cursor-pointer place-items-center rounded border border-custom-sidebar-border-200 text-center text-sm hover:bg-custom-sidebar-background-90"
onClick={() => router.back()} onClick={() => router.back()}
> >
<Icon <Icon
@ -41,7 +41,7 @@ const BreadcrumbItem: React.FC<BreadcrumbItemProps> = ({ title, link, icon }) =>
<> <>
{link ? ( {link ? (
<Link href={link}> <Link href={link}>
<a className="border-r-2 border-custom-sidebar-border-100 px-3 text-sm"> <a className="border-r-2 border-custom-sidebar-border-200 px-3 text-sm">
<p className={`${icon ? "flex items-center gap-2" : ""}`}> <p className={`${icon ? "flex items-center gap-2" : ""}`}>
{icon ?? null} {icon ?? null}
{title} {title}

4
apps/app/components/command-palette/command-pallette.tsx
View File

@ -421,7 +421,7 @@ export const CommandPalette: React.FC = () => {
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform divide-y divide-custom-border-300 divide-opacity-10 rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform divide-y divide-custom-border-200 divide-opacity-10 rounded-xl border border-custom-border-200 bg-custom-background-100 shadow-2xl transition-all">
<Command <Command
filter={(value, search) => { filter={(value, search) => {
if (value.toLowerCase().includes(search.toLowerCase())) return 1; if (value.toLowerCase().includes(search.toLowerCase())) return 1;
@ -456,7 +456,7 @@ export const CommandPalette: React.FC = () => {
aria-hidden="true" aria-hidden="true"
/> />
<Command.Input <Command.Input
className="w-full border-0 border-b border-custom-border-300 bg-transparent p-4 pl-11 text-custom-text-100 outline-none focus:ring-0 sm:text-sm" className="w-full border-0 border-b border-custom-border-200 bg-transparent p-4 pl-11 text-custom-text-100 outline-none focus:ring-0 sm:text-sm"
placeholder={placeholder} placeholder={placeholder}
value={searchTerm} value={searchTerm}
onValueChange={(e) => { onValueChange={(e) => {

14
apps/app/components/command-palette/shortcuts-modal.tsx
View File

@ -104,7 +104,7 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
</span> </span>
</Dialog.Title> </Dialog.Title>
<div> <div>
<div className="flex w-full items-center justify-start gap-1 rounded border-[0.6px] border-custom-border-300 bg-custom-background-90 px-3 py-2"> <div className="flex w-full items-center justify-start gap-1 rounded border-[0.6px] border-custom-border-200 bg-custom-background-90 px-3 py-2">
<MagnifyingGlassIcon className="h-3.5 w-3.5 text-custom-text-200" /> <MagnifyingGlassIcon className="h-3.5 w-3.5 text-custom-text-200" />
<Input <Input
className="w-full border-none bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none" className="w-full border-none bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none"
@ -130,15 +130,15 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
{shortcut.keys.split(",").map((key, index) => ( {shortcut.keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1"> <span key={index} className="flex items-center gap-1">
{key === "Ctrl" ? ( {key === "Ctrl" ? (
<span className="flex h-full items-center rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5"> <span className="flex h-full items-center rounded-sm border border-custom-border-200 bg-custom-background-90 p-1.5">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</span> </span>
) : key === "Ctrl" ? ( ) : key === "Ctrl" ? (
<kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-200 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</kbd> </kbd>
) : ( ) : (
<kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-200 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200">
{key} {key}
</kbd> </kbd>
)} )}
@ -173,15 +173,15 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
{keys.split(",").map((key, index) => ( {keys.split(",").map((key, index) => (
<span key={index} className="flex items-center gap-1"> <span key={index} className="flex items-center gap-1">
{key === "Ctrl" ? ( {key === "Ctrl" ? (
<span className="flex h-full items-center rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5 text-custom-text-200"> <span className="flex h-full items-center rounded-sm border border-custom-border-200 bg-custom-background-90 p-1.5 text-custom-text-200">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</span> </span>
) : key === "Ctrl" ? ( ) : key === "Ctrl" ? (
<kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-200 bg-custom-background-90 p-1.5 text-sm font-medium text-custom-text-200">
<CommandIcon className="h-4 w-4 fill-current text-custom-text-200" /> <CommandIcon className="h-4 w-4 fill-current text-custom-text-200" />
</kbd> </kbd>
) : ( ) : (
<kbd className="rounded-sm border border-custom-border-300 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200"> <kbd className="rounded-sm border border-custom-border-200 bg-custom-background-90 px-2 py-1 text-sm font-medium text-custom-text-200">
{key} {key}
</kbd> </kbd>
)} )}

6
apps/app/components/core/board-view/single-issue.tsx
View File

@ -392,7 +392,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
/> />
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -402,7 +402,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5" /> <LinkIcon className="h-3.5 w-3.5" />
@ -412,7 +412,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45" />

8
apps/app/components/core/calendar-view/calendar-header.tsx
View File

@ -92,7 +92,7 @@ export const CalendarHeader: React.FC<Props> = ({
</button> </button>
))} ))}
</div> </div>
<div className="grid grid-cols-4 border-t border-custom-border-300 px-2"> <div className="grid grid-cols-4 border-t border-custom-border-200 px-2">
{MONTHS_LIST.map((month) => ( {MONTHS_LIST.map((month) => (
<button <button
onClick={() => onClick={() =>
@ -152,7 +152,7 @@ export const CalendarHeader: React.FC<Props> = ({
<div className="flex w-full items-center justify-end gap-2"> <div className="flex w-full items-center justify-end gap-2">
<button <button
className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-300 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none" className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-200 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none"
onClick={() => { onClick={() => {
if (isMonthlyView) { if (isMonthlyView) {
updateDate(new Date()); updateDate(new Date());
@ -170,7 +170,7 @@ export const CalendarHeader: React.FC<Props> = ({
<CustomMenu <CustomMenu
customButton={ customButton={
<div className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-300 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none "> <div className="group flex cursor-pointer items-center gap-2 rounded-md border border-custom-border-200 px-3 py-1 text-sm hover:bg-custom-background-80 hover:text-custom-text-100 focus:outline-none ">
{isMonthlyView ? "Monthly" : "Weekly"} {isMonthlyView ? "Monthly" : "Weekly"}
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" /> <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</div> </div>
@ -207,7 +207,7 @@ export const CalendarHeader: React.FC<Props> = ({
/> />
</div> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="mt-1 flex w-52 items-center justify-between border-t border-custom-border-300 py-2 px-1 text-sm text-custom-text-200"> <div className="mt-1 flex w-52 items-center justify-between border-t border-custom-border-200 py-2 px-1 text-sm text-custom-text-200">
<h4>Show weekends</h4> <h4>Show weekends</h4>
<ToggleSwitch value={showWeekEnds} onChange={() => setShowWeekEnds(!showWeekEnds)} /> <ToggleSwitch value={showWeekEnds} onChange={() => setShowWeekEnds(!showWeekEnds)} />
</div> </div>

2
apps/app/components/core/calendar-view/calendar.tsx
View File

@ -191,7 +191,7 @@ export const CalendarView: React.FC<Props> = ({
{weeks.map((date, index) => ( {weeks.map((date, index) => (
<div <div
key={index} key={index}
className={`flex items-center justify-start gap-2 border-custom-border-300 bg-custom-background-90 p-1.5 text-base font-medium text-custom-text-200 ${ className={`flex items-center justify-start gap-2 border-custom-border-200 bg-custom-background-90 p-1.5 text-base font-medium text-custom-text-200 ${
!isMonthlyView !isMonthlyView
? showWeekEnds ? showWeekEnds
? (index + 1) % 7 === 0 ? (index + 1) % 7 === 0

4
apps/app/components/core/calendar-view/single-date.tsx
View File

@ -49,7 +49,7 @@ export const SingleCalendarDate: React.FC<Props> = ({
key={index} key={index}
ref={provided.innerRef} ref={provided.innerRef}
{...provided.droppableProps} {...provided.droppableProps}
className={`group relative flex min-h-[150px] flex-col gap-1.5 border-t border-custom-border-300 p-2.5 text-left text-sm font-medium hover:bg-custom-background-90 ${ className={`group relative flex min-h-[150px] flex-col gap-1.5 border-t border-custom-border-200 p-2.5 text-left text-sm font-medium hover:bg-custom-background-90 ${
isMonthlyView ? "" : "pt-9" isMonthlyView ? "" : "pt-9"
} ${ } ${
showWeekEnds showWeekEnds
@ -83,7 +83,7 @@ export const SingleCalendarDate: React.FC<Props> = ({
{totalIssues > 4 && ( {totalIssues > 4 && (
<button <button
type="button" type="button"
className="w-min whitespace-nowrap rounded-md border border-custom-border-300 bg-custom-background-80 px-1.5 py-1 text-xs" className="w-min whitespace-nowrap rounded-md border border-custom-border-200 bg-custom-background-80 px-1.5 py-1 text-xs"
onClick={() => setShowAllIssues((prevData) => !prevData)} onClick={() => setShowAllIssues((prevData) => !prevData)}
> >
{showAllIssues ? "Hide" : totalIssues - 4 + " more"} {showAllIssues ? "Hide" : totalIssues - 4 + " more"}

8
apps/app/components/core/calendar-view/single-issue.tsx
View File

@ -163,7 +163,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
ref={provided.innerRef} ref={provided.innerRef}
{...provided.draggableProps} {...provided.draggableProps}
{...provided.dragHandleProps} {...provided.dragHandleProps}
className={`w-full relative cursor-pointer rounded border border-custom-border-300 px-1.5 py-1.5 text-xs duration-300 hover:cursor-move hover:bg-custom-background-80 ${ className={`w-full relative cursor-pointer rounded border border-custom-border-200 px-1.5 py-1.5 text-xs duration-300 hover:cursor-move hover:bg-custom-background-80 ${
snapshot.isDragging ? "bg-custom-background-80 shadow-lg" : "" snapshot.isDragging ? "bg-custom-background-80 shadow-lg" : ""
}`} }`}
> >
@ -267,7 +267,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
/> />
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -277,7 +277,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5" /> <LinkIcon className="h-3.5 w-3.5" />
@ -287,7 +287,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45" />

53
apps/app/components/core/feeds.tsx
View File

@ -5,25 +5,16 @@ import Link from "next/link";
// icons // icons
import { import {
ArrowTopRightOnSquareIcon, ArrowTopRightOnSquareIcon,
CalendarDaysIcon,
ChartBarIcon,
ChatBubbleBottomCenterTextIcon,
ChatBubbleLeftEllipsisIcon, ChatBubbleLeftEllipsisIcon,
LinkIcon,
PaperClipIcon,
PlayIcon,
RectangleGroupIcon,
Squares2X2Icon, Squares2X2Icon,
TrashIcon,
UserIcon,
} from "@heroicons/react/24/outline"; } from "@heroicons/react/24/outline";
import { BlockedIcon, BlockerIcon, CyclesIcon, TagIcon, UserGroupIcon } from "components/icons"; import { BlockedIcon, BlockerIcon } from "components/icons";
import { Icon } from "components/ui";
// helpers // helpers
import { renderShortDateWithYearFormat, timeAgo } from "helpers/date-time.helper"; import { renderShortDateWithYearFormat, timeAgo } from "helpers/date-time.helper";
import { addSpaceIfCamelCase } from "helpers/string.helper"; import { addSpaceIfCamelCase } from "helpers/string.helper";
// types // types
import RemirrorRichTextEditor from "components/rich-text-editor"; import RemirrorRichTextEditor from "components/rich-text-editor";
import { Icon } from "components/ui";
const activityDetails: { const activityDetails: {
[key: string]: { [key: string]: {
@ -33,11 +24,11 @@ const activityDetails: {
} = { } = {
assignee: { assignee: {
message: "removed the assignee", message: "removed the assignee",
icon: <UserGroupIcon className="h-3 w-3" color="#6b7280" aria-hidden="true" />, icon: <Icon iconName="group" className="!text-sm" aria-hidden="true" />,
}, },
assignees: { assignees: {
message: "added a new assignee", message: "added a new assignee",
icon: <UserGroupIcon className="h-3 w-3" color="#6b7280" aria-hidden="true" />, icon: <Icon iconName="group" className="!text-sm" aria-hidden="true" />,
}, },
blocks: { blocks: {
message: "marked this issue being blocked by", message: "marked this issue being blocked by",
@ -49,14 +40,14 @@ const activityDetails: {
}, },
cycles: { cycles: {
message: "set the cycle to", message: "set the cycle to",
icon: <CyclesIcon height="12" width="12" color="#6b7280" />, icon: <Icon iconName="contrast" className="!text-sm" aria-hidden="true" />,
}, },
labels: { labels: {
icon: <TagIcon height="12" width="12" color="#6b7280" />, icon: <Icon iconName="sell" className="!text-sm" aria-hidden="true" />,
}, },
modules: { modules: {
message: "set the module to", message: "set the module to",
icon: <RectangleGroupIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="dataset" className="!text-sm" aria-hidden="true" />,
}, },
state: { state: {
message: "set the state to", message: "set the state to",
@ -64,51 +55,47 @@ const activityDetails: {
}, },
priority: { priority: {
message: "set the priority to", message: "set the priority to",
icon: <ChartBarIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="signal_cellular_alt" className="!text-sm" aria-hidden="true" />,
}, },
name: { name: {
message: "set the name to", message: "set the name to",
icon: ( icon: <Icon iconName="chat" className="!text-sm" aria-hidden="true" />,
<ChatBubbleBottomCenterTextIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />
),
}, },
description: { description: {
message: "updated the description.", message: "updated the description.",
icon: ( icon: <Icon iconName="chat" className="!text-sm" aria-hidden="true" />,
<ChatBubbleBottomCenterTextIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />
),
}, },
estimate_point: { estimate_point: {
message: "set the estimate point to", message: "set the estimate point to",
icon: <PlayIcon className="h-3 w-3 -rotate-90 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="change_history" className="!text-sm" aria-hidden="true" />,
}, },
target_date: { target_date: {
message: "set the due date to", message: "set the due date to",
icon: <CalendarDaysIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="calendar_today" className="!text-sm" aria-hidden="true" />,
}, },
parent: { parent: {
message: "set the parent to", message: "set the parent to",
icon: <UserIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="supervised_user_circle" className="!text-sm" aria-hidden="true" />,
}, },
issue: { issue: {
message: "deleted the issue.", message: "deleted the issue.",
icon: <TrashIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="delete" className="!text-sm" aria-hidden="true" />,
}, },
estimate: { estimate: {
message: "updated the estimate", message: "updated the estimate",
icon: <PlayIcon className="h-3 w-3 -rotate-90 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="change_history" className="!text-sm" aria-hidden="true" />,
}, },
link: { link: {
message: "updated the link", message: "updated the link",
icon: <LinkIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="link" className="!text-sm" aria-hidden="true" />,
}, },
attachment: { attachment: {
message: "updated the attachment", message: "updated the attachment",
icon: <PaperClipIcon className="h-3 w-3 text-custom-text-200 " aria-hidden="true" />, icon: <Icon iconName="attach_file" className="!text-sm" aria-hidden="true" />,
}, },
archived_at: { archived_at: {
message: "archived", message: "archived",
icon: <Icon iconName="archive" className="text-sm text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="archive" className="!text-sm text-custom-text-200" aria-hidden="true" />,
}, },
}; };
@ -263,7 +250,7 @@ export const Feeds: React.FC<any> = ({ activities }) => (
} }
editable={false} editable={false}
noBorder noBorder
customClassName="text-xs border border-custom-border-300 bg-custom-background-100" customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
/> />
</div> </div>
</div> </div>
@ -287,7 +274,7 @@ export const Feeds: React.FC<any> = ({ activities }) => (
<div> <div>
<div className="relative px-1.5"> <div className="relative px-1.5">
<div className="mt-1.5"> <div className="mt-1.5">
<div className="ring-6 flex h-7 w-7 items-center justify-center rounded-full bg-custom-background-80 ring-white"> <div className="ring-6 flex h-7 w-7 items-center justify-center rounded-full bg-custom-background-80 text-custom-text-200 ring-white">
{activity.field ? ( {activity.field ? (
activityDetails[activity.field as keyof typeof activityDetails]?.icon activityDetails[activity.field as keyof typeof activityDetails]?.icon
) : activity.actor_detail.avatar && ) : activity.actor_detail.avatar &&

2
apps/app/components/core/filters/due-date-filter-modal.tsx
View File

@ -109,7 +109,7 @@ export const DueDateFilterModal: React.FC<Props> = ({ isOpen, handleClose }) =>
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative flex transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative flex transform rounded-lg border border-custom-border-200 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form className="space-y-4" onSubmit={handleSubmit(handleFormSubmit)}> <form className="space-y-4" onSubmit={handleSubmit(handleFormSubmit)}>
<div className="flex w-full justify-between"> <div className="flex w-full justify-between">
<Controller <Controller

6
apps/app/components/core/filters/filters-list.tsx
View File

@ -58,7 +58,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
return ( return (
<div <div
key={key} key={key}
className="flex items-center gap-x-2 rounded-full border border-custom-border-300 bg-custom-background-80 px-2 py-1" className="flex items-center gap-x-2 rounded-full border border-custom-border-200 bg-custom-background-80 px-2 py-1"
> >
<span className="capitalize text-custom-text-200"> <span className="capitalize text-custom-text-200">
{key === "target_date" ? "Due Date" : replaceUnderscoreIfSnakeCase(key)}: {key === "target_date" ? "Due Date" : replaceUnderscoreIfSnakeCase(key)}:
@ -310,7 +310,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
return ( return (
<div <div
key={date} key={date}
className="inline-flex items-center gap-x-1 rounded-full border border-custom-border-300 bg-custom-background-100 px-1 py-0.5" className="inline-flex items-center gap-x-1 rounded-full border border-custom-border-200 bg-custom-background-100 px-1 py-0.5"
> >
<div className="h-1.5 w-1.5 rounded-full" /> <div className="h-1.5 w-1.5 rounded-full" />
<span className="capitalize"> <span className="capitalize">
@ -381,7 +381,7 @@ export const FilterList: React.FC<any> = ({ filters, setFilters }) => {
target_date: null, target_date: null,
}) })
} }
className="flex items-center gap-x-1 rounded-full border border-custom-border-300 bg-custom-background-80 px-3 py-1.5 text-xs" className="flex items-center gap-x-1 rounded-full border border-custom-border-200 bg-custom-background-80 px-3 py-1.5 text-xs"
> >
<span>Clear all filters</span> <span>Clear all filters</span>
<XMarkIcon className="h-3 w-3" /> <XMarkIcon className="h-3 w-3" />

8
apps/app/components/core/filters/issues-view-filter.tsx
View File

@ -146,7 +146,7 @@ export const IssuesFilterView: React.FC = () => {
{({ open }) => ( {({ open }) => (
<> <>
<Popover.Button <Popover.Button
className={`group flex items-center gap-2 rounded-md border border-custom-sidebar-border-100 bg-transparent px-3 py-1.5 text-xs hover:bg-custom-sidebar-background-90 hover:text-custom-sidebar-text-100 focus:outline-none duration-300 ${ className={`group flex items-center gap-2 rounded-md border border-custom-sidebar-border-200 bg-transparent px-3 py-1.5 text-xs hover:bg-custom-sidebar-background-90 hover:text-custom-sidebar-text-100 focus:outline-none duration-300 ${
open open
? "bg-custom-sidebar-background-90 text-custom-sidebar-text-100" ? "bg-custom-sidebar-background-90 text-custom-sidebar-text-100"
: "text-custom-sidebar-text-200" : "text-custom-sidebar-text-200"
@ -165,8 +165,8 @@ export const IssuesFilterView: React.FC = () => {
leaveFrom="opacity-100 translate-y-0" leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 translate-y-1" leaveTo="opacity-0 translate-y-1"
> >
<Popover.Panel className="absolute right-0 z-30 mt-1 w-screen max-w-xs transform rounded-lg border border-custom-border-300 bg-custom-background-90 p-3 shadow-lg"> <Popover.Panel className="absolute right-0 z-30 mt-1 w-screen max-w-xs transform rounded-lg border border-custom-border-200 bg-custom-background-90 p-3 shadow-lg">
<div className="relative divide-y-2 divide-custom-border-300"> <div className="relative divide-y-2 divide-custom-border-200">
<div className="space-y-4 pb-3 text-xs"> <div className="space-y-4 pb-3 text-xs">
{issueView !== "calendar" && issueView !== "spreadsheet" && ( {issueView !== "calendar" && issueView !== "spreadsheet" && (
<> <>
@ -292,7 +292,7 @@ export const IssuesFilterView: React.FC = () => {
className={`rounded border px-2 py-1 text-xs capitalize ${ className={`rounded border px-2 py-1 text-xs capitalize ${
properties[key as keyof Properties] properties[key as keyof Properties]
? "border-custom-primary bg-custom-primary text-white" ? "border-custom-primary bg-custom-primary text-white"
: "border-custom-border-300" : "border-custom-border-200"
}`} }`}
onClick={() => setProperties(key as keyof Properties)} onClick={() => setProperties(key as keyof Properties)}
> >

6
apps/app/components/core/image-picker-popover.tsx
View File

@ -62,7 +62,7 @@ export const ImagePickerPopover: React.FC<Props> = ({ label, value, onChange })
return ( return (
<Popover className="relative z-[2]" ref={ref}> <Popover className="relative z-[2]" ref={ref}>
<Popover.Button <Popover.Button
className="rounded-md border border-custom-border-300 bg-custom-background-80 px-2 py-1 text-xs text-custom-text-200" className="rounded-md border border-custom-border-200 bg-custom-background-80 px-2 py-1 text-xs text-custom-text-200"
onClick={() => setIsOpen((prev) => !prev)} onClick={() => setIsOpen((prev) => !prev)}
> >
{label} {label}
@ -76,8 +76,8 @@ export const ImagePickerPopover: React.FC<Props> = ({ label, value, onChange })
leaveFrom="transform opacity-100 scale-100" leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95" leaveTo="transform opacity-0 scale-95"
> >
<Popover.Panel className="absolute right-0 z-10 mt-2 rounded-md border border-custom-border-300 bg-custom-background-80 shadow-lg"> <Popover.Panel className="absolute right-0 z-10 mt-2 rounded-md border border-custom-border-200 bg-custom-background-80 shadow-lg">
<div className="h-96 w-80 overflow-auto rounded border border-custom-border-300 bg-custom-background-80 p-5 shadow-2xl sm:max-w-2xl md:w-96 lg:w-[40rem]"> <div className="h-96 w-80 overflow-auto rounded border border-custom-border-200 bg-custom-background-80 p-5 shadow-2xl sm:max-w-2xl md:w-96 lg:w-[40rem]">
<Tab.Group> <Tab.Group>
<Tab.List as="span" className="inline-block rounded bg-custom-background-80 p-1"> <Tab.List as="span" className="inline-block rounded bg-custom-background-80 p-1">
{tabOptions.map((tab) => ( {tabOptions.map((tab) => (

2
apps/app/components/core/issues-view.tsx
View File

@ -488,7 +488,7 @@ export const IssuesView: React.FC<Props> = ({
{viewId ? "Update" : "Save"} view {viewId ? "Update" : "Save"} view
</PrimaryButton> </PrimaryButton>
</div> </div>
{<div className="mt-3 border-t border-custom-border-300" />} {<div className="mt-3 border-t border-custom-border-200" />}
</> </>
)} )}

8
apps/app/components/core/list-view/single-issue.tsx
View File

@ -219,7 +219,7 @@ export const SingleListIssue: React.FC<Props> = ({
</a> </a>
</ContextMenu> </ContextMenu>
<div <div
className="flex flex-wrap items-center justify-between px-4 py-2.5 gap-2 border-b border-custom-border-300 bg-custom-background-100 last:border-b-0" className="flex flex-wrap items-center justify-between px-4 py-2.5 gap-2 border-b border-custom-border-200 bg-custom-background-100 last:border-b-0"
onContextMenu={(e) => { onContextMenu={(e) => {
e.preventDefault(); e.preventDefault();
setContextMenu(true); setContextMenu(true);
@ -307,7 +307,7 @@ export const SingleListIssue: React.FC<Props> = ({
/> />
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -317,7 +317,7 @@ export const SingleListIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5" /> <LinkIcon className="h-3.5 w-3.5" />
@ -327,7 +327,7 @@ export const SingleListIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachments" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45" />

4
apps/app/components/core/modals/bulk-delete-issues-modal.tsx
View File

@ -173,7 +173,7 @@ export const BulkDeleteIssuesModal: React.FC<Props> = ({ isOpen, setIsOpen, user
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-200 bg-custom-background-100 shadow-2xl transition-all">
<form> <form>
<Combobox <Combobox
onChange={(val: string) => { onChange={(val: string) => {
@ -201,7 +201,7 @@ export const BulkDeleteIssuesModal: React.FC<Props> = ({ isOpen, setIsOpen, user
<Combobox.Options <Combobox.Options
static static
className="max-h-80 scroll-py-2 divide-y divide-custom-border-300 overflow-y-auto" className="max-h-80 scroll-py-2 divide-y divide-custom-border-200 overflow-y-auto"
> >
{filteredIssues.length > 0 ? ( {filteredIssues.length > 0 ? (
<li className="p-2"> <li className="p-2">

6
apps/app/components/core/modals/existing-issues-list-modal.tsx
View File

@ -154,7 +154,7 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-200 bg-custom-background-100 shadow-2xl transition-all">
<Combobox <Combobox
as="div" as="div"
onChange={(val: ISearchIssueResponse) => { onChange={(val: ISearchIssueResponse) => {
@ -182,7 +182,7 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
{selectedIssues.map((issue) => ( {selectedIssues.map((issue) => (
<div <div
key={issue.id} key={issue.id}
className="flex items-center gap-1 text-xs border border-custom-border-300 bg-custom-background-80 pl-2 py-1 rounded-md text-custom-text-100 whitespace-nowrap" className="flex items-center gap-1 text-xs border border-custom-border-200 bg-custom-background-80 pl-2 py-1 rounded-md text-custom-text-100 whitespace-nowrap"
> >
{issue.project__identifier}-{issue.sequence_id} {issue.project__identifier}-{issue.sequence_id}
<button <button
@ -200,7 +200,7 @@ export const ExistingIssuesListModal: React.FC<Props> = ({
))} ))}
</div> </div>
) : ( ) : (
<div className="w-min text-xs border border-custom-border-300 bg-custom-background-80 p-2 rounded-md whitespace-nowrap"> <div className="w-min text-xs border border-custom-border-200 bg-custom-background-80 p-2 rounded-md whitespace-nowrap">
No issues selected No issues selected
</div> </div>
)} )}

2
apps/app/components/core/modals/gpt-assistant-modal.tsx
View File

@ -143,7 +143,7 @@ export const GptAssistantModal: React.FC<Props> = ({
return ( return (
<div <div
className={`absolute ${inset} z-20 w-full space-y-4 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4 shadow ${ className={`absolute ${inset} z-20 w-full space-y-4 rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4 shadow ${
isOpen ? "block" : "hidden" isOpen ? "block" : "hidden"
}`} }`}
> >

4
apps/app/components/core/modals/image-upload-modal.tsx
View File

@ -118,7 +118,7 @@ export const ImageUploadModal: React.FC<Props> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:w-full sm:max-w-xl sm:p-6"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:w-full sm:max-w-xl sm:p-6">
<div className="space-y-5"> <div className="space-y-5">
<Dialog.Title <Dialog.Title
as="h3" as="h3"
@ -132,7 +132,7 @@ export const ImageUploadModal: React.FC<Props> = ({
{...getRootProps()} {...getRootProps()}
className={`relative grid h-80 w-full cursor-pointer place-items-center rounded-lg p-12 text-center focus:outline-none focus:ring-2 focus:ring-custom-primary focus:ring-offset-2 ${ className={`relative grid h-80 w-full cursor-pointer place-items-center rounded-lg p-12 text-center focus:outline-none focus:ring-2 focus:ring-custom-primary focus:ring-offset-2 ${
(image === null && isDragActive) || !value (image === null && isDragActive) || !value
? "border-2 border-dashed border-custom-border-300 hover:bg-custom-background-90" ? "border-2 border-dashed border-custom-border-200 hover:bg-custom-background-90"
: "" : ""
}`} }`}
> >

2
apps/app/components/core/sidebar/progress-chart.tsx
View File

@ -119,7 +119,7 @@ const ProgressChart: React.FC<Props> = ({ distribution, startDate, endDate, tota
gridXValues={chartData.map((item, index) => (index % 2 === 0 ? item.currentDate : ""))} gridXValues={chartData.map((item, index) => (index % 2 === 0 ? item.currentDate : ""))}
enableSlices="x" enableSlices="x"
sliceTooltip={(datum) => ( sliceTooltip={(datum) => (
<div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs"> <div className="rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
{datum.slice.points[0].data.yFormatted} {datum.slice.points[0].data.yFormatted}
<span className="text-custom-text-200"> issues pending on </span> <span className="text-custom-text-200"> issues pending on </span>
{datum.slice.points[0].data.xFormatted} {datum.slice.points[0].data.xFormatted}

8
apps/app/components/core/sidebar/sidebar-progress-stats.tsx
View File

@ -87,7 +87,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`w-full ${ `w-full ${
roundedTab ? "rounded-3xl border border-custom-border-300" : "rounded" roundedTab ? "rounded-3xl border border-custom-border-200" : "rounded"
} px-3 py-1 text-custom-text-100 ${ } px-3 py-1 text-custom-text-100 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
@ -98,7 +98,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`w-full ${ `w-full ${
roundedTab ? "rounded-3xl border border-custom-border-300" : "rounded" roundedTab ? "rounded-3xl border border-custom-border-200" : "rounded"
} px-3 py-1 text-custom-text-100 ${ } px-3 py-1 text-custom-text-100 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
@ -109,7 +109,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`w-full ${ `w-full ${
roundedTab ? "rounded-3xl border border-custom-border-300" : "rounded" roundedTab ? "rounded-3xl border border-custom-border-200" : "rounded"
} px-3 py-1 text-custom-text-100 ${ } px-3 py-1 text-custom-text-100 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
@ -159,7 +159,7 @@ export const SidebarProgressStats: React.FC<Props> = ({
key={`unassigned-${index}`} key={`unassigned-${index}`}
title={ title={
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-5 w-5 rounded-full border-2 border-custom-border-300 bg-custom-background-80"> <div className="h-5 w-5 rounded-full border-2 border-custom-border-200 bg-custom-background-80">
<img <img
src="/user.png" src="/user.png"
height="100%" height="100%"

22
apps/app/components/core/spreadsheet-view/single-issue.tsx
View File

@ -179,10 +179,10 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
return ( return (
<div <div
className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-300 w-full min-w-max" className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-200 w-full min-w-max"
style={{ gridTemplateColumns }} style={{ gridTemplateColumns }}
> >
<div className="flex gap-1.5 items-center px-4 sticky z-[1] left-0 text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-300 w-full"> <div className="flex gap-1.5 items-center px-4 sticky z-[1] left-0 text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-200 w-full">
<div className="flex gap-1.5 items-center" style={issue.parent ? { paddingLeft } : {}}> <div className="flex gap-1.5 items-center" style={issue.parent ? { paddingLeft } : {}}>
<div className="relative flex items-center cursor-pointer text-xs text-center hover:text-custom-text-100 w-14"> <div className="relative flex items-center cursor-pointer text-xs text-center hover:text-custom-text-100 w-14">
{properties.key && ( {properties.key && (
@ -198,7 +198,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
onInteraction={(nextOpenState) => setIsOpen(nextOpenState)} onInteraction={(nextOpenState) => setIsOpen(nextOpenState)}
content={ content={
<div <div
className={`flex flex-col gap-1.5 overflow-y-scroll whitespace-nowrap rounded-md border p-1 text-xs shadow-lg focus:outline-none max-h-44 min-w-full border-custom-border-300 bg-custom-background-90`} className={`flex flex-col gap-1.5 overflow-y-scroll whitespace-nowrap rounded-md border p-1 text-xs shadow-lg focus:outline-none max-h-44 min-w-full border-custom-border-200 bg-custom-background-90`}
> >
<button <button
type="button" type="button"
@ -270,7 +270,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</Link> </Link>
</div> </div>
{properties.state && ( {properties.state && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
<ViewStateSelect <ViewStateSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -284,7 +284,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.priority && ( {properties.priority && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
<ViewPrioritySelect <ViewPrioritySelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -297,7 +297,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.assignee && ( {properties.assignee && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
<ViewAssigneeSelect <ViewAssigneeSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -310,7 +310,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.labels && ( {properties.labels && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
<ViewLabelSelect <ViewLabelSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -324,7 +324,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
)} )}
{properties.due_date && ( {properties.due_date && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
<ViewDueDateSelect <ViewDueDateSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -336,7 +336,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.estimate && ( {properties.estimate && (
<div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
<ViewEstimateSelect <ViewEstimateSelect
issue={issue} issue={issue}
partialUpdateIssue={partialUpdateIssue} partialUpdateIssue={partialUpdateIssue}
@ -348,12 +348,12 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
</div> </div>
)} )}
{properties.created_on && ( {properties.created_on && (
<div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
{renderLongDetailDateFormat(issue.created_at)} {renderLongDetailDateFormat(issue.created_at)}
</div> </div>
)} )}
{properties.updated_on && ( {properties.updated_on && (
<div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-300"> <div className="flex items-center text-xs cursor-default text-custom-text-200 text-center p-2 group-hover:bg-custom-background-80 border-custom-border-200">
{renderLongDetailDateFormat(issue.updated_at)} {renderLongDetailDateFormat(issue.updated_at)}
</div> </div>
)} )}

9
apps/app/components/core/spreadsheet-view/spreadsheet-columns.tsx
View File

@ -56,7 +56,7 @@ export const SpreadsheetColumns: React.FC<Props> = ({ columnData, gridTemplateCo
className="!w-full" className="!w-full"
customButton={ customButton={
<div <div
className={`relative group flex items-center justify-start gap-1.5 cursor-pointer text-sm text-custom-text-200 text-current hover:text-custom-text-100 w-full py-3 px-2 ${ className={`relative group flex items-center justify-start gap-1.5 cursor-pointer text-sm text-custom-text-200 hover:text-custom-text-100 w-full py-3 px-2 ${
activeSortingProperty === col.propertyName ? "bg-custom-background-80" : "" activeSortingProperty === col.propertyName ? "bg-custom-background-80" : ""
}`} }`}
> >
@ -90,16 +90,9 @@ export const SpreadsheetColumns: React.FC<Props> = ({ columnData, gridTemplateCo
<ChevronDownIcon className="h-3 w-3" aria-hidden="true" /> <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
</div> </div>
} }
menuItemsWhiteBg
width="xl" width="xl"
> >
<CustomMenu.MenuItem <CustomMenu.MenuItem
className={`${
selectedMenuItem === `${col.ascendingOrder}_${col.propertyName}`
? "bg-custom-background-80"
: ""
}`}
key={col.propertyName}
onClick={() => { onClick={() => {
handleOrderBy(col.ascendingOrder, col.propertyName); handleOrderBy(col.ascendingOrder, col.propertyName);
}} }}

10
apps/app/components/core/spreadsheet-view/spreadsheet-view.tsx
View File

@ -62,7 +62,7 @@ export const SpreadsheetView: React.FC<Props> = ({
return ( return (
<div className="h-full rounded-lg text-custom-text-200 overflow-x-auto whitespace-nowrap bg-custom-background-100"> <div className="h-full rounded-lg text-custom-text-200 overflow-x-auto whitespace-nowrap bg-custom-background-100">
<div className="sticky z-[2] top-0 border-b border-custom-border-300 bg-custom-background-90 w-full min-w-max"> <div className="sticky z-[2] top-0 border-b border-custom-border-200 bg-custom-background-90 w-full min-w-max">
<SpreadsheetColumns columnData={columnData} gridTemplateColumns={gridTemplateColumns} /> <SpreadsheetColumns columnData={columnData} gridTemplateColumns={gridTemplateColumns} />
</div> </div>
{spreadsheetIssues ? ( {spreadsheetIssues ? (
@ -84,12 +84,12 @@ export const SpreadsheetView: React.FC<Props> = ({
/> />
))} ))}
<div <div
className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-300 w-full min-w-max" className="relative group grid auto-rows-[minmax(44px,1fr)] hover:rounded-sm hover:bg-custom-background-80 border-b border-custom-border-200 w-full min-w-max"
style={{ gridTemplateColumns }} style={{ gridTemplateColumns }}
> >
{type === "issue" ? ( {type === "issue" ? (
<button <button
className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-300 w-full" className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-200 w-full"
onClick={() => { onClick={() => {
const e = new KeyboardEvent("keydown", { key: "c" }); const e = new KeyboardEvent("keydown", { key: "c" });
document.dispatchEvent(e); document.dispatchEvent(e);
@ -104,7 +104,7 @@ export const SpreadsheetView: React.FC<Props> = ({
className="sticky left-0 z-[1]" className="sticky left-0 z-[1]"
customButton={ customButton={
<button <button
className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-300 w-full" className="flex gap-1.5 items-center pl-7 py-2.5 text-sm sticky left-0 z-[1] text-custom-text-200 bg-custom-background-100 group-hover:text-custom-text-100 group-hover:bg-custom-background-80 border-custom-border-200 w-full"
type="button" type="button"
> >
<PlusIcon className="h-4 w-4" /> <PlusIcon className="h-4 w-4" />
@ -112,7 +112,7 @@ export const SpreadsheetView: React.FC<Props> = ({
</button> </button>
} }
position="left" position="left"
menuItemsClassName="left-5 !w-36" optionsClassName="left-5 !w-36"
noBorder noBorder
> >
<CustomMenu.MenuItem <CustomMenu.MenuItem

2
apps/app/components/core/theme/color-picker-input.tsx
View File

@ -81,7 +81,7 @@ export const ColorPickerInput: React.FC<Props> = ({ name, watch, setValue, error
> >
{watch(name) && watch(name) !== "" ? ( {watch(name) && watch(name) !== "" ? (
<span <span
className="h-4 w-4 rounded border border-custom-border-300" className="h-4 w-4 rounded border border-custom-border-200"
style={{ style={{
backgroundColor: `${watch(name)}`, backgroundColor: `${watch(name)}`,
}} }}

10
apps/app/components/core/theme/custom-theme-selector.tsx
View File

@ -21,11 +21,11 @@ type Props = {
}; };
const defaultValues: ICustomTheme = { const defaultValues: ICustomTheme = {
background: "#fff7f7", background: "#292d3e",
text: "#ffc9c9", text: "#ffffff",
primary: "#fe5050", primary: "#7d57c1",
sidebarBackground: "#ffffff", sidebarBackground: "#292d3e",
sidebarText: "#000000", sidebarText: "#ffffff",
darkPalette: false, darkPalette: false,
palette: "", palette: "",
}; };

5
apps/app/components/core/theme/theme-switch.tsx
View File

@ -71,9 +71,8 @@ export const ThemeSwitch: React.FC<Props> = ({
} }
onChange={({ value, type }: { value: string; type: string }) => { onChange={({ value, type }: { value: string; type: string }) => {
if (value === "custom") { if (value === "custom") {
if (user?.theme.palette) { if (user?.theme.palette) setPreLoadedData(user.theme);
setPreLoadedData(user.theme);
}
if (!customThemeSelectorOptions) setCustomThemeSelectorOptions(true); if (!customThemeSelectorOptions) setCustomThemeSelectorOptions(true);
} else { } else {
if (customThemeSelectorOptions) setCustomThemeSelectorOptions(false); if (customThemeSelectorOptions) setCustomThemeSelectorOptions(false);

18
apps/app/components/cycles/active-cycle-details.tsx
View File

@ -209,8 +209,8 @@ export const ActiveCycleDetails: React.FC = () => {
})); }));
return ( return (
<div className="grid-row-2 grid rounded-[10px] shadow divide-y bg-custom-background-100 border border-custom-border-300"> <div className="grid-row-2 grid rounded-[10px] shadow divide-y bg-custom-background-100 border border-custom-border-200">
<div className="grid grid-cols-1 divide-y border-custom-border-300 lg:divide-y-0 lg:divide-x lg:grid-cols-3"> <div className="grid grid-cols-1 divide-y border-custom-border-200 lg:divide-y-0 lg:divide-x lg:grid-cols-3">
<div className="flex flex-col text-xs"> <div className="flex flex-col text-xs">
<div className="h-full w-full"> <div className="h-full w-full">
<div className="flex h-60 flex-col gap-5 justify-between rounded-b-[10px] p-4"> <div className="flex h-60 flex-col gap-5 justify-between rounded-b-[10px] p-4">
@ -362,8 +362,8 @@ export const ActiveCycleDetails: React.FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className="grid col-span-2 grid-cols-1 divide-y border-custom-border-300 md:divide-y-0 md:divide-x md:grid-cols-2"> <div className="grid col-span-2 grid-cols-1 divide-y border-custom-border-200 md:divide-y-0 md:divide-x md:grid-cols-2">
<div className="flex h-60 flex-col border-custom-border-300"> <div className="flex h-60 flex-col border-custom-border-200">
<div className="flex h-full w-full flex-col text-custom-text-200 p-4"> <div className="flex h-full w-full flex-col text-custom-text-200 p-4">
<div className="flex w-full items-center gap-2 py-1"> <div className="flex w-full items-center gap-2 py-1">
<span>Progress</span> <span>Progress</span>
@ -391,12 +391,12 @@ export const ActiveCycleDetails: React.FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className="border-custom-border-300 h-60 overflow-y-scroll"> <div className="border-custom-border-200 h-60 overflow-y-scroll">
<ActiveCycleProgressStats cycle={cycle} /> <ActiveCycleProgressStats cycle={cycle} />
</div> </div>
</div> </div>
</div> </div>
<div className="grid grid-cols-1 divide-y border-custom-border-300 lg:divide-y-0 lg:divide-x lg:grid-cols-2"> <div className="grid grid-cols-1 divide-y border-custom-border-200 lg:divide-y-0 lg:divide-x lg:grid-cols-2">
<div className="flex flex-col justify-between p-4"> <div className="flex flex-col justify-between p-4">
<div> <div>
<div className="text-custom-primary">High Priority Issues</div> <div className="text-custom-primary">High Priority Issues</div>
@ -406,7 +406,7 @@ export const ActiveCycleDetails: React.FC = () => {
issues.map((issue) => ( issues.map((issue) => (
<div <div
key={issue.id} key={issue.id}
className="flex flex-wrap rounded-md items-center justify-between gap-2 border border-custom-border-300 bg-custom-background-90 px-3 py-1.5" className="flex flex-wrap rounded-md items-center justify-between gap-2 border border-custom-border-200 bg-custom-background-90 px-3 py-1.5"
> >
<div className="flex flex-col gap-1"> <div className="flex flex-col gap-1">
<div> <div>
@ -444,7 +444,7 @@ export const ActiveCycleDetails: React.FC = () => {
{issue.label_details.map((label) => ( {issue.label_details.map((label) => (
<span <span
key={label.id} key={label.id}
className="group flex items-center gap-1 rounded-2xl border border-custom-border-300 px-2 py-0.5 text-xs text-custom-text-200" className="group flex items-center gap-1 rounded-2xl border border-custom-border-200 px-2 py-0.5 text-xs text-custom-text-200"
> >
<span <span
className="h-1.5 w-1.5 rounded-full" className="h-1.5 w-1.5 rounded-full"
@ -517,7 +517,7 @@ export const ActiveCycleDetails: React.FC = () => {
</div> </div>
)} )}
</div> </div>
<div className="flex flex-col justify-between border-custom-border-300 p-4"> <div className="flex flex-col justify-between border-custom-border-200 p-4">
<div className="flex items-start justify-between gap-4 py-1.5 text-xs"> <div className="flex items-start justify-between gap-4 py-1.5 text-xs">
<div className="flex items-center gap-3 text-custom-text-100"> <div className="flex items-center gap-3 text-custom-text-100">
<div className="flex items-center justify-center gap-1"> <div className="flex items-center justify-center gap-1">

6
apps/app/components/cycles/active-cycle-stats.tsx
View File

@ -52,7 +52,7 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
> >
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-300 ${ `px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-200 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
} }
@ -61,7 +61,7 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
</Tab> </Tab>
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
`px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-300 ${ `px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-200 ${
selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80"
}` }`
} }
@ -103,7 +103,7 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
key={`unassigned-${index}`} key={`unassigned-${index}`}
title={ title={
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-5 w-5 rounded-full border-2 border-custom-border-300 bg-custom-background-80"> <div className="h-5 w-5 rounded-full border-2 border-custom-border-200 bg-custom-background-80">
<img <img
src="/user.png" src="/user.png"
height="100%" height="100%"

7
apps/app/components/cycles/cycles-list-gantt-chart.tsx
View File

@ -22,7 +22,7 @@ export const CyclesListGanttChartView: FC<Props> = ({ cycles }) => {
<div className="relative flex w-full h-full items-center p-1 overflow-hidden gap-1"> <div className="relative flex w-full h-full items-center p-1 overflow-hidden gap-1">
<div <div
className="rounded-sm flex-shrink-0 w-[10px] h-[10px] flex justify-center items-center" className="rounded-sm flex-shrink-0 w-[10px] h-[10px] flex justify-center items-center"
style={{ backgroundColor: "#858e96" }} style={{ backgroundColor: "rgb(var(--color-primary-100))" }}
/> />
<div className="text-custom-text-100 text-sm">{data?.name}</div> <div className="text-custom-text-100 text-sm">{data?.name}</div>
</div> </div>
@ -32,7 +32,10 @@ export const CyclesListGanttChartView: FC<Props> = ({ cycles }) => {
const GanttBlockView = ({ data }: { data: ICycle }) => ( const GanttBlockView = ({ data }: { data: ICycle }) => (
<Link href={`/${workspaceSlug}/projects/${projectId}/cycles/${data?.id}`}> <Link href={`/${workspaceSlug}/projects/${projectId}/cycles/${data?.id}`}>
<a className="relative flex items-center w-full h-full overflow-hidden shadow-sm"> <a className="relative flex items-center w-full h-full overflow-hidden shadow-sm">
<div className="flex-shrink-0 w-[4px] h-full" style={{ backgroundColor: "#858e96" }} /> <div
className="flex-shrink-0 w-[4px] h-full"
style={{ backgroundColor: "rgb(var(--color-primary-100))" }}
/>
<Tooltip tooltipContent={data?.name} className={`z-[999999]`}> <Tooltip tooltipContent={data?.name} className={`z-[999999]`}>
<div className="text-custom-text-100 text-[15px] whitespace-nowrap py-[4px] px-2.5 overflow-hidden w-full"> <div className="text-custom-text-100 text-[15px] whitespace-nowrap py-[4px] px-2.5 overflow-hidden w-full">
{data?.name} {data?.name}

4
apps/app/components/cycles/cycles-view.tsx
View File

@ -173,10 +173,10 @@ export const CyclesView: React.FC<Props> = ({ cycles, viewType }) => {
{cycles ? ( {cycles ? (
cycles.length > 0 ? ( cycles.length > 0 ? (
viewType === "list" ? ( viewType === "list" ? (
<div className="divide-y divide-custom-border-300"> <div className="divide-y divide-custom-border-200">
{cycles.map((cycle) => ( {cycles.map((cycle) => (
<div className="hover:bg-custom-background-80"> <div className="hover:bg-custom-background-80">
<div className="flex flex-col border-custom-border-300"> <div className="flex flex-col border-custom-border-200">
<SingleCycleList <SingleCycleList
key={cycle.id} key={cycle.id}
cycle={cycle} cycle={cycle}

2
apps/app/components/cycles/delete-cycle-modal.tsx
View File

@ -124,7 +124,7 @@ export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-[40rem]"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-[40rem]">
<div className="px-4 pt-5 pb-4 sm:p-6 sm:pb-4"> <div className="px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
<div className="sm:flex sm:items-start"> <div className="sm:flex sm:items-start">
<div className="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-red-500/20 sm:mx-0 sm:h-10 sm:w-10"> <div className="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-red-500/20 sm:mx-0 sm:h-10 sm:w-10">

2
apps/app/components/cycles/form.tsx
View File

@ -107,7 +107,7 @@ export const CycleForm: React.FC<Props> = ({ handleFormSubmit, handleClose, stat
</div> </div>
</div> </div>
</div> </div>
<div className="-mx-5 mt-5 flex justify-end gap-2 border-t border-custom-border-300 px-5 pt-5"> <div className="-mx-5 mt-5 flex justify-end gap-2 border-t border-custom-border-200 px-5 pt-5">
<SecondaryButton onClick={handleClose}>Cancel</SecondaryButton> <SecondaryButton onClick={handleClose}>Cancel</SecondaryButton>
<PrimaryButton type="submit" loading={isSubmitting}> <PrimaryButton type="submit" loading={isSubmitting}>
{status {status

4
apps/app/components/cycles/gantt-chart.tsx
View File

@ -26,7 +26,7 @@ export const CycleIssuesGanttChartView: FC<Props> = ({}) => {
<div className="relative flex w-full h-full items-center p-1 overflow-hidden gap-1"> <div className="relative flex w-full h-full items-center p-1 overflow-hidden gap-1">
<div <div
className="rounded-sm flex-shrink-0 w-[10px] h-[10px] flex justify-center items-center" className="rounded-sm flex-shrink-0 w-[10px] h-[10px] flex justify-center items-center"
style={{ backgroundColor: data?.state_detail?.color || "#858e96" }} style={{ backgroundColor: data?.state_detail?.color || "rgb(var(--color-primary-100))" }}
/> />
<div className="text-custom-text-100 text-sm">{data?.name}</div> <div className="text-custom-text-100 text-sm">{data?.name}</div>
</div> </div>
@ -38,7 +38,7 @@ export const CycleIssuesGanttChartView: FC<Props> = ({}) => {
<a className="relative flex items-center w-full h-full overflow-hidden shadow-sm"> <a className="relative flex items-center w-full h-full overflow-hidden shadow-sm">
<div <div
className="flex-shrink-0 w-[4px] h-full" className="flex-shrink-0 w-[4px] h-full"
style={{ backgroundColor: data?.state_detail?.color || "#858e96" }} style={{ backgroundColor: data?.state_detail?.color || "rgb(var(--color-primary-100))" }}
/> />
<Tooltip tooltipContent={data?.name} className={`z-[999999]`}> <Tooltip tooltipContent={data?.name} className={`z-[999999]`}>
<div className="text-custom-text-100 text-[15px] whitespace-nowrap py-[4px] px-2.5 overflow-hidden w-full"> <div className="text-custom-text-100 text-[15px] whitespace-nowrap py-[4px] px-2.5 overflow-hidden w-full">

2
apps/app/components/cycles/modal.tsx
View File

@ -247,7 +247,7 @@ export const CreateUpdateCycleModal: React.FC<CycleModalProps> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-200 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<CycleForm <CycleForm
handleFormSubmit={handleFormSubmit} handleFormSubmit={handleFormSubmit}
handleClose={handleClose} handleClose={handleClose}

2
apps/app/components/cycles/select.tsx
View File

@ -66,7 +66,7 @@ export const CycleSelect: React.FC<IssueCycleSelectProps> = ({
{({ open }) => ( {({ open }) => (
<> <>
<Listbox.Button <Listbox.Button
className={`flex cursor-pointer items-center gap-1 rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm duration-300 hover:bg-custom-background-90 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500`} className={`flex cursor-pointer items-center gap-1 rounded-md border border-custom-border-200 px-2 py-1 text-xs shadow-sm duration-300 hover:bg-custom-background-90 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500`}
> >
<CyclesIcon className="h-3 w-3 text-custom-text-200" /> <CyclesIcon className="h-3 w-3 text-custom-text-200" />
<div className="flex items-center gap-2 truncate"> <div className="flex items-center gap-2 truncate">

12
apps/app/components/cycles/sidebar.tsx
View File

@ -292,14 +292,14 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
<div <div
className={`fixed top-[66px] ${ className={`fixed top-[66px] ${
isOpen ? "right-0" : "-right-[24rem]" isOpen ? "right-0" : "-right-[24rem]"
} h-full w-[24rem] overflow-y-auto border-l border-custom-border-300 bg-custom-sidebar-background-100 pt-5 pb-10 duration-300`} } h-full w-[24rem] overflow-y-auto border-l border-custom-border-200 bg-custom-sidebar-background-100 pt-5 pb-10 duration-300`}
> >
{cycle ? ( {cycle ? (
<> <>
<div className="flex flex-col items-start justify-center"> <div className="flex flex-col items-start justify-center">
<div className="flex gap-2.5 px-5 text-sm"> <div className="flex gap-2.5 px-5 text-sm">
<div className="flex items-center"> <div className="flex items-center">
<span className="flex items-center rounded border-[0.5px] border-custom-border-300 bg-custom-background-90 px-2 py-1 text-center text-xs capitalize"> <span className="flex items-center rounded border-[0.5px] border-custom-border-200 bg-custom-background-90 px-2 py-1 text-center text-xs capitalize">
{capitalizeFirstLetter(cycleStatus)} {capitalizeFirstLetter(cycleStatus)}
</span> </span>
</div> </div>
@ -309,7 +309,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
<> <>
<Popover.Button <Popover.Button
disabled={isCompleted ?? false} disabled={isCompleted ?? false}
className={`group flex h-full items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-300 bg-custom-background-90 px-2 py-1 text-xs ${ className={`group flex h-full items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-200 bg-custom-background-90 px-2 py-1 text-xs ${
cycle.start_date ? "" : "text-custom-text-200" cycle.start_date ? "" : "text-custom-text-200"
}`} }`}
> >
@ -359,7 +359,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
<> <>
<Popover.Button <Popover.Button
disabled={isCompleted ?? false} disabled={isCompleted ?? false}
className={`group flex items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-300 bg-custom-background-90 px-2 py-1 text-xs ${ className={`group flex items-center gap-2 whitespace-nowrap rounded border-[0.5px] border-custom-border-200 bg-custom-background-90 px-2 py-1 text-xs ${
cycle.end_date ? "" : "text-custom-text-200" cycle.end_date ? "" : "text-custom-text-200"
}`} }`}
> >
@ -477,7 +477,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
</div> </div>
</div> </div>
</div> </div>
<div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-300 p-6"> <div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-200 p-6">
<Disclosure defaultOpen> <Disclosure defaultOpen>
{({ open }) => ( {({ open }) => (
<div <div
@ -561,7 +561,7 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
)} )}
</Disclosure> </Disclosure>
</div> </div>
<div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-300 p-6"> <div className="flex w-full flex-col items-center justify-start gap-2 border-t border-custom-border-200 p-6">
<Disclosure defaultOpen> <Disclosure defaultOpen>
{({ open }) => ( {({ open }) => (
<div <div

4
apps/app/components/cycles/single-cycle-card.tsx
View File

@ -128,7 +128,7 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
return ( return (
<div> <div>
<div className="flex flex-col rounded-[10px] bg-custom-background-100 border border-custom-border-300 text-xs shadow"> <div className="flex flex-col rounded-[10px] bg-custom-background-100 border border-custom-border-200 text-xs shadow">
<Link href={`/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`}> <Link href={`/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`}>
<a className="w-full"> <a className="w-full">
<div className="flex h-full flex-col gap-4 rounded-b-[10px] p-4"> <div className="flex h-full flex-col gap-4 rounded-b-[10px] p-4">
@ -321,7 +321,7 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
<Disclosure> <Disclosure>
{({ open }) => ( {({ open }) => (
<div <div
className={`flex h-full w-full flex-col rounded-b-[10px] border-t border-custom-border-300 bg-custom-background-80 text-custom-text-200 ${ className={`flex h-full w-full flex-col rounded-b-[10px] border-t border-custom-border-200 bg-custom-background-80 text-custom-text-200 ${
open ? "" : "flex-row" open ? "" : "flex-row"
}`} }`}
> >

2
apps/app/components/cycles/transfer-issues-modal.tsx
View File

@ -119,7 +119,7 @@ export const TransferIssuesModal: React.FC<Props> = ({ isOpen, handleClose }) =>
<XMarkIcon className="h-4 w-4" /> <XMarkIcon className="h-4 w-4" />
</button> </button>
</div> </div>
<div className="flex items-center gap-2 border-b border-custom-border-300 px-5 pb-3"> <div className="flex items-center gap-2 border-b border-custom-border-200 px-5 pb-3">
<MagnifyingGlassIcon className="h-4 w-4 text-custom-text-200" /> <MagnifyingGlassIcon className="h-4 w-4 text-custom-text-200" />
<input <input
className="bg-custom-background-90 outline-none" className="bg-custom-background-90 outline-none"

8
apps/app/components/emoji-icon-picker/index.tsx
View File

@ -63,8 +63,8 @@ const EmojiIconPicker: React.FC<Props> = ({ label, value, onChange, onIconColorC
leaveFrom="transform opacity-100 scale-100" leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95" leaveTo="transform opacity-0 scale-95"
> >
<Popover.Panel className="absolute z-10 mt-2 w-[250px] rounded-[4px] border border-custom-border-300 bg-custom-background-80 shadow-lg"> <Popover.Panel className="absolute z-10 mt-2 w-[250px] rounded-[4px] border border-custom-border-200 bg-custom-background-80 shadow-lg">
<div className="h-[230px] w-[250px] overflow-auto rounded-[4px] border border-custom-border-300 bg-custom-background-80 p-2 shadow-xl"> <div className="h-[230px] w-[250px] overflow-auto rounded-[4px] border border-custom-border-200 bg-custom-background-80 p-2 shadow-xl">
<Tab.Group as="div" className="flex h-full w-full flex-col"> <Tab.Group as="div" className="flex h-full w-full flex-col">
<Tab.List className="flex-0 -mx-2 flex justify-around gap-1 p-1"> <Tab.List className="flex-0 -mx-2 flex justify-around gap-1 p-1">
{tabOptions.map((tab) => ( {tabOptions.map((tab) => (
@ -107,7 +107,7 @@ const EmojiIconPicker: React.FC<Props> = ({ label, value, onChange, onIconColorC
</div> </div>
</div> </div>
)} )}
<hr className="mb-2 h-[1px] w-full border-custom-border-300" /> <hr className="mb-2 h-[1px] w-full border-custom-border-200" />
<div> <div>
<div className="grid grid-cols-8 gap-x-2 gap-y-3"> <div className="grid grid-cols-8 gap-x-2 gap-y-3">
{emojis.map((emoji) => ( {emojis.map((emoji) => (
@ -173,7 +173,7 @@ const EmojiIconPicker: React.FC<Props> = ({ label, value, onChange, onIconColorC
/> />
</div> </div>
</div> </div>
<hr className="mb-1 h-[1px] w-full border-custom-border-300" /> <hr className="mb-1 h-[1px] w-full border-custom-border-200" />
<div className="mt-1 ml-1 grid grid-cols-8 gap-x-2 gap-y-3"> <div className="mt-1 ml-1 grid grid-cols-8 gap-x-2 gap-y-3">
{icons.material_rounded.map((icon, index) => ( {icons.material_rounded.map((icon, index) => (
<button <button

2
apps/app/components/estimates/create-update-estimate-modal.tsx
View File

@ -254,7 +254,7 @@ export const CreateUpdateEstimateModal: React.FC<Props> = ({ handleClose, data,
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-200 bg-custom-background-100 px-5 py-8 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
<div className="space-y-3"> <div className="space-y-3">
<div className="text-lg font-medium leading-6"> <div className="text-lg font-medium leading-6">

2
apps/app/components/estimates/delete-estimate-modal.tsx
View File

@ -60,7 +60,7 @@ export const DeleteEstimateModal: React.FC<Props> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

4
apps/app/components/gantt-chart/blocks/index.tsx
View File

@ -44,7 +44,7 @@ export const GanttChartBlocks: FC<{
</div> </div>
<div <div
className="rounded shadow-sm bg-custom-background-100 overflow-hidden relative flex items-center h-[34px] border border-custom-border-300" className="rounded shadow-sm bg-custom-background-100 overflow-hidden relative flex items-center h-[34px] border border-custom-border-200"
style={{ style={{
width: `${block?.position?.width}px`, width: `${block?.position?.width}px`,
}} }}
@ -68,7 +68,7 @@ export const GanttChartBlocks: FC<{
</div> </div>
{/* sidebar */} {/* sidebar */}
{/* <div className="fixed top-0 bottom-0 w-[300px] flex-shrink-0 divide-y divide-custom-border-300 border-r border-custom-border-300 overflow-y-auto"> {/* <div className="fixed top-0 bottom-0 w-[300px] flex-shrink-0 divide-y divide-custom-border-200 border-r border-custom-border-200 overflow-y-auto">
{blocks && {blocks &&
blocks.length > 0 && blocks.length > 0 &&
blocks.map((block: any, _idx: number) => ( blocks.map((block: any, _idx: number) => (

8
apps/app/components/gantt-chart/chart/bi-week.tsx
View File

@ -7,18 +7,18 @@ export const BiWeekChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const BiWeekChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/day.tsx
View File

@ -7,18 +7,18 @@ export const DayChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const DayChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/hours.tsx
View File

@ -7,18 +7,18 @@ export const HourChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const HourChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

14
apps/app/components/gantt-chart/chart/index.tsx
View File

@ -219,11 +219,11 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
? `fixed top-0 bottom-0 left-0 right-0 z-[999999] bg-custom-background-100` ? `fixed top-0 bottom-0 left-0 right-0 z-[999999] bg-custom-background-100`
: `relative` : `relative`
} ${ } ${
border ? `border border-custom-border-300` : `` border ? `border border-custom-border-200` : ``
} flex h-full flex-col rounded-sm select-none bg-custom-background-100 shadow`} } flex h-full flex-col rounded-sm select-none bg-custom-background-100 shadow`}
> >
{/* chart title */} {/* chart title */}
{/* <div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2 border-b border-custom-border-300"> {/* <div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2 border-b border-custom-border-200">
{title && ( {title && (
<div className="text-lg font-medium flex gap-2 items-center"> <div className="text-lg font-medium flex gap-2 items-center">
<div>{title}</div> <div>{title}</div>
@ -244,7 +244,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
{/* chart header */} {/* chart header */}
<div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2"> <div className="flex w-full flex-shrink-0 flex-wrap items-center gap-5 gap-y-3 whitespace-nowrap p-2">
{/* <div {/* <div
className="transition-all border border-custom-border-300 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80" className="transition-all border border-custom-border-200 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80"
onClick={() => setBlocksSidebarView(() => !blocksSidebarView)} onClick={() => setBlocksSidebarView(() => !blocksSidebarView)}
> >
{blocksSidebarView ? ( {blocksSidebarView ? (
@ -279,7 +279,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
allViews.map((_chatView: any, _idx: any) => ( allViews.map((_chatView: any, _idx: any) => (
<div <div
key={_chatView?.key} key={_chatView?.key}
className={`cursor-pointer rounded-sm border border-custom-border-300 p-1 px-2 text-xs ${ className={`cursor-pointer rounded-sm border border-custom-border-200 p-1 px-2 text-xs ${
currentView === _chatView?.key currentView === _chatView?.key
? `bg-custom-background-80` ? `bg-custom-background-80`
: `hover:bg-custom-background-90` : `hover:bg-custom-background-90`
@ -293,7 +293,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
<div className="flex items-center gap-1"> <div className="flex items-center gap-1">
<div <div
className={`cursor-pointer rounded-sm border border-custom-border-300 p-1 px-2 text-xs hover:bg-custom-background-80`} className={`cursor-pointer rounded-sm border border-custom-border-200 p-1 px-2 text-xs hover:bg-custom-background-80`}
onClick={handleToday} onClick={handleToday}
> >
Today Today
@ -301,7 +301,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
</div> </div>
<div <div
className="transition-all border border-custom-border-300 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80" className="transition-all border border-custom-border-200 w-[30px] h-[30px] flex justify-center items-center cursor-pointer rounded-sm hover:bg-custom-background-80"
onClick={() => setFullScreenMode(() => !fullScreenMode)} onClick={() => setFullScreenMode(() => !fullScreenMode)}
> >
{fullScreenMode ? ( {fullScreenMode ? (
@ -313,7 +313,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = ({
</div> </div>
{/* content */} {/* content */}
<div className="relative flex h-full w-full flex-1 overflow-hidden border-t border-custom-border-300"> <div className="relative flex h-full w-full flex-1 overflow-hidden border-t border-custom-border-200">
<div <div
className="relative flex h-full w-full flex-1 flex-col overflow-hidden overflow-x-auto" className="relative flex h-full w-full flex-1 flex-col overflow-hidden overflow-x-auto"
id="scroll-container" id="scroll-container"

8
apps/app/components/gantt-chart/chart/month.tsx
View File

@ -7,18 +7,18 @@ export const MonthChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const MonthChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/quarter.tsx
View File

@ -7,18 +7,18 @@ export const QuarterChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const QuarterChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/week.tsx
View File

@ -7,18 +7,18 @@ export const WeekChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const WeekChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

8
apps/app/components/gantt-chart/chart/year.tsx
View File

@ -7,18 +7,18 @@ export const YearChartView: FC<any> = () => {
return ( return (
<> <>
<div className="absolute flex h-full flex-grow divide-x divide-custom-border-300"> <div className="absolute flex h-full flex-grow divide-x divide-custom-border-200">
{renderView && {renderView &&
renderView.length > 0 && renderView.length > 0 &&
renderView.map((_itemRoot: any, _idxRoot: any) => ( renderView.map((_itemRoot: any, _idxRoot: any) => (
<div key={`title-${_idxRoot}`} className="relative flex flex-col"> <div key={`title-${_idxRoot}`} className="relative flex flex-col">
<div className="relative border-b border-custom-border-300"> <div className="relative border-b border-custom-border-200">
<div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize"> <div className="sticky left-0 inline-flex whitespace-nowrap px-2 py-1 text-sm font-medium capitalize">
{_itemRoot?.title} {_itemRoot?.title}
</div> </div>
</div> </div>
<div className="flex h-full w-full divide-x divide-custom-border-300"> <div className="flex h-full w-full divide-x divide-custom-border-200">
{_itemRoot.children && {_itemRoot.children &&
_itemRoot.children.length > 0 && _itemRoot.children.length > 0 &&
_itemRoot.children.map((_item: any, _idx: any) => ( _itemRoot.children.map((_item: any, _idx: any) => (
@ -29,7 +29,7 @@ export const YearChartView: FC<any> = () => {
> >
<div <div
className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${ className={`flex-shrink-0 border-b py-1 text-center text-sm capitalize font-medium ${
_item?.today ? `text-red-500 border-red-500` : `border-custom-border-300` _item?.today ? `text-red-500 border-red-500` : `border-custom-border-200`
}`} }`}
> >
<div>{_item.title}</div> <div>{_item.title}</div>

2
apps/app/components/inbox/accept-issue-modal.tsx
View File

@ -56,7 +56,7 @@ export const AcceptIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, o
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-green-500/20 p-4"> <span className="place-items-center rounded-full bg-green-500/20 p-4">

2
apps/app/components/inbox/decline-issue-modal.tsx
View File

@ -56,7 +56,7 @@ export const DeclineIssueModal: React.FC<Props> = ({ isOpen, handleClose, data,
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

2
apps/app/components/inbox/delete-issue-modal.tsx
View File

@ -111,7 +111,7 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data })
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

2
apps/app/components/inbox/filters-dropdown.tsx
View File

@ -72,7 +72,7 @@ export const FiltersDropdown: React.FC = () => {
]} ]}
/> />
{filtersLength > 0 && ( {filtersLength > 0 && (
<div className="absolute -top-2 -right-2 h-4 w-4 text-[0.65rem] grid place-items-center rounded-full text-custom-text-100 bg-custom-background-80 border border-custom-border-300 z-10"> <div className="absolute -top-2 -right-2 h-4 w-4 text-[0.65rem] grid place-items-center rounded-full text-custom-text-100 bg-custom-background-80 border border-custom-border-200 z-10">
<span>{filtersLength}</span> <span>{filtersLength}</span>
</div> </div>
)} )}

4
apps/app/components/inbox/filters-list.tsx
View File

@ -22,7 +22,7 @@ export const InboxFiltersList = () => {
return ( return (
<div <div
key={key} key={key}
className="flex items-center gap-x-2 rounded-full border border-custom-border-300 bg-custom-background-80 px-2 py-1" className="flex items-center gap-x-2 rounded-full border border-custom-border-200 bg-custom-background-80 px-2 py-1"
> >
<span className="capitalize text-custom-text-200"> <span className="capitalize text-custom-text-200">
{replaceUnderscoreIfSnakeCase(key)}: {replaceUnderscoreIfSnakeCase(key)}:
@ -116,7 +116,7 @@ export const InboxFiltersList = () => {
<button <button
type="button" type="button"
onClick={clearAllFilters} onClick={clearAllFilters}
className="flex items-center gap-x-1 rounded-full border border-custom-border-300 bg-custom-background-80 px-3 py-1.5 text-custom-text-200 hover:text-custom-text-100" className="flex items-center gap-x-1 rounded-full border border-custom-border-200 bg-custom-background-80 px-3 py-1.5 text-custom-text-200 hover:text-custom-text-100"
> >
<span>Clear all</span> <span>Clear all</span>
<XMarkIcon className="h-3 w-3" /> <XMarkIcon className="h-3 w-3" />

8
apps/app/components/inbox/inbox-action-headers.tsx
View File

@ -162,7 +162,7 @@ export const InboxActionHeader = () => {
handleClose={() => setDeleteIssueModal(false)} handleClose={() => setDeleteIssueModal(false)}
data={inboxIssues?.find((i) => i.bridge_id === inboxIssueId)} data={inboxIssues?.find((i) => i.bridge_id === inboxIssueId)}
/> />
<div className="grid grid-cols-4 border-b border-custom-border-300 divide-x divide-custom-border-300"> <div className="grid grid-cols-4 border-b border-custom-border-200 divide-x divide-custom-border-200">
<div className="col-span-1 flex justify-between p-4"> <div className="col-span-1 flex justify-between p-4">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<InboxIcon className="h-4 w-4 text-custom-text-200" /> <InboxIcon className="h-4 w-4 text-custom-text-200" />
@ -175,7 +175,7 @@ export const InboxActionHeader = () => {
<div className="flex items-center gap-x-2"> <div className="flex items-center gap-x-2">
<button <button
type="button" type="button"
className="rounded border border-custom-border-300 bg-custom-background-90 p-1.5 hover:bg-custom-background-80" className="rounded border border-custom-border-200 bg-custom-background-90 p-1.5 hover:bg-custom-background-80"
onClick={() => { onClick={() => {
const e = new KeyboardEvent("keydown", { key: "ArrowUp" }); const e = new KeyboardEvent("keydown", { key: "ArrowUp" });
document.dispatchEvent(e); document.dispatchEvent(e);
@ -185,7 +185,7 @@ export const InboxActionHeader = () => {
</button> </button>
<button <button
type="button" type="button"
className="rounded border border-custom-border-300 bg-custom-background-90 p-1.5 hover:bg-custom-background-80" className="rounded border border-custom-border-200 bg-custom-background-90 p-1.5 hover:bg-custom-background-80"
onClick={() => { onClick={() => {
const e = new KeyboardEvent("keydown", { key: "ArrowDown" }); const e = new KeyboardEvent("keydown", { key: "ArrowDown" });
document.dispatchEvent(e); document.dispatchEvent(e);
@ -207,7 +207,7 @@ export const InboxActionHeader = () => {
<span>Snooze</span> <span>Snooze</span>
</SecondaryButton> </SecondaryButton>
</Popover.Button> </Popover.Button>
<Popover.Panel className="w-80 p-2 absolute right-0 z-10 mt-2 rounded-md border border-custom-border-300 bg-custom-background-80 shadow-lg"> <Popover.Panel className="w-80 p-2 absolute right-0 z-10 mt-2 rounded-md border border-custom-border-200 bg-custom-background-80 shadow-lg">
{({ close }) => ( {({ close }) => (
<div className="w-full h-full flex flex-col gap-y-1"> <div className="w-full h-full flex flex-col gap-y-1">
<DatePicker <DatePicker

6
apps/app/components/inbox/inbox-issue-card.tsx
View File

@ -40,7 +40,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
<a> <a>
<div <div
id={issue.id} id={issue.id}
className={`relative min-h-[5rem] cursor-pointer select-none space-y-3 py-2 px-4 border-b border-custom-border-300 hover:bg-custom-primary/5 ${ className={`relative min-h-[5rem] cursor-pointer select-none space-y-3 py-2 px-4 border-b border-custom-border-200 hover:bg-custom-primary/5 ${
active ? "bg-custom-primary/5" : " " active ? "bg-custom-primary/5" : " "
} ${issue.issue_inbox[0].status !== -2 ? "opacity-60" : ""}`} } ${issue.issue_inbox[0].status !== -2 ? "opacity-60" : ""}`}
> >
@ -62,7 +62,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
? "border-yellow-500/20 bg-yellow-500/20 text-yellow-500" ? "border-yellow-500/20 bg-yellow-500/20 text-yellow-500"
: issue.priority === "low" : issue.priority === "low"
? "border-green-500/20 bg-green-500/20 text-green-500" ? "border-green-500/20 bg-green-500/20 text-green-500"
: "border-custom-border-300" : "border-custom-border-200"
}`} }`}
> >
{getPriorityIcon( {getPriorityIcon(
@ -75,7 +75,7 @@ export const InboxIssueCard: React.FC<Props> = (props) => {
tooltipHeading="Created on" tooltipHeading="Created on"
tooltipContent={`${renderShortDateWithYearFormat(issue.created_at ?? "")}`} tooltipContent={`${renderShortDateWithYearFormat(issue.created_at ?? "")}`}
> >
<div className="flex items-center gap-1 rounded border border-custom-border-300 shadow-sm text-xs px-2 py-[0.19rem] text-custom-text-200"> <div className="flex items-center gap-1 rounded border border-custom-border-200 shadow-sm text-xs px-2 py-[0.19rem] text-custom-text-200">
<CalendarDaysIcon className="h-3.5 w-3.5" /> <CalendarDaysIcon className="h-3.5 w-3.5" />
<span>{renderShortDateWithYearFormat(issue.created_at ?? "")}</span> <span>{renderShortDateWithYearFormat(issue.created_at ?? "")}</span>
</div> </div>

2
apps/app/components/inbox/inbox-main-content.tsx
View File

@ -310,7 +310,7 @@ export const InboxMainContent: React.FC = () => {
</div> </div>
</div> </div>
<div className="basis-1/3 space-y-5 border-custom-border-300 p-5"> <div className="basis-1/3 space-y-5 border-custom-border-200 p-5">
<IssueDetailsSidebar <IssueDetailsSidebar
control={control} control={control}
issueDetail={issueDetails} issueDetail={issueDetails}

2
apps/app/components/inbox/issues-list-sidebar.tsx
View File

@ -18,7 +18,7 @@ export const IssuesListSidebar = () => {
<InboxFiltersList /> <InboxFiltersList />
{inboxIssues ? ( {inboxIssues ? (
inboxIssues.length > 0 ? ( inboxIssues.length > 0 ? (
<div className="divide-y divide-custom-border-300 overflow-auto h-full"> <div className="divide-y divide-custom-border-200 overflow-auto h-full">
{inboxIssues.map((issue) => ( {inboxIssues.map((issue) => (
<InboxIssueCard <InboxIssueCard
key={issue.id} key={issue.id}

4
apps/app/components/inbox/select-duplicate.tsx
View File

@ -101,7 +101,7 @@ export const SelectDuplicateInboxIssueModal: React.FC<Props> = (props) => {
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-200 bg-custom-background-100 shadow-2xl transition-all">
<Combobox <Combobox
value={selectedItem} value={selectedItem}
onChange={(value) => { onChange={(value) => {
@ -123,7 +123,7 @@ export const SelectDuplicateInboxIssueModal: React.FC<Props> = (props) => {
<Combobox.Options <Combobox.Options
static static
className="max-h-80 scroll-py-2 divide-y divide-custom-border-300 overflow-y-auto" className="max-h-80 scroll-py-2 divide-y divide-custom-border-200 overflow-y-auto"
> >
{filteredIssues.length > 0 ? ( {filteredIssues.length > 0 ? (
<li className="p-2"> <li className="p-2">

2
apps/app/components/integration/delete-import-modal.tsx
View File

@ -88,7 +88,7 @@ export const DeleteImportModal: React.FC<Props> = ({ isOpen, handleClose, data,
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

6
apps/app/components/integration/github/root.tsx
View File

@ -185,7 +185,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
</div> </div>
</Link> </Link>
<div className="space-y-4 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4"> <div className="space-y-4 rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-10 w-10 flex-shrink-0"> <div className="h-10 w-10 flex-shrink-0">
<Image src={GithubLogo} alt="GithubLogo" /> <Image src={GithubLogo} alt="GithubLogo" />
@ -201,7 +201,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
? "border-opacity-100 bg-opacity-100" ? "border-opacity-100 bg-opacity-100"
: "border-opacity-80 bg-opacity-80" : "border-opacity-80 bg-opacity-80"
}` }`
: "border-custom-border-300" : "border-custom-border-200"
}`} }`}
> >
<integration.icon <integration.icon
@ -216,7 +216,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
className={`border-b px-7 ${ className={`border-b px-7 ${
index <= activeIntegrationState() - 1 index <= activeIntegrationState() - 1
? `border-custom-primary` ? `border-custom-primary`
: `border-custom-border-300` : `border-custom-border-200`
}`} }`}
> >
{" "} {" "}

6
apps/app/components/integration/guide.tsx
View File

@ -83,7 +83,7 @@ const IntegrationGuide = () => {
{IMPORTERS_EXPORTERS_LIST.map((service) => ( {IMPORTERS_EXPORTERS_LIST.map((service) => (
<div <div
key={service.provider} key={service.provider}
className="rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4" className="rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4"
> >
<div className="flex items-center gap-4 whitespace-nowrap"> <div className="flex items-center gap-4 whitespace-nowrap">
<div className="relative h-10 w-10 flex-shrink-0"> <div className="relative h-10 w-10 flex-shrink-0">
@ -113,7 +113,7 @@ const IntegrationGuide = () => {
</div> </div>
))} ))}
</div> </div>
<div className="rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4"> <div className="rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4">
<h3 className="mb-2 flex gap-2 text-lg font-medium"> <h3 className="mb-2 flex gap-2 text-lg font-medium">
Previous Imports Previous Imports
<button <button
@ -133,7 +133,7 @@ const IntegrationGuide = () => {
{importerServices ? ( {importerServices ? (
importerServices.length > 0 ? ( importerServices.length > 0 ? (
<div className="space-y-2"> <div className="space-y-2">
<div className="divide-y divide-custom-border-300"> <div className="divide-y divide-custom-border-200">
{importerServices.map((service) => ( {importerServices.map((service) => (
<SingleImport <SingleImport
key={service.id} key={service.id}

2
apps/app/components/integration/jira/import-users.tsx
View File

@ -51,7 +51,7 @@ export const JiraImportUsers: FC = () => {
})); }));
return ( return (
<div className="h-full w-full space-y-10 divide-y-2 divide-custom-border-300 overflow-y-auto"> <div className="h-full w-full space-y-10 divide-y-2 divide-custom-border-200 overflow-y-auto">
<div className="grid grid-cols-1 gap-10 md:grid-cols-2"> <div className="grid grid-cols-1 gap-10 md:grid-cols-2">
<div className="col-span-1"> <div className="col-span-1">
<h3 className="font-semibold">Users</h3> <h3 className="font-semibold">Users</h3>

10
apps/app/components/integration/jira/root.tsx
View File

@ -118,7 +118,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
</div> </div>
</Link> </Link>
<div className="flex h-full flex-col space-y-4 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-4"> <div className="flex h-full flex-col space-y-4 rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div className="h-10 w-10 flex-shrink-0"> <div className="h-10 w-10 flex-shrink-0">
<Image src={JiraLogo} alt="jira logo" /> <Image src={JiraLogo} alt="jira logo" />
@ -135,14 +135,14 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
index > activeIntegrationState() + 1 || index > activeIntegrationState() + 1 ||
Boolean(index === activeIntegrationState() + 1 && disableTopBarAfter) Boolean(index === activeIntegrationState() + 1 && disableTopBarAfter)
} }
className={`flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full border border-custom-border-300 ${ className={`flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full border border-custom-border-200 ${
index <= activeIntegrationState() index <= activeIntegrationState()
? `border-custom-primary bg-custom-primary ${ ? `border-custom-primary bg-custom-primary ${
index === activeIntegrationState() index === activeIntegrationState()
? "border-opacity-100 bg-opacity-100" ? "border-opacity-100 bg-opacity-100"
: "border-opacity-80 bg-opacity-80" : "border-opacity-80 bg-opacity-80"
}` }`
: "border-custom-border-300" : "border-custom-border-200"
}`} }`}
> >
<integration.icon <integration.icon
@ -157,7 +157,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
className={`border-b px-7 ${ className={`border-b px-7 ${
index <= activeIntegrationState() - 1 index <= activeIntegrationState() - 1
? `border-custom-primary` ? `border-custom-primary`
: `border-custom-border-300` : `border-custom-border-200`
}`} }`}
> >
{" "} {" "}
@ -183,7 +183,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
{currentStep?.state === "import-confirmation" && <JiraConfirmImport />} {currentStep?.state === "import-confirmation" && <JiraConfirmImport />}
</div> </div>
<div className="-mx-4 mt-4 flex justify-end gap-4 border-t border-custom-border-300 p-4 pb-0"> <div className="-mx-4 mt-4 flex justify-end gap-4 border-t border-custom-border-200 p-4 pb-0">
{currentStep?.state !== "import-configure" && ( {currentStep?.state !== "import-configure" && (
<SecondaryButton <SecondaryButton
onClick={() => { onClick={() => {

2
apps/app/components/integration/single-integration-card.tsx
View File

@ -99,7 +99,7 @@ export const SingleIntegrationCard: React.FC<Props> = ({ integration }) => {
); );
return ( return (
<div className="flex items-center justify-between gap-2 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-5"> <div className="flex items-center justify-between gap-2 rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-5">
<div className="flex items-start gap-4"> <div className="flex items-start gap-4">
<div className="h-12 w-12 flex-shrink-0"> <div className="h-12 w-12 flex-shrink-0">
<Image <Image

54
apps/app/components/issues/activity.tsx
View File

@ -13,18 +13,8 @@ import { CommentCard } from "components/issues/comment";
// ui // ui
import { Icon, Loader } from "components/ui"; import { Icon, Loader } from "components/ui";
// icons // icons
import { import { Squares2X2Icon } from "@heroicons/react/24/outline";
CalendarDaysIcon, import { BlockedIcon, BlockerIcon } from "components/icons";
ChartBarIcon,
ChatBubbleBottomCenterTextIcon,
LinkIcon,
PaperClipIcon,
PlayIcon,
RectangleGroupIcon,
Squares2X2Icon,
UserIcon,
} from "@heroicons/react/24/outline";
import { BlockedIcon, BlockerIcon, CyclesIcon, TagIcon, UserGroupIcon } from "components/icons";
// helpers // helpers
import { renderShortDateWithYearFormat, timeAgo } from "helpers/date-time.helper"; import { renderShortDateWithYearFormat, timeAgo } from "helpers/date-time.helper";
import { addSpaceIfCamelCase } from "helpers/string.helper"; import { addSpaceIfCamelCase } from "helpers/string.helper";
@ -41,11 +31,11 @@ const activityDetails: {
} = { } = {
assignee: { assignee: {
message: "removed the assignee", message: "removed the assignee",
icon: <UserGroupIcon className="h-3 w-3" color="#6b7280" aria-hidden="true" />, icon: <Icon iconName="group" className="!text-sm" aria-hidden="true" />,
}, },
assignees: { assignees: {
message: "added a new assignee", message: "added a new assignee",
icon: <UserGroupIcon className="h-3 w-3" color="#6b7280" aria-hidden="true" />, icon: <Icon iconName="group" className="!text-sm" aria-hidden="true" />,
}, },
blocks: { blocks: {
message: "marked this issue being blocked by", message: "marked this issue being blocked by",
@ -57,62 +47,58 @@ const activityDetails: {
}, },
cycles: { cycles: {
message: "set the cycle to", message: "set the cycle to",
icon: <CyclesIcon height="12" width="12" color="#6b7280" />, icon: <Icon iconName="contrast" className="!text-sm" aria-hidden="true" />,
}, },
estimate_point: { estimate_point: {
message: "set the estimate point to", message: "set the estimate point to",
icon: <PlayIcon className="h-3 w-3 -rotate-90 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="change_history" className="!text-sm" aria-hidden="true" />,
}, },
labels: { labels: {
icon: <TagIcon height="12" width="12" color="#6b7280" />, icon: <Icon iconName="sell" className="!text-sm" aria-hidden="true" />,
}, },
modules: { modules: {
message: "set the module to", message: "set the module to",
icon: <RectangleGroupIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="dataset" className="!text-sm" aria-hidden="true" />,
}, },
state: { state: {
message: "set the state to", message: "set the state to",
icon: <Squares2X2Icon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Squares2X2Icon className="h-3 w-3" aria-hidden="true" />,
}, },
priority: { priority: {
message: "set the priority to", message: "set the priority to",
icon: <ChartBarIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="signal_cellular_alt" className="!text-sm" aria-hidden="true" />,
}, },
name: { name: {
message: "set the name to", message: "set the name to",
icon: ( icon: <Icon iconName="chat" className="!text-sm" aria-hidden="true" />,
<ChatBubbleBottomCenterTextIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />
),
}, },
description: { description: {
message: "updated the description.", message: "updated the description.",
icon: ( icon: <Icon iconName="chat" className="!text-sm" aria-hidden="true" />,
<ChatBubbleBottomCenterTextIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />
),
}, },
target_date: { target_date: {
message: "set the due date to", message: "set the due date to",
icon: <CalendarDaysIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="calendar_today" className="!text-sm" aria-hidden="true" />,
}, },
parent: { parent: {
message: "set the parent to", message: "set the parent to",
icon: <UserIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="supervised_user_circle" className="!text-sm" aria-hidden="true" />,
}, },
estimate: { estimate: {
message: "updated the estimate", message: "updated the estimate",
icon: <PlayIcon className="h-3 w-3 -rotate-90 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="change_history" className="!text-sm" aria-hidden="true" />,
}, },
link: { link: {
message: "updated the link", message: "updated the link",
icon: <LinkIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="link" className="!text-sm" aria-hidden="true" />,
}, },
attachment: { attachment: {
message: "updated the attachment", message: "updated the attachment",
icon: <PaperClipIcon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="attach_file" className="!text-sm" aria-hidden="true" />,
}, },
archived_at: { archived_at: {
message: "archived", message: "archived",
icon: <Icon iconName="archive" className="text-sm text-custom-text-200" aria-hidden="true" />, icon: <Icon iconName="archive" className="!text-sm" aria-hidden="true" />,
}, },
}; };
@ -288,7 +274,7 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
} }
value = ( value = (
<span className="relative inline-flex items-center rounded-full border border-custom-border-300 px-2 py-0.5 text-xs"> <span className="relative inline-flex items-center rounded-full border border-custom-border-200 px-2 py-0.5 text-xs">
<span className="absolute flex flex-shrink-0 items-center justify-center"> <span className="absolute flex flex-shrink-0 items-center justify-center">
<span <span
className="h-1.5 w-1.5 rounded-full" className="h-1.5 w-1.5 rounded-full"
@ -352,7 +338,7 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
<div> <div>
<div className="relative px-1.5"> <div className="relative px-1.5">
<div className="mt-1.5"> <div className="mt-1.5">
<div className="ring-6 flex h-7 w-7 items-center justify-center rounded-full bg-custom-background-80 ring-white"> <div className="ring-6 flex h-7 w-7 items-center justify-center rounded-full bg-custom-background-80 text-custom-text-200 ring-white">
{activityItem.field ? ( {activityItem.field ? (
activityItem.new_value === "restore" ? ( activityItem.new_value === "restore" ? (
<Icon <Icon

2
apps/app/components/issues/attachment-upload.tsx
View File

@ -90,7 +90,7 @@ export const IssueAttachmentUpload: React.FC<Props> = ({ disabled = false }) =>
<div <div
{...getRootProps()} {...getRootProps()}
className={`flex items-center justify-center h-[60px] border-2 border-dashed text-custom-primary bg-custom-primary/5 text-xs rounded-md px-4 ${ className={`flex items-center justify-center h-[60px] border-2 border-dashed text-custom-primary bg-custom-primary/5 text-xs rounded-md px-4 ${
isDragActive ? "bg-custom-primary/10 border-custom-primary" : "border-custom-border-300" isDragActive ? "bg-custom-primary/10 border-custom-primary" : "border-custom-border-200"
} ${isDragReject ? "bg-red-100" : ""} ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`} } ${isDragReject ? "bg-red-100" : ""} ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`}
> >
<input {...getInputProps()} /> <input {...getInputProps()} />

2
apps/app/components/issues/attachments.tsx
View File

@ -61,7 +61,7 @@ export const IssueAttachments = () => {
attachments.map((file) => ( attachments.map((file) => (
<div <div
key={file.id} key={file.id}
className="flex h-[60px] items-center justify-between gap-1 rounded-md border-[2px] border-custom-border-300 bg-custom-background-100 px-4 py-2 text-sm" className="flex h-[60px] items-center justify-between gap-1 rounded-md border-[2px] border-custom-border-200 bg-custom-background-100 px-4 py-2 text-sm"
> >
<Link href={file.asset}> <Link href={file.asset}>
<a target="_blank"> <a target="_blank">

4
apps/app/components/issues/comment/comment-card.tsx
View File

@ -72,7 +72,7 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
alt={comment.actor_detail.first_name} alt={comment.actor_detail.first_name}
height={30} height={30}
width={30} width={30}
className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-300" className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-200"
/> />
) : ( ) : (
<div <div
@ -135,7 +135,7 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
value={comment.comment_html} value={comment.comment_html}
editable={false} editable={false}
noBorder noBorder
customClassName="text-xs border border-custom-border-300 bg-custom-background-100" customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
ref={showEditorRef} ref={showEditorRef}
/> />
</div> </div>

7
apps/app/components/issues/delete-issue-modal.tsx
View File

@ -40,7 +40,7 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, u
const [isDeleteLoading, setIsDeleteLoading] = useState(false); const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const router = useRouter(); const router = useRouter();
const { workspaceSlug, projectId, cycleId, moduleId, viewId } = router.query; const { workspaceSlug, projectId, cycleId, moduleId, viewId, issueId } = router.query;
const isArchivedIssues = router.pathname.includes("archived-issues"); const isArchivedIssues = router.pathname.includes("archived-issues");
const { issueView, params } = useIssuesView(); const { issueView, params } = useIssuesView();
@ -121,7 +121,8 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, u
type: "success", type: "success",
message: "Issue deleted successfully", message: "Issue deleted successfully",
}); });
router.back();
if (issueId) router.back();
}) })
.catch((error) => { .catch((error) => {
console.log(error); console.log(error);
@ -180,7 +181,7 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, u
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-300 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform overflow-hidden rounded-lg border border-custom-border-200 bg-custom-background-100 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl">
<div className="flex flex-col gap-6 p-6"> <div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6"> <div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-red-500/20 p-4"> <span className="place-items-center rounded-full bg-red-500/20 p-4">

2
apps/app/components/issues/form.tsx
View File

@ -529,7 +529,7 @@ export const IssueForm: FC<IssueFormProps> = ({
</div> </div>
</div> </div>
</div> </div>
<div className="-mx-5 mt-5 flex items-center justify-between gap-2 border-t border-custom-border-300 px-5 pt-5"> <div className="-mx-5 mt-5 flex items-center justify-between gap-2 border-t border-custom-border-200 px-5 pt-5">
<div <div
className="flex cursor-pointer items-center gap-1" className="flex cursor-pointer items-center gap-1"
onClick={() => setCreateMore((prevData) => !prevData)} onClick={() => setCreateMore((prevData) => !prevData)}

4
apps/app/components/issues/gantt-chart.tsx
View File

@ -25,7 +25,7 @@ export const IssueGanttChartView: FC<Props> = ({}) => {
<div className="relative flex w-full h-full items-center p-1 overflow-hidden gap-1"> <div className="relative flex w-full h-full items-center p-1 overflow-hidden gap-1">
<div <div
className="rounded-sm flex-shrink-0 w-[10px] h-[10px] flex justify-center items-center" className="rounded-sm flex-shrink-0 w-[10px] h-[10px] flex justify-center items-center"
style={{ backgroundColor: data?.state_detail?.color || "#858e96" }} style={{ backgroundColor: data?.state_detail?.color || "#rgb(var(--color-primary-100))" }}
/> />
<div className="text-custom-text-100 text-sm">{data?.name}</div> <div className="text-custom-text-100 text-sm">{data?.name}</div>
</div> </div>
@ -37,7 +37,7 @@ export const IssueGanttChartView: FC<Props> = ({}) => {
<a className="relative flex items-center w-full h-full overflow-hidden shadow-sm font-normal"> <a className="relative flex items-center w-full h-full overflow-hidden shadow-sm font-normal">
<div <div
className="flex-shrink-0 w-[4px] h-full" className="flex-shrink-0 w-[4px] h-full"
style={{ backgroundColor: data?.state_detail?.color || "#858e96" }} style={{ backgroundColor: data?.state_detail?.color || "rgb(var(--color-primary-100))" }}
/> />
<Tooltip tooltipContent={data?.name} className={`z-[999999]`}> <Tooltip tooltipContent={data?.name} className={`z-[999999]`}>
<div className="text-custom-text-100 text-[15px] whitespace-nowrap py-[4px] px-2.5 overflow-hidden w-full"> <div className="text-custom-text-100 text-[15px] whitespace-nowrap py-[4px] px-2.5 overflow-hidden w-full">

2
apps/app/components/issues/modal.tsx
View File

@ -343,7 +343,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
> >
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 p-5 text-left shadow-xl transition-all sm:w-full sm:max-w-2xl"> <Dialog.Panel className="relative transform rounded-lg border border-custom-border-200 bg-custom-background-100 p-5 text-left shadow-xl transition-all sm:w-full sm:max-w-2xl">
<IssueForm <IssueForm
issues={issues ?? []} issues={issues ?? []}
handleFormSubmit={handleFormSubmit} handleFormSubmit={handleFormSubmit}

12
apps/app/components/issues/my-issues-list-item.tsx
View File

@ -87,7 +87,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
const isNotAllowed = false; const isNotAllowed = false;
return ( return (
<div className="border-b border-custom-border-300 bg-custom-background-100 px-4 py-2.5 last:border-b-0"> <div className="border-b border-custom-border-200 bg-custom-background-100 px-4 py-2.5 last:border-b-0">
<div key={issue.id} className="flex items-center justify-between gap-2"> <div key={issue.id} className="flex items-center justify-between gap-2">
<Link href={`/${workspaceSlug}/projects/${issue?.project_detail?.id}/issues/${issue.id}`}> <Link href={`/${workspaceSlug}/projects/${issue?.project_detail?.id}/issues/${issue.id}`}>
<a className="group relative flex items-center gap-2"> <a className="group relative flex items-center gap-2">
@ -139,7 +139,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
{issue.label_details.map((label) => ( {issue.label_details.map((label) => (
<span <span
key={label.id} key={label.id}
className="group flex items-center gap-1 rounded-2xl border border-custom-border-300 px-2 py-0.5 text-xs text-custom-text-200" className="group flex items-center gap-1 rounded-2xl border border-custom-border-200 px-2 py-0.5 text-xs text-custom-text-200"
> >
<span <span
className="h-1.5 w-1.5 rounded-full" className="h-1.5 w-1.5 rounded-full"
@ -155,7 +155,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
"" ""
)} )}
{properties.assignee && ( {properties.assignee && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2 py-1 text-xs shadow-sm">
<Tooltip <Tooltip
position="top-right" position="top-right"
tooltipHeading="Assignees" tooltipHeading="Assignees"
@ -176,7 +176,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
</div> </div>
)} )}
{properties.sub_issue_count && ( {properties.sub_issue_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2.5 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2.5 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}> <Tooltip tooltipHeading="Sub-issue" tooltipContent={`${issue.sub_issues_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LayerDiagonalIcon className="h-3.5 w-3.5" /> <LayerDiagonalIcon className="h-3.5 w-3.5" />
@ -186,7 +186,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
</div> </div>
)} )}
{properties.link && ( {properties.link && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}> <Tooltip tooltipHeading="Link" tooltipContent={`${issue.link_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<LinkIcon className="h-3.5 w-3.5 text-custom-text-200" /> <LinkIcon className="h-3.5 w-3.5 text-custom-text-200" />
@ -196,7 +196,7 @@ export const MyIssuesListItem: React.FC<Props> = ({ issue, properties, projectId
</div> </div>
)} )}
{properties.attachment_count && ( {properties.attachment_count && (
<div className="flex cursor-default items-center rounded-md border border-custom-border-300 px-2 py-1 text-xs shadow-sm"> <div className="flex cursor-default items-center rounded-md border border-custom-border-200 px-2 py-1 text-xs shadow-sm">
<Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}> <Tooltip tooltipHeading="Attachment" tooltipContent={`${issue.attachment_count}`}>
<div className="flex items-center gap-1 text-custom-text-200"> <div className="flex items-center gap-1 text-custom-text-200">
<PaperClipIcon className="h-3.5 w-3.5 -rotate-45 text-custom-text-200" /> <PaperClipIcon className="h-3.5 w-3.5 -rotate-45 text-custom-text-200" />

2
apps/app/components/issues/parent-issues-list-modal.tsx
View File

@ -108,7 +108,7 @@ export const ParentIssuesListModal: React.FC<Props> = ({
leaveFrom="opacity-100 scale-100" leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-300 bg-custom-background-100 shadow-2xl transition-all"> <Dialog.Panel className="relative mx-auto max-w-2xl transform rounded-xl border border-custom-border-200 bg-custom-background-100 shadow-2xl transition-all">
<Combobox value={value} onChange={onChange}> <Combobox value={value} onChange={onChange}>
<div className="relative m-1"> <div className="relative m-1">
<MagnifyingGlassIcon <MagnifyingGlassIcon

2
apps/app/components/issues/select/date.tsx
View File

@ -16,7 +16,7 @@ export const IssueDateSelect: React.FC<Props> = ({ value, onChange }) => (
<Popover className="relative flex items-center justify-center rounded-lg"> <Popover className="relative flex items-center justify-center rounded-lg">
{({ open }) => ( {({ open }) => (
<> <>
<Popover.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-300 text-xs shadow-sm duration-200"> <Popover.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-200 text-xs shadow-sm duration-200">
<span className="flex items-center justify-center gap-2 px-2 py-1 text-xs text-custom-text-200"> <span className="flex items-center justify-center gap-2 px-2 py-1 text-xs text-custom-text-200">
{value ? ( {value ? (
<> <>

6
apps/app/components/issues/select/label.tsx
View File

@ -59,7 +59,7 @@ export const IssueLabelSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
> >
{({ open }: any) => ( {({ open }: any) => (
<> <>
<Combobox.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-300 text-xs shadow-sm duration-200 hover:bg-custom-background-80"> <Combobox.Button className="flex cursor-pointer items-center rounded-md border border-custom-border-200 text-xs shadow-sm duration-200 hover:bg-custom-background-80">
{value && value.length > 0 ? ( {value && value.length > 0 ? (
<span className="flex items-center justify-center gap-2 px-3 py-1 text-xs"> <span className="flex items-center justify-center gap-2 px-3 py-1 text-xs">
<IssueLabelsList <IssueLabelsList
@ -90,7 +90,7 @@ export const IssueLabelSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
className={`absolute z-10 mt-1 max-h-52 min-w-[8rem] overflow-auto rounded-md border-none className={`absolute z-10 mt-1 max-h-52 min-w-[8rem] overflow-auto rounded-md border-none
bg-custom-background-90 px-2 py-2 text-xs shadow-md focus:outline-none`} bg-custom-background-90 px-2 py-2 text-xs shadow-md focus:outline-none`}
> >
<div className="flex w-full items-center justify-start rounded-sm border-[0.6px] border-custom-border-300 bg-custom-background-90 px-2"> <div className="flex w-full items-center justify-start rounded-sm border-[0.6px] border-custom-border-200 bg-custom-background-90 px-2">
<MagnifyingGlassIcon className="h-3 w-3 text-custom-text-200" /> <MagnifyingGlassIcon className="h-3 w-3 text-custom-text-200" />
<Combobox.Input <Combobox.Input
className="w-full bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none" className="w-full bg-transparent py-1 px-2 text-xs text-custom-text-200 focus:outline-none"
@ -141,7 +141,7 @@ export const IssueLabelSelect: React.FC<Props> = ({ setIsOpen, value, onChange,
); );
} else } else
return ( return (
<div className="border-y border-custom-border-300"> <div className="border-y border-custom-border-200">
<div className="flex select-none items-center gap-2 truncate p-2 text-custom-text-100"> <div className="flex select-none items-center gap-2 truncate p-2 text-custom-text-100">
<RectangleGroupIcon className="h-3 w-3" /> {label.name} <RectangleGroupIcon className="h-3 w-3" /> {label.name}
</div> </div>

Some files were not shown because too many files have changed in this diff Show More