From 22339b9786e98e12be803ca33eeaafe56fb5134a Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Fri, 12 Dec 2025 20:50:14 +0530 Subject: [PATCH] [WEB-5602] feat: new design system (#8220) * chore: init tailwind v4 * chore: update all configs * chore: add source to parse monorepo packages * chore: combine all css files * feat: added extended colors * chore: update typography * chore: update extended color var names * refactor: remove initial spacing variable and update dark mode selector * chore: update css files * chore: update animations * chore: remove spacing tokens * fix: external css files * chore: update tailwind-merge version * chore: update font family * chore: added brief agents.md and story for new design system * chore: enhance design system documentation with rare exceptions for visual separation * chore: add fontsource package for typography * chore: material symbols font added * chore: update shadow default * chore: add stroke and outline theme vars * chore: update ring and fill colors * chore: overwrite tailwind typography tokens * chore: add high contrast mode tokens * chore: update scrollbar colors * chore: backward compatibility for buttons and placeholders * chore: add priority colors * chore: update urgent priority color * chore: update plan colors * chore: add missing utility class * chore: update height and padding classes * chore: update label colors * chore: add missing utlity * chore: add typography plugin to space app * chore: replace existing classNames with new design system tokens #8244 (#8278) * chore: update border colors * chore: update all borders * chore: update text colors * chore: update css variables * chore: update font sizes and weights * chore: update bg colors * chore: sync changes * fix: uncomment spacing-1200 variable in variables.css * chore: update primary colors * refactor: updated border to border-subtle * refactor: update various components and improve UI consistency across the application * updated classnames * updated classnames * refactor: update color-related class names to use new design system variables for consistency * chore: default automations * chore: update text sizes * chore: home and power k * chore: home and power k * chore: replace ui package button components * chore: update text sizes * chore: updated issue identifier (#8275) * refactor: top navigation and sidebar design token (#8276) * chore: update all button components (#8277) * chore: new button component * chore: update existing buttons * chore: overwrite tailwind typography tokens * fix: twMerge config + fixed cn instances * refactor: toast design token updated (#8279) * chore: update existing buttons * chore: tooltip design token updatged (#8280) * chore: moved cn utility to propel (#8281) * chore: update space app UI (#8285) * chore; update space app filters component * fix: button whitespace wrap * chore: space app votes * chore: update dropdown components * refactor: auth, onboarding, sidebar, and common component design token migration (#8291) * chore: checkbox component design token updated * chore: indicator and oauth component design token updated * chore: sidebar design token updated * chore: auth and onboarding design token updated * chore: update divider color * style: update background colors and hover effects across list components * fix: tailwind merge * refactor: toggle switch design token migration and header utility classname added (#8295) * chore: toggle component design token updated * chore: h-header utility class added * chore: updated color tokens for work item detail page (#8296) * chore: update react-day-picker UI * refactor: update button sizes and styles in filters components * refactor: breadcrumbs design token updated (#8297) * chore: update priority icon colors * refactor: updated layout variables * chore: update plan card primary CTA * Chore update editor design system (#8299) * refactor: update styles for callout, color selector, logo selector, and image uploader * refactor:fix image * chore: update settings UI * chore: updated notifications color and size tokens (#8302) * chore: update sm button border radius * fix: logo renderer * chore: icon button component * chore: remove deprecated classes * chore: remove deprecated classes * chore: update editor list spacing * fix: icon button size * chore: improvements (#8309) * chore: update cycles and modules pages * refactor: update background styles across various components to use new design system colors * fix: button type errors * chore: update modals design system (#8310) * refactor: callout bg * refactor: code bg * refactor: modal size and variant --------- Co-authored-by: Aaryan Khandelwal * chore: update next-themes * design: update billing and plans component styles and remove unused utility functions (#8313) * refactor: empty state design token migration and improvements (#8315) * fix: profile page * refactor: tabs design token updated (#8316) * chore: updated buttons and tokens for work items (#8317) * fix: adjust trial button spacing in checkout modal * chore: update add button hover state * fix: type error (#8318) * fix: type error * chore: code refactor * refactor: update button sizes and background styles in rich filters components * refactor: update editor bg * refactor: enhance Gantt chart sidebar functionality and styling - Removed unused prop from . - Updated to include new props for better block management and scrolling behavior. - Improved auto-scroll functionality for Gantt chart items. - Adjusted styles in component for consistent design. * regression: gantt design * chore: new badge component * fix: favorite star * chore: update backgroung, typography and button sizes across workspace settings general and members pages * fix: header button sizes * fix: emoji icon logo (#8323) * more fixes * chore: update settings sidebar * refactor: avatar component * chore: updated work item detail sidebar (#8327) * refactor: update link preview * fix: work item property dropdowns * fix: dropdown buttons border radius * chore: update power k translation * chore: updated profile activity design (#8328) * chore: update settings pages * chore: update work item sidebar alignments (#8330) * refactor: admin design system * chore: update page header --------- Co-authored-by: Jayash Tripathy <76092296+JayashTripathy@users.noreply.github.com> Co-authored-by: VipinDevelops Co-authored-by: Vamsi Krishna <46787868+vamsikrishnamathala@users.noreply.github.com> Co-authored-by: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Co-authored-by: gakshita Co-authored-by: Palanikannan M Co-authored-by: Prateek Shourya Co-authored-by: b-saikrishnakanth Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com> * fix: formatting * reexport types * fix: lint error --------- Co-authored-by: Jayash Tripathy <76092296+JayashTripathy@users.noreply.github.com> Co-authored-by: VipinDevelops Co-authored-by: Vamsi Krishna <46787868+vamsikrishnamathala@users.noreply.github.com> Co-authored-by: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Co-authored-by: gakshita Co-authored-by: Palanikannan M Co-authored-by: Prateek Shourya Co-authored-by: b-saikrishnakanth Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com> --- .gitignore | 2 - AGENTS.md | 24 + apps/admin/app/(all)/(dashboard)/ai/form.tsx | 14 +- apps/admin/app/(all)/(dashboard)/ai/page.tsx | 6 +- .../(dashboard)/authentication/gitea/form.tsx | 29 +- .../(dashboard)/authentication/gitea/page.tsx | 2 +- .../authentication/github/form.tsx | 32 +- .../authentication/github/page.tsx | 2 +- .../authentication/gitlab/form.tsx | 26 +- .../authentication/gitlab/page.tsx | 2 +- .../authentication/google/form.tsx | 32 +- .../authentication/google/page.tsx | 2 +- .../(all)/(dashboard)/authentication/page.tsx | 14 +- .../(dashboard)/email/email-config-form.tsx | 14 +- .../app/(all)/(dashboard)/email/page.tsx | 10 +- .../(dashboard)/email/test-email-modal.tsx | 16 +- .../app/(all)/(dashboard)/general/form.tsx | 32 +- .../(all)/(dashboard)/general/intercom.tsx | 10 +- .../app/(all)/(dashboard)/general/page.tsx | 6 +- apps/admin/app/(all)/(dashboard)/header.tsx | 8 +- .../app/(all)/(dashboard)/image/form.tsx | 4 +- .../app/(all)/(dashboard)/image/page.tsx | 6 +- apps/admin/app/(all)/(dashboard)/layout.tsx | 4 +- .../(all)/(dashboard)/sidebar-dropdown.tsx | 20 +- .../(dashboard)/sidebar-help-section.tsx | 24 +- .../app/(all)/(dashboard)/sidebar-menu.tsx | 12 +- apps/admin/app/(all)/(dashboard)/sidebar.tsx | 2 +- .../(dashboard)/workspace/create/form.tsx | 30 +- .../(dashboard)/workspace/create/page.tsx | 6 +- .../app/(all)/(dashboard)/workspace/page.tsx | 26 +- apps/admin/app/(all)/(home)/auth-banner.tsx | 8 +- apps/admin/app/(all)/(home)/auth-header.tsx | 2 +- apps/admin/app/(all)/(home)/auth-helpers.tsx | 4 +- apps/admin/app/(all)/(home)/layout.tsx | 2 +- apps/admin/app/(all)/(home)/sign-in-form.tsx | 14 +- apps/admin/app/components/404.tsx | 8 +- apps/admin/app/root.tsx | 6 +- .../authentication/authentication-modes.tsx | 8 +- .../ce/components/common/upgrade-button.tsx | 2 +- .../authentication-method-card.tsx | 18 +- .../authentication/gitea-config.tsx | 13 +- .../authentication/github-config.tsx | 9 +- .../authentication/gitlab-config.tsx | 9 +- .../authentication/google-config.tsx | 9 +- apps/admin/core/components/common/banner.tsx | 2 +- .../components/common/breadcrumb-link.tsx | 11 +- .../core/components/common/code-block.tsx | 4 +- .../common/confirm-discard-modal.tsx | 12 +- .../components/common/controller-input.tsx | 8 +- .../core/components/common/copy-field.tsx | 9 +- .../core/components/common/empty-state.tsx | 5 +- .../core/components/instance/failure.tsx | 6 +- .../core/components/instance/form-header.tsx | 4 +- .../instance/instance-not-ready.tsx | 8 +- .../core/components/instance/setup-form.tsx | 44 +- apps/admin/core/components/new-user-popup.tsx | 10 +- .../core/components/workspace/list-item.tsx | 30 +- apps/admin/postcss.config.cjs | 1 - apps/admin/postcss.config.js | 3 + apps/admin/styles/globals.css | 404 +----- apps/admin/tailwind.config.cjs | 5 - apps/api/plane/seeds/data/issues.json | 14 +- apps/api/plane/seeds/data/pages.json | 56 +- apps/space/app/error.tsx | 8 +- apps/space/app/issues/[anchor]/layout.tsx | 4 +- apps/space/app/not-found.tsx | 6 +- .../account/auth-forms/auth-banner.tsx | 8 +- .../account/auth-forms/auth-header.tsx | 4 +- .../components/account/auth-forms/email.tsx | 14 +- .../account/auth-forms/password.tsx | 30 +- .../account/auth-forms/unique-code.tsx | 20 +- .../account/terms-and-conditions.tsx | 6 +- .../components/account/user-logged-in.tsx | 10 +- .../core/components/common/powered-by.tsx | 6 +- .../core/components/common/project-logo.tsx | 4 +- .../editor/embeds/mentions/user.tsx | 11 +- .../components/editor/lite-text-editor.tsx | 2 +- apps/space/core/components/editor/toolbar.tsx | 17 +- .../instance/instance-failure-view.tsx | 6 +- .../filters/applied-filters/filters-list.tsx | 8 +- .../issues/filters/applied-filters/label.tsx | 4 +- .../filters/applied-filters/priority.tsx | 28 +- .../issues/filters/applied-filters/root.tsx | 2 +- .../issues/filters/applied-filters/state.tsx | 4 +- .../issues/filters/helpers/dropdown.tsx | 6 +- .../issues/filters/helpers/filter-header.tsx | 6 +- .../issues/filters/helpers/filter-option.tsx | 12 +- .../core/components/issues/filters/labels.tsx | 4 +- .../components/issues/filters/priority.tsx | 2 +- .../core/components/issues/filters/root.tsx | 2 +- .../components/issues/filters/selection.tsx | 12 +- .../core/components/issues/filters/state.tsx | 4 +- .../components/issues/issue-layouts/error.tsx | 6 +- .../issues/issue-layouts/issue-layout-HOC.tsx | 4 +- .../issue-layouts/kanban/base-kanban-root.tsx | 4 +- .../issue-layouts/kanban/block-reactions.tsx | 4 +- .../issues/issue-layouts/kanban/block.tsx | 14 +- .../issue-layouts/kanban/blocks-list.tsx | 10 +- .../issues/issue-layouts/kanban/default.tsx | 78 +- .../kanban/headers/group-by-card.tsx | 13 +- .../kanban/headers/sub-group-by-card.tsx | 12 +- .../issue-layouts/kanban/kanban-group.tsx | 5 +- .../issues/issue-layouts/kanban/swimlanes.tsx | 4 +- .../issue-layouts/list/base-list-root.tsx | 2 +- .../issues/issue-layouts/list/block.tsx | 14 +- .../issues/issue-layouts/list/blocks-list.tsx | 10 +- .../issues/issue-layouts/list/default.tsx | 3 +- .../list/headers/group-by-card.tsx | 11 +- .../issues/issue-layouts/list/list-group.tsx | 15 +- .../properties/all-properties.tsx | 14 +- .../issues/issue-layouts/properties/cycle.tsx | 6 +- .../issue-layouts/properties/due-date.tsx | 4 +- .../issue-layouts/properties/labels.tsx | 12 +- .../issue-layouts/properties/member.tsx | 6 +- .../issue-layouts/properties/modules.tsx | 14 +- .../issue-layouts/properties/priority.tsx | 16 +- .../issues/issue-layouts/properties/state.tsx | 6 +- .../components/issues/issue-layouts/root.tsx | 8 +- .../components/issues/navbar/controls.tsx | 6 +- .../issues/navbar/layout-selection.tsx | 8 +- .../core/components/issues/navbar/root.tsx | 15 +- .../core/components/issues/navbar/theme.tsx | 10 +- .../components/issues/navbar/user-avatar.tsx | 15 +- .../comment/comment-detail-card.tsx | 36 +- .../peek-overview/full-screen-peek-view.tsx | 4 +- .../issues/peek-overview/header.tsx | 34 +- .../issues/peek-overview/issue-activity.tsx | 6 +- .../issues/peek-overview/issue-details.tsx | 4 +- .../issues/peek-overview/issue-properties.tsx | 26 +- .../issues/peek-overview/layout.tsx | 8 +- .../issues/peek-overview/side-peek-view.tsx | 6 +- .../issues/reactions/issue-vote-reactions.tsx | 18 +- apps/space/core/components/ui/icon.tsx | 2 +- apps/space/core/components/ui/not-found.tsx | 6 +- apps/space/core/components/views/header.tsx | 2 +- apps/space/core/lib/instance-provider.tsx | 2 +- apps/space/helpers/emoji.helper.tsx | 2 +- apps/space/package.json | 1 + apps/space/postcss.config.cjs | 1 - apps/space/postcss.config.js | 3 + apps/space/styles/globals.css | 532 +------- apps/space/tailwind.config.cjs | 1 - .../(projects)/active-cycles/header.tsx | 2 +- .../(projects)/analytics/[tabId]/header.tsx | 2 +- .../(projects)/analytics/[tabId]/page.tsx | 4 +- .../(projects)/browse/[workItem]/header.tsx | 4 +- .../browse/[workItem]/work-item-header.tsx | 2 +- .../(projects)/drafts/header.tsx | 4 +- .../(projects)/extended-project-sidebar.tsx | 10 +- .../(projects)/extended-sidebar-wrapper.tsx | 2 +- .../[workspaceSlug]/(projects)/header.tsx | 13 +- .../[workspaceSlug]/(projects)/layout.tsx | 4 +- .../profile/[userId]/activity/page.tsx | 6 +- .../(projects)/profile/[userId]/header.tsx | 40 +- .../(projects)/profile/[userId]/layout.tsx | 2 +- .../profile/[userId]/mobile-header.tsx | 18 +- .../(projects)/profile/[userId]/navbar.tsx | 19 +- .../(detail)/[projectId]/archives/header.tsx | 6 +- .../(detail)/[archivedIssueId]/page.tsx | 7 +- .../archives/issues/(detail)/header.tsx | 4 +- .../cycles/(detail)/[cycleId]/page.tsx | 6 +- .../[projectId]/cycles/(detail)/header.tsx | 31 +- .../cycles/(detail)/mobile-header.tsx | 18 +- .../[projectId]/cycles/(list)/header.tsx | 4 +- .../cycles/(list)/mobile-header.tsx | 8 +- .../issues/(list)/mobile-header.tsx | 10 +- .../projects/(detail)/[projectId]/layout.tsx | 4 +- .../modules/(detail)/[moduleId]/page.tsx | 6 +- .../[projectId]/modules/(detail)/header.tsx | 34 +- .../modules/(detail)/mobile-header.tsx | 18 +- .../[projectId]/modules/(list)/header.tsx | 4 +- .../modules/(list)/mobile-header.tsx | 10 +- .../pages/(detail)/[pageId]/page.tsx | 6 +- .../[projectId]/pages/(detail)/header.tsx | 2 +- .../[projectId]/pages/(list)/header.tsx | 8 +- .../views/(detail)/[viewId]/header.tsx | 13 +- .../[projectId]/views/(list)/header.tsx | 4 +- .../views/(list)/mobile-header.tsx | 10 +- .../(projects)/star-us-link.tsx | 4 +- .../(projects)/stickies/header.tsx | 5 +- .../(projects)/workspace-views/header.tsx | 9 +- .../(projects)/workspace-views/page.tsx | 6 +- .../[workspaceSlug]/(settings)/layout.tsx | 8 +- .../settings/(workspace)/members/page.tsx | 10 +- .../(workspace)/mobile-header-tabs.tsx | 6 +- .../(workspace)/webhooks/[webhookId]/page.tsx | 2 +- .../settings/account/activity/page.tsx | 9 +- .../settings/account/security/page.tsx | 12 +- .../(settings)/settings/account/sidebar.tsx | 6 +- .../(settings)/settings/projects/page.tsx | 7 +- apps/web/app/(all)/create-workspace/page.tsx | 18 +- apps/web/app/(all)/invitations/page.tsx | 30 +- apps/web/app/(all)/layout.tsx | 6 - apps/web/app/(all)/onboarding/page.tsx | 4 +- apps/web/app/(all)/profile/activity/page.tsx | 4 +- .../web/app/(all)/profile/appearance/page.tsx | 4 +- apps/web/app/(all)/profile/layout.tsx | 4 +- apps/web/app/(all)/profile/security/page.tsx | 12 +- apps/web/app/(all)/profile/sidebar.tsx | 32 +- .../app/(all)/workspace-invitations/page.tsx | 4 +- apps/web/app/error/dev.tsx | 52 +- apps/web/app/error/prod.tsx | 12 +- apps/web/app/layout.tsx | 9 +- apps/web/app/not-found.tsx | 8 +- apps/web/app/root.tsx | 7 +- .../workspace-active-cycles-upgrade.tsx | 12 +- .../ce/components/command-palette/helpers.tsx | 10 +- .../power-k/search/no-results-command.tsx | 2 +- .../ce/components/comments/comment-block.tsx | 10 +- .../components/cycles/active-cycle/root.tsx | 8 +- .../estimates/estimate-list-item-buttons.tsx | 2 +- .../gantt-chart/blocks/block-row-list.tsx | 1 - .../global/product-updates/header.tsx | 4 +- .../instance/maintenance-message.tsx | 6 +- apps/web/ce/components/issues/header.tsx | 11 +- .../issues/issue-details/issue-creator.tsx | 4 +- .../issues/issue-details/issue-identifier.tsx | 87 +- .../{sidebar.tsx => sidebar}/date-alert.tsx | 0 .../license/modal/upgrade-modal.tsx | 7 +- .../navigations/top-navigation-root.tsx | 4 +- .../ce/components/onboarding/tour/root.tsx | 26 +- .../ce/components/onboarding/tour/sidebar.tsx | 10 +- .../pages/editor/ai/ask-pi-menu.tsx | 24 +- .../ce/components/pages/editor/ai/menu.tsx | 32 +- .../editor/embed/issue-embed-upgrade-card.tsx | 6 +- .../components/pages/header/lock-control.tsx | 10 +- .../tab-panels/empty-states/assets.tsx | 10 +- .../tab-panels/empty-states/outline.tsx | 10 +- .../components/projects/create/attributes.tsx | 4 +- .../ce/components/projects/mobile-header.tsx | 6 +- .../projects/settings/intake/header.tsx | 9 +- .../projects/settings/useProjectColumns.tsx | 2 +- apps/web/ce/components/relations/index.tsx | 12 +- .../rich-filters/filter-value-input/root.tsx | 2 +- .../ce/components/workflow/state-option.tsx | 3 +- .../notification-card/root.tsx | 8 +- .../billing/comparison/frequency-toggle.tsx | 39 +- .../billing/comparison/plan-detail.tsx | 39 +- .../ce/components/workspace/billing/root.tsx | 18 +- .../components/workspace/content-wrapper.tsx | 4 +- .../workspace/delete-workspace-section.tsx | 10 +- .../ce/components/workspace/edition-badge.tsx | 7 +- .../workspace/settings/useMemberColumns.tsx | 8 +- .../sidebar/extended-sidebar-item.tsx | 12 +- .../ce/components/workspace/upgrade-badge.tsx | 6 +- .../constants/project/settings/features.tsx | 10 +- apps/web/ce/types/pages/pane-extensions.ts | 19 +- .../account/auth-forms/auth-banner.tsx | 8 +- .../account/auth-forms/auth-header.tsx | 6 +- .../account/auth-forms/common/header.tsx | 4 +- .../components/account/auth-forms/email.tsx | 12 +- .../auth-forms/forgot-password-popover.tsx | 8 +- .../account/auth-forms/forgot-password.tsx | 10 +- .../account/auth-forms/password.tsx | 36 +- .../account/auth-forms/reset-password.tsx | 22 +- .../account/auth-forms/set-password.tsx | 22 +- .../account/auth-forms/unique-code.tsx | 20 +- .../account/deactivate-account-modal.tsx | 12 +- .../account/terms-and-conditions.tsx | 6 +- .../analytics/analytics-section-wrapper.tsx | 4 +- .../analytics/analytics-wrapper.tsx | 2 +- .../core/components/analytics/empty-state.tsx | 6 +- .../components/analytics/insight-card.tsx | 4 +- .../analytics/insight-table/data-table.tsx | 12 +- .../analytics/insight-table/root.tsx | 2 +- .../overview/active-project-item.tsx | 6 +- .../analytics/overview/project-insights.tsx | 12 +- .../analytics/select/analytics-params.tsx | 9 +- .../core/components/analytics/trend-piece.tsx | 8 +- .../work-items/created-vs-resolved.tsx | 2 +- .../analytics/work-items/modal/header.tsx | 6 +- .../analytics/work-items/modal/index.tsx | 2 +- .../analytics/work-items/priority-chart.tsx | 4 +- .../work-items/workitems-insight-table.tsx | 8 +- .../core/components/api-token/empty-state.tsx | 6 +- .../core/components/api-token/modal/form.tsx | 22 +- .../modal/generated-token-details.tsx | 12 +- .../components/api-token/token-list-item.tsx | 12 +- .../components/archives/archive-tabs-list.tsx | 6 +- .../core/components/auth-screens/footer.tsx | 8 +- .../core/components/auth-screens/header.tsx | 8 +- .../auth-screens/not-authorized-view.tsx | 4 +- .../project/project-access-restriction.tsx | 6 +- .../auth-screens/workspace/not-a-member.tsx | 6 +- .../automation/auto-archive-automation.tsx | 18 +- .../automation/auto-close-automation.tsx | 20 +- .../automation/select-month-modal.tsx | 22 +- .../components/base-layouts/gantt/sidebar.tsx | 15 +- .../base-layouts/kanban/group-header.tsx | 4 +- .../components/base-layouts/kanban/group.tsx | 12 +- .../base-layouts/layout-switcher.tsx | 10 +- .../base-layouts/list/group-header.tsx | 4 +- .../components/base-layouts/list/group.tsx | 8 +- .../components/base-layouts/list/layout.tsx | 2 +- .../core/components/comments/card/display.tsx | 4 +- .../components/comments/card/edit-form.tsx | 8 +- .../components/comments/comment-create.tsx | 2 +- .../components/comments/quick-actions.tsx | 6 +- .../core/components/common/access-field.tsx | 11 +- .../common/activity/activity-block.tsx | 14 +- .../components/common/activity/helper.tsx | 108 +- .../core/components/common/activity/user.tsx | 4 +- .../common/applied-filters/date.tsx | 4 +- .../common/applied-filters/members.tsx | 4 +- .../components/common/breadcrumb-link.tsx | 2 +- .../web/core/components/common/count-chip.tsx | 2 +- .../core/components/common/empty-state.tsx | 4 +- .../components/common/filters/created-at.tsx | 2 +- .../components/common/filters/created-by.tsx | 4 +- .../common/latest-feature-block.tsx | 12 +- .../layout/sidebar/property-list-item.tsx | 25 + .../components/common/new-empty-state.tsx | 28 +- .../components/common/page-access-icon.tsx | 6 +- .../core/components/common/switcher-label.tsx | 4 +- apps/web/core/components/core/activity.tsx | 112 +- apps/web/core/components/core/app-header.tsx | 7 +- .../components/core/content-overflow-HOC.tsx | 4 +- .../description-versions/dropdown-item.tsx | 2 +- .../core/description-versions/dropdown.tsx | 6 +- .../core/description-versions/modal.tsx | 49 +- .../core/filters/date-filter-modal.tsx | 18 +- .../core/filters/date-filter-select.tsx | 2 +- .../components/core/image-picker-popover.tsx | 34 +- .../core/components/core/list/list-item.tsx | 5 +- .../modals/bulk-delete-issues-modal-item.tsx | 4 +- .../core/modals/bulk-delete-issues-modal.tsx | 26 +- .../core/modals/change-email-modal.tsx | 26 +- .../modals/existing-issues-list-modal.tsx | 47 +- .../core/modals/gpt-assistant-popover.tsx | 14 +- .../core/modals/user-image-upload-modal.tsx | 24 +- .../modals/workspace-image-upload-modal.tsx | 30 +- .../components/core/render-if-visible-HOC.tsx | 2 +- .../core/sidebar/progress-stats/assignee.tsx | 6 +- .../core/sidebar/progress-stats/label.tsx | 8 +- .../sidebar/progress-stats/state_group.tsx | 2 +- .../sidebar/sidebar-menu-hamburger-toggle.tsx | 4 +- .../core/sidebar/single-progress-stats.tsx | 6 +- .../core/theme/color-picker-input.tsx | 8 +- .../core/theme/custom-theme-selector.tsx | 32 +- .../components/core/theme/theme-switch.tsx | 2 +- .../cycles/active-cycle/cycle-stats.tsx | 50 +- .../cycles/active-cycle/productivity.tsx | 10 +- .../cycles/active-cycle/progress.tsx | 16 +- .../analytics-sidebar/issue-progress.tsx | 14 +- .../analytics-sidebar/progress-stats.tsx | 14 +- .../analytics-sidebar/sidebar-details.tsx | 30 +- .../analytics-sidebar/sidebar-header.tsx | 12 +- .../cycles/applied-filters/date.tsx | 4 +- .../cycles/applied-filters/root.tsx | 6 +- .../cycles/applied-filters/status.tsx | 5 +- .../cycles/archived-cycles/header.tsx | 10 +- .../cycles/archived-cycles/modal.tsx | 12 +- .../cycles/archived-cycles/root.tsx | 2 +- .../cycles/archived-cycles/view.tsx | 4 +- .../components/cycles/cycle-peek-overview.tsx | 2 +- .../components/cycles/cycles-view-header.tsx | 23 +- .../core/components/cycles/cycles-view.tsx | 4 +- .../core/components/cycles/delete-modal.tsx | 2 +- .../dropdowns/estimate-type-dropdown.tsx | 2 +- .../cycles/dropdowns/filters/end-date.tsx | 2 +- .../cycles/dropdowns/filters/root.tsx | 12 +- .../cycles/dropdowns/filters/start-date.tsx | 2 +- .../cycles/dropdowns/filters/status.tsx | 2 +- apps/web/core/components/cycles/form.tsx | 14 +- .../cycles/list/cycle-list-group-header.tsx | 8 +- .../cycles/list/cycle-list-item-action.tsx | 18 +- .../list/cycle-list-project-group-header.tsx | 6 +- .../cycles/list/cycles-list-item.tsx | 6 +- apps/web/core/components/cycles/list/root.tsx | 4 +- .../core/components/cycles/quick-actions.tsx | 6 +- .../cycles/transfer-issues-modal.tsx | 24 +- .../components/cycles/transfer-issues.tsx | 4 +- .../web/core/components/dropdowns/buttons.tsx | 17 +- .../dropdowns/cycle/cycle-options.tsx | 18 +- .../core/components/dropdowns/cycle/index.tsx | 9 +- .../core/components/dropdowns/date-range.tsx | 18 +- apps/web/core/components/dropdowns/date.tsx | 6 +- .../core/components/dropdowns/estimate.tsx | 26 +- .../dropdowns/intake-state/base.tsx | 18 +- apps/web/core/components/dropdowns/layout.tsx | 14 +- .../core/components/dropdowns/member/base.tsx | 4 +- .../dropdowns/member/member-options.tsx | 22 +- .../core/components/dropdowns/module/base.tsx | 9 +- .../dropdowns/module/button-content.tsx | 6 +- .../dropdowns/module/module-options.tsx | 20 +- .../core/components/dropdowns/priority.tsx | 90 +- .../components/dropdowns/project/base.tsx | 22 +- .../core/components/dropdowns/state/base.tsx | 18 +- .../editor/embeds/mentions/user.tsx | 19 +- .../components/editor/lite-text/editor.tsx | 2 +- .../editor/lite-text/lite-toolbar.tsx | 4 +- .../components/editor/lite-text/toolbar.tsx | 28 +- .../editor/sticky-editor/color-palette.tsx | 4 +- .../editor/sticky-editor/editor.tsx | 2 +- .../editor/sticky-editor/toolbar.tsx | 25 +- .../empty-state/comic-box-button.tsx | 39 +- .../empty-state/detailed-empty-state-root.tsx | 20 +- .../empty-state/section-empty-state-root.tsx | 8 +- .../empty-state/simple-empty-state-root.tsx | 6 +- .../components/estimates/create/modal.tsx | 12 +- .../components/estimates/create/stage-one.tsx | 22 +- .../components/estimates/delete/modal.tsx | 12 +- .../components/estimates/empty-screen.tsx | 2 +- .../estimates/estimate-list-item.tsx | 8 +- .../estimates/inputs/number-input.tsx | 2 +- .../estimates/inputs/text-input.tsx | 2 +- .../estimates/points/create-root.tsx | 4 +- .../components/estimates/points/create.tsx | 12 +- .../components/estimates/points/preview.tsx | 20 +- .../components/estimates/points/update.tsx | 12 +- .../components/estimates/radio-select.tsx | 10 +- apps/web/core/components/estimates/root.tsx | 14 +- apps/web/core/components/exporter/column.tsx | 14 +- .../core/components/exporter/export-form.tsx | 14 +- .../core/components/exporter/export-modal.tsx | 13 +- .../core/components/exporter/prev-exports.tsx | 74 +- .../components/exporter/single-export.tsx | 8 +- .../gantt-chart/blocks/block-row.tsx | 14 +- .../components/gantt-chart/blocks/block.tsx | 2 +- .../components/gantt-chart/chart/header.tsx | 18 +- .../gantt-chart/chart/main-content.tsx | 4 +- .../components/gantt-chart/chart/root.tsx | 6 +- .../gantt-chart/chart/views/month.tsx | 27 +- .../gantt-chart/chart/views/quarter.tsx | 22 +- .../gantt-chart/chart/views/week.tsx | 28 +- .../gantt-chart/helpers/add-block.tsx | 2 +- .../blockResizables/left-resizable.tsx | 6 +- .../blockResizables/right-resizable.tsx | 6 +- .../gantt-chart/helpers/draggable.tsx | 2 +- .../gantt-chart/sidebar/issues/block.tsx | 21 +- .../gantt-chart/sidebar/issues/sidebar.tsx | 2 +- .../gantt-chart/sidebar/modules/block.tsx | 13 +- .../components/gantt-chart/sidebar/root.tsx | 9 +- .../global/product-updates/footer.tsx | 12 +- .../components/global/timezone-select.tsx | 2 +- .../home/home-dashboard-widgets.tsx | 2 +- apps/web/core/components/home/root.tsx | 4 +- .../core/components/home/user-greetings.tsx | 4 +- .../home/widgets/empty-states/links.tsx | 2 +- .../home/widgets/empty-states/no-projects.tsx | 34 +- .../home/widgets/empty-states/recents.tsx | 2 +- .../home/widgets/empty-states/stickies.tsx | 2 +- .../components/home/widgets/links/action.tsx | 8 +- .../links/create-update-link-modal.tsx | 18 +- .../components/home/widgets/links/links.tsx | 2 +- .../components/home/widgets/links/root.tsx | 4 +- .../home/widgets/loaders/home-loader.tsx | 4 +- .../home/widgets/loaders/quick-links.tsx | 2 +- .../home/widgets/loaders/recent-activity.tsx | 2 +- .../components/home/widgets/manage/index.tsx | 2 +- .../manage/widget-item-drag-handle.tsx | 2 +- .../home/widgets/manage/widget-item.tsx | 6 +- .../home/widgets/recents/filters.tsx | 14 +- .../components/home/widgets/recents/index.tsx | 6 +- .../components/home/widgets/recents/issue.tsx | 12 +- .../components/home/widgets/recents/page.tsx | 12 +- .../home/widgets/recents/project.tsx | 8 +- .../components/icons/locked-component.tsx | 2 +- .../inbox/content/inbox-issue-header.tsx | 21 +- .../content/inbox-issue-mobile-header.tsx | 13 +- .../inbox/content/issue-properties.tsx | 32 +- .../core/components/inbox/content/root.tsx | 2 +- .../inbox-filter/applied-filters/date.tsx | 10 +- .../inbox-filter/applied-filters/label.tsx | 10 +- .../inbox-filter/applied-filters/member.tsx | 10 +- .../inbox-filter/applied-filters/priority.tsx | 10 +- .../inbox-filter/applied-filters/state.tsx | 10 +- .../inbox-filter/applied-filters/status.tsx | 8 +- .../inbox/inbox-filter/filters/date.tsx | 2 +- .../inbox-filter/filters/filter-selection.tsx | 12 +- .../inbox/inbox-filter/filters/labels.tsx | 4 +- .../inbox/inbox-filter/filters/members.tsx | 4 +- .../inbox/inbox-filter/filters/priority.tsx | 2 +- .../inbox/inbox-filter/filters/state.tsx | 4 +- .../inbox/inbox-filter/filters/status.tsx | 2 +- .../components/inbox/inbox-filter/root.tsx | 2 +- .../inbox/inbox-filter/sorting/order-by.tsx | 4 +- .../components/inbox/inbox-issue-status.tsx | 6 +- .../components/inbox/inbox-status-icon.tsx | 4 +- .../inbox/modals/create-modal/create-root.tsx | 16 +- .../modals/create-modal/issue-description.tsx | 2 +- .../modals/create-modal/issue-properties.tsx | 4 +- .../inbox/modals/create-modal/issue-title.tsx | 4 +- .../inbox/modals/decline-issue-modal.tsx | 2 +- .../inbox/modals/delete-issue-modal.tsx | 2 +- .../inbox/modals/select-duplicate.tsx | 27 +- .../inbox/modals/snooze-issue-modal.tsx | 6 +- apps/web/core/components/inbox/root.tsx | 10 +- .../inbox/sidebar/inbox-list-item.tsx | 16 +- .../core/components/inbox/sidebar/root.tsx | 10 +- .../components/instance/maintenance-view.tsx | 2 +- .../components/instance/not-ready-view.tsx | 8 +- .../integration/delete-import-modal.tsx | 22 +- .../integration/github/import-configure.tsx | 2 +- .../integration/github/import-confirm.tsx | 4 +- .../integration/github/import-data.tsx | 16 +- .../integration/github/import-users.tsx | 8 +- .../integration/github/repo-details.tsx | 16 +- .../components/integration/github/root.tsx | 12 +- .../integration/github/select-repository.tsx | 2 +- .../integration/github/single-user-select.tsx | 12 +- .../web/core/components/integration/guide.tsx | 20 +- .../integration/jira/confirm-import.tsx | 24 +- .../integration/jira/give-details.tsx | 28 +- .../integration/jira/import-users.tsx | 8 +- .../integration/jira/jira-project-detail.tsx | 28 +- .../core/components/integration/jira/root.tsx | 18 +- .../components/integration/single-import.tsx | 6 +- .../integration/single-integration-card.tsx | 8 +- .../components/issues/archive-issue-modal.tsx | 12 +- .../issues/attachment/attachment-detail.tsx | 8 +- .../attachment/attachment-item-list.tsx | 8 +- .../attachment/attachment-list-item.tsx | 10 +- .../attachment-list-upload-item.tsx | 8 +- .../attachment/attachment-upload-details.tsx | 8 +- .../issues/attachment/attachment-upload.tsx | 4 +- .../components/issues/attachment/root.tsx | 2 +- .../issues/bulk-operations/upgrade-banner.tsx | 6 +- .../issues/confirm-issue-discard.tsx | 14 +- .../create-issue-toast-action-items.tsx | 8 +- .../components/issues/delete-issue-modal.tsx | 2 +- apps/web/core/components/issues/filters.tsx | 7 +- .../attachments/title.tsx | 2 +- .../issue-detail-widgets/links/title.tsx | 2 +- .../relations/content.tsx | 2 +- .../issue-detail-widgets/relations/title.tsx | 2 +- .../issues/issue-detail-widgets/root.tsx | 2 +- .../sub-issues/content.tsx | 12 +- .../sub-issues/display-filters.tsx | 8 +- .../sub-issues/filters.tsx | 18 +- .../sub-issues/issues-list/list-group.tsx | 6 +- .../sub-issues/issues-list/list-item.tsx | 15 +- .../sub-issues/issues-list/properties.tsx | 3 +- .../sub-issues/issues-list/root.tsx | 2 +- .../issue-detail-widgets/sub-issues/title.tsx | 2 +- .../issue-detail-widgets/widget-button.tsx | 16 +- .../issues/issue-detail/cycle-select.tsx | 4 +- .../issues/issue-detail/identifier-text.tsx | 59 + .../issue-activity/activity-filter.tsx | 29 +- .../activity/actions/archived-at.tsx | 4 +- .../activity/actions/assignee.tsx | 4 +- .../activity/actions/attachment.tsx | 2 +- .../issue-activity/activity/actions/cycle.tsx | 8 +- .../activity/actions/default.tsx | 2 +- .../activity/actions/description.tsx | 2 +- .../activity/actions/estimate.tsx | 2 +- .../actions/helpers/activity-block.tsx | 10 +- .../activity/actions/helpers/issue-link.tsx | 4 +- .../activity/actions/helpers/issue-user.tsx | 4 +- .../issue-activity/activity/actions/inbox.tsx | 2 +- .../activity/actions/label-activity-chip.tsx | 4 +- .../issue-activity/activity/actions/label.tsx | 2 +- .../issue-activity/activity/actions/link.tsx | 8 +- .../activity/actions/module.tsx | 8 +- .../issue-activity/activity/actions/name.tsx | 2 +- .../activity/actions/parent.tsx | 6 +- .../activity/actions/priority.tsx | 4 +- .../activity/actions/relation.tsx | 4 +- .../activity/actions/start_date.tsx | 4 +- .../issue-activity/activity/actions/state.tsx | 4 +- .../activity/actions/target_date.tsx | 4 +- .../issue-detail/issue-activity/root.tsx | 4 +- .../issue-detail/issue-activity/sort-root.tsx | 27 +- .../issue-detail-quick-actions.tsx | 18 +- .../issue-detail/label/create-label.tsx | 16 +- .../issue-detail/label/label-list-item.tsx | 29 +- .../issues/issue-detail/label/root.tsx | 2 +- .../label/select/label-select.tsx | 35 +- .../links/create-update-link-modal.tsx | 16 +- .../issues/issue-detail/links/link-detail.tsx | 18 +- .../issues/issue-detail/links/link-item.tsx | 18 +- .../issues/issue-detail/links/link-list.tsx | 2 +- .../issues/issue-detail/links/root.tsx | 4 +- .../issues/issue-detail/main-content.tsx | 2 +- .../issues/issue-detail/module-select.tsx | 4 +- .../issues/issue-detail/parent-select.tsx | 17 +- .../issues/issue-detail/parent/root.tsx | 11 +- .../issue-detail/parent/sibling-item.tsx | 2 +- .../issues/issue-detail/parent/siblings.tsx | 4 +- .../issues/issue-detail/relation-select.tsx | 16 +- .../components/issues/issue-detail/root.tsx | 4 +- .../issues/issue-detail/sidebar.tsx | 173 +-- .../issues/issue-detail/subscription.tsx | 6 +- .../calendar/base-calendar-root.tsx | 2 +- .../issue-layouts/calendar/calendar.tsx | 6 +- .../issue-layouts/calendar/day-tile.tsx | 22 +- .../calendar/dropdowns/months-dropdown.tsx | 8 +- .../calendar/dropdowns/options-dropdown.tsx | 12 +- .../issues/issue-layouts/calendar/header.tsx | 2 +- .../issue-layouts/calendar/issue-block.tsx | 23 +- .../issue-layouts/calendar/issue-blocks.tsx | 6 +- .../calendar/quick-add-issue-actions.tsx | 6 +- .../issue-layouts/calendar/week-days.tsx | 2 +- .../issue-layouts/calendar/week-header.tsx | 9 +- .../empty-states/archived-issues.tsx | 2 +- .../issue-layouts/empty-states/cycle.tsx | 4 +- .../issue-layouts/empty-states/module.tsx | 4 +- .../empty-states/project-issues.tsx | 2 +- .../filters/applied-filters/cycle.tsx | 4 +- .../filters/applied-filters/date.tsx | 4 +- .../filters/applied-filters/label.tsx | 4 +- .../filters/applied-filters/members.tsx | 4 +- .../filters/applied-filters/module.tsx | 4 +- .../filters/applied-filters/priority.tsx | 4 +- .../filters/applied-filters/project.tsx | 4 +- .../filters/applied-filters/state-group.tsx | 4 +- .../filters/applied-filters/state.tsx | 4 +- .../display-filters-selection.tsx | 2 +- .../display-filters/display-properties.tsx | 6 +- .../filters/header/filters/assignee.tsx | 4 +- .../filters/header/filters/created-by.tsx | 4 +- .../filters/header/filters/cycle.tsx | 4 +- .../filters/header/filters/due-date.tsx | 2 +- .../filters/header/filters/labels.tsx | 4 +- .../filters/header/filters/mentions.tsx | 4 +- .../filters/header/filters/module.tsx | 4 +- .../filters/header/filters/priority.tsx | 2 +- .../filters/header/filters/project.tsx | 4 +- .../filters/header/filters/start-date.tsx | 2 +- .../filters/header/filters/state-group.tsx | 4 +- .../filters/header/filters/state.tsx | 4 +- .../filters/header/helpers/dropdown.tsx | 145 +- .../filters/header/helpers/filter-header.tsx | 15 +- .../filters/header/helpers/filter-option.tsx | 14 +- .../filters/header/layout-selection.tsx | 24 +- .../header/mobile-layout-selection.tsx | 10 +- .../issues/issue-layouts/gantt/blocks.tsx | 15 +- .../issue-layouts/group-drag-overlay.tsx | 8 +- .../issue-layouts/kanban/base-kanban-root.tsx | 6 +- .../issues/issue-layouts/kanban/block.tsx | 21 +- .../issues/issue-layouts/kanban/default.tsx | 2 +- .../kanban/headers/group-by-card.tsx | 22 +- .../kanban/headers/sub-group-by-card.tsx | 12 +- .../issue-layouts/kanban/kanban-group.tsx | 6 +- .../issues/issue-layouts/kanban/swimlanes.tsx | 4 +- .../issue-layouts/list/base-list-root.tsx | 2 +- .../issues/issue-layouts/list/block-root.tsx | 2 +- .../issues/issue-layouts/list/block.tsx | 23 +- .../list/headers/group-by-card.tsx | 8 +- .../issues/issue-layouts/list/list-group.tsx | 8 +- .../properties/all-properties.tsx | 23 +- .../properties/label-dropdown.tsx | 51 +- .../issue-layouts/properties/labels.tsx | 18 +- .../quick-action-dropdowns/all-issue.tsx | 18 +- .../quick-action-dropdowns/archived-issue.tsx | 6 +- .../quick-action-dropdowns/cycle-issue.tsx | 18 +- .../quick-action-dropdowns/issue-detail.tsx | 23 +- .../quick-action-dropdowns/module-issue.tsx | 18 +- .../quick-action-dropdowns/project-issue.tsx | 18 +- .../issue-layouts/quick-add/button/gantt.tsx | 4 +- .../issue-layouts/quick-add/button/kanban.tsx | 4 +- .../issue-layouts/quick-add/button/list.tsx | 4 +- .../quick-add/button/spreadsheet.tsx | 4 +- .../issue-layouts/quick-add/form/calendar.tsx | 6 +- .../issue-layouts/quick-add/form/gantt.tsx | 8 +- .../issue-layouts/quick-add/form/kanban.tsx | 10 +- .../issue-layouts/quick-add/form/list.tsx | 8 +- .../quick-add/form/spreadsheet.tsx | 8 +- .../issues/issue-layouts/quick-add/root.tsx | 8 +- .../roots/all-issue-layout-root.tsx | 4 +- .../roots/project-layout-root.tsx | 4 +- .../spreadsheet/columns/assignee-column.tsx | 4 +- .../spreadsheet/columns/attachment-column.tsx | 2 +- .../spreadsheet/columns/created-on-column.tsx | 2 +- .../spreadsheet/columns/cycle-column.tsx | 4 +- .../spreadsheet/columns/due-date-column.tsx | 6 +- .../spreadsheet/columns/estimate-column.tsx | 4 +- .../spreadsheet/columns/header-column.tsx | 14 +- .../spreadsheet/columns/label-column.tsx | 4 +- .../spreadsheet/columns/link-column.tsx | 2 +- .../spreadsheet/columns/module-column.tsx | 4 +- .../spreadsheet/columns/priority-column.tsx | 4 +- .../spreadsheet/columns/start-date-column.tsx | 4 +- .../spreadsheet/columns/state-column.tsx | 4 +- .../spreadsheet/columns/sub-issue-column.tsx | 2 +- .../spreadsheet/columns/updated-on-column.tsx | 2 +- .../spreadsheet/issue-column.tsx | 2 +- .../issue-layouts/spreadsheet/issue-row.tsx | 27 +- .../spreadsheet/spreadsheet-header-column.tsx | 2 +- .../spreadsheet/spreadsheet-header.tsx | 6 +- .../spreadsheet/spreadsheet-table.tsx | 2 +- .../spreadsheet/spreadsheet-view.tsx | 6 +- .../components/default-properties.tsx | 8 +- .../components/description-editor.tsx | 8 +- .../issue-modal/components/parent-tag.tsx | 6 +- .../issue-modal/components/title-input.tsx | 4 +- .../components/issues/issue-modal/form.tsx | 22 +- .../components/issues/issue-update-status.tsx | 2 +- apps/web/core/components/issues/label.tsx | 10 +- .../issues/parent-issues-list-modal.tsx | 25 +- .../components/issues/peek-overview/error.tsx | 2 +- .../issues/peek-overview/header.tsx | 21 +- .../issues/peek-overview/loader.tsx | 2 +- .../issues/peek-overview/properties.tsx | 176 +-- .../components/issues/peek-overview/root.tsx | 2 + .../components/issues/peek-overview/view.tsx | 8 +- .../components/issues/preview-card/date.tsx | 2 +- .../components/issues/preview-card/root.tsx | 12 +- .../issues/relations/issue-list-item.tsx | 11 +- .../core/components/issues/select/base.tsx | 45 +- .../core/components/issues/title-input.tsx | 8 +- .../workspace-draft/draft-issue-block.tsx | 14 +- .../draft-issue-properties.tsx | 2 +- .../issues/workspace-draft/quick-action.tsx | 6 +- .../issues/workspace-draft/root.tsx | 11 +- .../labels/create-update-label-inline.tsx | 11 +- .../components/labels/delete-label-modal.tsx | 4 +- .../labels/label-block/label-item-block.tsx | 4 +- .../labels/label-block/label-name.tsx | 2 +- .../labels/label-drag-n-drop-HOC.tsx | 2 +- .../labels/project-setting-label-group.tsx | 12 +- .../labels/project-setting-label-item.tsx | 8 +- .../labels/project-setting-label-list.tsx | 2 +- .../modal/card/base-paid-plan-card.tsx | 25 +- .../license/modal/card/checkout-button.tsx | 47 +- .../license/modal/card/free-plan.tsx | 14 +- .../license/modal/card/plan-upgrade.tsx | 6 +- .../license/modal/card/talk-to-sales.tsx | 86 +- .../analytics-sidebar/issue-progress.tsx | 14 +- .../analytics-sidebar/progress-stats.tsx | 14 +- .../modules/analytics-sidebar/root.tsx | 55 +- .../modules/applied-filters/date.tsx | 4 +- .../modules/applied-filters/members.tsx | 4 +- .../modules/applied-filters/root.tsx | 12 +- .../modules/applied-filters/status.tsx | 4 +- .../modules/archived-modules/header.tsx | 10 +- .../modules/archived-modules/modal.tsx | 18 +- .../modules/archived-modules/root.tsx | 2 +- .../modules/archived-modules/view.tsx | 4 +- .../modules/delete-module-modal.tsx | 4 +- .../modules/dropdowns/filters/lead.tsx | 4 +- .../modules/dropdowns/filters/members.tsx | 4 +- .../modules/dropdowns/filters/root.tsx | 12 +- .../modules/dropdowns/filters/start-date.tsx | 2 +- .../modules/dropdowns/filters/status.tsx | 2 +- .../modules/dropdowns/filters/target-date.tsx | 2 +- .../components/modules/dropdowns/order-by.tsx | 6 +- apps/web/core/components/modules/form.tsx | 14 +- .../components/modules/gantt-chart/blocks.tsx | 8 +- .../modules/links/create-update-modal.tsx | 14 +- .../components/modules/links/list-item.tsx | 27 +- .../components/modules/module-card-item.tsx | 14 +- .../components/modules/module-layout-icon.tsx | 4 +- .../modules/module-list-item-action.tsx | 4 +- .../components/modules/module-list-item.tsx | 10 +- .../modules/module-peek-overview.tsx | 2 +- .../modules/module-status-dropdown.tsx | 2 +- .../components/modules/module-view-header.tsx | 27 +- .../core/components/modules/quick-actions.tsx | 6 +- .../core/components/modules/select/status.tsx | 6 +- .../modules/sidebar-select/select-status.tsx | 4 +- .../components/navigation/app-rail-root.tsx | 15 +- .../customize-navigation-dialog.tsx | 64 +- .../navigation/project-actions-menu.tsx | 4 +- .../navigation/project-header-button.tsx | 10 +- .../components/navigation/project-header.tsx | 13 +- .../tab-navigation-overflow-menu.tsx | 10 +- .../navigation/tab-navigation-root.tsx | 2 +- .../tab-navigation-visible-item.tsx | 11 +- .../components/navigation/top-nav-power-k.tsx | 14 +- .../onboarding/create-or-join-workspaces.tsx | 2 +- .../onboarding/create-workspace.tsx | 50 +- .../web/core/components/onboarding/header.tsx | 8 +- .../components/onboarding/invitations.tsx | 24 +- .../components/onboarding/invite-members.tsx | 44 +- .../components/onboarding/profile-setup.tsx | 48 +- .../components/onboarding/step-indicator.tsx | 4 +- .../onboarding/steps/common/header.tsx | 4 +- .../onboarding/steps/profile/consent.tsx | 8 +- .../onboarding/steps/profile/root.tsx | 16 +- .../onboarding/steps/profile/set-password.tsx | 18 +- .../components/onboarding/steps/role/root.tsx | 18 +- .../components/onboarding/steps/team/root.tsx | 40 +- .../onboarding/steps/usecase/root.tsx | 22 +- .../onboarding/steps/workspace/create.tsx | 46 +- .../steps/workspace/join-invites.tsx | 12 +- .../onboarding/switch-account-dropdown.tsx | 12 +- .../onboarding/switch-account-modal.tsx | 16 +- .../components/pages/editor/editor-body.tsx | 2 +- .../pages/editor/header/logo-picker.tsx | 4 +- .../components/pages/editor/header/root.tsx | 4 +- .../pages/editor/summary/content-browser.tsx | 2 +- .../editor/summary/heading-components.tsx | 8 +- .../core/components/pages/editor/title.tsx | 4 +- .../pages/editor/toolbar/color-dropdown.tsx | 139 +- .../components/pages/editor/toolbar/root.tsx | 6 +- .../pages/editor/toolbar/toolbar.tsx | 77 +- .../pages/header/archived-badge.tsx | 4 +- .../pages/header/copy-link-control.tsx | 53 +- .../pages/header/favorite-control.tsx | 13 +- .../components/pages/header/offline-badge.tsx | 4 +- .../components/pages/header/syncing-badge.tsx | 33 +- .../pages/list/applied-filters/root.tsx | 6 +- .../pages/list/block-item-action.tsx | 6 +- apps/web/core/components/pages/list/block.tsx | 2 +- .../components/pages/list/filters/root.tsx | 24 +- .../core/components/pages/list/order-by.tsx | 11 +- .../components/pages/list/search-input.tsx | 29 +- .../components/pages/list/tab-navigation.tsx | 15 +- .../pages/loaders/page-content-loader.tsx | 2 +- .../components/pages/loaders/page-loader.tsx | 4 +- .../pages/modals/delete-page-modal.tsx | 3 +- .../pages/modals/export-page-modal.tsx | 14 +- .../components/pages/modals/page-form.tsx | 18 +- .../components/pages/navigation-pane/root.tsx | 6 +- .../navigation-pane/tab-panels/assets.tsx | 12 +- .../tab-panels/info/actors-info.tsx | 14 +- .../tab-panels/info/document-info.tsx | 6 +- .../navigation-pane/tab-panels/info/root.tsx | 2 +- .../tab-panels/info/version-history.tsx | 30 +- .../pages/navigation-pane/tabs-list.tsx | 6 +- .../pages/navigation-pane/types/extensions.ts | 6 +- .../components/pages/version/main-content.tsx | 22 +- .../core/components/pages/version/root.tsx | 2 +- .../components/power-k/menus/empty-state.tsx | 2 +- .../ui/modal/command-item-shortcut-badge.tsx | 6 +- .../power-k/ui/modal/command-item.tsx | 4 +- .../power-k/ui/modal/context-indicator.tsx | 10 +- .../components/power-k/ui/modal/footer.tsx | 4 +- .../components/power-k/ui/modal/header.tsx | 8 +- .../power-k/ui/modal/search-menu.tsx | 4 +- .../power-k/ui/modal/search-results-map.tsx | 10 +- .../power-k/ui/modal/shortcuts-root.tsx | 17 +- .../components/power-k/ui/modal/wrapper.tsx | 4 +- .../ui/pages/work-item-selection-page.tsx | 6 +- .../power-k/ui/renderer/shortcut.tsx | 6 +- .../core/components/preferences/section.tsx | 4 +- .../profile/activity/activity-list.tsx | 24 +- .../activity/profile-activity-list.tsx | 26 +- apps/web/core/components/profile/form.tsx | 40 +- .../notification/email-notification-form.tsx | 22 +- .../components/profile/overview/activity.tsx | 16 +- .../overview/priority-distribution.tsx | 2 +- .../profile/overview/state-distribution.tsx | 6 +- .../components/profile/overview/stats.tsx | 8 +- .../components/profile/overview/workload.tsx | 8 +- .../profile/preferences/language-timezone.tsx | 10 +- .../profile-setting-content-header.tsx | 6 +- .../profile-setting-content-wrapper.tsx | 2 +- apps/web/core/components/profile/sidebar.tsx | 42 +- apps/web/core/components/profile/time.tsx | 2 +- .../project-states/create-update/form.tsx | 10 +- .../components/project-states/group-item.tsx | 17 +- .../project-states/options/delete.tsx | 13 +- .../options/mark-as-default.tsx | 4 +- .../project-states/state-delete-modal.tsx | 4 +- .../project-states/state-item-title.tsx | 12 +- .../components/project-states/state-item.tsx | 2 +- .../project/applied-filters/access.tsx | 4 +- .../project/applied-filters/date.tsx | 4 +- .../project/applied-filters/members.tsx | 4 +- .../project-display-filters.tsx | 4 +- .../project/applied-filters/root.tsx | 8 +- apps/web/core/components/project/card.tsx | 38 +- .../project/confirm-project-member-remove.tsx | 20 +- .../project/create/common-attributes.tsx | 12 +- .../core/components/project/create/header.tsx | 6 +- .../project/create/project-create-buttons.tsx | 6 +- .../project/delete-project-modal.tsx | 27 +- .../project/dropdowns/filters/access.tsx | 2 +- .../project/dropdowns/filters/created-at.tsx | 2 +- .../project/dropdowns/filters/lead.tsx | 4 +- .../project/dropdowns/filters/member-list.tsx | 4 +- .../project/dropdowns/filters/members.tsx | 4 +- .../project/dropdowns/filters/root.tsx | 12 +- .../components/project/dropdowns/order-by.tsx | 19 +- .../core/components/project/empty-state.tsx | 6 +- .../core/components/project/form-loader.tsx | 10 +- apps/web/core/components/project/form.tsx | 41 +- apps/web/core/components/project/header.tsx | 5 +- .../components/project/integration-card.tsx | 6 +- .../components/project/join-project-modal.tsx | 10 +- .../project/leave-project-modal.tsx | 30 +- .../project/member-header-column.tsx | 10 +- .../components/project/member-list-item.tsx | 6 +- .../core/components/project/member-list.tsx | 13 +- .../core/components/project/member-select.tsx | 10 +- .../components/project/multi-select-modal.tsx | 30 +- .../project/project-feature-update.tsx | 8 +- .../project-settings-member-defaults.tsx | 4 +- .../project/publish-project/modal.tsx | 42 +- .../components/project/search-projects.tsx | 19 +- .../project/send-project-invitation-modal.tsx | 28 +- .../archive-project/archive-restore-modal.tsx | 13 +- .../settings/archive-project/selection.tsx | 8 +- .../settings/delete-project-section.tsx | 11 +- .../project/settings/features-list.tsx | 15 +- .../components/project/settings/helper.tsx | 4 +- .../project/settings/member-columns.tsx | 6 +- apps/web/core/components/readonly/cycle.tsx | 2 +- apps/web/core/components/readonly/date.tsx | 6 +- .../web/core/components/readonly/estimate.tsx | 2 +- apps/web/core/components/readonly/labels.tsx | 6 +- apps/web/core/components/readonly/member.tsx | 12 +- apps/web/core/components/readonly/module.tsx | 6 +- .../web/core/components/readonly/priority.tsx | 2 +- apps/web/core/components/readonly/state.tsx | 4 +- .../rich-filters/add-filters/button.tsx | 13 +- .../rich-filters/add-filters/dropdown.tsx | 6 +- .../rich-filters/filter-item/close-button.tsx | 2 +- .../rich-filters/filter-item/container.tsx | 6 +- .../rich-filters/filter-item/property.tsx | 2 +- .../rich-filters/filter-item/root.tsx | 4 +- .../filter-value-input/date/range.tsx | 2 +- .../filter-value-input/date/single.tsx | 4 +- .../select/selected-options-display.tsx | 10 +- .../filter-value-input/select/shared.tsx | 4 +- .../components/rich-filters/filters-row.tsx | 22 +- .../rich-filters/filters-toggle.tsx | 20 +- .../core/components/rich-filters/shared.ts | 2 +- apps/web/core/components/settings/header.tsx | 33 +- apps/web/core/components/settings/heading.tsx | 8 +- .../core/components/settings/mobile/nav.tsx | 10 +- .../project/sidebar/nav-item-children.tsx | 9 +- .../settings/project/sidebar/root.tsx | 2 +- .../components/settings/sidebar/header.tsx | 6 +- .../components/settings/sidebar/nav-item.tsx | 20 +- .../core/components/settings/sidebar/root.tsx | 6 +- apps/web/core/components/settings/tabs.tsx | 10 +- .../core/components/sidebar/add-button.tsx | 4 +- .../components/sidebar/resizable-sidebar.tsx | 18 +- .../core/components/sidebar/search-button.tsx | 8 +- .../core/components/sidebar/sidebar-item.tsx | 14 +- .../components/sidebar/sidebar-navigation.tsx | 7 +- .../sidebar/sidebar-toggle-button.tsx | 2 +- .../components/sidebar/sidebar-wrapper.tsx | 6 +- .../core/components/stickies/action-bar.tsx | 18 +- .../stickies/layout/stickies-infinite.tsx | 2 +- .../stickies/layout/stickies-loader.tsx | 2 +- .../stickies/layout/stickies-truncated.tsx | 2 +- .../core/components/stickies/modal/search.tsx | 22 +- .../components/stickies/modal/stickies.tsx | 12 +- .../components/stickies/sticky/inputs.tsx | 2 +- .../core/components/stickies/sticky/root.tsx | 2 +- .../sticky/sticky-item-drag-handle.tsx | 2 +- apps/web/core/components/stickies/widget.tsx | 6 +- apps/web/core/components/ui/empty-space.tsx | 25 +- .../integration-and-import-export-banner.tsx | 8 +- apps/web/core/components/ui/labels-list.tsx | 4 +- .../ui/loader/cycle-module-board-loader.tsx | 22 +- .../ui/loader/cycle-module-list-loader.tsx | 14 +- .../loader/layouts/calendar-layout-loader.tsx | 14 +- .../ui/loader/layouts/gantt-layout-loader.tsx | 30 +- .../loader/layouts/kanban-layout-loader.tsx | 6 +- .../ui/loader/layouts/list-layout-loader.tsx | 26 +- .../loader/layouts/members-layout-loader.tsx | 4 +- .../project-inbox/inbox-layout-loader.tsx | 2 +- .../project-inbox/inbox-sidebar-loader.tsx | 14 +- .../layouts/spreadsheet-layout-loader.tsx | 21 +- .../ui/loader/notification-loader.tsx | 10 +- .../components/ui/loader/pages-loader.tsx | 18 +- .../components/ui/loader/projects-loader.tsx | 25 +- .../ui/loader/settings/activity.tsx | 6 +- .../ui/loader/settings/api-token.tsx | 14 +- .../components/ui/loader/settings/email.tsx | 16 +- .../ui/loader/settings/import-and-export.tsx | 10 +- .../ui/loader/settings/integration.tsx | 15 +- .../components/ui/loader/settings/members.tsx | 12 +- .../ui/loader/settings/web-hook.tsx | 12 +- .../components/ui/loader/view-list-loader.tsx | 12 +- .../components/ui/markdown-to-component.tsx | 10 +- .../components/ui/profile-empty-state.tsx | 6 +- .../core/components/user/user-greetings.tsx | 4 +- .../views/applied-filters/access.tsx | 4 +- .../components/views/applied-filters/root.tsx | 6 +- .../views/filters/filter-selection.tsx | 12 +- .../components/views/filters/order-by.tsx | 15 +- apps/web/core/components/views/form.tsx | 20 +- .../core/components/views/quick-actions.tsx | 6 +- .../components/views/view-list-header.tsx | 19 +- .../views/view-list-item-action.tsx | 4 +- .../core/components/views/view-list-item.tsx | 2 +- apps/web/core/components/views/views-list.tsx | 2 +- .../core/components/web-hooks/empty-state.tsx | 8 +- .../web-hooks/form/delete-section.tsx | 9 +- .../components/web-hooks/form/event-types.tsx | 4 +- .../core/components/web-hooks/form/form.tsx | 11 +- .../form/individual-event-options.tsx | 4 +- .../core/components/web-hooks/form/input.tsx | 2 +- .../components/web-hooks/form/secret-key.tsx | 23 +- .../core/components/web-hooks/form/toggle.tsx | 2 +- .../web-hooks/generated-hook-details.tsx | 8 +- .../web-hooks/webhooks-list-item.tsx | 4 +- .../sidebar/filters/applied-filter.tsx | 4 +- .../sidebar/filters/menu/menu-option-item.tsx | 15 +- .../sidebar/filters/menu/root.tsx | 2 +- .../header/options/menu-option/menu-item.tsx | 11 +- .../header/options/menu-option/root.tsx | 4 +- .../sidebar/header/options/root.tsx | 6 +- .../sidebar/header/root.tsx | 4 +- .../sidebar/loader.tsx | 10 +- .../sidebar/notification-card/content.tsx | 8 +- .../sidebar/notification-card/item.tsx | 22 +- .../notification-card/options/archive.tsx | 4 +- .../notification-card/options/button.tsx | 2 +- .../notification-card/options/read.tsx | 2 +- .../notification-card/options/root.tsx | 6 +- .../options/snooze/modal.tsx | 50 +- .../notification-card/options/snooze/root.tsx | 12 +- .../workspace-notifications/sidebar/root.tsx | 15 +- .../ConfirmWorkspaceMemberRemove.tsx | 14 +- .../workspace/billing/comparison/base.tsx | 31 +- .../billing/comparison/feature-detail.tsx | 7 +- .../confirm-workspace-member-remove.tsx | 18 +- .../workspace/create-workspace-form.tsx | 30 +- .../workspace/delete-workspace-form.tsx | 28 +- .../workspace/invite-modal/actions.tsx | 6 +- .../workspace/invite-modal/fields.tsx | 23 +- .../workspace/invite-modal/form.tsx | 4 +- apps/web/core/components/workspace/logo.tsx | 2 +- .../settings/invitations-list-item.tsx | 26 +- .../workspace/settings/member-columns.tsx | 12 +- .../workspace/settings/members-list-item.tsx | 8 +- .../workspace/settings/members-list.tsx | 10 +- .../workspace/settings/workspace-details.tsx | 29 +- .../workspace/sidebar/dropdown-item.tsx | 28 +- .../sidebar/favorites/favorite-folder.tsx | 33 +- .../common/favorite-item-drag-handle.tsx | 2 +- .../common/favorite-item-quick-action.tsx | 5 +- .../common/favorite-item-title.tsx | 2 +- .../common/favorite-item-wrapper.tsx | 4 +- .../sidebar/favorites/favorite-items/root.tsx | 4 +- .../sidebar/favorites/favorites-menu.tsx | 14 +- .../workspace/sidebar/help-section/root.tsx | 34 +- .../workspace/sidebar/project-navigation.tsx | 2 +- .../workspace/sidebar/projects-list-item.tsx | 33 +- .../workspace/sidebar/projects-list.tsx | 16 +- .../workspace/sidebar/quick-actions.tsx | 2 +- .../workspace/sidebar/sidebar-item.tsx | 2 +- .../workspace/sidebar/sidebar-menu-items.tsx | 10 +- .../workspace/sidebar/user-menu-item.tsx | 2 +- .../workspace/sidebar/user-menu-root.tsx | 14 +- .../sidebar/workspace-menu-header.tsx | 12 +- .../workspace/sidebar/workspace-menu-item.tsx | 2 +- .../workspace/sidebar/workspace-menu-root.tsx | 28 +- .../views/default-view-list-item.tsx | 6 +- .../views/default-view-quick-action.tsx | 8 +- .../core/components/workspace/views/form.tsx | 16 +- .../components/workspace/views/header.tsx | 6 +- .../workspace/views/quick-action.tsx | 8 +- .../workspace/views/view-list-item.tsx | 8 +- apps/web/core/constants/plans.tsx | 10 +- apps/web/core/hooks/use-debounce.tsx | 2 +- apps/web/core/hooks/use-timezone.tsx | 4 +- .../layouts/auth-layout/workspace-wrapper.tsx | 38 +- .../web/core/layouts/default-layout/index.tsx | 4 +- apps/web/package.json | 2 +- apps/web/postcss.config.cjs | 1 - apps/web/postcss.config.js | 3 + apps/web/styles/emoji.css | 88 +- apps/web/styles/globals.css | 937 ++----------- apps/web/styles/power-k.css | 60 +- apps/web/tailwind.config.cjs | 5 - packages/constants/src/chart.ts | 4 +- packages/constants/src/cycle.ts | 4 +- packages/constants/src/graph.ts | 8 +- packages/constants/src/issue/filter.ts | 10 +- packages/constants/src/module.ts | 8 +- packages/editor/postcss.config.js | 10 +- .../core/components/links/link-edit-view.tsx | 12 +- .../core/components/links/link-preview.tsx | 8 +- .../src/core/components/menus/block-menu.tsx | 4 +- .../menus/bubble-menu/alignment-selector.tsx | 4 +- .../menus/bubble-menu/color-selector.tsx | 27 +- .../menus/bubble-menu/link-selector.tsx | 18 +- .../menus/bubble-menu/node-selector.tsx | 12 +- .../components/menus/bubble-menu/root.tsx | 6 +- .../src/core/extensions/callout/block.tsx | 4 +- .../extensions/callout/color-selector.tsx | 12 +- .../core/extensions/callout/logo-selector.tsx | 4 +- .../src/core/extensions/code-inline/index.tsx | 2 +- .../extensions/code/code-block-node-view.tsx | 6 +- .../custom-image/components/block.tsx | 11 +- .../components/toolbar/alignment.tsx | 6 +- .../components/toolbar/download.tsx | 2 +- .../components/toolbar/full-screen/modal.tsx | 12 +- .../components/toolbar/full-screen/root.tsx | 2 +- .../custom-image/components/toolbar/root.tsx | 2 +- .../custom-image/components/upload-status.tsx | 2 +- .../custom-image/components/uploader.tsx | 37 +- .../core/extensions/custom-link/extension.tsx | 2 +- .../emoji/components/emojis-list.tsx | 10 +- .../src/core/extensions/horizontal-rule.ts | 2 +- .../mentions/mentions-list-dropdown.tsx | 14 +- .../slash-commands/command-items-list.tsx | 11 +- .../slash-commands/command-menu-item.tsx | 8 +- .../slash-commands/command-menu.tsx | 4 +- .../editor/src/core/extensions/starter-kit.ts | 6 +- .../plugins/drag-handles/color-selector.tsx | 14 +- .../drag-handles/column/drag-handle.tsx | 15 +- .../plugins/drag-handles/column/dropdown.tsx | 6 +- .../plugins/drag-handles/row/drag-handle.tsx | 15 +- .../plugins/drag-handles/row/dropdown.tsx | 6 +- .../table/plugins/drag-handles/utils.ts | 2 +- packages/editor/src/core/helpers/common.ts | 4 +- packages/editor/src/core/plugins/ai-handle.ts | 2 +- .../editor/src/core/plugins/drag-handle.ts | 6 +- packages/editor/src/styles/editor.css | 22 +- packages/editor/src/styles/table.css | 47 +- packages/editor/src/styles/tailwind.css | 3 - packages/editor/src/styles/variables.css | 2 +- packages/editor/tailwind.config.js | 6 - packages/i18n/src/locales/en/translations.ts | 3 +- packages/propel/.storybook/preview.ts | 3 +- packages/propel/.storybook/tailwind.css | 2 + packages/propel/package.json | 7 +- packages/propel/postcss.config.js | 4 +- .../src/accordion/accordion.stories.tsx | 4 +- packages/propel/src/accordion/accordion.tsx | 2 +- .../animated-counter.stories.tsx | 81 +- .../src/animated-counter/animated-counter.tsx | 35 +- packages/propel/src/avatar/avatar.tsx | 12 +- packages/propel/src/badge/badge.stories.tsx | 148 ++ packages/propel/src/badge/badge.tsx | 22 + packages/propel/src/badge/helper.tsx | 46 + packages/propel/src/badge/index.ts | 3 + packages/propel/src/banner/banner.stories.tsx | 2 +- packages/propel/src/banner/helper.tsx | 8 +- packages/propel/src/button/button.stories.tsx | 102 +- packages/propel/src/button/button.tsx | 32 +- packages/propel/src/button/helper.tsx | 170 +-- packages/propel/src/button/index.ts | 4 +- packages/propel/src/calendar/root.tsx | 2 +- packages/propel/src/card/card.stories.tsx | 68 +- packages/propel/src/card/helper.tsx | 3 +- .../propel/src/charts/area-chart/root.tsx | 4 +- packages/propel/src/charts/bar-chart/bar.tsx | 4 +- packages/propel/src/charts/bar-chart/root.tsx | 2 +- .../propel/src/charts/components/legend.tsx | 4 +- .../propel/src/charts/components/tick.tsx | 2 +- .../propel/src/charts/components/tooltip.tsx | 12 +- .../propel/src/charts/line-chart/root.tsx | 4 +- packages/propel/src/charts/pie-chart/root.tsx | 2 +- .../propel/src/charts/pie-chart/tooltip.tsx | 12 +- .../propel/src/charts/radar-chart/root.tsx | 4 +- .../propel/src/charts/scatter-chart/root.tsx | 4 +- .../src/charts/tree-map/map-content.tsx | 12 +- packages/propel/src/charts/tree-map/root.tsx | 2 +- .../propel/src/charts/tree-map/tooltip.tsx | 6 +- .../src/collapsible/collapsible.stories.tsx | 31 +- .../propel/src/collapsible/collapsible.tsx | 2 +- .../propel/src/combobox/combobox.stories.tsx | 2 +- packages/propel/src/combobox/combobox.tsx | 10 +- .../propel/src/command/command.stories.tsx | 76 +- packages/propel/src/command/command.tsx | 4 +- .../src/context-menu/context-menu.stories.tsx | 38 +- .../propel/src/context-menu/context-menu.tsx | 16 +- .../design-system-philosophy.stories.tsx | 428 ++++++ packages/propel/src/dialog/dialog.stories.tsx | 91 +- packages/propel/src/dialog/root.tsx | 6 +- .../emoji-picker.stories.tsx | 50 +- .../src/emoji-icon-picker/emoji-picker.tsx | 11 +- .../src/emoji-icon-picker/emoji/emoji.tsx | 10 +- .../src/emoji-icon-picker/icon/icon-root.tsx | 29 +- .../emoji-icon-picker/icon/lucide-root.tsx | 2 +- .../emoji-icon-picker/icon/material-root.tsx | 10 +- .../propel/src/emoji-icon-picker/logo.tsx | 4 +- .../emoji-reaction-picker.stories.tsx | 50 +- .../emoji-reaction/emoji-reaction-picker.tsx | 5 +- .../emoji-reaction/emoji-reaction.stories.tsx | 10 +- .../src/emoji-reaction/emoji-reaction.tsx | 18 +- .../empty-state/assets-showcase.stories.tsx | 60 +- .../propel/src/empty-state/assets/helper.tsx | 12 +- .../assets/horizontal-stack/customer.tsx | 28 +- .../assets/horizontal-stack/epic.tsx | 28 +- .../assets/horizontal-stack/estimate.tsx | 28 +- .../assets/horizontal-stack/export.tsx | 36 +- .../assets/horizontal-stack/intake.tsx | 40 +- .../assets/horizontal-stack/label.tsx | 32 +- .../assets/horizontal-stack/link.tsx | 42 +- .../assets/horizontal-stack/members.tsx | 40 +- .../assets/horizontal-stack/note.tsx | 34 +- .../assets/horizontal-stack/priority.tsx | 46 +- .../assets/horizontal-stack/project.tsx | 28 +- .../assets/horizontal-stack/settings.tsx | 32 +- .../assets/horizontal-stack/state.tsx | 28 +- .../assets/horizontal-stack/template.tsx | 36 +- .../assets/horizontal-stack/token.tsx | 36 +- .../assets/horizontal-stack/unknown.tsx | 54 +- .../assets/horizontal-stack/webhook.tsx | 28 +- .../assets/horizontal-stack/work-item.tsx | 40 +- .../assets/horizontal-stack/worklog.tsx | 36 +- .../empty-state/assets/illustration/inbox.tsx | 121 +- .../assets/illustration/search.tsx | 26 +- .../assets/vertical-stack/404-error.tsx | 236 ++-- .../assets/vertical-stack/archived-cycle.tsx | 184 +-- .../assets/vertical-stack/archived-module.tsx | 136 +- .../vertical-stack/archived-work-item.tsx | 162 +-- .../assets/vertical-stack/changelog.tsx | 2 +- .../assets/vertical-stack/customer.tsx | 472 +++---- .../assets/vertical-stack/cycle.tsx | 121 +- .../assets/vertical-stack/dashboard.tsx | 156 +-- .../assets/vertical-stack/draft.tsx | 120 +- .../assets/vertical-stack/epic.tsx | 106 +- .../assets/vertical-stack/initiative.tsx | 228 ++-- .../assets/vertical-stack/invalid-link.tsx | 204 +-- .../assets/vertical-stack/module.tsx | 212 +-- .../assets/vertical-stack/no-access.tsx | 54 +- .../assets/vertical-stack/page.tsx | 130 +- .../assets/vertical-stack/project.tsx | 117 +- .../assets/vertical-stack/server-error.tsx | 270 ++-- .../assets/vertical-stack/teamspace.tsx | 156 +-- .../assets/vertical-stack/view.tsx | 176 +-- .../assets/vertical-stack/work-item.tsx | 126 +- .../compact-empty-state.stories.tsx | 2 +- .../src/empty-state/compact-empty-state.tsx | 8 +- .../detailed-empty-state.stories.tsx | 4 +- .../src/empty-state/detailed-empty-state.tsx | 8 +- packages/propel/src/icon-button/helper.tsx | 49 + .../src/icon-button/icon-button.stories.tsx | 174 +++ .../propel/src/icon-button/icon-button.tsx | 42 + packages/propel/src/icon-button/index.ts | 3 + .../propel/src/icons/actions/copy-link.tsx | 13 + packages/propel/src/icons/actions/index.ts | 1 + packages/propel/src/icons/constants.tsx | 2 + packages/propel/src/icons/icons.stories.tsx | 108 +- packages/propel/src/icons/priority-icon.tsx | 22 +- packages/propel/src/icons/properties/index.ts | 1 + .../icons/properties/label-filled-icon.tsx | 17 + packages/propel/src/icons/registry.ts | 4 + packages/propel/src/input/input.stories.tsx | 4 +- packages/propel/src/input/input.tsx | 8 +- packages/propel/src/menu/menu.stories.tsx | 10 +- packages/propel/src/menu/menu.tsx | 18 +- packages/propel/src/pill/pill.stories.tsx | 2 +- packages/propel/src/pill/pill.tsx | 12 +- .../propel/src/popover/popover.stories.tsx | 97 +- packages/propel/src/portal/portal.stories.tsx | 14 +- .../src/scrollarea/scrollarea.stories.tsx | 51 +- packages/propel/src/scrollarea/scrollarea.tsx | 2 +- .../src/separator/separator.stories.tsx | 4 +- packages/propel/src/separator/separator.tsx | 2 +- packages/propel/src/skeleton/root.tsx | 8 +- .../spinners/circular-bar-spinner.stories.tsx | 24 +- .../src/spinners/circular-spinner.stories.tsx | 24 +- .../propel/src/spinners/circular-spinner.tsx | 2 +- .../propel/src/styles/fonts/Inter/LICENSE | 1 - .../fonts/Inter/inter-v13-latin-200.woff2 | Bin 22440 -> 0 bytes .../fonts/Inter/inter-v13-latin-300.woff2 | Bin 22444 -> 0 bytes .../fonts/Inter/inter-v13-latin-500.woff2 | Bin 22760 -> 0 bytes .../fonts/Inter/inter-v13-latin-600.woff2 | Bin 22820 -> 0 bytes .../fonts/Inter/inter-v13-latin-700.woff2 | Bin 22904 -> 0 bytes .../fonts/Inter/inter-v13-latin-800.woff2 | Bin 22792 -> 0 bytes .../fonts/Inter/inter-v13-latin-regular.woff2 | Bin 21564 -> 0 bytes packages/propel/src/styles/fonts/index.css | 87 -- .../propel/src/styles/react-day-picker.css | 590 ++++---- packages/propel/src/switch/root.tsx | 12 +- packages/propel/src/switch/switch.stories.tsx | 48 +- .../tab-navigation/tab-navigation-item.tsx | 7 +- .../tab-navigation/tab-navigation.stories.tsx | 14 +- packages/propel/src/table/core.tsx | 24 +- packages/propel/src/table/table.stories.tsx | 14 +- packages/propel/src/tabs/tabs.stories.tsx | 49 +- packages/propel/src/tabs/tabs.tsx | 18 +- packages/propel/src/toast/toast.stories.tsx | 376 +++++- packages/propel/src/toast/toast.tsx | 169 ++- .../propel/src/toolbar/toolbar.stories.tsx | 10 +- packages/propel/src/toolbar/toolbar.tsx | 29 +- packages/propel/src/tooltip/root.tsx | 8 +- .../propel/src/tooltip/tooltip.stories.tsx | 60 +- packages/propel/src/utils/classname.tsx | 62 +- packages/propel/tailwind.config.ts | 7 - packages/propel/tsdown.config.ts | 2 + packages/tailwind-config/AGENTS.md | 667 ++++++++++ packages/tailwind-config/animations.css | 77 ++ packages/tailwind-config/global.css | 833 ------------ packages/tailwind-config/index.css | 203 +++ packages/tailwind-config/package.json | 21 +- packages/tailwind-config/postcss.config.js | 7 +- packages/tailwind-config/tailwind.config.js | 492 ------- packages/tailwind-config/variables.css | 1185 +++++++++++++++++ packages/types/src/index.ts | 1 + packages/types/src/issues/issue-identifier.ts | 37 + packages/ui/package.json | 2 +- packages/ui/postcss.config.js | 4 +- .../auth-form/auth-confirm-password-input.tsx | 2 +- .../ui/src/auth-form/auth-forgot-password.tsx | 2 +- packages/ui/src/auth-form/auth-form.tsx | 4 +- packages/ui/src/auth-form/auth-input.tsx | 10 +- packages/ui/src/avatar/avatar-group.tsx | 8 +- packages/ui/src/avatar/avatar.tsx | 68 +- packages/ui/src/avatar/helper.tsx | 64 + packages/ui/src/badge/helper.tsx | 54 +- packages/ui/src/billing/index.ts | 1 - packages/ui/src/billing/subscription.ts | 209 --- .../src/breadcrumbs/breadcrumbs.stories.tsx | 2 +- packages/ui/src/breadcrumbs/breadcrumbs.tsx | 18 +- .../src/breadcrumbs/navigation-dropdown.tsx | 28 +- .../navigation-search-dropdown.tsx | 22 +- packages/ui/src/button/helper.tsx | 60 +- packages/ui/src/button/toggle-switch.tsx | 28 +- packages/ui/src/card/helper.tsx | 3 +- .../ui/src/collapsible/collapsible-button.tsx | 11 +- packages/ui/src/drag-handle.tsx | 5 +- packages/ui/src/drop-indicator.tsx | 6 +- packages/ui/src/dropdown/common/button.tsx | 2 +- .../ui/src/dropdown/common/input-search.tsx | 6 +- packages/ui/src/dropdown/common/loader.tsx | 2 +- packages/ui/src/dropdown/common/options.tsx | 10 +- packages/ui/src/dropdown/multi-select.tsx | 2 +- packages/ui/src/dropdown/single-select.tsx | 2 +- .../ui/src/dropdowns/context-menu/item.tsx | 22 +- .../ui/src/dropdowns/context-menu/root.tsx | 2 +- packages/ui/src/dropdowns/custom-menu.tsx | 38 +- .../ui/src/dropdowns/custom-search-select.tsx | 36 +- packages/ui/src/dropdowns/custom-select.tsx | 20 +- packages/ui/src/favorite-star.tsx | 4 +- packages/ui/src/form-fields/checkbox.tsx | 12 +- .../ui/src/form-fields/input-color-picker.tsx | 101 +- packages/ui/src/form-fields/input.tsx | 8 +- .../ui/src/form-fields/password/helper.tsx | 8 +- .../ui/src/form-fields/password/indicator.tsx | 10 +- .../form-fields/password/password-input.tsx | 6 +- packages/ui/src/form-fields/root.tsx | 6 +- packages/ui/src/form-fields/textarea.tsx | 6 +- packages/ui/src/header/helper.tsx | 8 +- packages/ui/src/index.ts | 1 - packages/ui/src/link/block.tsx | 16 +- packages/ui/src/loader.tsx | 4 +- packages/ui/src/modals/alert-modal.tsx | 12 +- packages/ui/src/modals/modal-core.tsx | 4 +- packages/ui/src/oauth/oauth-button.tsx | 6 +- packages/ui/src/oauth/oauth-options.tsx | 6 +- .../ui/src/popovers/popover-menu.stories.tsx | 4 +- packages/ui/src/popovers/popover-menu.tsx | 2 +- packages/ui/src/popovers/popover.stories.tsx | 10 +- packages/ui/src/popovers/popover.tsx | 2 +- .../progress/circular-progress-indicator.tsx | 4 +- .../progress/linear-progress-indicator.tsx | 8 +- packages/ui/src/spinners/circular-spinner.tsx | 2 +- packages/ui/src/tables/table.stories.tsx | 2 +- packages/ui/src/tables/table.tsx | 8 +- packages/ui/src/tabs/tab-list.tsx | 16 +- packages/ui/src/tag/helper.tsx | 2 +- packages/ui/src/tooltip/tooltip.tsx | 4 +- packages/ui/src/typography/sub-heading.tsx | 2 +- packages/ui/src/utils/classname.tsx | 6 +- packages/ui/styles/globals.css | 697 +--------- packages/ui/tailwind.config.js | 5 - packages/utils/package.json | 2 +- packages/utils/src/common.ts | 56 +- pnpm-lock.yaml | 1081 ++++++++------- 1342 files changed, 14227 insertions(+), 15119 deletions(-) create mode 100644 AGENTS.md delete mode 100644 apps/admin/postcss.config.cjs create mode 100644 apps/admin/postcss.config.js delete mode 100644 apps/admin/tailwind.config.cjs delete mode 100644 apps/space/postcss.config.cjs create mode 100644 apps/space/postcss.config.js delete mode 100644 apps/space/tailwind.config.cjs rename apps/web/ce/components/issues/issue-details/{sidebar.tsx => sidebar}/date-alert.tsx (100%) create mode 100644 apps/web/core/components/common/layout/sidebar/property-list-item.tsx create mode 100644 apps/web/core/components/issues/issue-detail/identifier-text.tsx delete mode 100644 apps/web/postcss.config.cjs create mode 100644 apps/web/postcss.config.js delete mode 100644 apps/web/tailwind.config.cjs delete mode 100644 packages/editor/src/styles/tailwind.css delete mode 100644 packages/editor/tailwind.config.js create mode 100644 packages/propel/.storybook/tailwind.css create mode 100644 packages/propel/src/badge/badge.stories.tsx create mode 100644 packages/propel/src/badge/badge.tsx create mode 100644 packages/propel/src/badge/helper.tsx create mode 100644 packages/propel/src/badge/index.ts create mode 100644 packages/propel/src/design-system/design-system-philosophy.stories.tsx create mode 100644 packages/propel/src/icon-button/helper.tsx create mode 100644 packages/propel/src/icon-button/icon-button.stories.tsx create mode 100644 packages/propel/src/icon-button/icon-button.tsx create mode 100644 packages/propel/src/icon-button/index.ts create mode 100644 packages/propel/src/icons/actions/copy-link.tsx create mode 100644 packages/propel/src/icons/properties/label-filled-icon.tsx delete mode 100644 packages/propel/src/styles/fonts/Inter/LICENSE delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-200.woff2 delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-300.woff2 delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-500.woff2 delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-600.woff2 delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-700.woff2 delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-800.woff2 delete mode 100644 packages/propel/src/styles/fonts/Inter/inter-v13-latin-regular.woff2 delete mode 100644 packages/propel/src/styles/fonts/index.css delete mode 100644 packages/propel/tailwind.config.ts create mode 100644 packages/tailwind-config/AGENTS.md create mode 100644 packages/tailwind-config/animations.css delete mode 100644 packages/tailwind-config/global.css create mode 100644 packages/tailwind-config/index.css delete mode 100644 packages/tailwind-config/tailwind.config.js create mode 100644 packages/tailwind-config/variables.css create mode 100644 packages/types/src/issues/issue-identifier.ts create mode 100644 packages/ui/src/avatar/helper.tsx delete mode 100644 packages/ui/src/billing/index.ts delete mode 100644 packages/ui/src/billing/subscription.ts delete mode 100644 packages/ui/tailwind.config.js diff --git a/.gitignore b/.gitignore index f0093a0e68..e2e6441ba3 100644 --- a/.gitignore +++ b/.gitignore @@ -105,10 +105,8 @@ CLAUDE.md build/ .react-router/ -AGENTS.md build/ .react-router/ -AGENTS.md temp/ scripts/ diff --git a/AGENTS.md b/AGENTS.md new file mode 100644 index 0000000000..dc76d8ce59 --- /dev/null +++ b/AGENTS.md @@ -0,0 +1,24 @@ +# Agent Development Guide + +## Commands + +- `pnpm dev` - Start all dev servers (web:3000, admin:3001) +- `pnpm build` - Build all packages and apps +- `pnpm check` - Run all checks (format, lint, types) +- `pnpm check:lint` - ESLint across all packages +- `pnpm check:types` - TypeScript type checking +- `pnpm fix` - Auto-fix format and lint issues +- `pnpm turbo run --filter=` - Target specific package/app +- `pnpm --filter=@plane/ui storybook` - Start Storybook on port 6006 + +## Code Style + +- **Imports**: Use `workspace:*` for internal packages, `catalog:` for external deps +- **TypeScript**: Strict mode enabled, all files must be typed +- **Formatting**: Prettier with Tailwind plugin, run `pnpm fix:format` +- **Linting**: ESLint with shared config, max warnings vary by package +- **Naming**: camelCase for variables/functions, PascalCase for components/types +- **Error Handling**: Use try-catch with proper error types, log errors appropriately +- **State Management**: MobX stores in `packages/shared-state`, reactive patterns +- **Testing**: All features require unit tests, use existing test framework per package +- **Components**: Build in `@plane/ui` with Storybook for isolated development diff --git a/apps/admin/app/(all)/(dashboard)/ai/form.tsx b/apps/admin/app/(all)/(dashboard)/ai/form.tsx index 568289033f..3cb96a454c 100644 --- a/apps/admin/app/(all)/(dashboard)/ai/form.tsx +++ b/apps/admin/app/(all)/(dashboard)/ai/form.tsx @@ -42,7 +42,7 @@ export function InstanceAIForm(props: IInstanceAIForm) { Learn more @@ -63,7 +63,7 @@ export function InstanceAIForm(props: IInstanceAIForm) { here. @@ -94,8 +94,8 @@ export function InstanceAIForm(props: IInstanceAIForm) {
-
OpenAI
-
If you use ChatGPT, this is for you.
+
OpenAI
+
If you use ChatGPT, this is for you.
{aiFormFields.map((field) => ( @@ -114,12 +114,12 @@ export function InstanceAIForm(props: IInstanceAIForm) {
-
- -
+
If you have a preferred AI models vendor, please get in{" "} diff --git a/apps/admin/app/(all)/(dashboard)/ai/page.tsx b/apps/admin/app/(all)/(dashboard)/ai/page.tsx index ebdf40528b..04a440fcf4 100644 --- a/apps/admin/app/(all)/(dashboard)/ai/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/ai/page.tsx @@ -16,9 +16,9 @@ const InstanceAIPage = observer(function InstanceAIPage(_props: Route.ComponentP return ( <>
-
-
AI features for all your workspaces
-
+
+
AI features for all your workspaces
+
Configure your AI API credentials so Plane AI features are turned on for all your workspaces.
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx index 15b97b5880..250c451250 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx @@ -4,10 +4,9 @@ import Link from "next/link"; import { useForm } from "react-hook-form"; // plane internal packages import { API_BASE_URL } from "@plane/constants"; +import { Button, getButtonStyling } from "@plane/propel/button"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; import type { IFormattedInstanceConfiguration, TInstanceGiteaAuthenticationConfigurationKeys } from "@plane/types"; -import { Button, getButtonStyling } from "@plane/ui"; -import { cn } from "@plane/utils"; // components import { CodeBlock } from "@/components/common/code-block"; import { ConfirmDiscardModal } from "@/components/common/confirm-discard-modal"; @@ -69,7 +68,7 @@ export function InstanceGiteaConfigForm(props: Props) { tabIndex={-1} href="https://gitea.com/user/settings/applications" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > Gitea OAuth application settings. @@ -91,7 +90,7 @@ export function InstanceGiteaConfigForm(props: Props) { tabIndex={-1} href="https://gitea.com/user/settings/applications" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > Gitea OAuth application settings. @@ -117,7 +116,7 @@ export function InstanceGiteaConfigForm(props: Props) { tabIndex={-1} href={`${control._formValues.GITEA_HOST || "https://gitea.com"}/user/settings/applications`} target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > here. @@ -163,7 +162,7 @@ export function InstanceGiteaConfigForm(props: Props) {
-
Gitea-provided details for Plane
+
Gitea-provided details for Plane
{GITEA_FORM_FIELDS.map((field) => (
- - + Go back
-
-
Plane-provided details for Gitea
+
+
Plane-provided details for Gitea
{GITEA_SERVICE_FIELD.map((field) => ( ))} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx index 1838cd5b82..6dd90a2d18 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx @@ -58,7 +58,7 @@ const InstanceGiteaAuthenticationPage = observer(function InstanceGiteaAuthentic return ( <>
-
+
GitHub OAuth application settings. @@ -82,7 +82,7 @@ export function InstanceGithubConfigForm(props: Props) { tabIndex={-1} href="https://github.com/settings/applications/new" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > GitHub OAuth application settings. @@ -116,7 +116,7 @@ export function InstanceGithubConfigForm(props: Props) { tabIndex={-1} href="https://github.com/settings/applications/new" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > here. @@ -139,7 +139,7 @@ export function InstanceGithubConfigForm(props: Props) { tabIndex={-1} href="https://github.com/settings/applications/new" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > here. @@ -185,7 +185,7 @@ export function InstanceGithubConfigForm(props: Props) {
-
GitHub-provided details for Plane
+
GitHub-provided details for Plane
{GITHUB_FORM_FIELDS.map((field) => (
- - + Go back
-
Plane-provided details for GitHub
+
Plane-provided details for GitHub
{/* common service details */} -
+
{GITHUB_COMMON_SERVICE_DETAILS.map((field) => ( ))} @@ -227,11 +229,11 @@ export function InstanceGithubConfigForm(props: Props) { {/* web service details */}
-
+
Web
-
+
{GITHUB_SERVICE_DETAILS.map((field) => ( ))} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx index 4fe3c46112..438bfc9f94 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx @@ -67,7 +67,7 @@ const InstanceGithubAuthenticationPage = observer(function InstanceGithubAuthent return ( <>
-
+
GitLab OAuth application settings @@ -94,7 +94,7 @@ export function InstanceGitlabConfigForm(props: Props) { tabIndex={-1} href="https://docs.gitlab.com/ee/integration/oauth_provider.html" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > GitLab OAuth application settings @@ -120,7 +120,7 @@ export function InstanceGitlabConfigForm(props: Props) { tabIndex={-1} href="https://docs.gitlab.com/ee/integration/oauth_provider.html" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > GitLab OAuth application @@ -167,7 +167,7 @@ export function InstanceGitlabConfigForm(props: Props) {
-
GitLab-provided details for Plane
+
GitLab-provided details for Plane
{GITLAB_FORM_FIELDS.map((field) => (
- - + Go back
-
-
Plane-provided details for GitLab
+
+
Plane-provided details for GitLab
{GITLAB_SERVICE_FIELD.map((field) => ( ))} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx index ba421e04c4..4a09927346 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx @@ -58,7 +58,7 @@ const InstanceGitlabAuthenticationPage = observer(function InstanceGitlabAuthent return ( <>
-
+
Learn more @@ -80,7 +80,7 @@ export function InstanceGoogleConfigForm(props: Props) { tabIndex={-1} href="https://developers.google.com/identity/oauth2/web/guides/get-google-api-clientid" target="_blank" - className="text-custom-primary-100 hover:underline" + className="text-accent-primary hover:underline" rel="noreferrer" > Learn more @@ -105,7 +105,7 @@ export function InstanceGoogleConfigForm(props: Props) { here. @@ -127,7 +127,7 @@ export function InstanceGoogleConfigForm(props: Props) { here. @@ -172,7 +172,7 @@ export function InstanceGoogleConfigForm(props: Props) {
-
Google-provided details for Plane
+
Google-provided details for Plane
{GOOGLE_FORM_FIELDS.map((field) => (
- - + Go back
-
Plane-provided details for Google
+
Plane-provided details for Google
{/* common service details */} -
+
{GOOGLE_COMMON_SERVICE_DETAILS.map((field) => ( ))} @@ -214,11 +216,11 @@ export function InstanceGoogleConfigForm(props: Props) { {/* web service details */}
-
+
Web
-
+
{GOOGLE_SERVICE_DETAILS.map((field) => ( ))} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx index c99c597877..8089fcd640 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx @@ -58,7 +58,7 @@ const InstanceGoogleAuthenticationPage = observer(function InstanceGoogleAuthent return ( <>
-
+
-
-
Manage authentication modes for your instance
-
+
+
Manage authentication modes for your instance
+
Configure authentication modes for your team and restrict sign-ups to be invite only.
{formattedConfig ? (
-
+
-
Allow anyone to sign up even without an invite
-
+
Allow anyone to sign up even without an invite
+
Toggling this off will only let users sign up when they are invited.
@@ -92,7 +92,7 @@ const InstanceAuthenticationPage = observer(function InstanceAuthenticationPage(
-
Available authentication modes
+
Available authentication modes
) : ( diff --git a/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx b/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx index 014be38109..e8ae5ed8d6 100644 --- a/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx +++ b/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx @@ -157,12 +157,12 @@ export function InstanceEmailForm(props: IInstanceEmailForm) { /> ))}
-

Email security

+

Email security

{Object.entries(EMAIL_SECURITY_OPTIONS).map(([key, value]) => ( @@ -173,12 +173,12 @@ export function InstanceEmailForm(props: IInstanceEmailForm) {
-
+
-
Authentication
-
+
Authentication
+
This is optional, but we recommend setting up a username and a password for your SMTP server.
@@ -204,6 +204,7 @@ export function InstanceEmailForm(props: IInstanceEmailForm) {
{sendEmailStep === ESendEmailSteps.SEND_EMAIL && ( - )} diff --git a/apps/admin/app/(all)/(dashboard)/general/form.tsx b/apps/admin/app/(all)/(dashboard)/general/form.tsx index db663f7772..0b5619ea00 100644 --- a/apps/admin/app/(all)/(dashboard)/general/form.tsx +++ b/apps/admin/app/(all)/(dashboard)/general/form.tsx @@ -63,8 +63,8 @@ export const GeneralConfigurationForm = observer(function GeneralConfigurationFo return (
-
-
Instance details
+
+
Instance details
-

Email

+

Email

-

Instance ID

+

Instance ID

-
-
Chat + telemetry
+
+
Chat + telemetry
-
+
-
- +
+
-
- Let Plane collect anonymous usage data -
-
+
Let Plane collect anonymous usage data
+
No PII is collected.This anonymized data is used to understand how you use Plane and build new features in line with{" "} our Telemetry Policy. @@ -146,7 +144,7 @@ export const GeneralConfigurationForm = observer(function GeneralConfigurationFo
-
diff --git a/apps/admin/app/(all)/(dashboard)/general/intercom.tsx b/apps/admin/app/(all)/(dashboard)/general/intercom.tsx index a7659f4254..d5ec8d352e 100644 --- a/apps/admin/app/(all)/(dashboard)/general/intercom.tsx +++ b/apps/admin/app/(all)/(dashboard)/general/intercom.tsx @@ -49,17 +49,17 @@ export const IntercomConfig = observer(function IntercomConfig(props: TIntercomC return ( <> -
+
-
- +
+
-
Chat with us
-
+
Chat with us
+
Let your users chat with us via Intercom or another service. Toggling Telemetry off turns this off automatically.
diff --git a/apps/admin/app/(all)/(dashboard)/general/page.tsx b/apps/admin/app/(all)/(dashboard)/general/page.tsx index 5a70e30aa6..fd7efd3099 100644 --- a/apps/admin/app/(all)/(dashboard)/general/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/general/page.tsx @@ -11,9 +11,9 @@ function GeneralPage() { return ( <>
-
-
General settings
-
+
+
General settings
+
Change the name of your instance and instance admin e-mail addresses. Enable or disable telemetry in your instance.
diff --git a/apps/admin/app/(all)/(dashboard)/header.tsx b/apps/admin/app/(all)/(dashboard)/header.tsx index c2ccc6358e..e769d38602 100644 --- a/apps/admin/app/(all)/(dashboard)/header.tsx +++ b/apps/admin/app/(all)/(dashboard)/header.tsx @@ -12,10 +12,10 @@ export const HamburgerToggle = observer(function HamburgerToggle() { const { isSidebarCollapsed, toggleSidebar } = useTheme(); return (
toggleSidebar(!isSidebarCollapsed)} > - +
); }); @@ -71,7 +71,7 @@ export const AdminHeader = observer(function AdminHeader() { const breadcrumbItems = generateBreadcrumbItems(pathName); return ( -
+
{breadcrumbItems.length >= 0 && ( @@ -82,7 +82,7 @@ export const AdminHeader = observer(function AdminHeader() { } + icon={} /> } /> diff --git a/apps/admin/app/(all)/(dashboard)/image/form.tsx b/apps/admin/app/(all)/(dashboard)/image/form.tsx index 9227a5ba9b..7d12ee59f7 100644 --- a/apps/admin/app/(all)/(dashboard)/image/form.tsx +++ b/apps/admin/app/(all)/(dashboard)/image/form.tsx @@ -56,7 +56,7 @@ export function InstanceImageConfigForm(props: IInstanceImageConfigForm) { Learn more. @@ -70,7 +70,7 @@ export function InstanceImageConfigForm(props: IInstanceImageConfigForm) {
-
diff --git a/apps/admin/app/(all)/(dashboard)/image/page.tsx b/apps/admin/app/(all)/(dashboard)/image/page.tsx index 57dd3a0fd6..5bd2914d54 100644 --- a/apps/admin/app/(all)/(dashboard)/image/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/image/page.tsx @@ -16,9 +16,9 @@ const InstanceImagePage = observer(function InstanceImagePage(_props: Route.Comp return ( <>
-
-
Third-party image libraries
-
+
+
Third-party image libraries
+
Let your users search and choose images from third-party libraries
diff --git a/apps/admin/app/(all)/(dashboard)/layout.tsx b/apps/admin/app/(all)/(dashboard)/layout.tsx index b0a766d2fc..2798c8f043 100644 --- a/apps/admin/app/(all)/(dashboard)/layout.tsx +++ b/apps/admin/app/(all)/(dashboard)/layout.tsx @@ -34,9 +34,9 @@ function AdminLayout(_props: Route.ComponentProps) { return (
-
+
-
+
diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx index f2458f869b..5babcbbd40 100644 --- a/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx +++ b/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx @@ -33,20 +33,20 @@ export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() { const getSidebarMenuItems = () => (
- {currentUser?.email} + {currentUser?.email}
@@ -59,7 +59,7 @@ export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() { Sign out @@ -75,10 +75,10 @@ export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() { }, [csrfToken]); return ( -
+
@@ -88,8 +88,8 @@ export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() { "cursor-default": !isSidebarCollapsed, })} > -
- +
+
{isSidebarCollapsed && ( @@ -109,7 +109,7 @@ export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() { {!isSidebarCollapsed && (
-

Instance admin

+

Instance admin

)}
@@ -123,7 +123,7 @@ export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() { src={getFileURL(currentUser.avatar_url)} size={24} shape="square" - className="!text-base" + className="!text-14" /> diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx index da09ef348e..8d0b87ac98 100644 --- a/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx +++ b/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx @@ -45,7 +45,7 @@ export const AdminSidebarHelpSection = observer(function AdminSidebarHelpSection return ( -
Version: v{packageJson.version}
+
Version: v{packageJson.version}
diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx index 4fe17e0bf2..e7371fc69e 100644 --- a/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx +++ b/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx @@ -72,8 +72,8 @@ export const AdminSidebarMenu = observer(function AdminSidebarMenu() { className={cn( `group flex w-full items-center gap-3 rounded-md px-3 py-2 outline-none transition-colors`, isActive - ? "bg-custom-primary-100/10 text-custom-primary-100" - : "text-custom-sidebar-text-200 hover:bg-custom-sidebar-background-80 focus:bg-custom-sidebar-background-80", + ? "bg-accent-primary/10 text-accent-primary" + : "text-secondary hover:bg-layer-1-hover focus:bg-layer-1-hover", isSidebarCollapsed ? "justify-center" : "w-[260px]" )} > @@ -82,16 +82,16 @@ export const AdminSidebarMenu = observer(function AdminSidebarMenu() {
{item.name}
{item.description} diff --git a/apps/admin/app/(all)/(dashboard)/sidebar.tsx b/apps/admin/app/(all)/(dashboard)/sidebar.tsx index 7950879c17..ec340247f5 100644 --- a/apps/admin/app/(all)/(dashboard)/sidebar.tsx +++ b/apps/admin/app/(all)/(dashboard)/sidebar.tsx @@ -38,7 +38,7 @@ export const AdminSidebar = observer(function AdminSidebar() { return (
-

Name your workspace

+

Name your workspace

)} /> - {errors?.name?.message} + {errors?.name?.message}
-

Set your workspace's URL

-
- {workspaceBaseURL} +

Set your workspace's URL

+
+ {workspaceBaseURL} )} />
- {slugError &&

This URL is taken. Try something else.

} + {slugError &&

This URL is taken. Try something else.

} {invalidSlug && ( -

{`URLs can contain only ( - ), ( _ ) and alphanumeric characters.`}

+

{`URLs can contain only ( - ), ( _ ) and alphanumeric characters.`}

)} - {errors.slug && {errors.slug.message}} + {errors.slug && {errors.slug.message}}
-

How many people will use this workspace?

+

How many people will use this workspace?

c === value) ?? ( - Select a range + Select a range ) } - buttonClassName="!border-[0.5px] !border-custom-border-200 !shadow-none" + buttonClassName="!border-[0.5px] !border-subtle !shadow-none" input > {ORGANIZATION_SIZE.map((item) => ( @@ -187,7 +187,7 @@ export function WorkspaceCreateForm() { )} /> {errors.organization_size && ( - {errors.organization_size.message} + {errors.organization_size.message} )}
@@ -195,14 +195,14 @@ export function WorkspaceCreateForm() {
- + Go back
diff --git a/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx b/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx index fe3fc033a2..3fd441c268 100644 --- a/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx @@ -6,9 +6,9 @@ import { WorkspaceCreateForm } from "./form"; const WorkspaceCreatePage = observer(function WorkspaceCreatePage(_props: Route.ComponentProps) { return (
-
-
Create a new workspace on this instance.
-
+
+
Create a new workspace on this instance.
+
You will need to invite users from Workspace Settings after you create this workspace.
diff --git a/apps/admin/app/(all)/(dashboard)/workspace/page.tsx b/apps/admin/app/(all)/(dashboard)/workspace/page.tsx index f5d8a678c2..c3222f1fb9 100644 --- a/apps/admin/app/(all)/(dashboard)/workspace/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/workspace/page.tsx @@ -69,22 +69,20 @@ const WorkspaceManagementPage = observer(function WorkspaceManagementPage(_props return (
-
+
-
Workspaces on this instance
-
- See all workspaces and control who can create them. -
+
Workspaces on this instance
+
See all workspaces and control who can create them.
{formattedConfig ? ( -
+
-
Prevent anyone else from creating a workspace.
-
+
Prevent anyone else from creating a workspace.
+
Toggling this on will let only you create workspaces. You will have to invite users to new workspaces.
@@ -116,20 +114,19 @@ const WorkspaceManagementPage = observer(function WorkspaceManagementPage(_props <>
-
- All workspaces on this instance{" "} - • {workspaceIds.length} +
+ All workspaces on this instance • {workspaceIds.length} {workspaceLoader && ["mutation", "pagination"].includes(workspaceLoader) && ( )}
-
+
You can't yet delete workspaces and you can only go to the workspace if you are an Admin or a Member.
- + Create workspace
@@ -142,7 +139,8 @@ const WorkspaceManagementPage = observer(function WorkspaceManagementPage(_props {hasNextPage && (
-
diff --git a/apps/admin/app/components/404.tsx b/apps/admin/app/components/404.tsx index 3851daa327..a4954ebaaf 100644 --- a/apps/admin/app/components/404.tsx +++ b/apps/admin/app/components/404.tsx @@ -7,22 +7,22 @@ import Image404 from "@/app/assets/images/404.svg?url"; function PageNotFound() { return ( -
+
404 - Page not found
-

Oops! Something went wrong.

-

+

Oops! Something went wrong.

+

Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is temporarily unavailable.

- diff --git a/apps/admin/app/root.tsx b/apps/admin/app/root.tsx index 89415106d9..cbae375398 100644 --- a/apps/admin/app/root.tsx +++ b/apps/admin/app/root.tsx @@ -56,7 +56,11 @@ export const meta: Route.MetaFunction = () => [ ]; export default function Root() { - return ; + return ( +
+ +
+ ); } export function HydrateFallback() { diff --git a/apps/admin/ce/components/authentication/authentication-modes.tsx b/apps/admin/ce/components/authentication/authentication-modes.tsx index 7b0f658d8a..9c2348c81d 100644 --- a/apps/admin/ce/components/authentication/authentication-modes.tsx +++ b/apps/admin/ce/components/authentication/authentication-modes.tsx @@ -43,14 +43,14 @@ export const getAuthenticationModes: (props: TGetBaseAuthenticationModeProps) => name: "Unique codes", description: "Log in or sign up for Plane using codes sent via email. You need to have set up SMTP to use this method.", - icon: , + icon: , config: , }, { key: "passwords-login", name: "Passwords", description: "Allow members to create accounts with passwords and use it with their email addresses to sign in.", - icon: , + icon: , config: , }, { @@ -112,7 +112,7 @@ export const AuthenticationModes = observer(function AuthenticationModes(props: const { resolvedTheme } = useTheme(); return ( - <> +
{getAuthenticationModes({ disabled, updateConfig, resolvedTheme }).map((method) => ( ))} - +
); }); diff --git a/apps/admin/ce/components/common/upgrade-button.tsx b/apps/admin/ce/components/common/upgrade-button.tsx index 51b6eb6c4d..cf656bbd5e 100644 --- a/apps/admin/ce/components/common/upgrade-button.tsx +++ b/apps/admin/ce/components/common/upgrade-button.tsx @@ -10,7 +10,7 @@ export function UpgradeButton() { Upgrade diff --git a/apps/admin/core/components/authentication/authentication-method-card.tsx b/apps/admin/core/components/authentication/authentication-method-card.tsx index c512e24d14..df330aa71c 100644 --- a/apps/admin/core/components/authentication/authentication-method-card.tsx +++ b/apps/admin/core/components/authentication/authentication-method-card.tsx @@ -16,8 +16,8 @@ export function AuthenticationMethodCard(props: Props) { return (
-
{icon}
+
{icon}
{name}
{description} diff --git a/apps/admin/core/components/authentication/gitea-config.tsx b/apps/admin/core/components/authentication/gitea-config.tsx index 22019979e3..7fadf1e1a3 100644 --- a/apps/admin/core/components/authentication/gitea-config.tsx +++ b/apps/admin/core/components/authentication/gitea-config.tsx @@ -1,11 +1,11 @@ -import React from "react"; import { observer } from "mobx-react"; import Link from "next/link"; // icons import { Settings2 } from "lucide-react"; // plane internal packages +import { getButtonStyling } from "@plane/propel/button"; import type { TInstanceAuthenticationMethodKeys } from "@plane/types"; -import { ToggleSwitch, getButtonStyling } from "@plane/ui"; +import { ToggleSwitch } from "@plane/ui"; import { cn } from "@plane/utils"; // hooks import { useInstance } from "@/hooks/store"; @@ -28,7 +28,7 @@ export const GiteaConfiguration = observer(function GiteaConfiguration(props: Pr <> {GiteaConfigured ? (
- + Edit
) : ( - - + + Configure )} diff --git a/apps/admin/core/components/authentication/github-config.tsx b/apps/admin/core/components/authentication/github-config.tsx index b2db3e0862..46a1a708c9 100644 --- a/apps/admin/core/components/authentication/github-config.tsx +++ b/apps/admin/core/components/authentication/github-config.tsx @@ -28,7 +28,7 @@ export const GithubConfiguration = observer(function GithubConfiguration(props: <> {isGithubConfigured ? (
- + Edit
) : ( - - + + Configure )} diff --git a/apps/admin/core/components/authentication/gitlab-config.tsx b/apps/admin/core/components/authentication/gitlab-config.tsx index 7e6ee1ddba..b3069e6cc0 100644 --- a/apps/admin/core/components/authentication/gitlab-config.tsx +++ b/apps/admin/core/components/authentication/gitlab-config.tsx @@ -27,7 +27,7 @@ export const GitlabConfiguration = observer(function GitlabConfiguration(props: <> {isGitlabConfigured ? (
- + Edit
) : ( - - + + Configure )} diff --git a/apps/admin/core/components/authentication/google-config.tsx b/apps/admin/core/components/authentication/google-config.tsx index d31b38dda9..61d89e3325 100644 --- a/apps/admin/core/components/authentication/google-config.tsx +++ b/apps/admin/core/components/authentication/google-config.tsx @@ -27,7 +27,7 @@ export const GoogleConfiguration = observer(function GoogleConfiguration(props: <> {isGoogleConfigured ? (
- + Edit
) : ( - - + + Configure )} diff --git a/apps/admin/core/components/common/banner.tsx b/apps/admin/core/components/common/banner.tsx index df0818b34f..861e8f6341 100644 --- a/apps/admin/core/components/common/banner.tsx +++ b/apps/admin/core/components/common/banner.tsx @@ -23,7 +23,7 @@ export function Banner(props: TBanner) { )}
-

{message}

+

{message}

diff --git a/apps/admin/core/components/common/breadcrumb-link.tsx b/apps/admin/core/components/common/breadcrumb-link.tsx index aa647e2205..0bed7e6064 100644 --- a/apps/admin/core/components/common/breadcrumb-link.tsx +++ b/apps/admin/core/components/common/breadcrumb-link.tsx @@ -14,17 +14,12 @@ export function BreadcrumbLink(props: Props) {
  • {href ? ( - - {icon && ( -
    {icon}
    - )} + + {icon &&
    {icon}
    }
    {label}
    ) : ( -
    +
    {icon &&
    {icon}
    }
    {label}
    diff --git a/apps/admin/core/components/common/code-block.tsx b/apps/admin/core/components/common/code-block.tsx index ab46459495..334d8d54ce 100644 --- a/apps/admin/core/components/common/code-block.tsx +++ b/apps/admin/core/components/common/code-block.tsx @@ -10,9 +10,9 @@ export function CodeBlock({ children, className, darkerShade }: TProps) { return ( -
    +
    @@ -39,15 +39,15 @@ export function ConfirmDiscardModal(props: Props) { leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" > - +
    - + You have unsaved changes
    -

    +

    Changes you made will be lost if you go back. Do you wish to go back?

    @@ -55,10 +55,10 @@ export function ConfirmDiscardModal(props: Props) {
    - - + Go back
    diff --git a/apps/admin/core/components/common/controller-input.tsx b/apps/admin/core/components/common/controller-input.tsx index 4d3534859d..9dc38d851a 100644 --- a/apps/admin/core/components/common/controller-input.tsx +++ b/apps/admin/core/components/common/controller-input.tsx @@ -35,7 +35,7 @@ export function ControllerInput(props: Props) { return (
    -

    {label}

    +

    {label}

    setShowPassword(false)} > @@ -69,14 +69,14 @@ export function ControllerInput(props: Props) { ) : ( ))}
    - {description &&

    {description}

    } + {description &&

    {description}

    }
    ); } diff --git a/apps/admin/core/components/common/copy-field.tsx b/apps/admin/core/components/common/copy-field.tsx index 484cf74540..10a2c3729d 100644 --- a/apps/admin/core/components/common/copy-field.tsx +++ b/apps/admin/core/components/common/copy-field.tsx @@ -22,9 +22,10 @@ export function CopyField(props: Props) { return (
    -

    {label}

    +

    {label}

    -
    {description}
    +
    {description}
    ); } diff --git a/apps/admin/core/components/common/empty-state.tsx b/apps/admin/core/components/common/empty-state.tsx index f69b041793..861ff85882 100644 --- a/apps/admin/core/components/common/empty-state.tsx +++ b/apps/admin/core/components/common/empty-state.tsx @@ -19,8 +19,8 @@ export function EmptyState({ title, description, image, primaryButton, secondary
    {image && {primaryButton?.text} -
    {title}
    - {description &&

    {description}

    } +
    {title}
    + {description &&

    {description}

    }
    {primaryButton && ( diff --git a/apps/admin/core/components/instance/failure.tsx b/apps/admin/core/components/instance/failure.tsx index e31633dc9f..30d9f09dfb 100644 --- a/apps/admin/core/components/instance/failure.tsx +++ b/apps/admin/core/components/instance/failure.tsx @@ -22,13 +22,13 @@ export const InstanceFailureView = observer(function InstanceFailureView() {
    Instance failure illustration -

    Unable to fetch instance details.

    -

    +

    Unable to fetch instance details.

    +

    We were unable to fetch the details of the instance. Fret not, it might just be a connectivity issue.

    -
    diff --git a/apps/admin/core/components/instance/form-header.tsx b/apps/admin/core/components/instance/form-header.tsx index ead66b9631..75062c30f5 100644 --- a/apps/admin/core/components/instance/form-header.tsx +++ b/apps/admin/core/components/instance/form-header.tsx @@ -1,8 +1,8 @@ export function FormHeader({ heading, subHeading }: { heading: string; subHeading: string }) { return (
    - {heading} - {subHeading} + {heading} + {subHeading}
    ); } diff --git a/apps/admin/core/components/instance/instance-not-ready.tsx b/apps/admin/core/components/instance/instance-not-ready.tsx index 0473effcda..7092ae048c 100644 --- a/apps/admin/core/components/instance/instance-not-ready.tsx +++ b/apps/admin/core/components/instance/instance-not-ready.tsx @@ -8,16 +8,14 @@ export function InstanceNotReady() {
    -

    Welcome aboard Plane!

    +

    Welcome aboard Plane!

    Plane Logo -

    - Get started by setting up your instance and workspace -

    +

    Get started by setting up your instance and workspace

    - diff --git a/apps/admin/core/components/instance/setup-form.tsx b/apps/admin/core/components/instance/setup-form.tsx index ab25b1a3e4..4e4e199504 100644 --- a/apps/admin/core/components/instance/setup-form.tsx +++ b/apps/admin/core/components/instance/setup-form.tsx @@ -156,11 +156,11 @@ export function InstanceSetupForm() {
    -
    -
    +
    -
    Create workspace
    -
    +
    Create workspace
    +
    Instance setup done! Welcome to Plane instance portal. Start your journey with by creating your first workspace.
    - + Create workspace -
    diff --git a/apps/admin/core/components/workspace/list-item.tsx b/apps/admin/core/components/workspace/list-item.tsx index 01855eec84..2f55ba2a1b 100644 --- a/apps/admin/core/components/workspace/list-item.tsx +++ b/apps/admin/core/components/workspace/list-item.tsx @@ -23,19 +23,19 @@ export const WorkspaceListItem = observer(function WorkspaceListItem({ workspace key={workspaceId} href={`${WEB_BASE_URL}/${encodeURIComponent(workspace.slug)}`} target="_blank" - className="group flex items-center justify-between p-4 gap-2.5 truncate border border-custom-border-200/70 hover:border-custom-border-200 hover:bg-custom-background-90 rounded-md" + className="group flex items-center justify-between p-4 gap-2.5 truncate border border-subtle/70 hover:border-subtle bg-layer-1 hover:bg-layer-1-hover rounded-md" rel="noreferrer" >
    {workspace?.logo_url && workspace.logo_url !== "" ? ( Workspace Logo ) : ( @@ -44,30 +44,30 @@ export const WorkspaceListItem = observer(function WorkspaceListItem({ workspace
    -

    {workspace.name}

    / +

    {workspace.name}

    / -

    [{workspace.slug}]

    +

    [{workspace.slug}]
    {workspace.owner.email && ( -
    -

    Owned by:

    -

    {workspace.owner.email}

    +
    +

    Owned by:

    +

    {workspace.owner.email}

    )} -
    +
    {workspace.total_projects !== null && ( -

    Total projects:

    -

    {workspace.total_projects}

    +

    Total projects:

    +

    {workspace.total_projects}

     )} {workspace.total_members !== null && ( <> • -

    Total members:

    -

    {workspace.total_members}

    +

    Total members:

    +

    {workspace.total_members}

     )} @@ -75,7 +75,7 @@ export const WorkspaceListItem = observer(function WorkspaceListItem({ workspace
    - +
    ); diff --git a/apps/admin/postcss.config.cjs b/apps/admin/postcss.config.cjs deleted file mode 100644 index 8a677108f5..0000000000 --- a/apps/admin/postcss.config.cjs +++ /dev/null @@ -1 +0,0 @@ -module.exports = require("@plane/tailwind-config/postcss.config.js"); diff --git a/apps/admin/postcss.config.js b/apps/admin/postcss.config.js new file mode 100644 index 0000000000..3ad28f15f3 --- /dev/null +++ b/apps/admin/postcss.config.js @@ -0,0 +1,3 @@ +import postcssConfig from "@plane/tailwind-config/postcss.config.js"; + +export default postcssConfig; diff --git a/apps/admin/styles/globals.css b/apps/admin/styles/globals.css index 1b88a170e6..12417088e6 100644 --- a/apps/admin/styles/globals.css +++ b/apps/admin/styles/globals.css @@ -1,373 +1,4 @@ -@import "@plane/propel/styles/fonts.css"; - -@tailwind base; -@tailwind components; -@tailwind utilities; - -@layer components { - .text-1\.5xl { - font-size: 1.375rem; - line-height: 1.875rem; - } - - .text-2\.5xl { - font-size: 1.75rem; - line-height: 2.25rem; - } -} - -@layer base { - html { - font-family: "Inter", sans-serif; - } - - :root { - color-scheme: light !important; - - --color-primary-10: 229, 243, 250; - --color-primary-20: 216, 237, 248; - --color-primary-30: 199, 229, 244; - --color-primary-40: 169, 214, 239; - --color-primary-50: 144, 202, 234; - --color-primary-60: 109, 186, 227; - --color-primary-70: 75, 170, 221; - --color-primary-80: 41, 154, 214; - --color-primary-90: 34, 129, 180; - --color-primary-100: 0, 99, 153; - --color-primary-200: 0, 92, 143; - --color-primary-300: 0, 86, 133; - --color-primary-400: 0, 77, 117; - --color-primary-500: 0, 66, 102; - --color-primary-600: 0, 53, 82; - --color-primary-700: 0, 43, 66; - --color-primary-800: 0, 33, 51; - --color-primary-900: 0, 23, 36; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - --color-shadow-2xs: - 0px 0px 1px 0px rgba(23, 23, 23, 0.06), 0px 1px 2px 0px rgba(23, 23, 23, 0.06), - 0px 1px 2px 0px rgba(23, 23, 23, 0.14); - --color-shadow-xs: - 0px 1px 2px 0px rgba(0, 0, 0, 0.16), 0px 2px 4px 0px rgba(16, 24, 40, 0.12), - 0px 1px 8px -1px rgba(16, 24, 40, 0.1); - --color-shadow-sm: - 0px 1px 4px 0px rgba(0, 0, 0, 0.01), 0px 4px 8px 0px rgba(0, 0, 0, 0.02), 0px 1px 12px 0px rgba(0, 0, 0, 0.12); - --color-shadow-rg: - 0px 3px 6px 0px rgba(0, 0, 0, 0.1), 0px 4px 4px 0px rgba(16, 24, 40, 0.08), - 0px 1px 12px 0px rgba(16, 24, 40, 0.04); - --color-shadow-md: - 0px 4px 8px 0px rgba(0, 0, 0, 0.12), 0px 6px 12px 0px rgba(16, 24, 40, 0.12), - 0px 1px 16px 0px rgba(16, 24, 40, 0.12); - --color-shadow-lg: - 0px 6px 12px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.12), - 0px 1px 24px 0px rgba(16, 24, 40, 0.12); - --color-shadow-xl: - 0px 0px 18px 0px rgba(0, 0, 0, 0.16), 0px 0px 24px 0px rgba(16, 24, 40, 0.16), - 0px 0px 52px 0px rgba(16, 24, 40, 0.16); - --color-shadow-2xl: - 0px 8px 16px 0px rgba(0, 0, 0, 0.12), 0px 12px 24px 0px rgba(16, 24, 40, 0.12), - 0px 1px 32px 0px rgba(16, 24, 40, 0.12); - --color-shadow-3xl: - 0px 12px 24px 0px rgba(0, 0, 0, 0.12), 0px 16px 32px 0px rgba(0, 0, 0, 0.12), - 0px 1px 48px 0px rgba(16, 24, 40, 0.12); - --color-shadow-4xl: 0px 8px 40px 0px rgba(0, 0, 61, 0.05), 0px 12px 32px -16px rgba(0, 0, 0, 0.05); - - --color-sidebar-background-100: var(--color-background-100); /* primary sidebar bg */ - --color-sidebar-background-90: var(--color-background-90); /* secondary sidebar bg */ - --color-sidebar-background-80: var(--color-background-80); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var(--color-text-200); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var(--color-text-400); /* sidebar placeholder text */ - - --color-sidebar-border-100: var(--color-border-100); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var(--color-border-100); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var(--color-border-100); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var(--color-border-100); /* strong sidebar border- 2 */ - - --color-sidebar-shadow-2xs: var(--color-shadow-2xs); - --color-sidebar-shadow-xs: var(--color-shadow-xs); - --color-sidebar-shadow-sm: var(--color-shadow-sm); - --color-sidebar-shadow-rg: var(--color-shadow-rg); - --color-sidebar-shadow-md: var(--color-shadow-md); - --color-sidebar-shadow-lg: var(--color-shadow-lg); - --color-sidebar-shadow-xl: var(--color-shadow-xl); - --color-sidebar-shadow-2xl: var(--color-shadow-2xl); - --color-sidebar-shadow-3xl: var(--color-shadow-3xl); - --color-sidebar-shadow-4xl: var(--color-shadow-4xl); - - /* toast theme */ - --color-toast-success-text: 178, 221, 181; - --color-toast-error-text: 206, 44, 49; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 141, 164, 239; - --color-toast-loading-text: 255, 255, 255; - --color-toast-secondary-text: 185, 187, 198; - --color-toast-tertiary-text: 139, 141, 152; - - --color-toast-success-background: 46, 46, 46; - --color-toast-error-background: 46, 46, 46; - --color-toast-warning-background: 46, 46, 46; - --color-toast-info-background: 46, 46, 46; - --color-toast-loading-background: 46, 46, 46; - - --color-toast-success-border: 42, 126, 59; - --color-toast-error-border: 100, 23, 35; - --color-toast-warning-border: 79, 52, 34; - --color-toast-info-border: 58, 91, 199; - --color-toast-loading-border: 96, 100, 108; - } - - [data-theme="light"], - [data-theme="light-contrast"] { - color-scheme: light !important; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - } - - [data-theme="light"] { - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - /* toast theme */ - --color-toast-success-text: 62, 155, 79; - --color-toast-error-text: 220, 62, 66; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 51, 88, 212; - --color-toast-loading-text: 28, 32, 36; - --color-toast-secondary-text: 128, 131, 141; - --color-toast-tertiary-text: 96, 100, 108; - - --color-toast-success-background: 253, 253, 254; - --color-toast-error-background: 255, 252, 252; - --color-toast-warning-background: 254, 253, 251; - --color-toast-info-background: 253, 253, 254; - --color-toast-loading-background: 253, 253, 254; - - --color-toast-success-border: 218, 241, 219; - --color-toast-error-border: 255, 219, 220; - --color-toast-warning-border: 255, 247, 194; - --color-toast-info-border: 210, 222, 255; - --color-toast-loading-border: 224, 225, 230; - } - - [data-theme="light-contrast"] { - --color-text-100: 11, 11, 11; /* primary text */ - --color-text-200: 38, 38, 38; /* secondary text */ - --color-text-300: 58, 58, 58; /* tertiary text */ - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - } - - [data-theme="dark"], - [data-theme="dark-contrast"] { - color-scheme: dark !important; - - --color-primary-10: 8, 31, 43; - --color-primary-20: 10, 37, 51; - --color-primary-30: 13, 49, 69; - --color-primary-40: 16, 58, 81; - --color-primary-50: 18, 68, 94; - --color-primary-60: 23, 86, 120; - --color-primary-70: 28, 104, 146; - --color-primary-80: 31, 116, 163; - --color-primary-90: 34, 129, 180; - --color-primary-100: 40, 146, 204; - --color-primary-200: 41, 154, 214; - --color-primary-300: 75, 170, 221; - --color-primary-400: 109, 186, 227; - --color-primary-500: 144, 202, 234; - --color-primary-600: 169, 214, 239; - --color-primary-700: 199, 229, 244; - --color-primary-800: 216, 237, 248; - --color-primary-900: 229, 243, 250; - - --color-background-100: 25, 25, 25; /* primary bg */ - --color-background-90: 32, 32, 32; /* secondary bg */ - --color-background-80: 44, 44, 44; /* tertiary bg */ - - --color-shadow-2xs: 0px 0px 1px 0px rgba(0, 0, 0, 0.15), 0px 1px 3px 0px rgba(0, 0, 0, 0.5); - --color-shadow-xs: 0px 0px 2px 0px rgba(0, 0, 0, 0.2), 0px 2px 4px 0px rgba(0, 0, 0, 0.5); - --color-shadow-sm: 0px 0px 4px 0px rgba(0, 0, 0, 0.2), 0px 2px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-rg: 0px 0px 6px 0px rgba(0, 0, 0, 0.2), 0px 4px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-md: 0px 2px 8px 0px rgba(0, 0, 0, 0.2), 0px 4px 8px 0px rgba(0, 0, 0, 0.5); - --color-shadow-lg: 0px 4px 12px 0px rgba(0, 0, 0, 0.25), 0px 4px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-xl: 0px 0px 14px 0px rgba(0, 0, 0, 0.25), 0px 6px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-2xl: 0px 0px 18px 0px rgba(0, 0, 0, 0.25), 0px 8px 12px 0px rgba(0, 0, 0, 0.6); - --color-shadow-3xl: 0px 4px 24px 0px rgba(0, 0, 0, 0.3), 0px 12px 40px 0px rgba(0, 0, 0, 0.65); - } - - [data-theme="dark"] { - --color-text-100: 229, 229, 229; /* primary text */ - --color-text-200: 163, 163, 163; /* secondary text */ - --color-text-300: 115, 115, 115; /* tertiary text */ - --color-text-400: 82, 82, 82; /* placeholder text */ - - --color-scrollbar: 82, 82, 82; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - } - - [data-theme="dark-contrast"] { - --color-text-100: 250, 250, 250; /* primary text */ - --color-text-200: 241, 241, 241; /* secondary text */ - --color-text-300: 212, 212, 212; /* tertiary text */ - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - } - - [data-theme="light"], - [data-theme="dark"], - [data-theme="light-contrast"], - [data-theme="dark-contrast"] { - --color-sidebar-background-100: var(--color-background-100); /* primary sidebar bg */ - --color-sidebar-background-90: var(--color-background-90); /* secondary sidebar bg */ - --color-sidebar-background-80: var(--color-background-80); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var(--color-text-200); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var(--color-text-400); /* sidebar placeholder text */ - - --color-sidebar-border-100: var(--color-border-100); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var(--color-border-200); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var(--color-border-300); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var(--color-border-400); /* strong sidebar border- 2 */ - } -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; - font-variant-ligatures: none; - -webkit-font-variant-ligatures: none; - text-rendering: optimizeLegibility; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; -} - -body { - color: rgba(var(--color-text-100)); -} - -/* scrollbar style */ -::-webkit-scrollbar { - display: none; -} - -@-moz-document url-prefix() { - * { - scrollbar-width: none; - } - .vertical-scrollbar, - .horizontal-scrollbar { - scrollbar-width: initial; - scrollbar-color: rgba(96, 100, 108, 0.1) transparent; - } - .vertical-scrollbar:hover, - .horizontal-scrollbar:hover { - scrollbar-color: rgba(96, 100, 108, 0.25) transparent; - } - .vertical-scrollbar:active, - .horizontal-scrollbar:active { - scrollbar-color: rgba(96, 100, 108, 0.7) transparent; - } -} - -.vertical-scrollbar { - overflow-y: auto; -} -.horizontal-scrollbar { - overflow-x: auto; -} -.vertical-scrollbar::-webkit-scrollbar, -.horizontal-scrollbar::-webkit-scrollbar { - display: block; -} -.vertical-scrollbar::-webkit-scrollbar-track, -.horizontal-scrollbar::-webkit-scrollbar-track { - background-color: transparent; - border-radius: 9999px; -} -.vertical-scrollbar::-webkit-scrollbar-thumb, -.horizontal-scrollbar::-webkit-scrollbar-thumb { - background-clip: padding-box; - background-color: rgba(96, 100, 108, 0.1); - border-radius: 9999px; -} -.vertical-scrollbar:hover::-webkit-scrollbar-thumb, -.horizontal-scrollbar:hover::-webkit-scrollbar-thumb { - background-color: rgba(96, 100, 108, 0.25); -} -.vertical-scrollbar::-webkit-scrollbar-thumb:hover, -.horizontal-scrollbar::-webkit-scrollbar-thumb:hover { - background-color: rgba(96, 100, 108, 0.5); -} -.vertical-scrollbar::-webkit-scrollbar-thumb:active, -.horizontal-scrollbar::-webkit-scrollbar-thumb:active { - background-color: rgba(96, 100, 108, 0.7); -} -.vertical-scrollbar::-webkit-scrollbar-corner, -.horizontal-scrollbar::-webkit-scrollbar-corner { - background-color: transparent; -} -.vertical-scrollbar-margin-top-md::-webkit-scrollbar-track { - margin-top: 44px; -} - -/* scrollbar xs size */ -.scrollbar-xs::-webkit-scrollbar { - height: 10px; - width: 10px; -} -.scrollbar-xs::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} +@import "@plane/tailwind-config/index.css"; .shadow-custom { box-shadow: 2px 2px 8px 2px rgba(234, 231, 250, 0.3); /* Convert #EAE7FA4D to rgba */ @@ -377,45 +8,12 @@ body { @apply backdrop-filter blur-[9px]; } -/* scrollbar sm size */ -.scrollbar-sm::-webkit-scrollbar { - height: 12px; - width: 12px; -} -.scrollbar-sm::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} -/* scrollbar md size */ -.scrollbar-md::-webkit-scrollbar { - height: 14px; - width: 14px; -} -.scrollbar-md::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} -/* scrollbar lg size */ - -.scrollbar-lg::-webkit-scrollbar { - height: 16px; - width: 16px; -} -.scrollbar-lg::-webkit-scrollbar-thumb { - border: 4px solid rgba(0, 0, 0, 0); -} -/* end scrollbar style */ - /* progress bar */ .progress-bar { fill: currentColor; color: rgba(var(--color-sidebar-background-100)); } -::-webkit-input-placeholder, -::placeholder, -:-ms-input-placeholder { - color: rgb(var(--color-text-400)); -} - /* Progress Bar Styles */ :root { --bprogress-color: rgb(var(--color-primary-100)) !important; diff --git a/apps/admin/tailwind.config.cjs b/apps/admin/tailwind.config.cjs deleted file mode 100644 index 9bc917eb42..0000000000 --- a/apps/admin/tailwind.config.cjs +++ /dev/null @@ -1,5 +0,0 @@ -const sharedConfig = require("@plane/tailwind-config/tailwind.config.js"); - -module.exports = { - presets: [sharedConfig], -}; diff --git a/apps/api/plane/seeds/data/issues.json b/apps/api/plane/seeds/data/issues.json index badd0e6115..be966e723a 100644 --- a/apps/api/plane/seeds/data/issues.json +++ b/apps/api/plane/seeds/data/issues.json @@ -3,7 +3,7 @@ "id": 1, "name": "Welcome to Plane 👋", "sequence_id": 1, - "description_html": "

    Hey there! This demo project is your playground to get hands-on with Plane. We've set this up so you can click around and see how everything works without worrying about breaking anything.

    Each work item is designed to make you familiar with the basics of using Plane. Just follow along card by card at your own pace.

    First thing to try

    1. Look in the Properties section below where it says State: Todo.

    2. Click on it and change it to Done from the dropdown. Alternatively, you can drag and drop the card to the Done column.

    ", + "description_html": "

    Hey there! This demo project is your playground to get hands-on with Plane. We've set this up so you can click around and see how everything works without worrying about breaking anything.

    Each work item is designed to make you familiar with the basics of using Plane. Just follow along card by card at your own pace.

    First thing to try

    1. Look in the Properties section below where it says State: Todo.

    2. Click on it and change it to Done from the dropdown. Alternatively, you can drag and drop the card to the Done column.

    ", "description_stripped": "Hey there! This demo project is your playground to get hands-on with Plane. We've set this up so you can click around and see how everything works without worrying about breaking anything.Each work item is designed to make you familiar with the basics of using Plane. Just follow along card by card at your own pace.First thing to tryLook in the Properties section below where it says State: Todo.Click on it and change it to Done from the dropdown. Alternatively, you can drag and drop the card to the Done column.", "sort_order": 1000, "state_id": 4, @@ -17,7 +17,7 @@ "id": 2, "name": "1. Create Projects 🎯", "sequence_id": 2, - "description_html": "


    A Project in Plane is where all your work comes together. Think of it as a base that organizes your work items and everything else your team needs to get things done.

    Note: This tutorial is already set up as a Project, and these cards you're reading are work items within it!

    We're showing you how to create a new project just so you'll know exactly what to do when you're ready to start your own real one.

    1. Look over at the left sidebar and find where it says Projects.

    2. Hover your mouse there and you'll see a little + icon pop up - go ahead and click it!

    3. A modal opens where you can give your project a name and other details.

    4. Notice the Access type options? Public means anyone (except Guest users) can see and join it, while Private keeps it just for those you invite.

      Tip: You can also quickly create a new project by using the keyboard shortcut P from anywhere in Plane!

    ", + "description_html": "


    A Project in Plane is where all your work comes together. Think of it as a base that organizes your work items and everything else your team needs to get things done.

    Note: This tutorial is already set up as a Project, and these cards you're reading are work items within it!

    We're showing you how to create a new project just so you'll know exactly what to do when you're ready to start your own real one.

    1. Look over at the left sidebar and find where it says Projects.

    2. Hover your mouse there and you'll see a little + icon pop up - go ahead and click it!

    3. A modal opens where you can give your project a name and other details.

    4. Notice the Access type options? Public means anyone (except Guest users) can see and join it, while Private keeps it just for those you invite.

      Tip: You can also quickly create a new project by using the keyboard shortcut P from anywhere in Plane!

    ", "sort_order": 2000, "state_id": 2, "labels": [2], @@ -30,7 +30,7 @@ "id": 3, "name": "2. Invite your team 🤜🤛", "sequence_id": 3, - "description_html": "

    Let's get your teammates on board!

    First, you'll need to invite them to your workspace before they can join specific projects:

    1. Click on your workspace name in the top-left corner, then select Settings from the dropdown.

    2. Head over to the Members tab - this is your user management hub. Click Add member on the top right.

    3. Enter your teammate's email address. Select a role for them (Admin, Member or Guest) that determines what they can do in the workspace.

    4. Your team member will get an email invite. Once they've joined your workspace, you can add them to specific projects.

    5. To do this, go to your project's Settings page.

    6. Find the Members section, select your teammate, and assign them a project role - this controls what they can do within just this project.


    That's it!

    To learn more about user management, see Manage users and roles.

    ", + "description_html": "

    Let's get your teammates on board!

    First, you'll need to invite them to your workspace before they can join specific projects:

    1. Click on your workspace name in the top-left corner, then select Settings from the dropdown.

    2. Head over to the Members tab - this is your user management hub. Click Add member on the top right.

    3. Enter your teammate's email address. Select a role for them (Admin, Member or Guest) that determines what they can do in the workspace.

    4. Your team member will get an email invite. Once they've joined your workspace, you can add them to specific projects.

    5. To do this, go to your project's Settings page.

    6. Find the Members section, select your teammate, and assign them a project role - this controls what they can do within just this project.


    That's it!

    To learn more about user management, see Manage users and roles.

    ", "description_stripped": "Let's get your teammates on board!First, you'll need to invite them to your workspace before they can join specific projects:Click on your workspace name in the top-left corner, then select Settings from the dropdown.Head over to the Members tab - this is your user management hub. Click Add member on the top right.Enter your teammate's email address. Select a role for them (Admin, Member or Guest) that determines what they can do in the workspace.Your team member will get an email invite. Once they've joined your workspace, you can add them to specific projects.To do this, go to your project's Settings page.Find the Members section, select your teammate, and assign them a project role - this controls what they can do within just this project.That's it!To learn more about user management, see Manage users and roles.", "sort_order": 3000, "state_id": 1, @@ -44,7 +44,7 @@ "id": 4, "name": "3. Create and assign Work Items ✏️", "sequence_id": 4, - "description_html": "

    A work item is the fundamental building block of your project. Think of these as the actionable tasks that move your project forward.

    Ready to add something to your project's to-do list? Here's how:

    1. Click the Add work item button in the top-right corner of the Work Items page.

    2. Give your task a clear title and add any details in the description.

    3. Set up the essentials:

      • Assign it to a team member (or yourself!)

      • Choose a priority level

      • Add start and due dates if there's a timeline

    Tip: Save time by using the keyboard shortcut C from anywhere in your project to quickly create a new work item!

    Want to dive deeper into all the things you can do with work items? Check out our documentation.

    ", + "description_html": "

    A work item is the fundamental building block of your project. Think of these as the actionable tasks that move your project forward.

    Ready to add something to your project's to-do list? Here's how:

    1. Click the Add work item button in the top-right corner of the Work Items page.

    2. Give your task a clear title and add any details in the description.

    3. Set up the essentials:

      • Assign it to a team member (or yourself!)

      • Choose a priority level

      • Add start and due dates if there's a timeline

    Tip: Save time by using the keyboard shortcut C from anywhere in your project to quickly create a new work item!

    Want to dive deeper into all the things you can do with work items? Check out our documentation.

    ", "description_stripped": "A work item is the fundamental building block of your project. Think of these as the actionable tasks that move your project forward.Ready to add something to your project's to-do list? Here's how:Click the Add work item button in the top-right corner of the Work Items page.Give your task a clear title and add any details in the description.Set up the essentials:Assign it to a team member (or yourself!)Choose a priority levelAdd start and due dates if there's a timelineTip: Save time by using the keyboard shortcut C from anywhere in your project to quickly create a new work item!Want to dive deeper into all the things you can do with work items? Check out our documentation.", "sort_order": 4000, "state_id": 3, @@ -58,7 +58,7 @@ "id": 5, "name": "4. Visualize your work 🔮", "sequence_id": 5, - "description_html": "

    Plane offers multiple ways to look at your work items depending on what you need to see. Let's explore how to change views and customize them!

    Switch between layouts

    1. Look at the top toolbar in your project. You'll see several layout icons.

    2. Click any of these icons to instantly switch between layouts.

    Tip: Different layouts work best for different needs. Try Board view for tracking progress, Calendar for deadline management, and Gantt for timeline planning! See Layouts for more info.

    Filter and display options

    Need to focus on specific work?

    1. Click the Filters dropdown in the toolbar. Select criteria and choose which items to show.

    2. Click the Display dropdown to tailor how the information appears in your layout

    3. Created the perfect setup? Save it for later by clicking the the Save View button.

    4. Access saved views anytime from the Views section in your sidebar.

    ", + "description_html": "

    Plane offers multiple ways to look at your work items depending on what you need to see. Let's explore how to change views and customize them!

    Switch between layouts

    1. Look at the top toolbar in your project. You'll see several layout icons.

    2. Click any of these icons to instantly switch between layouts.

    Tip: Different layouts work best for different needs. Try Board view for tracking progress, Calendar for deadline management, and Gantt for timeline planning! See Layouts for more info.

    Filter and display options

    Need to focus on specific work?

    1. Click the Filters dropdown in the toolbar. Select criteria and choose which items to show.

    2. Click the Display dropdown to tailor how the information appears in your layout

    3. Created the perfect setup? Save it for later by clicking the the Save View button.

    4. Access saved views anytime from the Views section in your sidebar.

    ", "description_stripped": "Plane offers multiple ways to look at your work items depending on what you need to see. Let's explore how to change views and customize them!Switch between layoutsLook at the top toolbar in your project. You'll see several layout icons.Click any of these icons to instantly switch between layouts.Tip: Different layouts work best for different needs. Try Board view for tracking progress, Calendar for deadline management, and Gantt for timeline planning! See Layouts for more info.Filter and display optionsNeed to focus on specific work?Click the Filters dropdown in the toolbar. Select criteria and choose which items to show.Click the Display dropdown to tailor how the information appears in your layoutCreated the perfect setup? Save it for later by clicking the the Save View button.Access saved views anytime from the Views section in your sidebar.", "sort_order": 5000, "state_id": 3, @@ -72,7 +72,7 @@ "id": 6, "name": "5. Use Cycles to time box tasks 🗓️", "sequence_id": 6, - "description_html": "

    A Cycle in Plane is like a sprint - a dedicated timeframe where your team focuses on completing specific work items. It helps you break down your project into manageable chunks with clear start and end dates so everyone knows what to work on and when it needs to be done.

    Setup Cycles

    1. Go to the Cycles section in your project (you can find it in the left sidebar)

    2. Click the Add cycle button in the top-right corner

    3. Enter details and set the start and end dates for your cycle.

    4. Click Create cycle and you're ready to go!

    5. Add existing work items to the Cycle or create new ones.

    Tip: To create a new Cycle quickly, just press Q from anywhere in your project!

    Want to learn more?

    • Starting and stopping cycles

    • Transferring work items between cycles

    • Tracking progress with charts

    Check out our detailed documentation for everything you need to know!

    ", + "description_html": "

    A Cycle in Plane is like a sprint - a dedicated timeframe where your team focuses on completing specific work items. It helps you break down your project into manageable chunks with clear start and end dates so everyone knows what to work on and when it needs to be done.

    Setup Cycles

    1. Go to the Cycles section in your project (you can find it in the left sidebar)

    2. Click the Add cycle button in the top-right corner

    3. Enter details and set the start and end dates for your cycle.

    4. Click Create cycle and you're ready to go!

    5. Add existing work items to the Cycle or create new ones.

    Tip: To create a new Cycle quickly, just press Q from anywhere in your project!

    Want to learn more?

    • Starting and stopping cycles

    • Transferring work items between cycles

    • Tracking progress with charts

    Check out our detailed documentation for everything you need to know!

    ", "description_stripped": "A Cycle in Plane is like a sprint - a dedicated timeframe where your team focuses on completing specific work items. It helps you break down your project into manageable chunks with clear start and end dates so everyone knows what to work on and when it needs to be done.Setup CyclesGo to the Cycles section in your project (you can find it in the left sidebar)Click the Add cycle button in the top-right cornerEnter details and set the start and end dates for your cycle.Click Create cycle and you're ready to go!Add existing work items to the Cycle or create new ones.Tip: To create a new Cycle quickly, just press Q from anywhere in your project!Want to learn more?Starting and stopping cyclesTransferring work items between cyclesTracking progress with chartsCheck out our detailed documentation for everything you need to know!", "sort_order": 6000, "state_id": 1, @@ -86,7 +86,7 @@ "id": 7, "name": "6. Customize your settings ⚙️", "sequence_id": 7, - "description_html": "

    Now that you're getting familiar with Plane, let's explore how you can customize settings to make it work just right for you and your team!

    Workspace settings

    Remember those workspace settings we mentioned when inviting team members? There's a lot more you can do there:

    • Invite and manage workspace members

    • Upgrade plans and manage billing

    • Import data from other tools

    • Export your data

    • Manage integrations

    Project Settings

    Each project has its own settings where you can:

    • Change project details and visibility

    • Invite specific members to just this project

    • Customize your workflow States (like adding a \"Testing\" state)

    • Create and organize Labels

    • Enable or disable features you need (or don't need)

    Your Profile Settings

    You can also customize your own personal experience! Click on your profile icon in the top-right corner to find:

    • Profile settings (update your name, photo, etc.)

    • Choose your timezone and preferred language for the interface

    • Email notification preferences (what you want to be alerted about)

    • Appearance settings (light/dark mode)

    Taking a few minutes to set things up just the way you like will make your everyday Plane experience much smoother!

    Note: Some settings are only available to workspace or project admins. If you don't see certain options, you might need admin access.

    ", + "description_html": "

    Now that you're getting familiar with Plane, let's explore how you can customize settings to make it work just right for you and your team!

    Workspace settings

    Remember those workspace settings we mentioned when inviting team members? There's a lot more you can do there:

    • Invite and manage workspace members

    • Upgrade plans and manage billing

    • Import data from other tools

    • Export your data

    • Manage integrations

    Project Settings

    Each project has its own settings where you can:

    • Change project details and visibility

    • Invite specific members to just this project

    • Customize your workflow States (like adding a \"Testing\" state)

    • Create and organize Labels

    • Enable or disable features you need (or don't need)

    Your Profile Settings

    You can also customize your own personal experience! Click on your profile icon in the top-right corner to find:

    • Profile settings (update your name, photo, etc.)

    • Choose your timezone and preferred language for the interface

    • Email notification preferences (what you want to be alerted about)

    • Appearance settings (light/dark mode)

    Taking a few minutes to set things up just the way you like will make your everyday Plane experience much smoother!

    Note: Some settings are only available to workspace or project admins. If you don't see certain options, you might need admin access.

    ", "description_stripped": "Now that you're getting familiar with Plane, let's explore how you can customize settings to make it work just right for you and your team!Workspace settingsRemember those workspace settings we mentioned when inviting team members? There's a lot more you can do there:Invite and manage workspace membersUpgrade plans and manage billingImport data from other toolsExport your dataManage integrationsProject SettingsEach project has its own settings where you can:Change project details and visibilityInvite specific members to just this projectCustomize your workflow States (like adding a \"Testing\" state)Create and organize LabelsEnable or disable features you need (or don't need)Your Profile SettingsYou can also customize your own personal experience! Click on your profile icon in the top-right corner to find:Profile settings (update your name, photo, etc.)Choose your timezone and preferred language for the interfaceEmail notification preferences (what you want to be alerted about)Appearance settings (light/dark mode)Taking a few minutes to set things up just the way you like will make your everyday Plane experience much smoother!Note: Some settings are only available to workspace or project admins. If you don't see certain options, you might need admin access.", "sort_order": 7000, "state_id": 1, diff --git a/apps/api/plane/seeds/data/pages.json b/apps/api/plane/seeds/data/pages.json index d719220bfe..00c5c91ef0 100644 --- a/apps/api/plane/seeds/data/pages.json +++ b/apps/api/plane/seeds/data/pages.json @@ -1,30 +1,30 @@ [ - { - "id": 1, - "name": "Project Design Spec", - "project_id": 1, - "description_html": "

    Welcome to your Project Pages — the documentation hub for this specific project.
    Each project in Plane can have its own Wiki space where you track plans, specs, updates, and learnings — all connected to your issues and modules.

    🧭 Project Summary

    Field

    Details

    Project Name

    ✏ Add your project name

    Owner

    Add project owner(s)

    Status

    🟢 Active / 🟡 In Progress / 🔴 Blocked

    Start Date

    —

    Target Release

    —

    Linked Modules

    Engineering, Security

    Cycle(s)

    Cycle 1, Cycle 2

    🧩 Use tables to summarize key project metadata or links.

    🎯 Goals & Objectives

    🎯 Primary Goals

    • Deliver MVP with all core features

    • Validate feature adoption with early users

    • Prepare launch plan for v1 release

    ⚙ Success Metrics

    Metric

    Target

    Owner

    User adoption

    100 active users

    Growth

    Performance

    < 200ms latency

    Backend

    Design feedback

    ≥ 8/10 average rating

    Design

    📈 Define measurable outcomes and track progress alongside issues.

    🧩 Scope & Deliverables

    Deliverable

    Owner

    Status

    Authentication flow

    Backend

    ✅ Done

    Issue board UI

    Frontend

    🏗 In Progress

    API integration

    Backend

    ⏳ Pending

    Documentation

    PM

    📝 Drafting

    🧩 Use tables or checklists to track scope and ownership.

    🧱 Architecture or System Design

    Use this section for technical deep dives or diagrams.

    Frontend → GraphQL → Backend → PostgreSQL\nRedis for caching | RabbitMQ for background jobs

    ", - "description": "{\"type\": \"doc\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Welcome to your \", \"type\": \"text\"}, {\"text\": \"Project Pages\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" — the documentation hub for this specific project.\", \"type\": \"text\"}, {\"type\": \"hardBreak\"}, {\"text\": \"Each project in Plane can have its own Wiki space where you track \", \"type\": \"text\"}, {\"text\": \"plans, specs, updates, and learnings\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" — all connected to your issues and modules.\", \"type\": \"text\"}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"compass\"}}, {\"text\": \" Project Summary\", \"type\": \"text\"}]}, {\"type\": \"table\", \"content\": [{\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Field\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Details\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Project Name\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"pencil\"}}, {\"text\": \" Add your project name\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Owner\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Add project owner(s)\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Status\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"green_circle\"}}, {\"text\": \" Active / \", \"type\": \"text\"}, {\"type\": \"emoji\", \"attrs\": {\"name\": \"yellow_circle\"}}, {\"text\": \" In Progress / \", \"type\": \"text\"}, {\"type\": \"emoji\", \"attrs\": {\"name\": \"red_circle\"}}, {\"text\": \" Blocked\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Start Date\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"—\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Target Release\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"—\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Linked Modules\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Engineering, Security\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Cycle(s)\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Cycle 1, Cycle 2\", \"type\": \"text\"}]}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"jigsaw\"}}, {\"text\": \" Use tables to summarize key project metadata or links.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bullseye\"}}, {\"text\": \" Goals & Objectives\", \"type\": \"text\"}]}, {\"type\": \"heading\", \"attrs\": {\"level\": 3, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bullseye\"}}, {\"text\": \" Primary Goals\", \"type\": \"text\"}]}, {\"type\": \"bulletList\", \"content\": [{\"type\": \"listItem\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Deliver MVP with all core features\", \"type\": \"text\"}]}]}, {\"type\": \"listItem\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Validate feature adoption with early users\", \"type\": \"text\"}]}]}, {\"type\": \"listItem\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Prepare launch plan for v1 release\", \"type\": \"text\"}]}]}]}, {\"type\": \"heading\", \"attrs\": {\"level\": 3, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"gear\"}}, {\"text\": \" Success Metrics\", \"type\": \"text\"}]}, {\"type\": \"table\", \"content\": [{\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Metric\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Target\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Owner\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"User adoption\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"100 active users\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Growth\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Performance\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"< 200ms latency\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Backend\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Design feedback\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"≥ 8/10 average rating\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Design\", \"type\": \"text\"}]}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"chart_increasing\"}}, {\"text\": \" Define measurable outcomes and track progress alongside issues.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"jigsaw\"}}, {\"text\": \" Scope & Deliverables\", \"type\": \"text\"}]}, {\"type\": \"table\", \"content\": [{\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Deliverable\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Owner\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Status\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Authentication flow\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Backend\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"check_mark_button\"}}, {\"text\": \" Done\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Issue board UI\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Frontend\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"building_construction\"}}, {\"text\": \" In Progress\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"API integration\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Backend\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"hourglass_flowing_sand\"}}, {\"text\": \" Pending\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Documentation\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"PM\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"memo\"}}, {\"text\": \" Drafting\", \"type\": \"text\"}]}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"jigsaw\"}}, {\"text\": \" Use tables or checklists to track scope and ownership.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bricks\"}}, {\"text\": \" Architecture or System Design\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Use this section for \", \"type\": \"text\"}, {\"text\": \"technical deep dives\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" or diagrams.\", \"type\": \"text\"}]}, {\"type\": \"codeBlock\", \"attrs\": {\"language\": \"bash\"}, \"content\": [{\"text\": \"Frontend → GraphQL → Backend → PostgreSQL\\nRedis for caching | RabbitMQ for background jobs\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}}]}", - "description_stripped": "Welcome to your Project Pages — the documentation hub for this specific project.Each project in Plane can have its own Wiki space where you track plans, specs, updates, and learnings — all connected to your issues and modules.🧭 Project SummaryFieldDetailsProject Name✏ Add your project nameOwnerAdd project owner(s)Status🟢 Active / 🟡 In Progress / 🔴 BlockedStart Date—Target Release—Linked ModulesEngineering, SecurityCycle(s)Cycle 1, Cycle 2🧩 Use tables to summarize key project metadata or links.🎯 Goals & Objectives🎯 Primary GoalsDeliver MVP with all core featuresValidate feature adoption with early usersPrepare launch plan for v1 release⚙ Success MetricsMetricTargetOwnerUser adoption100 active usersGrowthPerformance< 200ms latencyBackendDesign feedback≥ 8/10 average ratingDesign📈 Define measurable outcomes and track progress alongside issues.🧩 Scope & DeliverablesDeliverableOwnerStatusAuthentication flowBackend✅ DoneIssue board UIFrontend🏗 In ProgressAPI integrationBackend⏳ PendingDocumentationPM📝 Drafting🧩 Use tables or checklists to track scope and ownership.🧱 Architecture or System DesignUse this section for technical deep dives or diagrams.Frontend → GraphQL → Backend → PostgreSQL\nRedis for caching | RabbitMQ for background jobs", - "type": "PROJECT", - "access": 0, - "logo_props": { - "emoji": { - "url": "https://cdn.jsdelivr.net/npm/emoji-datasource-apple/img/apple/64/1f680.png", - "value": "128640" - }, - "in_use": "emoji" - } - }, - { - "id": 2, - "name": "Project Draft proposal", - "project_id": 1, - "description": "{\"type\": \"doc\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"This is your \", \"type\": \"text\"}, {\"text\": \"Project Draft area\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" — a private space inside the project where you can experiment, outline ideas, or prepare content before sharing it on the public Project Page.\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"It’s visible only to you (and collaborators you explicitly share with).\", \"type\": \"text\"}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"writing_hand\"}}, {\"text\": \" Current Work in Progress\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"speech_balloon\"}}, {\"text\": \" Use this section to jot down raw ideas, rough notes, or specs that aren’t ready yet.\", \"type\": \"text\"}]}]}, {\"type\": \"taskList\", \"content\": [{\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Outline project summary and goals\", \"type\": \"text\"}]}]}, {\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Draft new feature spec\", \"type\": \"text\"}]}]}, {\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Review dependency list\", \"type\": \"text\"}]}]}, {\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Collect team feedback for next iteration\", \"type\": \"text\"}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"check_mark_button\"}}, {\"text\": \" Tip: Turn these items into actionable issues when finalized.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bricks\"}}, {\"text\": \" Prototype Commands (if technical)\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"You can also use \", \"type\": \"text\"}, {\"text\": \"code blocks\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" to store snippets, scripts, or notes:\", \"type\": \"text\"}]}, {\"type\": \"codeBlock\", \"attrs\": {\"language\": \"bash\"}, \"content\": [{\"text\": \"# Rebuild Docker containers\\ndocker compose build backend frontend\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}}]}", - "description_html": "

    This is your Project Draft area — a private space inside the project where you can experiment, outline ideas, or prepare content before sharing it on the public Project Page.

    It’s visible only to you (and collaborators you explicitly share with).

    ✍ Current Work in Progress

    💬 Use this section to jot down raw ideas, rough notes, or specs that aren’t ready yet.

    • Outline project summary and goals

    • Draft new feature spec

    • Review dependency list

    • Collect team feedback for next iteration

    ✅ Tip: Turn these items into actionable issues when finalized.

    🧱 Prototype Commands (if technical)

    You can also use code blocks to store snippets, scripts, or notes:

    # Rebuild Docker containers\ndocker compose build backend frontend

    ", - "description_stripped": "This is your Project Draft area — a private space inside the project where you can experiment, outline ideas, or prepare content before sharing it on the public Project Page.It’s visible only to you (and collaborators you explicitly share with).✍ Current Work in Progress💬 Use this section to jot down raw ideas, rough notes, or specs that aren’t ready yet. Outline project summary and goals Draft new feature spec Review dependency list Collect team feedback for next iteration✅ Tip: Turn these items into actionable issues when finalized.🧱 Prototype Commands (if technical)You can also use code blocks to store snippets, scripts, or notes:# Rebuild Docker containers\ndocker compose build backend frontend", - "type": "PROJECT", - "access": 1, - "logo_props": "{\"emoji\": {\"url\": \"https://cdn.jsdelivr.net/npm/emoji-datasource-apple/img/apple/64/1f9f1.png\", \"value\": \"129521\"}, \"in_use\": \"emoji\"}" + { + "id": 1, + "name": "Project Design Spec", + "project_id": 1, + "description_html": "

    Welcome to your Project Pages — the documentation hub for this specific project.
    Each project in Plane can have its own Wiki space where you track plans, specs, updates, and learnings — all connected to your issues and modules.

    🧭 Project Summary

    Field

    Details

    Project Name

    ✏ Add your project name

    Owner

    Add project owner(s)

    Status

    🟢 Active / 🟡 In Progress / 🔴 Blocked

    Start Date

    —

    Target Release

    —

    Linked Modules

    Engineering, Security

    Cycle(s)

    Cycle 1, Cycle 2

    🧩 Use tables to summarize key project metadata or links.

    🎯 Goals & Objectives

    🎯 Primary Goals

    • Deliver MVP with all core features

    • Validate feature adoption with early users

    • Prepare launch plan for v1 release

    ⚙ Success Metrics

    Metric

    Target

    Owner

    User adoption

    100 active users

    Growth

    Performance

    < 200ms latency

    Backend

    Design feedback

    ≥ 8/10 average rating

    Design

    📈 Define measurable outcomes and track progress alongside issues.

    🧩 Scope & Deliverables

    Deliverable

    Owner

    Status

    Authentication flow

    Backend

    ✅ Done

    Issue board UI

    Frontend

    🏗 In Progress

    API integration

    Backend

    ⏳ Pending

    Documentation

    PM

    📝 Drafting

    🧩 Use tables or checklists to track scope and ownership.

    🧱 Architecture or System Design

    Use this section for technical deep dives or diagrams.

    Frontend → GraphQL → Backend → PostgreSQL\nRedis for caching | RabbitMQ for background jobs

    ", + "description": "{\"type\": \"doc\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Welcome to your \", \"type\": \"text\"}, {\"text\": \"Project Pages\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" — the documentation hub for this specific project.\", \"type\": \"text\"}, {\"type\": \"hardBreak\"}, {\"text\": \"Each project in Plane can have its own Wiki space where you track \", \"type\": \"text\"}, {\"text\": \"plans, specs, updates, and learnings\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" — all connected to your issues and modules.\", \"type\": \"text\"}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"compass\"}}, {\"text\": \" Project Summary\", \"type\": \"text\"}]}, {\"type\": \"table\", \"content\": [{\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Field\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Details\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Project Name\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"pencil\"}}, {\"text\": \" Add your project name\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Owner\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Add project owner(s)\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Status\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"green_circle\"}}, {\"text\": \" Active / \", \"type\": \"text\"}, {\"type\": \"emoji\", \"attrs\": {\"name\": \"yellow_circle\"}}, {\"text\": \" In Progress / \", \"type\": \"text\"}, {\"type\": \"emoji\", \"attrs\": {\"name\": \"red_circle\"}}, {\"text\": \" Blocked\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Start Date\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"—\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Target Release\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"—\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Linked Modules\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Engineering, Security\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Cycle(s)\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [666], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Cycle 1, Cycle 2\", \"type\": \"text\"}]}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"jigsaw\"}}, {\"text\": \" Use tables to summarize key project metadata or links.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bullseye\"}}, {\"text\": \" Goals & Objectives\", \"type\": \"text\"}]}, {\"type\": \"heading\", \"attrs\": {\"level\": 3, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bullseye\"}}, {\"text\": \" Primary Goals\", \"type\": \"text\"}]}, {\"type\": \"bulletList\", \"content\": [{\"type\": \"listItem\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Deliver MVP with all core features\", \"type\": \"text\"}]}]}, {\"type\": \"listItem\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Validate feature adoption with early users\", \"type\": \"text\"}]}]}, {\"type\": \"listItem\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Prepare launch plan for v1 release\", \"type\": \"text\"}]}]}]}, {\"type\": \"heading\", \"attrs\": {\"level\": 3, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"gear\"}}, {\"text\": \" Success Metrics\", \"type\": \"text\"}]}, {\"type\": \"table\", \"content\": [{\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Metric\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Target\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Owner\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"User adoption\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"100 active users\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Growth\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Performance\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"< 200ms latency\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Backend\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Design feedback\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"≥ 8/10 average rating\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Design\", \"type\": \"text\"}]}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"chart_increasing\"}}, {\"text\": \" Define measurable outcomes and track progress alongside issues.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"jigsaw\"}}, {\"text\": \" Scope & Deliverables\", \"type\": \"text\"}]}, {\"type\": \"table\", \"content\": [{\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Deliverable\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Owner\", \"type\": \"text\"}]}]}, {\"type\": \"tableHeader\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"background\": \"none\", \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Status\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Authentication flow\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Backend\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"check_mark_button\"}}, {\"text\": \" Done\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Issue board UI\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Frontend\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"building_construction\"}}, {\"text\": \" In Progress\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"API integration\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Backend\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"hourglass_flowing_sand\"}}, {\"text\": \" Pending\", \"type\": \"text\"}]}]}]}, {\"type\": \"tableRow\", \"attrs\": {\"textColor\": null, \"background\": null}, \"content\": [{\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Documentation\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"PM\", \"type\": \"text\"}]}]}, {\"type\": \"tableCell\", \"attrs\": {\"colspan\": 1, \"rowspan\": 1, \"colwidth\": [150], \"textColor\": null, \"background\": null, \"hideContent\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"memo\"}}, {\"text\": \" Drafting\", \"type\": \"text\"}]}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"jigsaw\"}}, {\"text\": \" Use tables or checklists to track scope and ownership.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bricks\"}}, {\"text\": \" Architecture or System Design\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"Use this section for \", \"type\": \"text\"}, {\"text\": \"technical deep dives\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" or diagrams.\", \"type\": \"text\"}]}, {\"type\": \"codeBlock\", \"attrs\": {\"language\": \"bash\"}, \"content\": [{\"text\": \"Frontend → GraphQL → Backend → PostgreSQL\\nRedis for caching | RabbitMQ for background jobs\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}}]}", + "description_stripped": "Welcome to your Project Pages — the documentation hub for this specific project.Each project in Plane can have its own Wiki space where you track plans, specs, updates, and learnings — all connected to your issues and modules.🧭 Project SummaryFieldDetailsProject Name✏ Add your project nameOwnerAdd project owner(s)Status🟢 Active / 🟡 In Progress / 🔴 BlockedStart Date—Target Release—Linked ModulesEngineering, SecurityCycle(s)Cycle 1, Cycle 2🧩 Use tables to summarize key project metadata or links.🎯 Goals & Objectives🎯 Primary GoalsDeliver MVP with all core featuresValidate feature adoption with early usersPrepare launch plan for v1 release⚙ Success MetricsMetricTargetOwnerUser adoption100 active usersGrowthPerformance< 200ms latencyBackendDesign feedback≥ 8/10 average ratingDesign📈 Define measurable outcomes and track progress alongside issues.🧩 Scope & DeliverablesDeliverableOwnerStatusAuthentication flowBackend✅ DoneIssue board UIFrontend🏗 In ProgressAPI integrationBackend⏳ PendingDocumentationPM📝 Drafting🧩 Use tables or checklists to track scope and ownership.🧱 Architecture or System DesignUse this section for technical deep dives or diagrams.Frontend → GraphQL → Backend → PostgreSQL\nRedis for caching | RabbitMQ for background jobs", + "type": "PROJECT", + "access": 0, + "logo_props": { + "emoji": { + "url": "https://cdn.jsdelivr.net/npm/emoji-datasource-apple/img/apple/64/1f680.png", + "value": "128640" + }, + "in_use": "emoji" } -] \ No newline at end of file + }, + { + "id": 2, + "name": "Project Draft proposal", + "project_id": 1, + "description": "{\"type\": \"doc\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"This is your \", \"type\": \"text\"}, {\"text\": \"Project Draft area\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" — a private space inside the project where you can experiment, outline ideas, or prepare content before sharing it on the public Project Page.\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"It’s visible only to you (and collaborators you explicitly share with).\", \"type\": \"text\"}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"writing_hand\"}}, {\"text\": \" Current Work in Progress\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"speech_balloon\"}}, {\"text\": \" Use this section to jot down raw ideas, rough notes, or specs that aren’t ready yet.\", \"type\": \"text\"}]}]}, {\"type\": \"taskList\", \"content\": [{\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Outline project summary and goals\", \"type\": \"text\"}]}]}, {\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Draft new feature spec\", \"type\": \"text\"}]}]}, {\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Review dependency list\", \"type\": \"text\"}]}]}, {\"type\": \"taskItem\", \"attrs\": {\"checked\": false}, \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \" Collect team feedback for next iteration\", \"type\": \"text\"}]}]}]}, {\"type\": \"blockquote\", \"content\": [{\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"check_mark_button\"}}, {\"text\": \" Tip: Turn these items into actionable issues when finalized.\", \"type\": \"text\"}]}]}, {\"type\": \"horizontalRule\"}, {\"type\": \"heading\", \"attrs\": {\"level\": 2, \"textAlign\": null}, \"content\": [{\"type\": \"emoji\", \"attrs\": {\"name\": \"bricks\"}}, {\"text\": \" Prototype Commands (if technical)\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}, \"content\": [{\"text\": \"You can also use \", \"type\": \"text\"}, {\"text\": \"code blocks\", \"type\": \"text\", \"marks\": [{\"type\": \"bold\"}]}, {\"text\": \" to store snippets, scripts, or notes:\", \"type\": \"text\"}]}, {\"type\": \"codeBlock\", \"attrs\": {\"language\": \"bash\"}, \"content\": [{\"text\": \"# Rebuild Docker containers\\ndocker compose build backend frontend\", \"type\": \"text\"}]}, {\"type\": \"paragraph\", \"attrs\": {\"textAlign\": null}}]}", + "description_html": "

    This is your Project Draft area — a private space inside the project where you can experiment, outline ideas, or prepare content before sharing it on the public Project Page.

    It’s visible only to you (and collaborators you explicitly share with).

    ✍ Current Work in Progress

    💬 Use this section to jot down raw ideas, rough notes, or specs that aren’t ready yet.

    • Outline project summary and goals

    • Draft new feature spec

    • Review dependency list

    • Collect team feedback for next iteration

    ✅ Tip: Turn these items into actionable issues when finalized.

    🧱 Prototype Commands (if technical)

    You can also use code blocks to store snippets, scripts, or notes:

    # Rebuild Docker containers\ndocker compose build backend frontend

    ", + "description_stripped": "This is your Project Draft area — a private space inside the project where you can experiment, outline ideas, or prepare content before sharing it on the public Project Page.It’s visible only to you (and collaborators you explicitly share with).✍ Current Work in Progress💬 Use this section to jot down raw ideas, rough notes, or specs that aren’t ready yet. Outline project summary and goals Draft new feature spec Review dependency list Collect team feedback for next iteration✅ Tip: Turn these items into actionable issues when finalized.🧱 Prototype Commands (if technical)You can also use code blocks to store snippets, scripts, or notes:# Rebuild Docker containers\ndocker compose build backend frontend", + "type": "PROJECT", + "access": 1, + "logo_props": "{\"emoji\": {\"url\": \"https://cdn.jsdelivr.net/npm/emoji-datasource-apple/img/apple/64/1f9f1.png\", \"value\": \"129521\"}, \"in_use\": \"emoji\"}" + } +] diff --git a/apps/space/app/error.tsx b/apps/space/app/error.tsx index 2330b90338..5f3ecace49 100644 --- a/apps/space/app/error.tsx +++ b/apps/space/app/error.tsx @@ -10,8 +10,8 @@ function ErrorPage() {
    -

    Yikes! That doesn{"'"}t look good.

    -

    +

    Yikes! That doesn{"'"}t look good.

    +

    That crashed Plane, pun intended. No worries, though. Our engineers have been notified. If you have more details, please write to{" "} @@ -30,10 +30,10 @@ function ErrorPage() {

    - - {/* */}
    diff --git a/apps/space/app/issues/[anchor]/layout.tsx b/apps/space/app/issues/[anchor]/layout.tsx index 60a171bcf5..e32b008a24 100644 --- a/apps/space/app/issues/[anchor]/layout.tsx +++ b/apps/space/app/issues/[anchor]/layout.tsx @@ -127,10 +127,10 @@ function IssuesLayout(props: Route.ComponentProps) { return ( <>
    -
    +
    -
    +
    diff --git a/apps/space/app/not-found.tsx b/apps/space/app/not-found.tsx index 9fcfd8a74b..411859ac04 100644 --- a/apps/space/app/not-found.tsx +++ b/apps/space/app/not-found.tsx @@ -5,13 +5,13 @@ function NotFound() { return (
    -
    +
    Something went wrong
    -

    That didn{"'"}t work

    -

    +

    That didn{"'"}t work

    +

    Check the URL you are entering in the browser{"'"}s address bar and try again.

    diff --git a/apps/space/core/components/account/auth-forms/auth-banner.tsx b/apps/space/core/components/account/auth-forms/auth-banner.tsx index 3ad6e775c6..689fde5e94 100644 --- a/apps/space/core/components/account/auth-forms/auth-banner.tsx +++ b/apps/space/core/components/account/auth-forms/auth-banner.tsx @@ -13,13 +13,13 @@ export function AuthBanner(props: TAuthBanner) { if (!bannerData) return <>; return ( -
    +
    - +
    -
    {bannerData?.message}
    +
    {bannerData?.message}
    handleBannerData && handleBannerData(undefined)} > diff --git a/apps/space/core/components/account/auth-forms/auth-header.tsx b/apps/space/core/components/account/auth-forms/auth-header.tsx index 9b0c95c3ea..cac429ffdf 100644 --- a/apps/space/core/components/account/auth-forms/auth-header.tsx +++ b/apps/space/core/components/account/auth-forms/auth-header.tsx @@ -44,8 +44,8 @@ export function AuthHeader(props: TAuthHeader) { return ( <>
    - {header} - {subHeader} + {header} + {subHeader}
    ); diff --git a/apps/space/core/components/account/auth-forms/email.tsx b/apps/space/core/components/account/auth-forms/email.tsx index 9ed44db83a..f407219b0f 100644 --- a/apps/space/core/components/account/auth-forms/email.tsx +++ b/apps/space/core/components/account/auth-forms/email.tsx @@ -46,13 +46,13 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo return (
    -
    -
    diff --git a/apps/space/core/components/account/auth-forms/password.tsx b/apps/space/core/components/account/auth-forms/password.tsx index 5b99cda2e6..cf622f92f7 100644 --- a/apps/space/core/components/account/auth-forms/password.tsx +++ b/apps/space/core/components/account/auth-forms/password.tsx @@ -116,12 +116,10 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
    -
    +
    handleFormChange("email", e.target.value)} placeholder="name@company.com" - className={`disable-autofill-style h-10 w-full placeholder:text-custom-text-400 border-0`} + className={`disable-autofill-style h-10 w-full placeholder:text-placeholder border-0`} disabled /> {passwordFormData.email.length > 0 && ( @@ -142,17 +140,17 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
    -
    +
    handleFormChange("password", e.target.value)} placeholder="Enter password" - className="disable-autofill-style h-10 w-full border border-custom-border-100 !bg-custom-background-100 pr-12 placeholder:text-custom-text-400" + className="disable-autofill-style h-10 w-full border border-subtle !bg-surface-1 pr-12 placeholder:text-placeholder" onFocus={() => setIsPasswordInputFocused(true)} onBlur={() => setIsPasswordInputFocused(false)} autoComplete="on" @@ -175,17 +173,17 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props) {mode === EAuthModes.SIGN_UP && (
    -
    {mode === EAuthModes.SIGN_IN ? ( <> - )} ) : ( - )} diff --git a/apps/space/core/components/account/auth-forms/unique-code.tsx b/apps/space/core/components/account/auth-forms/unique-code.tsx index fff0338371..fd347bfd94 100644 --- a/apps/space/core/components/account/auth-forms/unique-code.tsx +++ b/apps/space/core/components/account/auth-forms/unique-code.tsx @@ -80,12 +80,10 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
    -
    +
    handleFormChange("email", e.target.value)} placeholder="name@company.com" - className={`disable-autofill-style h-10 w-full placeholder:text-custom-text-400 border-0`} + className={`disable-autofill-style h-10 w-full placeholder:text-placeholder border-0`} disabled /> {uniqueCodeFormData.email.length > 0 && ( @@ -106,7 +104,7 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
    -
    +

    Paste the code sent to your email @@ -127,8 +125,8 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) { onClick={() => generateNewCode(uniqueCodeFormData.email)} className={`${ isRequestNewCodeDisabled - ? "text-custom-text-400" - : "font-medium text-custom-primary-300 hover:text-custom-primary-200" + ? "text-placeholder" + : "font-medium text-accent-secondary hover:text-accent-secondary" }`} disabled={isRequestNewCodeDisabled} > @@ -142,7 +140,7 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {

    -
    diff --git a/apps/space/core/components/account/terms-and-conditions.tsx b/apps/space/core/components/account/terms-and-conditions.tsx index 14e51ac63b..2b3e8daa97 100644 --- a/apps/space/core/components/account/terms-and-conditions.tsx +++ b/apps/space/core/components/account/terms-and-conditions.tsx @@ -8,14 +8,14 @@ export function TermsAndConditions(props: Props) { const { isSignUp = false } = props; return ( -

    +

    {isSignUp ? "By creating an account" : "By signing in"}, you agree to our{" \n"} - Terms of Service + Terms of Service {" "} and{" "} - Privacy Policy + Privacy Policy {"."}

    diff --git a/apps/space/core/components/account/user-logged-in.tsx b/apps/space/core/components/account/user-logged-in.tsx index 0e47d6e17d..fb719cd723 100644 --- a/apps/space/core/components/account/user-logged-in.tsx +++ b/apps/space/core/components/account/user-logged-in.tsx @@ -16,20 +16,20 @@ export const UserLoggedIn = observer(function UserLoggedIn() { return (
    -
    - +
    +
    -
    +
    User already logged in
    -

    Nice! Just one more step.

    -

    +

    Nice! Just one more step.

    +

    Enter the public-share URL or link of the view or Page you are trying to see in the browser{"'"}s address bar.

    diff --git a/apps/space/core/components/common/powered-by.tsx b/apps/space/core/components/common/powered-by.tsx index 116c4c40fe..e43c27ca68 100644 --- a/apps/space/core/components/common/powered-by.tsx +++ b/apps/space/core/components/common/powered-by.tsx @@ -15,12 +15,12 @@ export function PoweredBy(props: TPoweredBy) { return ( - -
    + +
    Powered by Plane Publish
    diff --git a/apps/space/core/components/common/project-logo.tsx b/apps/space/core/components/common/project-logo.tsx index 5f7869afe2..7319826c83 100644 --- a/apps/space/core/components/common/project-logo.tsx +++ b/apps/space/core/components/common/project-logo.tsx @@ -17,7 +17,7 @@ export function ProjectLogo(props: Props) { style={{ color: logo.icon.color, }} - className={cn("material-symbols-rounded text-base", className)} + className={cn("material-symbols-rounded text-14", className)} > {logo.icon.name} @@ -25,7 +25,7 @@ export function ProjectLogo(props: Props) { if (logo.in_use === "emoji" && logo.emoji) return ( - + {logo.emoji.value?.split("-").map((emoji) => String.fromCodePoint(parseInt(emoji, 10)))} ); diff --git a/apps/space/core/components/editor/embeds/mentions/user.tsx b/apps/space/core/components/editor/embeds/mentions/user.tsx index bb3cc37562..33265537b2 100644 --- a/apps/space/core/components/editor/embeds/mentions/user.tsx +++ b/apps/space/core/components/editor/embeds/mentions/user.tsx @@ -19,7 +19,7 @@ export const EditorUserMention = observer(function EditorUserMention(props: Prop if (!userDetails) { return ( -
    +
    @deactivated user
    ); @@ -27,12 +27,9 @@ export const EditorUserMention = observer(function EditorUserMention(props: Prop return (
    @{userDetails?.member__display_name}
    diff --git a/apps/space/core/components/editor/lite-text-editor.tsx b/apps/space/core/components/editor/lite-text-editor.tsx index d6d487dd7c..dc17219caf 100644 --- a/apps/space/core/components/editor/lite-text-editor.tsx +++ b/apps/space/core/components/editor/lite-text-editor.tsx @@ -59,7 +59,7 @@ export const LiteTextEditor = React.forwardRef(function LiteTextEditor( }); return ( -
    +
    -
    +
    +
    {Object.keys(toolbarItems).map((key, index) => (
    @@ -65,9 +65,9 @@ export function IssueCommentToolbar(props: Props) { +

    {item.name} - {item.shortcut && {item.shortcut.join(" + ")}} + {item.shortcut && {item.shortcut.join(" + ")}}

    } > @@ -75,15 +75,15 @@ export function IssueCommentToolbar(props: Props) { type="button" onClick={() => executeCommand(item)} className={cn( - "grid place-items-center aspect-square rounded-sm p-0.5 text-custom-text-400 hover:bg-custom-background-80", + "grid place-items-center aspect-square rounded-xs p-0.5 text-placeholder hover:bg-layer-transparent-hover", { - "bg-custom-background-80 text-custom-text-100": isItemActive, + "bg-layer-transparent-hover text-primary": isItemActive, } )} > @@ -99,7 +99,6 @@ export function IssueCommentToolbar(props: Props) {
    diff --git a/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx b/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx index 6fd9352ef2..73be2c1059 100644 --- a/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx +++ b/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx @@ -30,9 +30,9 @@ export const AppliedFiltersList = observer(function AppliedFiltersList(props: Pr return (
    - {replaceUnderscoreIfSnakeCase(filterKey)} + {replaceUnderscoreIfSnakeCase(filterKey)}
    {filterKey === "priority" && ( handleRemoveFilter(filterKey, null)} > @@ -62,7 +62,7 @@ export const AppliedFiltersList = observer(function AppliedFiltersList(props: Pr -
    - ))} + {values?.map((priority) => ( +
    + + {priority} + +
    + ))} ); } diff --git a/apps/space/core/components/issues/filters/applied-filters/root.tsx b/apps/space/core/components/issues/filters/applied-filters/root.tsx index 2571edadae..965ea473c9 100644 --- a/apps/space/core/components/issues/filters/applied-filters/root.tsx +++ b/apps/space/core/components/issues/filters/applied-filters/root.tsx @@ -89,7 +89,7 @@ export const IssueAppliedFilters = observer(function IssueAppliedFilters(props: if (Object.keys(appliedFilters).length === 0) return null; return ( -
    +
    +
    {stateDetails.name} @@ -46,7 +46,7 @@ export function FiltersDropdown(props: Props) { >
    -
    {title}
    +
    +
    {title}
    ); diff --git a/apps/space/core/components/issues/filters/labels.tsx b/apps/space/core/components/issues/filters/labels.tsx index fde7df951a..3db53f0253 100644 --- a/apps/space/core/components/issues/filters/labels.tsx +++ b/apps/space/core/components/issues/filters/labels.tsx @@ -59,7 +59,7 @@ export function FilterLabels(props: Props) { {filteredOptions.length > 5 && (
    )} diff --git a/apps/space/core/components/issues/filters/root.tsx b/apps/space/core/components/issues/filters/root.tsx index 8274702dbe..d7d5de6aa2 100644 --- a/apps/space/core/components/issues/filters/root.tsx +++ b/apps/space/core/components/issues/filters/root.tsx @@ -56,7 +56,7 @@ export const IssueFiltersDropdown = observer(function IssueFiltersDropdown(props ); return ( -
    +
    -
    -
    - +
    +
    + setFiltersSearchQuery(e.target.value)} @@ -36,12 +36,12 @@ export const FilterSelection = observer(function FilterSelection(props: Props) { /> {filtersSearchQuery !== "" && ( )}
    -
    +
    {/* priority */} {isFilterEnabled("priority") && (
    diff --git a/apps/space/core/components/issues/filters/state.tsx b/apps/space/core/components/issues/filters/state.tsx index 5cad518040..6ea374eb53 100644 --- a/apps/space/core/components/issues/filters/state.tsx +++ b/apps/space/core/components/issues/filters/state.tsx @@ -59,7 +59,7 @@ export const FilterState = observer(function FilterState(props: Props) { {filteredOptions.length > 5 && ( diff --git a/apps/space/core/components/issues/navbar/root.tsx b/apps/space/core/components/issues/navbar/root.tsx index 195065b4b7..5ae4da3681 100644 --- a/apps/space/core/components/issues/navbar/root.tsx +++ b/apps/space/core/components/issues/navbar/root.tsx @@ -19,22 +19,21 @@ export const IssuesNavbarRoot = observer(function IssuesNavbarRoot(props: Props) return (
    {/* project detail */} -
    +
    {project_details ? ( - - + + ) : ( - - + + )} -
    +
    {project_details?.name || `...`}
    - -
    +
    diff --git a/apps/space/core/components/issues/navbar/theme.tsx b/apps/space/core/components/issues/navbar/theme.tsx index 734e291429..15aa95f534 100644 --- a/apps/space/core/components/issues/navbar/theme.tsx +++ b/apps/space/core/components/issues/navbar/theme.tsx @@ -1,13 +1,11 @@ -// next theme import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { useTheme } from "next-themes"; -// mobx react lite - export const NavbarTheme = observer(function NavbarTheme() { + // states const [appTheme, setAppTheme] = useState("light"); - + // theme const { setTheme, theme } = useTheme(); const handleTheme = () => { @@ -23,9 +21,9 @@ export const NavbarTheme = observer(function NavbarTheme() { ); }); diff --git a/apps/space/core/components/issues/navbar/user-avatar.tsx b/apps/space/core/components/issues/navbar/user-avatar.tsx index c8566a9810..c2b827695b 100644 --- a/apps/space/core/components/issues/navbar/user-avatar.tsx +++ b/apps/space/core/components/issues/navbar/user-avatar.tsx @@ -60,10 +60,7 @@ export const UserAvatar = observer(function UserAvatar() {
    - @@ -116,7 +113,7 @@ export const UserAvatar = observer(function UserAvatar() { ) : (
    - +
    )} diff --git a/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx b/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx index bee899347c..b6849e2dfb 100644 --- a/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx +++ b/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx @@ -70,26 +70,28 @@ export const CommentCard = observer(function CommentCard(props: Props) { } height={30} width={30} - className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-200" + className="grid size-7 place-items-center rounded-full border-2 border-strong-1" /> ) : ( -
    +
    {comment.actor_detail.is_bot ? comment?.actor_detail?.first_name?.charAt(0) : comment?.actor_detail?.display_name?.charAt(0)}
    )} - -
    -
    +
    {comment.actor_detail.is_bot ? comment.actor_detail.first_name + " Bot" : comment.actor_detail.display_name}
    -

    +

    <>commented {timeAgo(comment.created_at)}

    @@ -130,16 +132,16 @@ export const CommentCard = observer(function CommentCard(props: Props) {
    @@ -164,9 +166,9 @@ export const CommentCard = observer(function CommentCard(props: Props) { {}} - className="relative grid cursor-pointer place-items-center rounded p-1 text-custom-text-200 outline-none hover:bg-custom-background-80 hover:text-custom-text-100" + className="relative grid cursor-pointer place-items-center rounded-sm p-1 text-tertiary outline-none hover:bg-layer-transparent-hover" > - + - + {({ active }) => (
    @@ -187,8 +189,8 @@ export const CommentCard = observer(function CommentCard(props: Props) { onClick={() => { setIsEditing(true); }} - className={`w-full select-none truncate rounded px-1 py-1.5 text-left text-custom-text-200 hover:bg-custom-background-80 ${ - active ? "bg-custom-background-80" : "" + className={`w-full select-none truncate rounded-sm px-1 py-1.5 text-left text-secondary hover:bg-layer-transparent-hover ${ + active ? "bg-layer-transparent-hover" : "" }`} > Edit @@ -202,8 +204,8 @@ export const CommentCard = observer(function CommentCard(props: Props) { )} @@ -69,12 +69,12 @@ export const PeekOverviewHeader = observer(function PeekOverviewHeader(props: Pr as="div" value={peekMode} onChange={(val) => setPeekMode(val)} - className="relative flex-shrink-0 text-left" + className="relative shrink-0 text-left" > - + - +
    {PEEK_MODES.map((mode) => ( - `cursor-pointer select-none truncate rounded px-1 py-1.5 ${ - active ? "bg-custom-background-80" : "" - } ${selected ? "text-custom-text-100" : "text-custom-text-200"}` + `cursor-pointer select-none truncate rounded-sm px-1 py-1.5 ${ + active ? "bg-layer-transparent-hover" : "" + } ${selected ? "text-primary" : "text-secondary"}` } >
    @@ -110,16 +110,14 @@ export const PeekOverviewHeader = observer(function PeekOverviewHeader(props: Pr
    {isClipboardWriteAllowed && (peekMode === "side" || peekMode === "modal") && ( -
    - -
    + )}
    diff --git a/apps/space/core/components/issues/peek-overview/issue-activity.tsx b/apps/space/core/components/issues/peek-overview/issue-activity.tsx index cc4ba4dca2..e965edbbff 100644 --- a/apps/space/core/components/issues/peek-overview/issue-activity.tsx +++ b/apps/space/core/components/issues/peek-overview/issue-activity.tsx @@ -52,9 +52,9 @@ export const PeekOverviewIssueActivity = observer(function PeekOverviewIssueActi )} ) : ( -
    -

    - +

    +

    + Sign in to add your comment

    diff --git a/apps/space/core/components/issues/peek-overview/issue-details.tsx b/apps/space/core/components/issues/peek-overview/issue-details.tsx index 2457766b3d..94d7a125b2 100644 --- a/apps/space/core/components/issues/peek-overview/issue-details.tsx +++ b/apps/space/core/components/issues/peek-overview/issue-details.tsx @@ -21,10 +21,10 @@ export const PeekOverviewIssueDetails = observer(function PeekOverviewIssueDetai return (
    -
    +
    {project_details?.identifier}-{issueDetails?.sequence_id}
    -

    {issueDetails.name}

    +

    {issueDetails.name}

    {description && description !== "" && description !== "

    " && ( +
    {mode === "full" && (
    @@ -65,33 +65,33 @@ export const PeekOverviewIssueProperties = observer(function PeekOverviewIssuePr )}
    -
    +
    State
    -
    +
    {addSpaceIfCamelCase(state?.name ?? "")}
    -
    +
    Priority
    {priority && ( @@ -105,14 +105,14 @@ export const PeekOverviewIssueProperties = observer(function PeekOverviewIssuePr
    -
    +
    Due date
    {issueDetails.target_date ? (
    @@ -120,7 +120,7 @@ export const PeekOverviewIssueProperties = observer(function PeekOverviewIssuePr {renderFormattedDate(issueDetails.target_date)}
    ) : ( - Empty + Empty )}
    diff --git a/apps/space/core/components/issues/peek-overview/layout.tsx b/apps/space/core/components/issues/peek-overview/layout.tsx index d8ebec8d03..d8b5a29ce1 100644 --- a/apps/space/core/components/issues/peek-overview/layout.tsx +++ b/apps/space/core/components/issues/peek-overview/layout.tsx @@ -68,7 +68,7 @@ export const IssuePeekOverview = observer(function IssuePeekOverview(props: TIss leaveFrom="translate-x-0" leaveTo="translate-x-full" > - + @@ -85,7 +85,7 @@ export const IssuePeekOverview = observer(function IssuePeekOverview(props: TIss leaveFrom="opacity-100" leaveTo="opacity-0" > -
    +
    {peekMode === "modal" && ( diff --git a/apps/space/core/components/issues/peek-overview/side-peek-view.tsx b/apps/space/core/components/issues/peek-overview/side-peek-view.tsx index d091d42c91..c965b7056c 100644 --- a/apps/space/core/components/issues/peek-overview/side-peek-view.tsx +++ b/apps/space/core/components/issues/peek-overview/side-peek-view.tsx @@ -23,12 +23,12 @@ export const SidePeekView = observer(function SidePeekView(props: Props) { const { canComment } = usePublish(anchor); return ( -
    +
    {issueDetails ? ( -
    +
    {/* issue title and description */}
    @@ -38,7 +38,7 @@ export const SidePeekView = observer(function SidePeekView(props: Props) {
    {/* divider */} -
    +
    {/* issue activity/comments */} {canComment && (
    diff --git a/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx b/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx index 43d2f8cbee..c4eddb9278 100644 --- a/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx +++ b/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx @@ -99,17 +99,17 @@ export const IssueVotes = observer(function IssueVotes(props: TIssueVotes) { else router.push(`/?next_path=${pathName}?${queryParam}`); }} className={cn( - "flex items-center justify-center gap-x-1 overflow-hidden rounded border focus:outline-none bg-custom-background-100", + "flex items-center justify-center gap-x-1 overflow-hidden rounded-sm border focus:outline-none hover:bg-layer-transparent-hover", votingDimensions, { - "border-custom-primary-200 text-custom-primary-200": isUpVotedByUser, - "border-custom-border-300": !isUpVotedByUser, + "border-accent-strong-200 text-accent-secondary": isUpVotedByUser, + "border-strong": !isUpVotedByUser, "cursor-default": isInIframe, } )} > - arrow_upward_alt - {allUpVotes.length} + arrow_upward_alt + {allUpVotes.length} @@ -140,17 +140,17 @@ export const IssueVotes = observer(function IssueVotes(props: TIssueVotes) { else router.push(`/?next_path=${pathName}?${queryParam}`); }} className={cn( - "flex items-center justify-center gap-x-1 overflow-hidden rounded border focus:outline-none bg-custom-background-100", + "flex items-center justify-center gap-x-1 overflow-hidden rounded-sm border focus:outline-none hover:bg-layer-transparent-hover", votingDimensions, { "border-red-600 text-red-600": isDownVotedByUser, - "border-custom-border-300": !isDownVotedByUser, + "border-strong": !isDownVotedByUser, "cursor-default": isInIframe, } )} > - arrow_downward_alt - {allDownVotes.length} + arrow_downward_alt + {allDownVotes.length}
    diff --git a/apps/space/core/components/ui/icon.tsx b/apps/space/core/components/ui/icon.tsx index 39d10b2b18..418be108c9 100644 --- a/apps/space/core/components/ui/icon.tsx +++ b/apps/space/core/components/ui/icon.tsx @@ -6,5 +6,5 @@ type Props = { }; export function Icon({ iconName, className = "" }: Props) { - return {iconName}; + return {iconName}; } diff --git a/apps/space/core/components/ui/not-found.tsx b/apps/space/core/components/ui/not-found.tsx index 37e0dc3b26..5ec0874cb3 100644 --- a/apps/space/core/components/ui/not-found.tsx +++ b/apps/space/core/components/ui/not-found.tsx @@ -3,15 +3,15 @@ import Image404 from "@/app/assets/404.svg?url"; export function PageNotFound() { return ( -
    +
    404- Page not found
    -

    Oops! Something went wrong.

    -

    +

    Oops! Something went wrong.

    +

    Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is temporarily unavailable.

    diff --git a/apps/space/core/components/views/header.tsx b/apps/space/core/components/views/header.tsx index 9acbd5868b..30284882d6 100644 --- a/apps/space/core/components/views/header.tsx +++ b/apps/space/core/components/views/header.tsx @@ -6,7 +6,7 @@ export function AuthHeader() { return (
    - +
    ); diff --git a/apps/space/core/lib/instance-provider.tsx b/apps/space/core/lib/instance-provider.tsx index 4d422df722..89ee49dfcf 100644 --- a/apps/space/core/lib/instance-provider.tsx +++ b/apps/space/core/lib/instance-provider.tsx @@ -47,7 +47,7 @@ export const InstanceProvider = observer(function InstanceProvider({ children }:
    - +
    diff --git a/apps/space/helpers/emoji.helper.tsx b/apps/space/helpers/emoji.helper.tsx index 1619d6c0d1..8190a6552f 100644 --- a/apps/space/helpers/emoji.helper.tsx +++ b/apps/space/helpers/emoji.helper.tsx @@ -10,7 +10,7 @@ export const renderEmoji = ( if (typeof emoji === "object") return ( - + {emoji.name} ); diff --git a/apps/space/package.json b/apps/space/package.json index d88b30514d..774b08b4b7 100644 --- a/apps/space/package.json +++ b/apps/space/package.json @@ -56,6 +56,7 @@ "@plane/tailwind-config": "workspace:*", "@plane/typescript-config": "workspace:*", "@react-router/dev": "catalog:", + "@tailwindcss/typography": "0.5.19", "@types/lodash-es": "catalog:", "@types/node": "catalog:", "@types/react": "catalog:", diff --git a/apps/space/postcss.config.cjs b/apps/space/postcss.config.cjs deleted file mode 100644 index 8a677108f5..0000000000 --- a/apps/space/postcss.config.cjs +++ /dev/null @@ -1 +0,0 @@ -module.exports = require("@plane/tailwind-config/postcss.config.js"); diff --git a/apps/space/postcss.config.js b/apps/space/postcss.config.js new file mode 100644 index 0000000000..3ad28f15f3 --- /dev/null +++ b/apps/space/postcss.config.js @@ -0,0 +1,3 @@ +import postcssConfig from "@plane/tailwind-config/postcss.config.js"; + +export default postcssConfig; diff --git a/apps/space/styles/globals.css b/apps/space/styles/globals.css index 46fca34027..d179aec6b9 100644 --- a/apps/space/styles/globals.css +++ b/apps/space/styles/globals.css @@ -1,500 +1,54 @@ -@import "@plane/propel/styles/fonts"; +@import "@plane/tailwind-config/index.css"; @import "@plane/editor/styles"; +@import "@plane/propel/styles/react-day-picker.css"; +@plugin "@tailwindcss/typography"; -@tailwind base; -@tailwind components; -@tailwind utilities; +/* stickies and editor colors */ +:root { + /* text colors */ + --editor-colors-gray-text: #5c5e63; + --editor-colors-peach-text: #ff5b59; + --editor-colors-pink-text: #f65385; + --editor-colors-orange-text: #fd9038; + --editor-colors-green-text: #0fc27b; + --editor-colors-light-blue-text: #17bee9; + --editor-colors-dark-blue-text: #266df0; + --editor-colors-purple-text: #9162f9; + /* end text colors */ -@layer base { - html { - font-family: "Inter", sans-serif; - } - - :root { - color-scheme: light !important; - - --color-primary-10: 229, 243, 250; - --color-primary-20: 216, 237, 248; - --color-primary-30: 199, 229, 244; - --color-primary-40: 169, 214, 239; - --color-primary-50: 144, 202, 234; - --color-primary-60: 109, 186, 227; - --color-primary-70: 75, 170, 221; - --color-primary-80: 41, 154, 214; - --color-primary-90: 34, 129, 180; - --color-primary-100: 0, 99, 153; - --color-primary-200: 0, 92, 143; - --color-primary-300: 0, 86, 133; - --color-primary-400: 0, 77, 117; - --color-primary-500: 0, 66, 102; - --color-primary-600: 0, 53, 82; - --color-primary-700: 0, 43, 66; - --color-primary-800: 0, 33, 51; - --color-primary-900: 0, 23, 36; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - --color-shadow-2xs: - 0px 0px 1px 0px rgba(23, 23, 23, 0.06), 0px 1px 2px 0px rgba(23, 23, 23, 0.06), - 0px 1px 2px 0px rgba(23, 23, 23, 0.14); - --color-shadow-xs: - 0px 1px 2px 0px rgba(0, 0, 0, 0.16), 0px 2px 4px 0px rgba(16, 24, 40, 0.12), - 0px 1px 8px -1px rgba(16, 24, 40, 0.1); - --color-shadow-sm: - 0px 1px 4px 0px rgba(0, 0, 0, 0.01), 0px 4px 8px 0px rgba(0, 0, 0, 0.02), 0px 1px 12px 0px rgba(0, 0, 0, 0.12); - --color-shadow-rg: - 0px 3px 6px 0px rgba(0, 0, 0, 0.1), 0px 4px 4px 0px rgba(16, 24, 40, 0.08), - 0px 1px 12px 0px rgba(16, 24, 40, 0.04); - --color-shadow-md: - 0px 4px 8px 0px rgba(0, 0, 0, 0.12), 0px 6px 12px 0px rgba(16, 24, 40, 0.12), - 0px 1px 16px 0px rgba(16, 24, 40, 0.12); - --color-shadow-lg: - 0px 6px 12px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.12), - 0px 1px 24px 0px rgba(16, 24, 40, 0.12); - --color-shadow-xl: - 0px 0px 18px 0px rgba(0, 0, 0, 0.16), 0px 0px 24px 0px rgba(16, 24, 40, 0.16), - 0px 0px 52px 0px rgba(16, 24, 40, 0.16); - --color-shadow-2xl: - 0px 8px 16px 0px rgba(0, 0, 0, 0.12), 0px 12px 24px 0px rgba(16, 24, 40, 0.12), - 0px 1px 32px 0px rgba(16, 24, 40, 0.12); - --color-shadow-3xl: - 0px 12px 24px 0px rgba(0, 0, 0, 0.12), 0px 16px 32px 0px rgba(0, 0, 0, 0.12), - 0px 1px 48px 0px rgba(16, 24, 40, 0.12); - --color-shadow-4xl: 0px 8px 40px 0px rgba(0, 0, 61, 0.05), 0px 12px 32px -16px rgba(0, 0, 0, 0.05); - - --color-sidebar-background-100: var(--color-background-100); /* primary sidebar bg */ - --color-sidebar-background-90: var(--color-background-90); /* secondary sidebar bg */ - --color-sidebar-background-80: var(--color-background-80); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var(--color-text-200); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var(--color-text-400); /* sidebar placeholder text */ - - --color-sidebar-border-100: var(--color-border-100); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var(--color-border-100); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var(--color-border-100); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var(--color-border-100); /* strong sidebar border- 2 */ - - --color-sidebar-shadow-2xs: var(--color-shadow-2xs); - --color-sidebar-shadow-xs: var(--color-shadow-xs); - --color-sidebar-shadow-sm: var(--color-shadow-sm); - --color-sidebar-shadow-rg: var(--color-shadow-rg); - --color-sidebar-shadow-md: var(--color-shadow-md); - --color-sidebar-shadow-lg: var(--color-shadow-lg); - --color-sidebar-shadow-xl: var(--color-shadow-xl); - --color-sidebar-shadow-2xl: var(--color-shadow-2xl); - --color-sidebar-shadow-3xl: var(--color-shadow-3xl); - --color-sidebar-shadow-4xl: var(--color-shadow-4xl); - - /* toast theme */ - --color-toast-success-text: 178, 221, 181; - --color-toast-error-text: 206, 44, 49; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 141, 164, 239; - --color-toast-loading-text: 255, 255, 255; - --color-toast-secondary-text: 185, 187, 198; - --color-toast-tertiary-text: 139, 141, 152; - - --color-toast-success-background: 46, 46, 46; - --color-toast-error-background: 46, 46, 46; - --color-toast-warning-background: 46, 46, 46; - --color-toast-info-background: 46, 46, 46; - --color-toast-loading-background: 46, 46, 46; - - --color-toast-success-border: 42, 126, 59; - --color-toast-error-border: 100, 23, 35; - --color-toast-warning-border: 79, 52, 34; - --color-toast-info-border: 58, 91, 199; - --color-toast-loading-border: 96, 100, 108; - } - - [data-theme="light"], - [data-theme="light-contrast"] { - color-scheme: light !important; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - } - - [data-theme="light"] { - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - /* onboarding colors */ - --gradient-onboarding-100: linear-gradient(106deg, #f2f6ff 29.8%, #e1eaff 99.34%); - --gradient-onboarding-200: linear-gradient(129deg, rgba(255, 255, 255, 0) -22.23%, rgba(255, 255, 255, 0.8) 62.98%); - --gradient-onboarding-300: linear-gradient(164deg, #fff 4.25%, rgba(255, 255, 255, 0.06) 93.5%); - --gradient-onboarding-400: linear-gradient(129deg, rgba(255, 255, 255, 0) -22.23%, rgba(255, 255, 255, 0.8) 62.98%); - - --color-onboarding-text-100: 23, 23, 23; - --color-onboarding-text-200: 58, 58, 58; - --color-onboarding-text-300: 82, 82, 82; - --color-onboarding-text-400: 163, 163, 163; - - --color-onboarding-background-100: 236, 241, 255; - --color-onboarding-background-200: 255, 255, 255; - --color-onboarding-background-300: 236, 241, 255; - --color-onboarding-background-400: 177, 206, 250; - - --color-onboarding-border-100: 229, 229, 229; - --color-onboarding-border-200: 217, 228, 255; - --color-onboarding-border-300: 229, 229, 229, 0.5; - - --color-onboarding-shadow-sm: 0px 4px 20px 0px rgba(126, 139, 171, 0.1); - - /* toast theme */ - --color-toast-success-text: 62, 155, 79; - --color-toast-error-text: 220, 62, 66; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 51, 88, 212; - --color-toast-loading-text: 28, 32, 36; - --color-toast-secondary-text: 128, 131, 141; - --color-toast-tertiary-text: 96, 100, 108; - - --color-toast-success-background: 253, 253, 254; - --color-toast-error-background: 255, 252, 252; - --color-toast-warning-background: 254, 253, 251; - --color-toast-info-background: 253, 253, 254; - --color-toast-loading-background: 253, 253, 254; - - --color-toast-success-border: 218, 241, 219; - --color-toast-error-border: 255, 219, 220; - --color-toast-warning-border: 255, 247, 194; - --color-toast-info-border: 210, 222, 255; - --color-toast-loading-border: 224, 225, 230; - } - - [data-theme="light-contrast"] { - --color-text-100: 11, 11, 11; /* primary text */ - --color-text-200: 38, 38, 38; /* secondary text */ - --color-text-300: 58, 58, 58; /* tertiary text */ - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - } - - [data-theme="dark"], - [data-theme="dark-contrast"] { - color-scheme: dark !important; - - --color-primary-10: 8, 31, 43; - --color-primary-20: 10, 37, 51; - --color-primary-30: 13, 49, 69; - --color-primary-40: 16, 58, 81; - --color-primary-50: 18, 68, 94; - --color-primary-60: 23, 86, 120; - --color-primary-70: 28, 104, 146; - --color-primary-80: 31, 116, 163; - --color-primary-90: 34, 129, 180; - --color-primary-100: 40, 146, 204; - --color-primary-200: 41, 154, 214; - --color-primary-300: 75, 170, 221; - --color-primary-400: 109, 186, 227; - --color-primary-500: 144, 202, 234; - --color-primary-600: 169, 214, 239; - --color-primary-700: 199, 229, 244; - --color-primary-800: 216, 237, 248; - --color-primary-900: 229, 243, 250; - - --color-background-100: 25, 25, 25; /* primary bg */ - --color-background-90: 32, 32, 32; /* secondary bg */ - --color-background-80: 44, 44, 44; /* tertiary bg */ - - --color-shadow-2xs: 0px 0px 1px 0px rgba(0, 0, 0, 0.15), 0px 1px 3px 0px rgba(0, 0, 0, 0.5); - --color-shadow-xs: 0px 0px 2px 0px rgba(0, 0, 0, 0.2), 0px 2px 4px 0px rgba(0, 0, 0, 0.5); - --color-shadow-sm: 0px 0px 4px 0px rgba(0, 0, 0, 0.2), 0px 2px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-rg: 0px 0px 6px 0px rgba(0, 0, 0, 0.2), 0px 4px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-md: 0px 2px 8px 0px rgba(0, 0, 0, 0.2), 0px 4px 8px 0px rgba(0, 0, 0, 0.5); - --color-shadow-lg: 0px 4px 12px 0px rgba(0, 0, 0, 0.25), 0px 4px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-xl: 0px 0px 14px 0px rgba(0, 0, 0, 0.25), 0px 6px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-2xl: 0px 0px 18px 0px rgba(0, 0, 0, 0.25), 0px 8px 12px 0px rgba(0, 0, 0, 0.6); - --color-shadow-3xl: 0px 4px 24px 0px rgba(0, 0, 0, 0.3), 0px 12px 40px 0px rgba(0, 0, 0, 0.65); - } - - [data-theme="dark"] { - --color-text-100: 229, 229, 229; /* primary text */ - --color-text-200: 163, 163, 163; /* secondary text */ - --color-text-300: 115, 115, 115; /* tertiary text */ - --color-text-400: 82, 82, 82; /* placeholder text */ - - --color-scrollbar: 82, 82, 82; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - - /* onboarding colors */ - --gradient-onboarding-100: linear-gradient(106deg, #18191b 25.17%, #18191b 99.34%); - --gradient-onboarding-200: linear-gradient(129deg, rgba(47, 49, 53, 0.8) -22.23%, rgba(33, 34, 37, 0.8) 62.98%); - --gradient-onboarding-300: linear-gradient(167deg, rgba(47, 49, 53, 0.45) 19.22%, #212225 98.48%); - - --color-onboarding-text-100: 237, 238, 240; - --color-onboarding-text-200: 176, 180, 187; - --color-onboarding-text-300: 118, 123, 132; - --color-onboarding-text-400: 105, 110, 119; - - --color-onboarding-background-100: 54, 58, 64; - --color-onboarding-background-200: 40, 42, 45; - --color-onboarding-background-300: 40, 42, 45; - --color-onboarding-background-400: 67, 72, 79; - - --color-onboarding-border-100: 54, 58, 64; - --color-onboarding-border-200: 54, 58, 64; - --color-onboarding-border-300: 34, 35, 38, 0.5; - - --color-onboarding-shadow-sm: 0px 4px 20px 0px rgba(39, 44, 56, 0.1); - } - - [data-theme="dark-contrast"] { - --color-text-100: 250, 250, 250; /* primary text */ - --color-text-200: 241, 241, 241; /* secondary text */ - --color-text-300: 212, 212, 212; /* tertiary text */ - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - } - - [data-theme="light"], - [data-theme="dark"], - [data-theme="light-contrast"], - [data-theme="dark-contrast"] { - --color-sidebar-background-100: var(--color-background-100); /* primary sidebar bg */ - --color-sidebar-background-90: var(--color-background-90); /* secondary sidebar bg */ - --color-sidebar-background-80: var(--color-background-80); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var(--color-text-200); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var(--color-text-400); /* sidebar placeholder text */ - - --color-sidebar-border-100: var(--color-border-100); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var(--color-border-200); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var(--color-border-300); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var(--color-border-400); /* strong sidebar border- 2 */ - } - - /* stickies and editor colors */ - :root { - /* text colors */ - --editor-colors-gray-text: #5c5e63; - --editor-colors-peach-text: #ff5b59; - --editor-colors-pink-text: #f65385; - --editor-colors-orange-text: #fd9038; - --editor-colors-green-text: #0fc27b; - --editor-colors-light-blue-text: #17bee9; - --editor-colors-dark-blue-text: #266df0; - --editor-colors-purple-text: #9162f9; - /* end text colors */ - - /* background colors */ - --editor-colors-gray-background: #d6d6d8; - --editor-colors-peach-background: #ffd5d7; - --editor-colors-pink-background: #fdd4e3; - --editor-colors-orange-background: #ffe3cd; - --editor-colors-green-background: #c3f0de; - --editor-colors-light-blue-background: #c5eff9; - --editor-colors-dark-blue-background: #c9dafb; - --editor-colors-purple-background: #e3d8fd; - /* end background colors */ - } /* background colors */ - [data-theme*="light"] { - --editor-colors-gray-background: #d6d6d8; - --editor-colors-peach-background: #ffd5d7; - --editor-colors-pink-background: #fdd4e3; - --editor-colors-orange-background: #ffe3cd; - --editor-colors-green-background: #c3f0de; - --editor-colors-light-blue-background: #c5eff9; - --editor-colors-dark-blue-background: #c9dafb; - --editor-colors-purple-background: #e3d8fd; - } - [data-theme*="dark"] { - --editor-colors-gray-background: #404144; - --editor-colors-peach-background: #593032; - --editor-colors-pink-background: #562e3d; - --editor-colors-orange-background: #583e2a; - --editor-colors-green-background: #1d4a3b; - --editor-colors-light-blue-background: #1f495c; - --editor-colors-dark-blue-background: #223558; - --editor-colors-purple-background: #3d325a; - } + --editor-colors-gray-background: #d6d6d8; + --editor-colors-peach-background: #ffd5d7; + --editor-colors-pink-background: #fdd4e3; + --editor-colors-orange-background: #ffe3cd; + --editor-colors-green-background: #c3f0de; + --editor-colors-light-blue-background: #c5eff9; + --editor-colors-dark-blue-background: #c9dafb; + --editor-colors-purple-background: #e3d8fd; /* end background colors */ } - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; - font-variant-ligatures: none; - -webkit-font-variant-ligatures: none; - text-rendering: optimizeLegibility; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; +/* background colors */ +[data-theme*="light"] { + --editor-colors-gray-background: #d6d6d8; + --editor-colors-peach-background: #ffd5d7; + --editor-colors-pink-background: #fdd4e3; + --editor-colors-orange-background: #ffe3cd; + --editor-colors-green-background: #c3f0de; + --editor-colors-light-blue-background: #c5eff9; + --editor-colors-dark-blue-background: #c9dafb; + --editor-colors-purple-background: #e3d8fd; } - -body { - color: rgba(var(--color-text-100)); -} - -::-webkit-scrollbar { - width: 5px; - height: 5px; - border-radius: 5px; -} - -::-webkit-scrollbar-track { - background-color: rgba(var(--color-background-100)); -} - -::-webkit-scrollbar-thumb { - border-radius: 5px; - background-color: rgba(var(--color-background-80)); -} - -.hide-vertical-scrollbar::-webkit-scrollbar { - width: 0 !important; -} - -.hide-horizontal-scrollbar::-webkit-scrollbar { - height: 0 !important; -} - -.hide-both-scrollbars::-webkit-scrollbar { - height: 0 !important; - width: 0 !important; -} - -/* By applying below class, the autofilled text in form fields will not have the default autofill background color and styles applied by WebKit browsers */ -.disable-autofill-style:-webkit-autofill, -.disable-autofill-style:-webkit-autofill:hover, -.disable-autofill-style:-webkit-autofill:focus, -.disable-autofill-style:-webkit-autofill:active { - -webkit-background-clip: text; -} - -@-moz-document url-prefix() { - * { - scrollbar-width: none; - } - .vertical-scrollbar, - .horizontal-scrollbar { - scrollbar-width: initial; - scrollbar-color: rgba(96, 100, 108, 0.1) transparent; - } - .vertical-scrollbar:hover, - .horizontal-scrollbar:hover { - scrollbar-color: rgba(96, 100, 108, 0.25) transparent; - } - .vertical-scrollbar:active, - .horizontal-scrollbar:active { - scrollbar-color: rgba(96, 100, 108, 0.7) transparent; - } -} - -.vertical-scrollbar { - overflow-y: auto; -} -.horizontal-scrollbar { - overflow-x: auto; -} -.vertical-scrollbar::-webkit-scrollbar, -.horizontal-scrollbar::-webkit-scrollbar { - display: block; -} -.vertical-scrollbar::-webkit-scrollbar-track, -.horizontal-scrollbar::-webkit-scrollbar-track { - background-color: transparent; - border-radius: 9999px; -} -.vertical-scrollbar::-webkit-scrollbar-thumb, -.horizontal-scrollbar::-webkit-scrollbar-thumb { - background-clip: padding-box; - background-color: rgba(96, 100, 108, 0.1); - border-radius: 9999px; -} -.vertical-scrollbar:hover::-webkit-scrollbar-thumb, -.horizontal-scrollbar:hover::-webkit-scrollbar-thumb { - background-color: rgba(96, 100, 108, 0.25); -} -.vertical-scrollbar::-webkit-scrollbar-thumb:hover, -.horizontal-scrollbar::-webkit-scrollbar-thumb:hover { - background-color: rgba(96, 100, 108, 0.5); -} -.vertical-scrollbar::-webkit-scrollbar-thumb:active, -.horizontal-scrollbar::-webkit-scrollbar-thumb:active { - background-color: rgba(96, 100, 108, 0.7); -} -.vertical-scrollbar::-webkit-scrollbar-corner, -.horizontal-scrollbar::-webkit-scrollbar-corner { - background-color: transparent; -} -.vertical-scrollbar-margin-top-md::-webkit-scrollbar-track { - margin-top: 44px; -} - -/* scrollbar sm size */ -.scrollbar-sm::-webkit-scrollbar { - height: 12px; - width: 12px; -} -.scrollbar-sm::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} -/* scrollbar md size */ -.scrollbar-md::-webkit-scrollbar { - height: 14px; - width: 14px; -} -.scrollbar-md::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} -/* scrollbar lg size */ - -.scrollbar-lg::-webkit-scrollbar { - height: 16px; - width: 16px; -} -.scrollbar-lg::-webkit-scrollbar-thumb { - border: 4px solid rgba(0, 0, 0, 0); +[data-theme*="dark"] { + --editor-colors-gray-background: #404144; + --editor-colors-peach-background: #593032; + --editor-colors-pink-background: #562e3d; + --editor-colors-orange-background: #583e2a; + --editor-colors-green-background: #1d4a3b; + --editor-colors-light-blue-background: #1f495c; + --editor-colors-dark-blue-background: #223558; + --editor-colors-purple-background: #3d325a; } +/* end background colors */ /* Progress Bar Styles */ :root { diff --git a/apps/space/tailwind.config.cjs b/apps/space/tailwind.config.cjs deleted file mode 100644 index 7511bd651d..0000000000 --- a/apps/space/tailwind.config.cjs +++ /dev/null @@ -1 +0,0 @@ -module.exports = require("@plane/tailwind-config/tailwind.config.js"); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx index edb12b0043..6eed5ff95c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx @@ -18,7 +18,7 @@ export const WorkspaceActiveCycleHeader = observer(function WorkspaceActiveCycle component={ } + icon={} /> } /> diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx index 95fd9186fc..85798e17e1 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx @@ -16,7 +16,7 @@ export const WorkspaceAnalyticsHeader = observer(function WorkspaceAnalyticsHead component={ } + icon={} /> } /> diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx index c8e4e1aeb4..c6b225de8f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx @@ -67,12 +67,12 @@ function AnalyticsPage({ params }: Route.ComponentProps) { {workspaceProjectIds && ( <> {workspaceProjectIds.length > 0 || loader === "init-loader" ? ( -
    +
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx index 7d99ed0e22..cf5176a2be 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx @@ -32,8 +32,8 @@ export const ProjectWorkItemDetailsHeader = observer(function ProjectWorkItemDet <> {projectPreferences.navigationMode === "horizontal" && (
    - -
    + +
    {sidebarCollapsed && (
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx index a1d983b81f..e4aa6e1fba 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx @@ -40,7 +40,7 @@ export const WorkItemDetailsHeader = observer(function WorkItemDetailsHeader() { } + icon={} /> } /> diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx index c18051384a..c34457db1d 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx @@ -46,7 +46,7 @@ export const WorkspaceDraftHeader = observer(function WorkspaceDraftHeader() { } /> + } /> } /> @@ -62,7 +62,7 @@ export const WorkspaceDraftHeader = observer(function WorkspaceDraftHeader() { {joinedProjectIds && joinedProjectIds.length > 0 && (
    -
    - +
    + } - /> + } /> } /> @@ -35,13 +32,13 @@ export const WorkspaceDashboardHeader = observer(function WorkspaceDashboardHead diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/layout.tsx index b93891fece..f64640536b 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/layout.tsx @@ -9,12 +9,12 @@ function WorkspaceLayout() { return ( <> -
    +
    -
    +
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/activity/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/activity/page.tsx index 95e7231842..6d1f212a14 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/activity/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/activity/page.tsx @@ -51,14 +51,14 @@ function ProfileActivityPage() {
    -

    {t("profile.stats.recent_activity.title")}

    +

    {t("profile.stats.recent_activity.title")}

    {canDownloadActivity && }
    {activityPages} {pageCount < totalPages && resultsCount !== 0 && ( -
    -
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx index a2dfcdc3cc..5bfdc10c1c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx @@ -15,6 +15,7 @@ import { ProfileIssuesFilter } from "@/components/profile/profile-issues-filter" // hooks import { useAppTheme } from "@/hooks/store/use-app-theme"; import { useUser, useUserPermissions } from "@/hooks/store/user"; +import { Button } from "@plane/propel/button"; type TUserProfileHeader = { userProjectsData: IUserProfileProjectSegregation | undefined; @@ -57,7 +58,7 @@ export const UserProfileHeader = observer(function UserProfileHeader(props: TUse } + icon={} /> } /> @@ -68,15 +69,15 @@ export const UserProfileHeader = observer(function UserProfileHeader(props: TUse
    - {type} - +
    + {type} +
    } - customButtonClassName="flex flex-grow justify-center text-custom-text-200 text-sm" + customButtonClassName="flex flex-grow justify-center text-secondary text-13" closeOnSelect > <> @@ -86,23 +87,22 @@ export const UserProfileHeader = observer(function UserProfileHeader(props: TUse key={tab.route} onClick={() => router.push(`/${workspaceSlug}/profile/${userId}/${tab.route}`)} > - {t(tab.i18n_label)} + {t(tab.i18n_label)} ))}     - +
    + +
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/layout.tsx index 4e100b0c35..b77c6493f1 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/layout.tsx @@ -74,7 +74,7 @@ function UseProfileLayout({ params }: Route.ComponentProps) {
    ) : ( -
    +
    {t("you_do_not_have_the_permission_to_access_this_page")}
    )} diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx index 989741f3b9..df9247d539 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx @@ -78,18 +78,18 @@ export const ProfileIssuesMobileHeader = observer(function ProfileIssuesMobileHe ); return ( -
    +
    +
    {t("common.layout")} - +
    } - customButtonClassName="flex flex-center text-custom-text-200 text-sm" + customButtonClassName="flex flex-center text-secondary text-13" closeOnSelect > {ISSUE_LAYOUTS.map((layout, index) => { @@ -103,19 +103,19 @@ export const ProfileIssuesMobileHeader = observer(function ProfileIssuesMobileHe className="flex items-center gap-2" > -
    {t(layout.i18n_title)}
    +
    {t(layout.i18n_title)}
    ); })}     -
    +
    +
    {t("common.display")} - +
    } > diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx index 3e135687e3..82dd85c0b3 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx @@ -1,13 +1,10 @@ -import React from "react"; - import Link from "next/link"; import { useParams, usePathname } from "next/navigation"; +// plane imports import { PROFILE_VIEWER_TAB, PROFILE_ADMINS_TAB } from "@plane/constants"; import { useTranslation } from "@plane/i18n"; - -// components -// constants import { Header, EHeaderVariant } from "@plane/ui"; +import { cn } from "@plane/utils"; type Props = { isAuthorized: boolean; @@ -27,11 +24,13 @@ export function ProfileNavbar(props: Props) { {tabsList.map((tab) => ( {t(tab.i18n_label)} diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx index 18d8dab9bf..ce8f2d82f1 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx @@ -72,7 +72,7 @@ export const ProjectArchivesHeader = observer(function ProjectArchivesHeader(pro } + icon={} /> } /> @@ -81,7 +81,7 @@ export const ProjectArchivesHeader = observer(function ProjectArchivesHeader(pro component={ } + icon={} /> } /> @@ -93,7 +93,7 @@ export const ProjectArchivesHeader = observer(function ProjectArchivesHeader(pro tooltipContent={`There are ${issueCount} ${issueCount > 1 ? "work items" : "work item"} in project's archived`} position="bottom" > - + {issueCount} diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx index 6b7123a2b1..97c1bc8ef6 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx @@ -67,17 +67,16 @@ function ArchivedIssueDetailsPage({ params }: Route.ComponentProps) { icon={} action={ } - className="border-b border-custom-border-200" + className="border-b border-subtle" />
    -
    +
    } + icon={} /> } /> @@ -50,7 +50,7 @@ export const ProjectArchivedIssueDetailsHeader = observer(function ProjectArchiv } + icon={} /> } /> diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/[cycleId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/[cycleId]/page.tsx index 361912ca9b..3d38155b36 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/[cycleId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/[cycleId]/page.tsx @@ -66,12 +66,8 @@ function CycleDetailPage({ params }: Route.ComponentProps) { {!isSidebarCollapsed && (
    } + icon={} /> } /> @@ -152,7 +152,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() { title={cycleDetails?.name} icon={ - + } isLast @@ -169,7 +169,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() { } in this cycle`} position="bottom" > - + {workItemsCount} @@ -226,39 +226,36 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() { {canUserCreateIssue && ( <> -
    + {!isCompletedCycle && ( )} )} - +
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx index 5b0610622d..26ac9b4801 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx @@ -90,15 +90,15 @@ export const CycleIssuesMobileHeader = observer(function CycleIssuesMobileHeader onClose={() => setAnalyticsModal(false)} cycleDetails={cycleDetails ?? undefined} /> -
    +
    {t("common.layout")} + {t("common.layout")} } - customButtonClassName="flex flex-grow justify-center text-custom-text-200 text-sm" + customButtonClassName="flex flex-grow justify-center text-secondary text-13" closeOnSelect > {SUPPORTED_LAYOUTS.map((layout, index) => ( @@ -110,18 +110,18 @@ export const CycleIssuesMobileHeader = observer(function CycleIssuesMobileHeader className="flex items-center gap-2" > -
    {t(layout.titleTranslationKey)}
    +
    {t(layout.titleTranslationKey)}
    ))}     -
    +
    + {t("common.display")} - + } > @@ -142,7 +142,7 @@ export const CycleIssuesMobileHeader = observer(function CycleIssuesMobileHeader setAnalyticsModal(true)} - className="flex flex-grow justify-center text-custom-text-200 text-sm border-l border-custom-border-200" + className="flex flex-grow justify-center text-secondary text-13 border-l border-subtle" > {t("common.analytics")} diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx index deabebfdc4..5ee1f4e44b 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx @@ -43,7 +43,7 @@ export const CyclesListHeader = observer(function CyclesListHeader() { } + icon={} isLast /> } @@ -56,7 +56,7 @@ export const CyclesListHeader = observer(function CyclesListHeader() { diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/layout.tsx index 2decac79e2..c3a27ec6ec 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/layout.tsx @@ -25,8 +25,8 @@ function ProjectLayout({ params }: Route.ComponentProps) { <> {projectPreferences.navigationMode === "horizontal" && (
    - -
    + +
    {sidebarCollapsed && (
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/[moduleId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/[moduleId]/page.tsx index 6101548247..9c5db9a986 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/[moduleId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/[moduleId]/page.tsx @@ -62,12 +62,8 @@ function ModuleIssuesPage({ params }: Route.ComponentProps) { {!isSidebarCollapsed && (
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx index ee254214eb..179e249d16 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx @@ -134,7 +134,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() { } + icon={} isLast /> } @@ -149,7 +149,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() { router.push(`/${workspaceSlug}/projects/${projectId}/modules/${value}`); }} title={moduleDetails?.name} - icon={} + icon={} isLast /> } @@ -163,7 +163,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() { } in this module`} position="bottom" > - + {workItemsCount} @@ -221,24 +221,20 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() { {canUserCreateIssue ? ( <> -
    + @@ -246,20 +242,16 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() { ) : ( <> )} - + {moduleId && ( )} diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx index 881733489c..bce3d92322 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx @@ -72,13 +72,13 @@ export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHead moduleDetails={moduleDetails ?? undefined} projectDetails={currentProjectDetails} /> -
    +
    Layout} - customButtonClassName="flex flex-grow justify-center text-custom-text-200 text-sm" + customButton={Layout} + customButtonClassName="flex flex-grow justify-center text-secondary text-13" closeOnSelect > {SUPPORTED_LAYOUTS.map((layout, index) => ( @@ -90,18 +90,18 @@ export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHead className="flex items-center gap-2" > -
    {t(layout.i18n_title)}
    +
    {t(layout.i18n_title)}
    ))}     -
    +
    + Display - + } > @@ -122,7 +122,7 @@ export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHead diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx index cad6652921..f08452982f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx @@ -47,7 +47,7 @@ export const ModulesListHeader = observer(function ModulesListHeader() { } + icon={} isLast /> } @@ -61,11 +61,11 @@ export const ModulesListHeader = observer(function ModulesListHeader() { {canUserCreateModule ? ( - ) : ( - <> )}
    } + icon={} isLast /> } @@ -45,7 +45,7 @@ export const ProjectViewsHeader = observer(function ProjectViewsHeader() {
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/security/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/security/page.tsx index 4ad032f0ec..cf8ff8c07f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/security/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/security/page.tsx @@ -127,7 +127,7 @@ function SecurityPage() {
    {oldPasswordRequired && (
    -

    {t("auth.common.password.current_password.label")}

    +

    {t("auth.common.password.current_password.label")}

    )}
    - {errors.old_password && {errors.old_password.message}} + {errors.old_password && {errors.old_password.message}}
    )}
    -

    {t("auth.common.password.new_password.label")}

    +

    {t("auth.common.password.new_password.label")}

    {passwordSupport} {isNewPasswordSameAsOldPassword && !isPasswordInputFocused && ( - {t("new_password_must_be_different_from_old_password")} + {t("new_password_must_be_different_from_old_password")} )}
    -

    {t("auth.common.password.confirm_password.label")}

    +

    {t("auth.common.password.confirm_password.label")}

    {!!confirmPassword && password !== confirmPassword && renderPasswordMatchError && ( - {t("auth.common.password.errors.match")} + {t("auth.common.password.errors.match")} )}
    diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx index 64234dc11c..86930f734f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx @@ -50,7 +50,7 @@ export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSi
    {!currentUser?.avatar_url || currentUser?.avatar_url === "" ? (
    - +
    ) : (
    @@ -63,8 +63,8 @@ export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSi )}
    -
    {currentUser?.display_name}
    -
    {currentUser?.email}
    +
    {currentUser?.display_name}
    +
    {currentUser?.email}
    } diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx index 7bd3568773..522e2ff5fb 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx @@ -20,17 +20,16 @@ function ProjectSettingsPage() { return (
    No projects yet -
    No projects yet
    -
    +
    No projects yet
    +
    Projects act as the foundation for goal-driven work. They let you manage your teams, tasks, and everything you need to get things done.
    - + Learn more about projects - + {t("workspace_creation.errors.creation_disabled.request_button")}
    ) : (
    -

    {t("workspace_creation.heading")}

    +

    {t("workspace_creation.heading")}

    -
    +
    - + -
    +
    {currentUser?.email}
    @@ -143,8 +143,8 @@ function UserInvitationsPage() { invitations.length > 0 ? (
    -
    {t("we_see_that_someone_has_invited_you_to_join_a_workspace")}
    -

    {t("join_a_workspace")}

    +
    {t("we_see_that_someone_has_invited_you_to_join_a_workspace")}
    +

    {t("join_a_workspace")}

    {invitations.map((invitation) => { const isSelected = invitationsRespond.includes(invitation.id); @@ -152,10 +152,8 @@ function UserInvitationsPage() { return (
    handleInvitation(invitation, isSelected ? "withdraw" : "accepted")} > @@ -167,12 +165,10 @@ function UserInvitationsPage() { />
    -
    {truncateText(invitation.workspace.name, 30)}
    -

    {ROLE[invitation.role]}

    +
    {truncateText(invitation.workspace.name, 30)}
    +

    {ROLE[invitation.role]}

    - +
    @@ -183,7 +179,7 @@ function UserInvitationsPage() { diff --git a/apps/web/app/(all)/layout.tsx b/apps/web/app/(all)/layout.tsx index e87557cb7d..986e93e4a5 100644 --- a/apps/web/app/(all)/layout.tsx +++ b/apps/web/app/(all)/layout.tsx @@ -1,12 +1,6 @@ import { Outlet } from "react-router"; import type { Route } from "./+types/layout"; import { PreloadResources } from "./layout.preload"; -// types - -// styles -import "@/styles/power-k.css"; -import "@/styles/emoji.css"; -import "@plane/propel/styles/react-day-picker.css"; export const meta: Route.MetaFunction = () => [ { name: "robots", content: "noindex, nofollow" }, diff --git a/apps/web/app/(all)/onboarding/page.tsx b/apps/web/app/(all)/onboarding/page.tsx index 0fdb91abc7..9dc169495c 100644 --- a/apps/web/app/(all)/onboarding/page.tsx +++ b/apps/web/app/(all)/onboarding/page.tsx @@ -40,9 +40,9 @@ function OnboardingPage() { return ( -
    +
    -
    +
    {user && !invitationsLoader ? ( ) : ( diff --git a/apps/web/app/(all)/profile/activity/page.tsx b/apps/web/app/(all)/profile/activity/page.tsx index 0ddd56f95e..e3956258ff 100644 --- a/apps/web/app/(all)/profile/activity/page.tsx +++ b/apps/web/app/(all)/profile/activity/page.tsx @@ -69,8 +69,8 @@ function ProfileActivityPage() { {activityPages} {isLoadMoreVisible && ( -
    -
    diff --git a/apps/web/app/(all)/profile/appearance/page.tsx b/apps/web/app/(all)/profile/appearance/page.tsx index 648681f073..68ba9779e6 100644 --- a/apps/web/app/(all)/profile/appearance/page.tsx +++ b/apps/web/app/(all)/profile/appearance/page.tsx @@ -68,8 +68,8 @@ function ProfileAppearancePage() {
    -

    {t("theme")}

    -

    {t("select_or_customize_your_interface_color_scheme")}

    +

    {t("theme")}

    +

    {t("select_or_customize_your_interface_color_scheme")}

    diff --git a/apps/web/app/(all)/profile/layout.tsx b/apps/web/app/(all)/profile/layout.tsx index f426859396..f5aebbfbbb 100644 --- a/apps/web/app/(all)/profile/layout.tsx +++ b/apps/web/app/(all)/profile/layout.tsx @@ -11,9 +11,9 @@ export default function ProfileSettingsLayout() { <> -
    +
    -
    +
    diff --git a/apps/web/app/(all)/profile/security/page.tsx b/apps/web/app/(all)/profile/security/page.tsx index 3e92f4747d..f121880071 100644 --- a/apps/web/app/(all)/profile/security/page.tsx +++ b/apps/web/app/(all)/profile/security/page.tsx @@ -125,7 +125,7 @@ function SecurityPage() {
    {oldPasswordRequired && (
    -

    {t("auth.common.password.current_password.label")}

    +

    {t("auth.common.password.current_password.label")}

    )}
    - {errors.old_password && {errors.old_password.message}} + {errors.old_password && {errors.old_password.message}}
    )}
    -

    {t("auth.common.password.new_password.label")}

    +

    {t("auth.common.password.new_password.label")}

    {passwordSupport} {isNewPasswordSameAsOldPassword && !isPasswordInputFocused && ( - {t("new_password_must_be_different_from_old_password")} + {t("new_password_must_be_different_from_old_password")} )}
    -

    {t("auth.common.password.confirm_password.label")}

    +

    {t("auth.common.password.confirm_password.label")}

    {!!confirmPassword && password !== confirmPassword && renderPasswordMatchError && ( - {t("auth.common.password.errors.match")} + {t("auth.common.password.errors.match")} )}
    diff --git a/apps/web/app/(all)/profile/sidebar.tsx b/apps/web/app/(all)/profile/sidebar.tsx index 13ab54bdba..daaad3d2ee 100644 --- a/apps/web/app/(all)/profile/sidebar.tsx +++ b/apps/web/app/(all)/profile/sidebar.tsx @@ -116,7 +116,7 @@ export const ProfileLayoutSidebar = observer(function ProfileLayoutSidebar() { return (
    {!sidebarCollapsed && ( -

    {t("profile_settings")}

    +

    {t("profile_settings")}

    )}
    {!sidebarCollapsed && ( -
    {t("your_account")}
    +
    {t("your_account")}
    )}
    {PROFILE_ACTION_LINKS.map((link) => { @@ -162,7 +162,7 @@ export const ProfileLayoutSidebar = observer(function ProfileLayoutSidebar() {
    - {!sidebarCollapsed &&

    {t(link.i18n_label)}

    } + {!sidebarCollapsed &&

    {t(link.i18n_label)}

    }
    @@ -173,7 +173,7 @@ export const ProfileLayoutSidebar = observer(function ProfileLayoutSidebar() {
    {!sidebarCollapsed && ( -
    {t("workspaces")}
    +
    {t("workspaces")}
    )} {workspacesList && workspacesList.length > 0 && (
    {workspace?.logo_url && workspace.logo_url !== "" ? ( Workspace Logo ) : ( (workspace?.name?.charAt(0) ?? "...") )} - {!sidebarCollapsed && ( -

    {workspace.name}

    - )} + {!sidebarCollapsed &&

    {workspace.name}

    }     ))} @@ -230,7 +228,7 @@ export const ProfileLayoutSidebar = observer(function ProfileLayoutSidebar() { isMobile={isMobile} >
    @@ -251,7 +249,7 @@ export const ProfileLayoutSidebar = observer(function ProfileLayoutSidebar() { {onReload && ( - )} @@ -34,7 +34,7 @@ interface DevErrorComponentProps { export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorComponentProps) { if (isRouteErrorResponse(error)) { return ( -
    +
    -

    +

    {error.status} {error.statusText}

    -
    +
    -

    Error Data

    -
    -

    {error.data}

    +

    Error Data

    +
    +

    {error.data}

    @@ -69,7 +69,7 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone if (error instanceof Error) { return ( -
    +
    -

    Error

    -
    +

    Error

    +
    -

    Message

    -
    -

    {error.message}

    +

    Message

    +
    +

    {error.message}

    {error.stack && (
    -

    Stack Trace

    -
    - 
    +                  
    Stack Trace
    
+                  
    
+                    
                           {error.stack}
                     
    
                   
    
@@ -106,12 +106,12 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone
    - +
    - +
    -

    Development Mode

    -

    +

    Development Mode

    +

    This detailed error view is only visible in development. In production, users will see a friendly error page.

    @@ -124,7 +124,7 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone } return ( -
    +
    -

    Unknown Error

    -
    +

    Unknown Error

    +
    -
    -

    +

    +

    An unknown error occurred. Please try refreshing the page or contact support if the problem persists.

    diff --git a/apps/web/app/error/prod.tsx b/apps/web/app/error/prod.tsx index 574294e548..75148e7838 100644 --- a/apps/web/app/error/prod.tsx +++ b/apps/web/app/error/prod.tsx @@ -39,7 +39,7 @@ export function ProdErrorComponent({ onGoHome }: ProdErrorComponentProps) { return ( -
    +
    -

    - 🚧 Looks like something went wrong! -

    - +

    🚧 Looks like something went wrong!

    + We track these errors automatically and working on getting things back up and running. If the problem persists feel free to contact us. In the meantime, try refreshing. @@ -67,7 +65,7 @@ export function ProdErrorComponent({ onGoHome }: ProdErrorComponentProps) { href={link.value} target="_blank" rel="noopener noreferrer" - className="text-custom-primary-100 hover:underline text-sm" + className="text-accent-primary hover:underline text-13" > {link.label} @@ -76,7 +74,7 @@ export function ProdErrorComponent({ onGoHome }: ProdErrorComponentProps) {
    -
    diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx index 824b19b91e..3638de072c 100644 --- a/apps/web/app/layout.tsx +++ b/apps/web/app/layout.tsx @@ -2,6 +2,8 @@ import Script from "next/script"; // styles import "@/styles/globals.css"; +import "@/styles/power-k.css"; +import "@/styles/emoji.css"; import { SITE_DESCRIPTION, SITE_NAME } from "@plane/constants"; @@ -76,12 +78,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
    -
    +
    {children}
    diff --git a/apps/web/app/not-found.tsx b/apps/web/app/not-found.tsx index 0ee635460c..44290d63cd 100644 --- a/apps/web/app/not-found.tsx +++ b/apps/web/app/not-found.tsx @@ -13,22 +13,22 @@ export const meta: Route.MetaFunction = () => [ function PageNotFound() { return ( -
    +
    404- Page not found
    -

    Oops! Something went wrong.

    -

    +

    Oops! Something went wrong.

    +

    Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is temporarily unavailable.

    - diff --git a/apps/web/app/root.tsx b/apps/web/app/root.tsx index fe1c36765d..a0d8c20764 100644 --- a/apps/web/app/root.tsx +++ b/apps/web/app/root.tsx @@ -58,12 +58,7 @@ export function Layout({ children }: { children: ReactNode }) {
    -
    +
    {children}
    diff --git a/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx b/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx index 316245fd3c..03c9a05f32 100644 --- a/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx +++ b/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx @@ -80,17 +80,17 @@ export const WorkspaceActiveCyclesUpgrade = observer(function WorkspaceActiveCyc >
    -

    {t("on_demand_snapshots_of_all_your_cycles")}

    -

    {t("active_cycles_description")}

    +

    {t("on_demand_snapshots_of_all_your_cycles")}

    +

    {t("active_cycles_description")}

    @@ -113,12 +113,12 @@ export const WorkspaceActiveCyclesUpgrade = observer(function WorkspaceActiveCyc
    {WORKSPACE_ACTIVE_CYCLES_DETAILS.map((item) => ( -
    +

    {t(item.key)}

    - {t(`${item.key}_description`)} + {t(`${item.key}_description`)}
    ))}
    diff --git a/apps/web/ce/components/command-palette/helpers.tsx b/apps/web/ce/components/command-palette/helpers.tsx index fee3166e8d..714f9a7e59 100644 --- a/apps/web/ce/components/command-palette/helpers.tsx +++ b/apps/web/ce/components/command-palette/helpers.tsx @@ -26,7 +26,7 @@ export const commandGroups: TCommandGroups = { icon: , itemName: (cycle: IWorkspaceDefaultSearchResult) => (
    - {cycle.project__identifier} {cycle.name} + {cycle.project__identifier} {cycle.name}
    ), path: (cycle: IWorkspaceDefaultSearchResult) => @@ -42,7 +42,7 @@ export const commandGroups: TCommandGroups = { issueTypeId={issue.type_id} projectIdentifier={issue.project__identifier} issueSequenceId={issue.sequence_id} - textContainerClassName="text-xs" + size="xs" />{" "} {issue.name}
    @@ -61,7 +61,7 @@ export const commandGroups: TCommandGroups = { icon: , itemName: (view: IWorkspaceDefaultSearchResult) => (
    - {view.project__identifier} {view.name} + {view.project__identifier} {view.name}
    ), path: (view: IWorkspaceDefaultSearchResult) => @@ -72,7 +72,7 @@ export const commandGroups: TCommandGroups = { icon: , itemName: (module: IWorkspaceDefaultSearchResult) => (
    - {module.project__identifier} {module.name} + {module.project__identifier} {module.name}
    ), path: (module: IWorkspaceDefaultSearchResult) => @@ -83,7 +83,7 @@ export const commandGroups: TCommandGroups = { icon: , itemName: (page: IWorkspacePageSearchResult) => (
    - {page.project__identifiers?.[0]} {page.name} + {page.project__identifiers?.[0]} {page.name}
    ), path: (page: IWorkspacePageSearchResult, projectId: string | undefined) => { diff --git a/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx b/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx index 789facdfe8..c4badccd4f 100644 --- a/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx +++ b/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx @@ -26,7 +26,7 @@ export function PowerKModalNoSearchResultsCommand(props: TPowerKModalNoSearchRes label={

    {t("power_k.search_menu.no_results")}{" "} - {t("power_k.search_menu.clear_search")} + {t("power_k.search_menu.clear_search")}

    } onSelect={() => updateSearchTerm("")} diff --git a/apps/web/ce/components/comments/comment-block.tsx b/apps/web/ce/components/comments/comment-block.tsx index becc8acb45..bfbb830218 100644 --- a/apps/web/ce/components/comments/comment-block.tsx +++ b/apps/web/ce/components/comments/comment-block.tsx @@ -41,7 +41,7 @@ export const CommentBlock = observer(function CommentBlock(props: TCommentBlock) ref={commentBlockRef} >
    - {displayName} + {displayName}
    -
    +
    commented{" "} - + {calculateTimeAgo(comment.created_at)} {comment.edited_at && ` (${t("edited")})`} @@ -72,7 +72,7 @@ export const CommentBlock = observer(function CommentBlock(props: TCommentBlock)
    {quickActions}
    -
    {children}
    +
    {children}
    ); diff --git a/apps/web/ce/components/cycles/active-cycle/root.tsx b/apps/web/ce/components/cycles/active-cycle/root.tsx index 12e395fba7..529dd0ffdc 100644 --- a/apps/web/ce/components/cycles/active-cycle/root.tsx +++ b/apps/web/ce/components/cycles/active-cycle/root.tsx @@ -59,7 +59,7 @@ const ActiveCyclesComponent = observer(function ActiveCyclesComponent({ } return ( -
    +
    - -
    + +
    {({ open }) => ( <> - + diff --git a/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx b/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx index a3e88778ce..be1f209ad9 100644 --- a/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx +++ b/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx @@ -18,7 +18,7 @@ export const EstimateListItemButtons = observer(function EstimateListItemButtons return (
    - ) : ( - <> )} diff --git a/apps/web/ce/components/issues/issue-details/issue-creator.tsx b/apps/web/ce/components/issues/issue-details/issue-creator.tsx index 19c1fd20a5..f56de6be97 100644 --- a/apps/web/ce/components/issues/issue-details/issue-creator.tsx +++ b/apps/web/ce/components/issues/issue-details/issue-creator.tsx @@ -22,11 +22,11 @@ export function IssueCreatorDisplay(props: TIssueUser) { return ( <> {customUserName ? ( - {customUserName || "Plane"} + {customUserName || "Plane"} ) : ( {activity.actor_detail?.display_name} diff --git a/apps/web/ce/components/issues/issue-details/issue-identifier.tsx b/apps/web/ce/components/issues/issue-details/issue-identifier.tsx index f6843015b0..e4eaba42c2 100644 --- a/apps/web/ce/components/issues/issue-details/issue-identifier.tsx +++ b/apps/web/ce/components/issues/issue-details/issue-identifier.tsx @@ -1,85 +1,13 @@ -import type { FC } from "react"; import { observer } from "mobx-react"; -// types -import { TOAST_TYPE, setToast } from "@plane/propel/toast"; -import { Tooltip } from "@plane/propel/tooltip"; -import type { IIssueDisplayProperties } from "@plane/types"; -// ui -// helpers -import { cn } from "@plane/utils"; +// plane imports +import type { TIssueIdentifierProps, TIssueTypeIdentifier } from "@plane/types"; // hooks import { useIssueDetail } from "@/hooks/store/use-issue-detail"; import { useProject } from "@/hooks/store/use-project"; - -type TIssueIdentifierBaseProps = { - projectId: string; - size?: "xs" | "sm" | "md" | "lg"; - textContainerClassName?: string; - displayProperties?: IIssueDisplayProperties | undefined; - enableClickToCopyIdentifier?: boolean; -}; - -type TIssueIdentifierFromStore = TIssueIdentifierBaseProps & { - issueId: string; -}; - -type TIssueIdentifierWithDetails = TIssueIdentifierBaseProps & { - issueTypeId?: string | null; - projectIdentifier: string; - issueSequenceId: string | number; -}; - -export type TIssueIdentifierProps = TIssueIdentifierFromStore | TIssueIdentifierWithDetails; - -type TIssueTypeIdentifier = { - issueTypeId: string; - size?: "xs" | "sm" | "md" | "lg"; -}; - -export const IssueTypeIdentifier = observer(function IssueTypeIdentifier(_props: TIssueTypeIdentifier) { - return <>; -}); - -type TIdentifierTextProps = { - identifier: string; - enableClickToCopyIdentifier?: boolean; - textContainerClassName?: string; -}; - -export function IdentifierText(props: TIdentifierTextProps) { - const { identifier, enableClickToCopyIdentifier = false, textContainerClassName } = props; - // handlers - const handleCopyIssueIdentifier = () => { - if (enableClickToCopyIdentifier) { - navigator.clipboard.writeText(identifier).then(() => { - setToast({ - type: TOAST_TYPE.SUCCESS, - title: "Work item ID copied to clipboard", - }); - }); - } - }; - - return ( - - - {identifier} - - - ); -} +import { IdentifierText } from "@/components/issues/issue-detail/identifier-text"; export const IssueIdentifier = observer(function IssueIdentifier(props: TIssueIdentifierProps) { - const { projectId, textContainerClassName, displayProperties, enableClickToCopyIdentifier = false } = props; + const { projectId, variant, size, displayProperties, enableClickToCopyIdentifier = false } = props; // store hooks const { getProjectIdentifierById } = useProject(); const { @@ -100,8 +28,13 @@ export const IssueIdentifier = observer(function IssueIdentifier(props: TIssueId
    ); }); + +export const IssueTypeIdentifier = observer(function IssueTypeIdentifier(_props: TIssueTypeIdentifier) { + return <>; +}); diff --git a/apps/web/ce/components/issues/issue-details/sidebar.tsx/date-alert.tsx b/apps/web/ce/components/issues/issue-details/sidebar/date-alert.tsx similarity index 100% rename from apps/web/ce/components/issues/issue-details/sidebar.tsx/date-alert.tsx rename to apps/web/ce/components/issues/issue-details/sidebar/date-alert.tsx diff --git a/apps/web/ce/components/license/modal/upgrade-modal.tsx b/apps/web/ce/components/license/modal/upgrade-modal.tsx index 0f5e651e17..2fc439d690 100644 --- a/apps/web/ce/components/license/modal/upgrade-modal.tsx +++ b/apps/web/ce/components/license/modal/upgrade-modal.tsx @@ -1,4 +1,3 @@ -import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports import { @@ -19,7 +18,7 @@ import type { TCheckoutParams } from "@/components/license/modal/card/checkout-b // Constants const COMMON_CARD_CLASSNAME = "flex flex-col w-full h-full justify-end col-span-12 sm:col-span-6 xl:col-span-3"; -const COMMON_EXTRA_FEATURES_CLASSNAME = "pt-2 text-center text-xs text-custom-primary-200 font-medium hover:underline"; +const COMMON_EXTRA_FEATURES_CLASSNAME = "pt-2 text-center text-caption-md-medium text-accent-primary hover:underline"; export type PaidPlanUpgradeModalProps = { isOpen: boolean; @@ -48,9 +47,9 @@ export const PaidPlanUpgradeModal = observer(function PaidPlanUpgradeModal(props
    {/* Free Plan Section */}
    -
    Upgrade to a paid plan and unlock missing features.
    +
    Upgrade to a paid plan and unlock missing features.
    -

    +

    Dashboards, Workflows, Approvals, Time Management, and other superpowers are just a click away. Upgrade today to unlock features your teams need yesterday.

    diff --git a/apps/web/ce/components/navigations/top-navigation-root.tsx b/apps/web/ce/components/navigations/top-navigation-root.tsx index 97de65f6c1..f8a3f5268b 100644 --- a/apps/web/ce/components/navigations/top-navigation-root.tsx +++ b/apps/web/ce/components/navigations/top-navigation-root.tsx @@ -40,7 +40,7 @@ export const TopNavigationRoot = observer(function TopNavigationRoot() { return (
    @@ -73,7 +73,7 @@ export const TopNavigationRoot = observer(function TopNavigationRoot() { -
    +
    diff --git a/apps/web/ce/components/onboarding/tour/root.tsx b/apps/web/ce/components/onboarding/tour/root.tsx index f44cd5a911..08ab90be6b 100644 --- a/apps/web/ce/components/onboarding/tour/root.tsx +++ b/apps/web/ce/components/onboarding/tour/root.tsx @@ -89,16 +89,16 @@ export const TourRoot = observer(function TourRoot(props: TOnboardingTourProps) return ( <> {step === "welcome" ? ( -
    +
    -
    - +
    +
    -

    +

    Welcome to Plane, {currentUser?.first_name} {currentUser?.last_name}

    -

    +

    We{"'"}re glad that you decided to try out Plane. You can now manage your projects with ease. Get started by creating a project.

    @@ -117,7 +117,7 @@ export const TourRoot = observer(function TourRoot(props: TOnboardingTourProps)
    ) : ( -
    +
    {currentStep?.title}
    -

    {currentStep?.title}

    -

    {currentStep?.description}

    +

    {currentStep?.title}

    +

    {currentStep?.description}

    {currentStep?.prevStep && ( - )} diff --git a/apps/web/ce/components/onboarding/tour/sidebar.tsx b/apps/web/ce/components/onboarding/tour/sidebar.tsx index 1c7abe20f9..2a41cd503b 100644 --- a/apps/web/ce/components/onboarding/tour/sidebar.tsx +++ b/apps/web/ce/components/onboarding/tour/sidebar.tsx @@ -43,8 +43,8 @@ type Props = { export function TourSidebar({ step, setStep }: Props) { return ( -
    -

    +
    +

    Let{"'"}s get started!
    Get more out of Plane. @@ -53,10 +53,8 @@ export function TourSidebar({ step, setStep }: Props) { {sidebarOptions.map((option) => (

    setStep(option.key)} role="button" diff --git a/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx b/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx index 7e2e70a31d..21fe0185b8 100644 --- a/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx +++ b/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx @@ -33,7 +33,7 @@ export function AskPiMenu(props: Props) { "items-start": response, })} > - + {response ? ( @@ -53,7 +53,7 @@ export function AskPiMenu(props: Props) {
    ) : ( -

    Pi is answering...

    +

    AI is answering...

    )}

    -
    +
    - + setQuery(e.target.value)} - placeholder="Tell Pi what to do..." + placeholder="Tell AI what to do..." /> - +
    diff --git a/apps/web/ce/components/pages/editor/ai/menu.tsx b/apps/web/ce/components/pages/editor/ai/menu.tsx index ac8d74b7a6..513b566b26 100644 --- a/apps/web/ce/components/pages/editor/ai/menu.tsx +++ b/apps/web/ce/components/pages/editor/ai/menu.tsx @@ -138,7 +138,7 @@ export function EditorAIMenu(props: Props) { return (
    @@ -158,9 +158,9 @@ export function EditorAIMenu(props: Props) { key={item.key} type="button" className={cn( - "w-full flex items-center justify-between gap-2 truncate rounded px-1 py-1.5 text-xs text-custom-text-200 hover:bg-custom-background-80 transition-colors", + "w-full flex items-center justify-between gap-2 truncate rounded-sm px-1 py-1.5 text-11 text-secondary hover:bg-layer-1 transition-colors", { - "bg-custom-background-80": isActiveTask, + "bg-layer-1": isActiveTask, } )} onClick={(e) => { @@ -203,7 +203,7 @@ export function EditorAIMenu(props: Props) { "items-start": response, })} > - + {response ? ( @@ -223,7 +223,7 @@ export function EditorAIMenu(props: Props) {
    ) : ( -

    +

    {activeTask ? LOADING_TEXTS[activeTask] : "Pi is writing"}...

    )}
    -
    +
    {TONES_LIST.map((tone) => (
    {activeTask && ( -
    +
    -

    +

    By using this feature, you consent to sharing the message with a 3rd party service.

    diff --git a/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx b/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx index 8f7b6f8b66..b7805b08cb 100644 --- a/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx +++ b/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx @@ -8,7 +8,7 @@ export function IssueEmbedUpgradeCard(props: any) { return (
    -

    +

    Embed and access issues in pages seamlessly, upgrade to Plane Pro now.

    @@ -24,7 +24,7 @@ export function IssueEmbedUpgradeCard(props: any) { href="https://plane.so/pro" target="_blank" rel="noopener noreferrer" - className={cn(getButtonStyling("primary", "md"), "no-underline")} + className={cn(getButtonStyling("primary", "base"), "no-underline")} > Upgrade diff --git a/apps/web/ce/components/pages/header/lock-control.tsx b/apps/web/ce/components/pages/header/lock-control.tsx index c2ee72f6d5..dddc7e6bf3 100644 --- a/apps/web/ce/components/pages/header/lock-control.tsx +++ b/apps/web/ce/components/pages/header/lock-control.tsx @@ -80,7 +80,7 @@ export const PageLockControl = observer(function PageLockControl({ page }: Props type="button" onClick={toggleLock} data-ph-element={PROJECT_PAGE_TRACKER_ELEMENTS.LOCK_BUTTON} - className="flex-shrink-0 size-6 grid place-items-center rounded text-custom-text-200 hover:text-custom-text-100 hover:bg-custom-background-80 transition-colors" + className="flex-shrink-0 size-6 grid place-items-center rounded-sm text-secondary hover:text-primary hover:bg-layer-1 transition-colors" aria-label="Lock" > @@ -93,11 +93,11 @@ export const PageLockControl = observer(function PageLockControl({ page }: Props type="button" onClick={toggleLock} data-ph-element={PROJECT_PAGE_TRACKER_ELEMENTS.LOCK_BUTTON} - className="h-6 flex items-center gap-1 px-2 rounded text-custom-primary-100 bg-custom-primary-100/20 hover:bg-custom-primary-100/30 transition-colors" + className="h-6 flex items-center gap-1 px-2 rounded-sm text-accent-primary bg-accent-primary/20 hover:bg-accent-primary/30 transition-colors" aria-label="Locked" > - + Locked @@ -105,11 +105,11 @@ export const PageLockControl = observer(function PageLockControl({ page }: Props {displayState === "unlocked" && (
    - + Unlocked
    diff --git a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx index 9754f1463f..35c0773040 100644 --- a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx +++ b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx @@ -16,14 +16,10 @@ export function PageNavigationPaneAssetsTabEmptyState() { return (
    - An image depicting the assets of a page + depicts the assets of a page
    -

    {t("page_navigation_pane.tabs.assets.empty_state.title")}

    -

    +

    {t("page_navigation_pane.tabs.assets.empty_state.title")}

    +

    {t("page_navigation_pane.tabs.assets.empty_state.description")}

    diff --git a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx index 43299c7e01..f9b9e612ec 100644 --- a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx +++ b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx @@ -16,14 +16,10 @@ export function PageNavigationPaneOutlineTabEmptyState() { return (
    - An image depicting the outline of a page + depicts the outline of a page
    -

    {t("page_navigation_pane.tabs.outline.empty_state.title")}

    -

    +

    {t("page_navigation_pane.tabs.outline.empty_state.title")}

    +

    {t("page_navigation_pane.tabs.outline.empty_state.description")}

    diff --git a/apps/web/ce/components/projects/create/attributes.tsx b/apps/web/ce/components/projects/create/attributes.tsx index ae7dc07300..d86a381098 100644 --- a/apps/web/ce/components/projects/create/attributes.tsx +++ b/apps/web/ce/components/projects/create/attributes.tsx @@ -40,7 +40,7 @@ function ProjectAttributes(props: Props) { {t(currentNetwork.i18n_label)} ) : ( - {t("select_network")} + {t("select_network")} )}
    } @@ -56,7 +56,7 @@ function ProjectAttributes(props: Props) {

    {t(network.i18n_label)}

    -

    {t(network.description)}

    +

    {t(network.description)}

    diff --git a/apps/web/ce/components/projects/mobile-header.tsx b/apps/web/ce/components/projects/mobile-header.tsx index ca7e9f7c38..8eff30aaf0 100644 --- a/apps/web/ce/components/projects/mobile-header.tsx +++ b/apps/web/ce/components/projects/mobile-header.tsx @@ -52,7 +52,7 @@ export const ProjectsListMobileHeader = observer(function ProjectsListMobileHead const isFiltersApplied = calculateTotalFilters(filters ?? {}) !== 0; return ( -
    +
    { @@ -63,13 +63,13 @@ export const ProjectsListMobileHeader = observer(function ProjectsListMobileHead }} isMobile /> -
    +
    } title={t("common.filters")} placement="bottom-end" menuButton={ -
    +
    {t("common.filters")} diff --git a/apps/web/ce/components/projects/settings/intake/header.tsx b/apps/web/ce/components/projects/settings/intake/header.tsx index 34dd99ccd0..aba1264d77 100644 --- a/apps/web/ce/components/projects/settings/intake/header.tsx +++ b/apps/web/ce/components/projects/settings/intake/header.tsx @@ -47,7 +47,7 @@ export const ProjectInboxHeader = observer(function ProjectInboxHeader() { } + icon={} isLast /> } @@ -56,9 +56,9 @@ export const ProjectInboxHeader = observer(function ProjectInboxHeader() { {loader === "pagination-loading" && ( -
    +
    -

    {t("syncing")}...

    +

    {t("syncing")}...

    )}
    @@ -72,8 +72,7 @@ export const ProjectInboxHeader = observer(function ProjectInboxHeader() { modalState={createIssueModal} handleModalClose={() => setCreateIssueModal(false)} /> - -
    diff --git a/apps/web/ce/components/projects/settings/useProjectColumns.tsx b/apps/web/ce/components/projects/settings/useProjectColumns.tsx index a128095c65..378629e2cc 100644 --- a/apps/web/ce/components/projects/settings/useProjectColumns.tsx +++ b/apps/web/ce/components/projects/settings/useProjectColumns.tsx @@ -94,7 +94,7 @@ export const useProjectColumns = (props: TUseProjectColumnsProps) => { handleDisplayFilterUpdate={handleDisplayFilterUpdate} /> ), - tdRender: (rowData: RowData) =>
    {rowData.member.email}
    , + tdRender: (rowData: RowData) =>
    {rowData.member.email}
    , }, { key: "Account Type", diff --git a/apps/web/ce/components/relations/index.tsx b/apps/web/ce/components/relations/index.tsx index f9d72944c2..9e833feb5d 100644 --- a/apps/web/ce/components/relations/index.tsx +++ b/apps/web/ce/components/relations/index.tsx @@ -9,29 +9,29 @@ export const ISSUE_RELATION_OPTIONS: Record , + className: "bg-layer-1 text-secondary", + icon: (size) => , placeholder: "Add related work items", }, duplicate: { key: "duplicate", i18n_label: "issue.relation.duplicate", - className: "bg-custom-background-80 text-custom-text-200", - icon: (size) => , + className: "bg-layer-1 text-secondary", + icon: (size) => , placeholder: "None", }, blocked_by: { key: "blocked_by", i18n_label: "issue.relation.blocked_by", className: "bg-red-500/20 text-red-700", - icon: (size) => , + icon: (size) => , placeholder: "None", }, blocking: { key: "blocking", i18n_label: "issue.relation.blocking", className: "bg-yellow-500/20 text-yellow-700", - icon: (size) => , + icon: (size) => , placeholder: "None", }, }; diff --git a/apps/web/ce/components/rich-filters/filter-value-input/root.tsx b/apps/web/ce/components/rich-filters/filter-value-input/root.tsx index ae73108463..5119266dda 100644 --- a/apps/web/ce/components/rich-filters/filter-value-input/root.tsx +++ b/apps/web/ce/components/rich-filters/filter-value-input/root.tsx @@ -11,7 +11,7 @@ export const AdditionalFilterValueInput = observer(function AdditionalFilterValu >(_props: TFilterValueInputProps) { return ( // Fallback -
    +
    Filter type not supported
    ); diff --git a/apps/web/ce/components/workflow/state-option.tsx b/apps/web/ce/components/workflow/state-option.tsx index 9516e00d5e..1c31e030f2 100644 --- a/apps/web/ce/components/workflow/state-option.tsx +++ b/apps/web/ce/components/workflow/state-option.tsx @@ -1,6 +1,7 @@ import { observer } from "mobx-react"; import { Check } from "lucide-react"; import { Combobox } from "@headlessui/react"; +import { cn } from "@plane/utils"; export type TStateOptionProps = { projectId: string | null | undefined; @@ -24,7 +25,7 @@ export const StateOption = observer(function StateOption(props: TStateOptionProp key={option.value} value={option.value} className={({ active, selected }) => - `${className} ${active ? "bg-custom-background-80" : ""} ${selected ? "text-custom-text-100" : "text-custom-text-200"}` + cn(`${className} ${active ? "bg-layer-transparent-hover" : ""} ${selected ? "text-primary" : "text-secondary"}`) } > {({ selected }) => ( diff --git a/apps/web/ce/components/workspace-notifications/notification-card/root.tsx b/apps/web/ce/components/workspace-notifications/notification-card/root.tsx index 9b28684dec..aed7327667 100644 --- a/apps/web/ce/components/workspace-notifications/notification-card/root.tsx +++ b/apps/web/ce/components/workspace-notifications/notification-card/root.tsx @@ -39,12 +39,12 @@ export const NotificationCardListRoot = observer(function NotificationCardListRo {paginationInfo && paginationInfo?.next_page_results && ( <> {loader === ENotificationLoader.PAGINATION_LOADER ? ( -
    -
    {t("loading")}...
    +
    +
    {t("loading")}...
    ) : ( -
    -
    +
    +
    {t("load_more")}
    diff --git a/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx b/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx index 3636216128..50c5333982 100644 --- a/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx +++ b/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx @@ -1,8 +1,6 @@ -import type { FC } from "react"; // plane imports import { observer } from "mobx-react"; import type { EProductSubscriptionEnum, TBillingFrequency } from "@plane/types"; -import { getSubscriptionBackgroundColor, getDiscountPillStyle } from "@plane/ui"; import { calculateYearlyDiscount, cn } from "@plane/utils"; type TPlanFrequencyToggleProps = { @@ -14,47 +12,42 @@ type TPlanFrequencyToggleProps = { }; export const PlanFrequencyToggle = observer(function PlanFrequencyToggle(props: TPlanFrequencyToggleProps) { - const { subscriptionType, monthlyPrice, yearlyPrice, selectedFrequency, setSelectedFrequency } = props; + const { monthlyPrice, yearlyPrice, selectedFrequency, setSelectedFrequency } = props; // derived values const yearlyDiscount = calculateYearlyDiscount(monthlyPrice, yearlyPrice); return ( -
    -
    -
    +
    +
    -
    +
    +
    ); diff --git a/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx b/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx index 96e6d4c91a..cdc170c446 100644 --- a/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx +++ b/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx @@ -1,4 +1,3 @@ -import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports import { @@ -9,11 +8,10 @@ import { WORKSPACE_SETTINGS_TRACKER_EVENTS, } from "@plane/constants"; import { useTranslation } from "@plane/i18n"; -import { getButtonStyling } from "@plane/propel/button"; +import { Button } from "@plane/propel/button"; import type { TBillingFrequency } from "@plane/types"; import { EProductSubscriptionEnum } from "@plane/types"; -import { getUpgradeButtonStyle } from "@plane/ui"; -import { cn, getSubscriptionName } from "@plane/utils"; +import { getSubscriptionName } from "@plane/utils"; // components import { DiscountInfo } from "@/components/license/modal/card/discount-info"; import type { TPlanDetail } from "@/constants/plans"; @@ -28,9 +26,6 @@ type TPlanDetailProps = { setBillingFrequency: (frequency: TBillingFrequency) => void; }; -const COMMON_BUTTON_STYLE = - "relative inline-flex items-center justify-center w-full px-4 py-1.5 text-xs font-medium rounded-lg focus:outline-none transition-all duration-300 animate-slide-up"; - export const PlanDetail = observer(function PlanDetail(props: TPlanDetailProps) { const { subscriptionType, planDetail, billingFrequency, setBillingFrequency } = props; // plane hooks @@ -45,8 +40,6 @@ export const PlanDetail = observer(function PlanDetail(props: TPlanDetailProps) billingFrequency === "month" ? planDetail.monthlyPriceSecondaryDescription : planDetail.yearlyPriceSecondaryDescription; - // helper styles - const upgradeButtonStyle = getUpgradeButtonStyle(subscriptionType, false) ?? getButtonStyling("primary", "lg"); const handleRedirection = () => { const frequency = billingFrequency ?? "year"; @@ -66,15 +59,17 @@ export const PlanDetail = observer(function PlanDetail(props: TPlanDetailProps)
    {/* Plan name and pricing section */}
    -
    - {subscriptionName} +
    + {subscriptionName} {subscriptionType === EProductSubscriptionEnum.PRO && ( - Popular + + Popular + )}
    -
    +
    {isSubscriptionActive && displayPrice !== undefined && ( -
    +
    )}
    - {pricingDescription &&
    {pricingDescription}
    } + {pricingDescription &&
    {pricingDescription}
    } {pricingSecondaryDescription && ( -
    - {pricingSecondaryDescription} -
    +
    {pricingSecondaryDescription}
    )}
    @@ -109,10 +102,12 @@ export const PlanDetail = observer(function PlanDetail(props: TPlanDetailProps) )} {/* Subscription button */} -
    - +
    ); diff --git a/apps/web/ce/components/workspace/billing/root.tsx b/apps/web/ce/components/workspace/billing/root.tsx index 085513cc7a..2753887d17 100644 --- a/apps/web/ce/components/workspace/billing/root.tsx +++ b/apps/web/ce/components/workspace/billing/root.tsx @@ -5,8 +5,6 @@ import { DEFAULT_PRODUCT_BILLING_FREQUENCY, SUBSCRIPTION_WITH_BILLING_FREQUENCY import { useTranslation } from "@plane/i18n"; import type { TBillingFrequency, TProductBillingFrequency } from "@plane/types"; import { EProductSubscriptionEnum } from "@plane/types"; -import { getSubscriptionTextColor } from "@plane/ui"; -import { cn } from "@plane/utils"; // components import { SettingsHeading } from "@/components/settings/heading"; // local imports @@ -44,24 +42,20 @@ export const BillingRoot = observer(function BillingRoot() { title={t("workspace_settings.settings.billing_and_plans.heading")} description={t("workspace_settings.settings.billing_and_plans.description")} /> -
    +
    -
    -
    +
    +
    -

    - Community -

    -
    +

    Community

    +
    Unlimited projects, issues, cycles, modules, pages, and storage
    -
    All plans
    +
    All plans
    +
    {/* Conditionally render AppRailRoot based on context */} @@ -25,7 +25,7 @@ export const WorkspaceContentWrapper = observer(function WorkspaceContentWrapper className={cn( "relative size-full pl-2 pb-2 pr-2 flex-grow transition-all ease-in-out duration-300 overflow-hidden", { - "pl-0": shouldRenderAppRail, + "pl-0!": shouldRenderAppRail, } )} > diff --git a/apps/web/ce/components/workspace/delete-workspace-section.tsx b/apps/web/ce/components/workspace/delete-workspace-section.tsx index d25025c28b..8fb5999291 100644 --- a/apps/web/ce/components/workspace/delete-workspace-section.tsx +++ b/apps/web/ce/components/workspace/delete-workspace-section.tsx @@ -1,4 +1,3 @@ -import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; // types @@ -30,7 +29,7 @@ export const DeleteWorkspaceSection = observer(function DeleteWorkspaceSection(p isOpen={deleteWorkspaceModal} onClose={() => setDeleteWorkspaceModal(false)} /> -
    +
    - + {t("workspace_settings.settings.general.delete_workspace")} {isOpen ? : } @@ -47,12 +46,13 @@ export const DeleteWorkspaceSection = observer(function DeleteWorkspaceSection(p } >
    - + {t("workspace_settings.settings.general.delete_workspace_description")}
    diff --git a/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx b/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx index bfbe82073e..5b6c50d512 100644 --- a/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx +++ b/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx @@ -30,7 +30,7 @@ export function ForgotPasswordPopover() { @@ -38,20 +38,20 @@ export function ForgotPasswordPopover() { {({ close }) => (
    🤥 -

    {t("auth.forgot_password.errors.smtp_not_enabled")}

    +

    {t("auth.forgot_password.errors.smtp_not_enabled")}

    )} diff --git a/apps/web/core/components/account/auth-forms/forgot-password.tsx b/apps/web/core/components/account/auth-forms/forgot-password.tsx index 4ef067d9c5..49b1ec43d5 100644 --- a/apps/web/core/components/account/auth-forms/forgot-password.tsx +++ b/apps/web/core/components/account/auth-forms/forgot-password.tsx @@ -92,7 +92,7 @@ export const ForgotPasswordForm = observer(function ForgotPasswordForm() {
    -
    ) : (
    -
    -
    +
    +
    -
    +

    -

    {comicBox?.title}

    -

    {comicBox?.description}

    +

    {comicBox?.title}

    +

    {comicBox?.description}

    diff --git a/apps/web/core/components/common/page-access-icon.tsx b/apps/web/core/components/common/page-access-icon.tsx index 8569013221..264938d8de 100644 --- a/apps/web/core/components/common/page-access-icon.tsx +++ b/apps/web/core/components/common/page-access-icon.tsx @@ -6,11 +6,11 @@ export function PageAccessIcon(page: TPage) { return (
    {page.archived_at ? ( - + ) : page.access === EPageAccess.PUBLIC ? ( - + ) : ( - + )}
    ); diff --git a/apps/web/core/components/common/switcher-label.tsx b/apps/web/core/components/common/switcher-label.tsx index 149fc18e9b..291cb3a8cd 100644 --- a/apps/web/core/components/common/switcher-label.tsx +++ b/apps/web/core/components/common/switcher-label.tsx @@ -22,7 +22,7 @@ export function SwitcherIcon({ logo_props, logo_url, LabelIcon, size = 12, type logo ); @@ -41,7 +41,7 @@ type TSwitcherLabelProps = { export function SwitcherLabel(props: TSwitcherLabelProps) { const { logo_props, name, LabelIcon, logo_url, type = "lucide" } = props; return ( -
    +
    {truncateText(name ?? "", 40)}
    diff --git a/apps/web/core/components/core/activity.tsx b/apps/web/core/components/core/activity.tsx index 92407ca4de..e898578d97 100644 --- a/apps/web/core/components/core/activity.tsx +++ b/apps/web/core/components/core/activity.tsx @@ -59,13 +59,13 @@ export function IssueLink({ activity }: { activity: IIssueActivity }) { href={workItemLink} target={activity.issue === null ? "_self" : "_blank"} rel={activity.issue === null ? "" : "noopener noreferrer"} - className="inline items-center gap-1 font-medium text-custom-text-100 hover:underline" + className="inline items-center gap-1 font-medium text-primary hover:underline" > {`${activity.project_detail.identifier}-${activity.issue_detail.sequence_id}`}{" "} - {activity.issue_detail?.name} + {activity.issue_detail?.name}     ) : ( - + {" a work item"}{" "} )} @@ -84,7 +84,7 @@ function UserLink({ activity }: { activity: IIssueActivity }) { }`} target="_blank" rel="noopener noreferrer" - className="inline-flex items-center font-medium text-custom-text-100 hover:underline" + className="inline-flex items-center font-medium text-primary hover:underline" > {activity.new_value && activity.new_value !== "" ? activity.new_value : activity.old_value}     @@ -177,7 +177,7 @@ const activityDetails: { ); }, - icon:
    ))} @@ -305,13 +305,13 @@ export const ImagePickerPopover = observer(function ImagePickerPopover(props: Pr {...getRootProps()} className={`relative grid h-full 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 - ? "border-2 border-dashed border-custom-border-200 hover:bg-custom-background-90" + ? "border-2 border-dashed border-subtle hover:bg-surface-2" : "" }`} > @@ -325,7 +325,7 @@ export const ImagePickerPopover = observer(function ImagePickerPopover(props: Pr ) : (
    - + {isDragActive ? "Drop image here to upload" : "Drag & drop image here"}
    @@ -335,18 +335,18 @@ export const ImagePickerPopover = observer(function ImagePickerPopover(props: Pr
    {fileRejections.length > 0 && ( -

    +

    {fileRejections[0].errors[0].code === "file-too-large" ? "The image size cannot exceed 5 MB." : "Please upload a file in a valid format."}

    )} -

    File formats supported- .jpeg, .jpg, .png, .webp

    +

    File formats supported- .jpeg, .jpg, .png, .webp

    diff --git a/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx b/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx index 77d4236ef9..086ca12be1 100644 --- a/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx +++ b/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx @@ -127,9 +127,9 @@ export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(pro issues.length > 0 ? (
  • {query === "" && ( -

    Select work items to delete

    +

    Select work items to delete

    )} -
      +
        {issues.map((issue) => ( setQuery("")} appear> -
        +
        -
        +
        { @@ -178,21 +178,18 @@ export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(pro >
        - + {isSearching ? ( @@ -208,10 +205,15 @@ export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(pro {issues.length > 0 && (
        - -
        diff --git a/apps/web/core/components/core/modals/change-email-modal.tsx b/apps/web/core/components/core/modals/change-email-modal.tsx index 3c963921e5..51bd6b3655 100644 --- a/apps/web/core/components/core/modals/change-email-modal.tsx +++ b/apps/web/core/components/core/modals/change-email-modal.tsx @@ -138,7 +138,7 @@ export const ChangeEmailModal = observer(function ChangeEmailModal(props: Props) leaveFrom="opacity-100" leaveTo="opacity-0" > -
        +
        @@ -152,17 +152,17 @@ export const ChangeEmailModal = observer(function ChangeEmailModal(props: Props) leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" > - +
        - + {changeEmailT("title")} -

        {changeEmailT("description")}

        +

        {changeEmailT("description")}

        {secondStep && ( -

        {changeEmailT("form.email.label")}

        +

        {changeEmailT("form.email.label")}

        )} )} /> - {errors?.email && {errors?.email?.message}} + {errors?.email && {errors?.email?.message}}
        {secondStep && (
        -

        {changeEmailT("form.code.label")}

        +

        {changeEmailT("form.code.label")}

        {errors?.code ? ( - {errors?.code?.message} + {errors?.code?.message} ) : ( - {changeEmailT("form.code.helper_text")} + {changeEmailT("form.code.helper_text")} )}
        )} -
        - -
        ))}
        ) : ( -
        +
        {t("issue.select.empty")}
        )} {workspaceLevelToggle && (
        {/* TODO: Translate here */} {searchTerm !== "" && ( -
        +
        Search results for{" "} - + {'"'} {searchTerm} {'"'} @@ -266,7 +267,7 @@ export function ExistingIssuesListModal(props: Props) { searchTerm={searchTerm} /> ) : ( -
          0 ? "p-2" : ""}`}> +
            0 ? "p-2" : ""}`}> {filteredIssues.map((issue) => { const selected = selectedIssues.some((i) => i.id === issue.id); @@ -277,9 +278,9 @@ export function ExistingIssuesListModal(props: Props) { htmlFor={`issue-${issue.id}`} value={issue} className={({ active }) => - `group flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 my-0.5 text-custom-text-200 ${ - active ? "bg-custom-background-80 text-custom-text-100" : "" - } ${selected ? "text-custom-text-100" : ""}` + `group flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 my-0.5 text-secondary ${ + active ? "bg-layer-1 text-primary" : "" + } ${selected ? "text-primary" : ""}` } >
            @@ -296,7 +297,8 @@ export function ExistingIssuesListModal(props: Props) { issueTypeId={issue.type_id} projectIdentifier={issue.project__identifier} issueSequenceId={issue.sequence_id} - textContainerClassName="text-xs text-custom-text-200" + size="xs" + variant="secondary" /> {issue.name} @@ -310,7 +312,7 @@ export function ExistingIssuesListModal(props: Props) { sequenceId: issue?.sequence_id, })} target="_blank" - className="z-1 relative hidden flex-shrink-0 text-custom-text-200 hover:text-custom-text-100 group-hover:block" + className="z-1 relative hidden flex-shrink-0 text-secondary hover:text-primary group-hover:block" rel="noopener noreferrer" onClick={(e) => e.stopPropagation()} > @@ -327,8 +329,7 @@ export function ExistingIssuesListModal(props: Props) {
            -
            diff --git a/apps/web/core/components/core/modals/user-image-upload-modal.tsx b/apps/web/core/components/core/modals/user-image-upload-modal.tsx index e70f8f7370..94cdcd38fc 100644 --- a/apps/web/core/components/core/modals/user-image-upload-modal.tsx +++ b/apps/web/core/components/core/modals/user-image-upload-modal.tsx @@ -99,7 +99,7 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props leaveFrom="opacity-100" leaveTo="opacity-0" > -
            +
            @@ -113,9 +113,9 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props leaveFrom="opacity-100 translate-y-0 sm:scale-100" leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" > - +
            - + Upload Image
            @@ -124,7 +124,7 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props {...getRootProps()} className={`relative grid h-80 w-80 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 - ? "border-2 border-dashed border-custom-border-200 hover:bg-custom-background-90" + ? "border-2 border-dashed border-subtle hover:bg-surface-2" : "" }`} > @@ -132,7 +132,7 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props <> @@ -144,8 +144,8 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props ) : (
            - - + + {isDragActive ? "Drop image here to upload" : "Drag & drop image here"}
            @@ -155,7 +155,7 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props
            {fileRejections.length > 0 && ( -

            +

            {fileRejections[0].errors[0].code === "file-too-large" ? "The image size cannot exceed 5 MB." : "Please upload a file in a valid format."} @@ -163,18 +163,18 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props )}

            -

            File formats supported- .jpeg, .jpg, .png, .webp

            +

            File formats supported- .jpeg, .jpg, .png, .webp

            -
            - @@ -157,8 +157,8 @@ export const WorkspaceImageUploadModal = observer(function WorkspaceImageUploadM ) : (
            - - + + {isDragActive ? "Drop image here to upload" : "Drag & drop image here"}
            @@ -168,7 +168,7 @@ export const WorkspaceImageUploadModal = observer(function WorkspaceImageUploadM
            {fileRejections.length > 0 && ( -

            +

            {fileRejections[0].errors[0].code === "file-too-large" ? "The image size cannot exceed 5 MB." : "Please upload a file in a valid format."} @@ -176,18 +176,24 @@ export const WorkspaceImageUploadModal = observer(function WorkspaceImageUploadM )}

            -

            File formats supported- .jpeg, .jpg, .png, .webp

            +

            File formats supported- .jpeg, .jpg, .png, .webp

            -
            - ); }); diff --git a/apps/web/core/components/core/sidebar/single-progress-stats.tsx b/apps/web/core/components/core/sidebar/single-progress-stats.tsx index f5eacec1b0..ecb453b9b5 100644 --- a/apps/web/core/components/core/sidebar/single-progress-stats.tsx +++ b/apps/web/core/components/core/sidebar/single-progress-stats.tsx @@ -11,9 +11,9 @@ type TSingleProgressStatsProps = { export function SingleProgressStats({ title, completed, total, onClick, selected = false }: TSingleProgressStatsProps) { return (
            {title}
            diff --git a/apps/web/core/components/core/theme/color-picker-input.tsx b/apps/web/core/components/core/theme/color-picker-input.tsx index ddbac128b6..c7a4d02b89 100644 --- a/apps/web/core/components/core/theme/color-picker-input.tsx +++ b/apps/web/core/components/core/theme/color-picker-input.tsx @@ -88,19 +88,17 @@ export function ColorPickerInput(props: Props) { <> {watch(name) && watch(name) !== "" ? ( ) : ( - + )} diff --git a/apps/web/core/components/core/theme/custom-theme-selector.tsx b/apps/web/core/components/core/theme/custom-theme-selector.tsx index 3273b74de6..e3e5083b68 100644 --- a/apps/web/core/components/core/theme/custom-theme-selector.tsx +++ b/apps/web/core/components/core/theme/custom-theme-selector.tsx @@ -127,11 +127,11 @@ export const CustomThemeSelector = observer(function CustomThemeSelector(props: return (
            -

            {t("customize_your_theme")}

            +

            {t("customize_your_theme")}

            -

            {t("background_color")}

            +

            {t("background_color")}

            handleValueChange(val, onChange)} placeholder="#0d101b" - className="w-full placeholder:text-custom-text-400/60" + className="w-full placeholder:text-placeholder/60" style={{ backgroundColor: watch("background"), color: watch("text"), @@ -152,12 +152,12 @@ export const CustomThemeSelector = observer(function CustomThemeSelector(props: /> )} /> - {errors.background &&

            {errors.background.message}

            } + {errors.background &&

            {errors.background.message}

            }
            -

            {t("text_color")}

            +

            {t("text_color")}

            handleValueChange(val, onChange)} placeholder="#c5c5c5" - className="w-full placeholder:text-custom-text-400/60" + className="w-full placeholder:text-placeholder/60" style={{ backgroundColor: watch("text"), color: watch("background"), @@ -178,12 +178,12 @@ export const CustomThemeSelector = observer(function CustomThemeSelector(props: /> )} /> - {errors.text &&

            {errors.text.message}

            } + {errors.text &&

            {errors.text.message}

            }
            -

            {t("primary_color")}

            +

            {t("primary_color")}

            handleValueChange(val, onChange)} placeholder="#3f76ff" - className="w-full placeholder:text-custom-text-400/60" + className="w-full placeholder:text-placeholder/60" style={{ backgroundColor: watch("primary"), color: watch("text"), @@ -204,12 +204,12 @@ export const CustomThemeSelector = observer(function CustomThemeSelector(props: /> )} /> - {errors.primary &&

            {errors.primary.message}

            } + {errors.primary &&

            {errors.primary.message}

            }
            -

            {t("sidebar_background_color")}

            +

            {t("sidebar_background_color")}

            handleValueChange(val, onChange)} placeholder="#0d101b" - className="w-full placeholder:text-custom-text-400/60" + className="w-full placeholder:text-placeholder/60" style={{ backgroundColor: watch("sidebarBackground"), color: watch("sidebarText"), @@ -231,13 +231,13 @@ export const CustomThemeSelector = observer(function CustomThemeSelector(props: )} /> {errors.sidebarBackground && ( -

            {errors.sidebarBackground.message}

            +

            {errors.sidebarBackground.message}

            )}
            -

            {t("sidebar_text_color")}

            +

            {t("sidebar_text_color")}

            handleValueChange(val, onChange)} placeholder="#c5c5c5" - className="w-full placeholder:text-custom-text-400/60" + className="w-full placeholder:text-placeholder/60" style={{ backgroundColor: watch("sidebarText"), color: watch("sidebarBackground"), @@ -258,7 +258,7 @@ export const CustomThemeSelector = observer(function CustomThemeSelector(props: /> )} /> - {errors.sidebarText &&

            {errors.sidebarText.message}

            } + {errors.sidebarText &&

            {errors.sidebarText.message}

            }
            diff --git a/apps/web/core/components/core/theme/theme-switch.tsx b/apps/web/core/components/core/theme/theme-switch.tsx index 597ee3394f..a7d9cc8262 100644 --- a/apps/web/core/components/core/theme/theme-switch.tsx +++ b/apps/web/core/components/core/theme/theme-switch.tsx @@ -22,7 +22,7 @@ export function ThemeSwitch(props: Props) { value ? (
            +
            cn( - "relative z-[1] font-semibold text-xs rounded-[3px] py-1.5 text-custom-text-400 focus:outline-none transition duration-500", + "relative z-[1] font-semibold text-11 rounded-[3px] py-1.5 text-placeholder focus:outline-none transition duration-500", { - "text-custom-text-300 bg-custom-background-100": selected, - "hover:text-custom-text-300": !selected, + "text-tertiary bg-surface-1": selected, + "hover:text-tertiary": !selected, } ) } @@ -141,10 +141,10 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active cn( - "relative z-[1] font-semibold text-xs rounded-[3px] py-1.5 text-custom-text-400 focus:outline-none transition duration-500", + "relative z-[1] font-semibold text-11 rounded-[3px] py-1.5 text-placeholder focus:outline-none transition duration-500", { - "text-custom-text-300 bg-custom-background-100": selected, - "hover:text-custom-text-300": !selected, + "text-tertiary bg-surface-1": selected, + "hover:text-tertiary": !selected, } ) } @@ -154,10 +154,10 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active cn( - "relative z-[1] font-semibold text-xs rounded-[3px] py-1.5 text-custom-text-400 focus:outline-none transition duration-500", + "relative z-[1] font-semibold text-11 rounded-[3px] py-1.5 text-placeholder focus:outline-none transition duration-500", { - "text-custom-text-300 bg-custom-background-100": selected, - "hover:text-custom-text-300": !selected, + "text-tertiary bg-surface-1": selected, + "hover:text-tertiary": !selected, } ) } @@ -169,7 +169,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active
            { if (issue.id) { setPeekIssue({ @@ -202,13 +202,9 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active }} >
            - + - {issue.name} + {issue.name}
            @@ -227,9 +223,9 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active tooltipHeading="Target Date" tooltipContent={renderFormattedDate(issue.target_date)} > -
            +
            - + {renderFormattedDateWithoutYear(issue.target_date)}
            @@ -243,7 +239,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active
            )} @@ -264,7 +260,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active {cycle && !isEmpty(cycle.distribution) ? ( cycle?.distribution?.assignees && cycle.distribution.assignees.length > 0 ? ( @@ -300,7 +296,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active key={`unassigned-${index}`} title={
            -
            +
            User
            {t("no_assignee")} @@ -326,7 +322,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active {cycle && !isEmpty(cycle.distribution) ? ( cycle?.distribution?.labels && cycle.distribution.labels.length > 0 ? ( @@ -341,7 +337,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active backgroundColor: label.color ?? "#000000", }} /> - {label.label_name ?? "No labels"} + {label.label_name ?? "No labels"}
            } completed={label.completed_issues} @@ -370,7 +366,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active
            ) : ( - + ); diff --git a/apps/web/core/components/cycles/active-cycle/productivity.tsx b/apps/web/core/components/cycles/active-cycle/productivity.tsx index af552d06dd..f34153b64c 100644 --- a/apps/web/core/components/cycles/active-cycle/productivity.tsx +++ b/apps/web/core/components/cycles/active-cycle/productivity.tsx @@ -45,12 +45,10 @@ export const ActiveCycleProductivity = observer(function ActiveCycleProductivity const completionChartDistributionData = chartDistributionData?.completion_chart || undefined; return cycle && completionChartDistributionData ? ( -
            +
            -

            - {t("project_cycles.active_cycle.issue_burndown")} -

            +

            {t("project_cycles.active_cycle.issue_burndown")}

            @@ -59,7 +57,7 @@ export const ActiveCycleProductivity = observer(function ActiveCycleProductivity {cycle.total_issues > 0 ? ( <>
            -
            +
            {estimateType === "points" ? ( {`Pending points - ${cycle.backlog_estimate_points + cycle.unstarted_estimate_points + cycle.started_estimate_points}`} ) : ( @@ -98,7 +96,7 @@ export const ActiveCycleProductivity = observer(function ActiveCycleProductivity
            ) : ( - + ); diff --git a/apps/web/core/components/cycles/active-cycle/progress.tsx b/apps/web/core/components/cycles/active-cycle/progress.tsx index 226a4b2ab2..b0d5ac74e8 100644 --- a/apps/web/core/components/cycles/active-cycle/progress.tsx +++ b/apps/web/core/components/cycles/active-cycle/progress.tsx @@ -44,12 +44,12 @@ export const ActiveCycleProgress = observer(function ActiveCycleProgress(props: const resolvedPath = resolvedTheme === "light" ? lightProgressAsset : darkProgressAsset; return cycle && cycle.hasOwnProperty("started_issues") ? ( -
            +
            -

            {t("project_cycles.active_cycle.progress")}

            +

            {t("project_cycles.active_cycle.progress")}

            {cycle.total_issues > 0 && ( - + {`${cycle.completed_issues + cycle.cancelled_issues}/${cycle.total_issues - cycle.cancelled_issues} ${ cycle.completed_issues + cycle.cancelled_issues > 1 ? "Work items" : "Work item" } closed`} @@ -66,7 +66,7 @@ export const ActiveCycleProgress = observer(function ActiveCycleProgress(props: {groupedIssues[group] > 0 && (
            { handleFiltersUpdate([{ property: "state_group", operator: "in", value: [group] }]); }} @@ -78,9 +78,9 @@ export const ActiveCycleProgress = observer(function ActiveCycleProgress(props: backgroundColor: PROGRESS_STATE_GROUPS_DETAILS[index].color, }} /> - {group} + {group}
            - {`${groupedIssues[group]} ${ + {`${groupedIssues[group]} ${ groupedIssues[group] > 1 ? "Work items" : "Work item" }`}
            @@ -89,7 +89,7 @@ export const ActiveCycleProgress = observer(function ActiveCycleProgress(props: ))} {cycle.cancelled_issues > 0 && ( - + {`${cycle.cancelled_issues} cancelled ${ cycle.cancelled_issues > 1 ? "work items are" : "work item is" @@ -105,7 +105,7 @@ export const ActiveCycleProgress = observer(function ActiveCycleProgress(props: )}
            ) : ( - + ); diff --git a/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx b/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx index 119979e031..711bfc66a2 100644 --- a/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx +++ b/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx @@ -98,7 +98,7 @@ export const CycleAnalyticsProgress = observer(function CycleAnalyticsProgress(p if (!cycleDetails) return <>; return ( -
            +
            {({ open }) => (
            @@ -106,9 +106,7 @@ export const CycleAnalyticsProgress = observer(function CycleAnalyticsProgress(p {isCycleDateValid ? (
            -
            - {t("project_cycles.active_cycle.progress")} -
            +
            {t("project_cycles.active_cycle.progress")}
             {open ? ( @@ -120,13 +118,11 @@ export const CycleAnalyticsProgress = observer(function CycleAnalyticsProgress(p
            ) : (
            -
            - {t("project_cycles.active_cycle.progress")} -
            +
            {t("project_cycles.active_cycle.progress")}
            )} - + {cycleStartDate && cycleEndDate ? ( <> {isCycleDateValid && ( @@ -160,7 +156,7 @@ export const CycleAnalyticsProgress = observer(function CycleAnalyticsProgress(p )} ) : ( -
            +
            {t("no_data_yet")}
            )} diff --git a/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx b/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx index 722d30e2c6..109285c1d2 100644 --- a/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx +++ b/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx @@ -122,18 +122,16 @@ export const CycleProgressStats = observer(function CycleProgressStats(props: TC className={cn( `flex w-full items-center justify-between gap-2 rounded-md p-1`, roundedTab ? `rounded-3xl` : `rounded-md`, - noBackground ? `` : `bg-custom-background-90`, - size === "xs" ? `text-xs` : `text-sm` + noBackground ? `` : `bg-surface-2`, + size === "xs" ? `text-11` : `text-13` )} > {PROGRESS_STATS.map((stat) => ( setCycleTab(stat.key)} @@ -142,7 +140,7 @@ export const CycleProgressStats = observer(function CycleProgressStats(props: TC ))} - + {cycleDetails?.description && (