From f464acbf97b70617671e720fe6fa6335827a85da Mon Sep 17 00:00:00 2001 From: Aaron Date: Mon, 8 Dec 2025 23:56:20 +0700 Subject: [PATCH] chore: run fixes (#4993) * chore: run fixes * fix: type, just use hocuspocusservercontext * fix: codemod * chore: run ee fixes --------- Co-authored-by: Palanikannan M --- .../pull-request-build-lint-web-apps.yml | 1 + .npmrc | 12 - .../authentication/github/mobile-form.tsx | 6 +- .../authentication/google/mobile-form.tsx | 6 +- .../(dashboard)/authentication/oidc/form.tsx | 4 +- .../(dashboard)/authentication/oidc/page.tsx | 4 +- .../(dashboard)/authentication/saml/form.tsx | 4 +- .../(dashboard)/authentication/saml/page.tsx | 4 +- .../(dashboard)/sidebar-help-section.tsx | 2 +- apps/admin/app/(all)/(home)/auth-helpers.tsx | 9 +- apps/admin/app/entry.client.tsx | 1 - .../ce/components/common/upgrade-button.tsx | 1 + .../core/components/workspace/list-item.tsx | 1 + .../authentication/authentication-modes.tsx | 2 +- .../components/authentication/oidc-config.tsx | 4 +- .../saml-attribute-mapping-table.tsx | 58 +- .../components/authentication/saml-config.tsx | 4 +- .../ee/components/common/upgrade-button.tsx | 6 +- apps/live/src/controllers/admin.controller.ts | 2 +- .../src/controllers/broadcast.controller.ts | 2 +- .../src/extensions/force-close-handler.ts | 4 +- apps/live/src/lib/markdown-parser.ts/index.ts | 25 +- apps/live/src/lib/stateless.ts | 4 +- apps/live/src/start.ts | 1 - apps/live/src/utils/broadcast-error.ts | 4 +- .../migrator/transformers/etl.ts | 2 +- .../migrator/clickup-additional.migrator.ts | 2 +- .../apps/engine/controllers/app.controller.ts | 2 +- .../silo/src/apps/github/controllers/index.ts | 4 +- apps/silo/src/apps/github/helpers/helpers.ts | 10 +- .../silo/src/apps/github/helpers/transform.ts | 2 +- .../event-handlers/installation.handler.ts | 2 +- .../event-handlers/issue-comment.handler.ts | 8 +- .../github/event-handlers/issue.handler.ts | 10 +- .../event-handlers/pull-request.handler.ts | 6 +- .../event-handlers/issue-comment.handler.ts | 12 +- .../plane/event-handlers/issue.handler.ts | 12 +- .../gitlab-enterprise/controllers/index.ts | 2 +- apps/silo/src/apps/gitlab/controller/index.ts | 6 +- .../gitlab/handlers/merge-request.handler.ts | 2 +- .../apps/jira-importer/controllers/index.ts | 2 +- .../helpers/migration-helpers.ts | 6 +- .../helpers/migration-helpers.ts | 2 +- .../steps/shared/entities/cycles.step.ts | 2 +- .../shared/entities/issue-properties.step.ts | 8 +- .../entities/issue-property-options.step.ts | 4 +- .../steps/shared/entities/issue-types.step.ts | 4 +- .../steps/shared/entities/modules.step.ts | 2 +- .../steps/shared/entities/users.step.ts | 4 +- .../migrator/tranformers/etl.ts | 4 +- .../notion-importer/worker/phases/base.ts | 6 +- .../worker/handlers/handle-alert-event.ts | 4 +- apps/silo/src/apps/slack/controllers/index.ts | 6 +- .../apps/slack/helpers/connection-details.ts | 8 +- .../src/apps/slack/views/issue-modal-full.ts | 1 - apps/silo/src/etl/migrator/cycles.migrator.ts | 2 +- .../issue-types/issue-property.migrator.ts | 4 +- .../issue-types/issue-type.migrator.ts | 2 +- apps/silo/src/etl/migrator/issues.migrator.ts | 8 +- apps/silo/src/etl/migrator/labels.migrator.ts | 2 +- .../src/etl/migrator/projects.migrator.ts | 2 +- apps/silo/src/etl/migrator/states.migrator.ts | 2 +- apps/silo/src/helpers/connection-details.ts | 2 +- apps/silo/src/helpers/job.ts | 2 +- apps/silo/src/helpers/utils.ts | 4 +- .../behaviours/git/pull-request.behaviour.ts | 2 +- apps/silo/src/lib/decorators.ts | 2 +- .../services/form-fields/options-fields.ts | 2 +- apps/silo/src/services/oauth/controller.ts | 2 +- apps/silo/src/services/oauth/helpers.ts | 2 +- .../oauth/strategies/github.strategy.ts | 26 +- .../oauth/strategies/gitlab.strategy.ts | 8 +- .../oauth/strategies/sentry-oauth.strategy.ts | 2 +- apps/space/app/entry.client.tsx | 1 - apps/space/app/intake/[anchor]/page.tsx | 4 +- apps/space/app/intake/forms/[anchor]/page.tsx | 4 +- apps/space/app/pages/[anchor]/page.tsx | 2 - apps/space/app/views/[anchor]/page.tsx | 4 +- .../issues/issue-layouts/issue-layout-HOC.tsx | 2 +- .../issues/issue-layouts/kanban/default.tsx | 2 +- .../issue-layouts/kanban/kanban-group.tsx | 2 +- .../issues/issue-layouts/kanban/swimlanes.tsx | 6 +- .../issues/issue-layouts/list/default.tsx | 2 +- .../issues/issue-layouts/list/list-group.tsx | 2 +- .../issues/issue-layouts/properties/state.tsx | 2 - .../components/issues/issue-layouts/utils.tsx | 11 +- .../hooks/use-clipboard-write-permission.tsx | 2 +- .../core/hooks/use-intersection-observer.tsx | 1 - .../core/store/helpers/base-issues.store.ts | 8 +- .../editor/embeds/mentions/root.tsx | 4 +- .../embeds/mentions/work-item/content.tsx | 2 +- .../editor/embeds/mentions/work-item/logo.tsx | 2 +- .../embeds/mentions/work-item/preview.tsx | 2 +- .../editor/embeds/mentions/work-item/root.tsx | 2 +- .../editor/external-embed/embed-handler.tsx | 2 +- .../components/gantt-chart/blocks/block.tsx | 4 +- .../gantt-chart/blocks/blocks-list.tsx | 6 +- .../components/gantt-chart/chart/header.tsx | 2 +- .../gantt-chart/chart/main-content.tsx | 4 +- .../ee/components/gantt-chart/chart/root.tsx | 4 +- .../gantt-chart/chart/views/bi-week.tsx | 3 +- .../gantt-chart/chart/views/day.tsx | 2 +- .../gantt-chart/chart/views/hours.tsx | 2 +- .../gantt-chart/chart/views/month.tsx | 2 +- .../gantt-chart/chart/views/quarter.tsx | 2 +- .../gantt-chart/chart/views/week.tsx | 2 +- .../gantt-chart/chart/views/year.tsx | 2 +- .../components/gantt-chart/contexts/index.tsx | 4 +- .../ee/components/gantt-chart/data/index.ts | 2 +- .../gantt-chart/helpers/Scrollable.tsx | 2 +- apps/space/ee/components/gantt-chart/root.tsx | 6 +- .../gantt-chart/sidebar/issues/block.tsx | 2 +- .../gantt-chart/sidebar/issues/sidebar.tsx | 6 +- .../components/gantt-chart/sidebar/root.tsx | 4 +- .../components/gantt-chart/sidebar/utils.ts | 2 +- .../intake/create/create-issue-modal.tsx | 5 +- .../intake/create/create-type-form-modal.tsx | 4 +- .../ee/components/intake/create/form.tsx | 2 +- .../ee/components/intake/create/success.tsx | 5 +- apps/space/ee/components/intake/info.tsx | 5 +- .../calendar/base-calendar-root.tsx | 4 +- .../issue-layouts/calendar/calendar.tsx | 6 +- .../issue-layouts/calendar/day-tile.tsx | 4 +- .../calendar/dropdowns/months-dropdown.tsx | 2 +- .../issue-layouts/calendar/header.tsx | 2 +- .../calendar/issue-block-root.tsx | 4 +- .../issue-layouts/calendar/issue-block.tsx | 2 - .../issue-layouts/calendar/issue-blocks.tsx | 2 +- .../issue-layouts/calendar/week-days.tsx | 2 +- .../issue-layouts/calendar/week-header.tsx | 2 +- .../filters/applied-filters/cycle.tsx | 4 +- .../filters/applied-filters/date.tsx | 2 +- .../filters/applied-filters/filters-list.tsx | 2 +- .../filters/applied-filters/label.tsx | 2 +- .../filters/applied-filters/members.tsx | 4 +- .../filters/applied-filters/module.tsx | 4 +- .../filters/applied-filters/priority.tsx | 4 +- .../filters/applied-filters/root.tsx | 4 +- .../filters/applied-filters/state.tsx | 4 +- .../filters/header/filters/assignee.tsx | 4 +- .../filters/header/filters/created-by.tsx | 4 +- .../filters/header/filters/cycle.tsx | 4 +- .../header/filters/filters-selection.tsx | 2 +- .../filters/header/filters/labels.tsx | 10 +- .../filters/header/filters/module.tsx | 4 +- .../filters/header/filters/priority.tsx | 4 +- .../filters/header/filters/start-date.tsx | 2 +- .../filters/header/filters/state.tsx | 4 +- .../filters/header/filters/target-date.tsx | 2 +- .../filters/header/helpers/dropdown.tsx | 6 +- .../filters/header/helpers/filter-header.tsx | 26 +- .../filters/header/helpers/filter-option.tsx | 4 +- .../components/issue-layouts/filters/root.tsx | 4 +- .../issue-layouts/gantt/base-gantt-root.tsx | 4 +- .../components/issue-layouts/gantt/blocks.tsx | 6 +- .../issue-layouts/kanban/base-kanban-root.tsx | 4 +- .../issue-layouts/list/base-list-root.tsx | 2 +- .../ee/components/issue-layouts/root.tsx | 4 +- .../spreadsheet/base-spreadsheet-root.tsx | 2 +- .../spreadsheet/columns/assignee-column.tsx | 2 +- .../spreadsheet/columns/attachment-column.tsx | 2 +- .../spreadsheet/columns/created-on-column.tsx | 2 +- .../spreadsheet/columns/cycle-column.tsx | 2 +- .../spreadsheet/columns/due-date-column.tsx | 2 +- .../spreadsheet/columns/header-column.tsx | 6 +- .../spreadsheet/columns/label-column.tsx | 2 +- .../spreadsheet/columns/link-column.tsx | 2 +- .../spreadsheet/columns/module-column.tsx | 2 +- .../spreadsheet/columns/priority-column.tsx | 2 +- .../spreadsheet/columns/start-date-column.tsx | 2 +- .../spreadsheet/columns/state-column.tsx | 2 +- .../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 | 6 +- .../spreadsheet/spreadsheet-header-column.tsx | 2 +- .../spreadsheet/spreadsheet-header.tsx | 2 +- .../spreadsheet/spreadsheet-table.tsx | 34 +- .../spreadsheet/spreadsheet-view.tsx | 2 +- apps/space/ee/components/navbar/controls.tsx | 4 +- apps/space/ee/components/navbar/root.tsx | 4 +- apps/space/ee/components/pages/error.tsx | 22 +- .../ee/components/pages/main-content.tsx | 2 +- apps/space/ee/components/pages/page-head.tsx | 26 +- apps/space/ee/components/pages/page/root.tsx | 22 +- .../ee/components/pages/work-item-embed.tsx | 2 +- apps/space/helpers/authentication.helper.tsx | 9 +- .../(pi)/pi-chat/[chatId]/page.tsx | 7 +- .../[workspaceSlug]/(pi)/pi-chat/layout.tsx | 2 - .../[workspaceSlug]/(pi)/pi-chat/new/page.tsx | 2 - .../[workspaceSlug]/(pi)/pi-chat/page.tsx | 2 - .../[workspaceSlug]/(pi)/pi-chat/sidebar.tsx | 3 +- .../(projects)/active-cycles/error.tsx | 2 - .../(projects)/analytics/[tabId]/page.tsx | 2 - .../browse/[workItem]/epic-header.tsx | 3 +- .../browse/[workItem]/work-item-header.tsx | 4 +- .../(detail)/[customerId]/layout.tsx | 2 - .../customers/(detail)/[customerId]/page.tsx | 6 +- .../(projects)/customers/(list)/layout.tsx | 2 - .../(projects)/customers/(list)/page.tsx | 5 +- .../(projects)/customers/layout.tsx | 1 - .../(detail)/[dashboardId]/header.tsx | 2 +- .../(detail)/[dashboardId]/layout.tsx | 2 - .../(detail)/[dashboardId]/page.tsx | 2 - .../(projects)/dashboards/(list)/header.tsx | 2 +- .../(projects)/dashboards/(list)/layout.tsx | 2 - .../(projects)/dashboards/(list)/page.tsx | 2 - .../(projects)/dashboards/layout.tsx | 2 - .../[initiativeId]/(overview)/layout.tsx | 20 +- .../[initiativeId]/(overview)/page.tsx | 2 - .../(detail)/[initiativeId]/scope/layout.tsx | 21 +- .../(detail)/[initiativeId]/scope/page.tsx | 2 - .../(projects)/initiatives/(list)/header.tsx | 4 +- .../(projects)/initiatives/(list)/layout.tsx | 20 +- .../(projects)/initiatives/(list)/page.tsx | 2 - .../(projects)/initiatives/layout.tsx | 2 - .../automations/[automationId]/header.tsx | 4 +- .../automations/[automationId]/layout.tsx | 2 - .../automations/[automationId]/page.tsx | 2 - .../[projectId]/cycles/(detail)/header.tsx | 6 +- .../epics/(detail)/[epicId]/page.tsx | 2 - .../[projectId]/epics/(detail)/header.tsx | 4 +- .../[projectId]/epics/(detail)/layout.tsx | 2 - .../[projectId]/epics/(list)/header.tsx | 4 +- .../[projectId]/epics/(list)/layout.tsx | 2 - .../epics/(list)/mobile-header.tsx | 11 +- .../[projectId]/epics/(list)/page.tsx | 2 - .../(detail)/[projectId]/epics/layout.tsx | 2 - .../issues/(list)/mobile-header.tsx | 5 +- .../projects/(detail)/[projectId]/layout.tsx | 2 - .../modules/(detail)/mobile-header.tsx | 6 +- .../[projectId]/modules/(list)/header.tsx | 2 +- .../[projectId]/overview/(list)/header.tsx | 4 +- .../[projectId]/overview/(list)/layout.tsx | 2 - .../[projectId]/overview/(list)/page.tsx | 2 - .../[projectId]/pages/(detail)/header.tsx | 12 +- .../[projectId]/views/(list)/header.tsx | 2 +- .../projects/pi-chat/[chatId]/page.tsx | 2 - .../(projects)/projects/pi-chat/layout.tsx | 2 - .../(projects)/projects/pi-chat/new/page.tsx | 2 - .../(projects)/projects/pi-chat/page.tsx | 1 - .../(projects)/search/page.tsx | 2 - .../[teamspaceId]/(overview)/layout.tsx | 2 - .../[teamspaceId]/(overview)/page.tsx | 2 - .../(detail)/[teamspaceId]/cycles/layout.tsx | 2 - .../(detail)/[teamspaceId]/cycles/page.tsx | 7 +- .../(detail)/[teamspaceId]/issues/layout.tsx | 2 - .../(detail)/[teamspaceId]/issues/page.tsx | 2 - .../(detail)/[teamspaceId]/layout.tsx | 2 - .../pages/(detail)/[pageId]/page.tsx | 2 - .../[teamspaceId]/pages/(detail)/header.tsx | 16 +- .../[teamspaceId]/pages/(detail)/layout.tsx | 2 - .../[teamspaceId]/pages/(list)/layout.tsx | 2 - .../[teamspaceId]/pages/(list)/page.tsx | 2 - .../(detail)/[teamspaceId]/pages/layout.tsx | 2 - .../projects/(detail)/[projectId]/page.tsx | 2 - .../projects/(detail)/header.tsx | 4 +- .../projects/(detail)/layout.tsx | 2 - .../[teamspaceId]/projects/(list)/layout.tsx | 2 - .../[teamspaceId]/projects/(list)/page.tsx | 2 - .../views/(detail)/[viewId]/page.tsx | 2 - .../[teamspaceId]/views/(detail)/header.tsx | 4 +- .../[teamspaceId]/views/(detail)/layout.tsx | 2 - .../[teamspaceId]/views/(list)/layout.tsx | 2 - .../[teamspaceId]/views/(list)/page.tsx | 2 - .../(projects)/teamspaces/(list)/layout.tsx | 2 - .../(projects)/teamspaces/(list)/page.tsx | 2 - .../(projects)/teamspaces/layout.tsx | 2 - .../settings/(workspace)/customers/page.tsx | 2 - .../imports/(importers)/asana/page.tsx | 2 - .../imports/(importers)/clickup/page.tsx | 2 - .../imports/(importers)/confluence/page.tsx | 2 - .../imports/(importers)/csv/page.tsx | 2 - .../imports/(importers)/jira-server/page.tsx | 2 - .../imports/(importers)/jira/page.tsx | 2 - .../imports/(importers)/layout.tsx | 2 - .../imports/(importers)/linear/page.tsx | 2 - .../imports/(importers)/notion/page.tsx | 2 - .../settings/(workspace)/initiatives/page.tsx | 2 - .../(integrations)/github-enterprise/page.tsx | 2 - .../(integrations)/github/page.tsx | 2 - .../(integrations)/gitlab-enterprise/page.tsx | 2 - .../(integrations)/gitlab/page.tsx | 2 - .../integrations/(integrations)/layout.tsx | 2 - .../(integrations)/sentry/page.tsx | 2 - .../(integrations)/slack/page.tsx | 2 - .../integrations/[appSlug]/edit/page.tsx | 2 - .../integrations/[appSlug]/install/page.tsx | 2 - .../integrations/[appSlug]/layout.tsx | 1 - .../(workspace)/integrations/create/page.tsx | 2 - .../(workspace)/integrations/layout.tsx | 14 +- .../(workspace)/plane-intelligence/page.tsx | 2 - .../(workspace)/project-states/page.tsx | 2 - .../settings/(workspace)/teamspaces/page.tsx | 2 - .../templates/(templates)/layout.tsx | 2 - .../templates/(templates)/page/page.tsx | 2 - .../project/[templateId]/publish/page.tsx | 2 - .../templates/(templates)/project/page.tsx | 2 - .../templates/(templates)/work-item/page.tsx | 2 - .../settings/(workspace)/templates/page.tsx | 2 - .../settings/(workspace)/worklogs/page.tsx | 2 - .../settings/account/connections/page.tsx | 2 - .../projects/[projectId]/epics/page.tsx | 2 - .../[projectId]/features/cycles/page.tsx | 2 - .../[projectId]/features/intake/page.tsx | 6 +- .../[projectId]/integrations/page.tsx | 2 - .../[projectId]/project-updates/page.tsx | 2 - .../[recurringWorkItemId]/update/page.tsx | 2 - .../(details)/create/page.tsx | 2 - .../recurring-work-items/(details)/layout.tsx | 2 - .../recurring-work-items/layout.tsx | 2 - .../[projectId]/recurring-work-items/page.tsx | 2 - .../templates/(templates)/layout.tsx | 2 - .../templates/(templates)/page/page.tsx | 2 - .../templates/(templates)/work-item/page.tsx | 2 - .../projects/[projectId]/templates/page.tsx | 2 - .../[projectId]/work-item-types/page.tsx | 2 - .../projects/[projectId]/workflows/page.tsx | 2 - .../wiki/(pageType)/archived/layout.tsx | 2 - .../(wiki)/wiki/(pageType)/archived/page.tsx | 2 - .../(wiki)/wiki/(pageType)/filters-header.tsx | 4 +- .../(wiki)/wiki/(pageType)/header.tsx | 4 +- .../(wiki)/wiki/(pageType)/private/layout.tsx | 2 - .../(wiki)/wiki/(pageType)/private/page.tsx | 2 - .../(wiki)/wiki/(pageType)/public/layout.tsx | 2 - .../(wiki)/wiki/(pageType)/public/page.tsx | 2 - .../(pageType)/shared/empty-shared-pages.tsx | 5 +- .../(wiki)/wiki/(pageType)/shared/layout.tsx | 2 - .../(wiki)/wiki/(pageType)/shared/page.tsx | 2 - .../(wiki)/wiki/[pageId]/header.tsx | 16 +- .../(wiki)/wiki/[pageId]/layout.tsx | 2 - .../(wiki)/wiki/[pageId]/page.tsx | 2 - .../[workspaceSlug]/(wiki)/wiki/_sidebar.tsx | 3 +- .../[workspaceSlug]/(wiki)/wiki/header.tsx | 30 +- .../[workspaceSlug]/(wiki)/wiki/layout.tsx | 2 - .../[workspaceSlug]/(wiki)/wiki/page.tsx | 2 - .../[workspaceSlug]/(wiki)/wiki/sidebar.tsx | 2 +- .../(all)/installations/[provider]/page.tsx | 2 - .../app/(all)/profile/connections/page.tsx | 2 - apps/web/app/entry.client.tsx | 1 - apps/web/app/m/auth/page.tsx | 2 - apps/web/app/oauth/page.tsx | 2 - .../[feature]/[identifier]/empty-state.tsx | 3 +- .../[feature]/[identifier]/page.tsx | 2 - .../[feature]/[identifier]/workspace-list.tsx | 4 +- .../[identifier]/workspace-selector.tsx | 2 +- .../ce/components/app-rail/app-rail-hoc.tsx | 4 +- .../intake/additional-information.tsx | 4 +- apps/web/ce/components/issues/header.tsx | 2 +- .../components/issues/issue-details/page.tsx | 6 +- .../license/modal/upgrade-modal.tsx | 14 +- .../navigations/top-navigation-root.tsx | 2 +- .../pages/editor/template-picker.tsx | 4 +- .../pages/header/comment-control.tsx | 6 +- .../projects/settings/useProjectColumns.tsx | 6 +- .../rich-filters/filter-value-input/root.tsx | 1 - .../workspace-notifications/root.tsx | 4 +- .../workspace/upgrade-empty-state-button.tsx | 24 +- apps/web/ce/hooks/app-rail/provider.tsx | 10 +- apps/web/ce/hooks/use-page-actions-menu.tsx | 4 +- .../account/auth-forms/auth-root.tsx | 4 +- .../modal/generated-token-details.tsx | 2 +- .../components/api-token/token-list-item.tsx | 2 +- apps/web/core/components/appearance/list.tsx | 18 +- .../core/components/appearance/section.tsx | 18 +- .../appearance/smooth-cursor-toggle.tsx | 2 +- .../components/appearance/theme-switcher.tsx | 4 +- .../components/comments/comment-create.tsx | 2 +- .../web/core/components/comments/comments.tsx | 2 +- .../components/comments/quick-actions.tsx | 2 +- .../components/common/breadcrumb-link.tsx | 9 +- .../core/components/common/custom-error.tsx | 6 +- .../core/modals/bulk-delete-issues-modal.tsx | 2 +- .../core/modals/change-email-modal.tsx | 4 +- .../analytics-sidebar/sidebar-header.tsx | 2 +- apps/web/core/components/cycles/modal.tsx | 2 +- .../dropdowns/intake-state/base.tsx | 8 +- .../dropdowns/intake-state/dropdown.tsx | 4 +- .../core/components/dropdowns/state/base.tsx | 2 +- .../components/estimates/points/create.tsx | 2 +- .../components/estimates/points/update.tsx | 2 +- apps/web/core/components/estimates/root.tsx | 1 + .../core/components/exporter/export-form.tsx | 2 +- .../core/components/exporter/export-modal.tsx | 2 +- apps/web/core/components/exporter/guide.tsx | 11 +- .../core/components/exporter/prev-exports.tsx | 8 +- .../components/exporter/single-export.tsx | 2 +- .../core/components/gantt-chart/data/index.ts | 2 +- .../components/gantt-chart/sidebar/utils.ts | 2 +- .../global/product-updates/footer.tsx | 5 + .../home/widgets/manage/widget-item.tsx | 2 +- .../core/components/importers/empty-state.tsx | 2 +- .../components/inbox/content/issue-root.tsx | 3 +- .../inbox/modals/delete-issue-modal.tsx | 4 +- .../integration/delete-import-modal.tsx | 4 +- .../integration/github/repo-details.tsx | 4 +- .../components/integration/github/root.tsx | 8 +- .../web/core/components/integration/guide.tsx | 6 +- .../integration/jira/import-users.tsx | 2 +- .../integration/single-integration-card.tsx | 9 +- .../integration/slack/select-channel.tsx | 12 +- .../relations/content.tsx | 4 +- .../relations/quick-action-button.tsx | 2 +- .../issues/issue-detail/label/root.tsx | 1 - .../issue-layouts/calendar/calendar.tsx | 7 +- .../issue-layouts/calendar/day-tile.tsx | 7 +- .../calendar/dropdowns/months-dropdown.tsx | 7 +- .../calendar/dropdowns/options-dropdown.tsx | 7 +- .../issues/issue-layouts/calendar/header.tsx | 7 +- .../issue-layouts/calendar/issue-block.tsx | 1 - .../issue-layouts/calendar/week-days.tsx | 7 +- .../empty-states/project-epic.tsx | 2 +- .../display-filters/display-properties.tsx | 2 +- .../issues/issue-layouts/kanban/default.tsx | 2 +- .../issue-layouts/kanban/kanban-group.tsx | 2 +- .../components/issues/issue-layouts/utils.tsx | 9 +- .../components/description-editor.tsx | 2 +- .../issues/layout-quick-actions.tsx | 4 +- .../issues/parent-issues-list-item.tsx | 4 +- .../issues/parent-issues-list-modal.tsx | 2 +- .../issues/relations/issue-list-item.tsx | 2 +- .../labels/label-drag-n-drop-HOC.tsx | 2 +- .../license/modal/card/talk-to-sales.tsx | 1 + apps/web/core/components/modules/form.tsx | 4 +- .../components/navigation/app-rail-root.tsx | 3 +- .../customize-navigation-dialog.tsx | 4 +- .../core/components/navigation/items-root.tsx | 21 +- .../navigation/project-actions-menu.tsx | 8 +- .../components/navigation/project-header.tsx | 2 +- .../tab-navigation-overflow-menu.tsx | 10 +- .../navigation/tab-navigation-root.tsx | 4 +- .../tab-navigation-visible-item.tsx | 6 +- .../components/navigation/top-nav-power-k.tsx | 2 +- .../components/pages/dropdowns/actions.tsx | 2 +- .../pages/editor/breadcrumb-page-item.tsx | 133 +- .../pages/editor/content-limit-banner.tsx | 54 +- .../components/pages/editor/header/root.tsx | 2 +- .../components/pages/editor/page-root.tsx | 2 +- .../pages/editor/toolbar/options-dropdown.tsx | 128 +- .../web/core/components/pages/header/base.tsx | 2 +- .../pages/header/copy-link-control.tsx | 2 +- .../web/core/components/pages/header/root.tsx | 2 +- .../components/pages/header/syncing-badge.tsx | 4 +- .../core/components/pages/list/block-root.tsx | 4 +- apps/web/core/components/pages/list/root.tsx | 2 +- .../pages/modals/delete-page-modal.tsx | 2 +- .../core/components/pages/pages-list-view.tsx | 2 +- .../core/components/pages/version/editor.tsx | 2 +- .../components/profile/profile-issues.tsx | 5 +- .../project-states/create-update/create.tsx | 2 +- .../project-states/create-update/update.tsx | 2 +- .../project-states/options/delete.tsx | 2 +- .../components/project-states/state-item.tsx | 4 +- .../components/project/integration-card.tsx | 14 +- .../components/project/settings/helper.tsx | 4 +- apps/web/core/components/properties/dates.tsx | 6 +- .../web/core/components/properties/labels.tsx | 6 +- .../core/components/properties/priority.tsx | 6 +- .../core/components/properties/project.tsx | 45 +- apps/web/core/components/properties/state.tsx | 6 +- .../ui/loader/workspace-active-cycle.tsx | 62 +- .../form/individual-event-options.tsx | 44 +- .../components/web-hooks/form/secret-key.tsx | 4 +- .../options/snooze/modal.tsx | 2 +- .../favorite-items/common/helper.tsx | 2 +- .../core/hooks/use-intersection-observer.ts | 1 - .../core/hooks/use-realtime-page-events.tsx | 2 +- .../core/layouts/access/workspace-wrapper.tsx | 4 +- apps/web/core/lib/app-rail/context.tsx | 2 - apps/web/core/lib/app-rail/provider.tsx | 7 +- apps/web/core/store/global-view.store.ts | 2 +- .../core/store/inbox/project-inbox.store.ts | 2 +- .../core/store/issue/cycle/filter.store.ts | 2 +- .../web/core/store/issue/cycle/issue.store.ts | 11 +- .../store/issue/helpers/base-issues-utils.ts | 6 +- .../store/issue/helpers/base-issues.store.ts | 10 +- .../store/issue/issue-details/root.store.ts | 2 +- .../core/store/issue/module/filter.store.ts | 2 +- .../core/store/issue/module/issue.store.ts | 4 +- .../core/store/issue/profile/filter.store.ts | 2 +- .../store/issue/project-views/filter.store.ts | 2 +- .../core/store/issue/project/filter.store.ts | 2 +- .../issue/workspace-draft/filter.store.ts | 2 +- .../store/issue/workspace/filter.store.ts | 6 +- .../workspace-notifications.store.ts | 2 +- .../core/store/pages/project-page.store.ts | 2 +- .../ee/components/active-cycles/card-v1.tsx | 4 +- .../ee/components/active-cycles/card-v2.tsx | 2 +- .../components/active-cycles/cycle-stats.tsx | 2 +- .../ee/components/active-cycles/header.tsx | 4 +- .../active-cycles/priority-issues.tsx | 4 +- .../components/active-cycles/productivity.tsx | 2 +- .../ee/components/active-cycles/progress.tsx | 4 +- .../active-cycles/project-title.tsx | 4 +- apps/web/ee/components/active-cycles/root.tsx | 4 +- .../workspace-active-cycle-root.tsx | 11 +- .../workspace-active-cycles-list.tsx | 6 +- .../workspace-active-cycles-upgrade.tsx | 4 +- .../analytics/cycles/cycle-progress.tsx | 2 +- .../analytics/cycles/cycles-insight-table.tsx | 4 +- .../ee/components/analytics/cycles/root.tsx | 20 +- .../analytics/intake/intake-insight-table.tsx | 4 +- .../analytics/intake/intake-trends.tsx | 2 +- .../ee/components/analytics/intake/root.tsx | 20 +- .../components/analytics/locked-tab-label.tsx | 50 +- .../analytics/modules-cycles-tooltip.tsx | 6 +- .../modules/module-insight-table.tsx | 4 +- .../analytics/modules/modules-progress.tsx | 2 +- .../ee/components/analytics/modules/root.tsx | 20 +- .../analytics/projects/projects-by-status.tsx | 2 +- .../projects/projects-insight-table.tsx | 2 +- .../ee/components/analytics/projects/root.tsx | 20 +- .../components/analytics/user-avatar-name.tsx | 10 +- .../ee/components/analytics/users/root.tsx | 2 +- .../analytics/users/user-insight-table.tsx | 2 +- .../users/wi-resolved-vs-pending/index.tsx | 205 +- .../users/wi-resolved-vs-pending/tooltip.tsx | 2 +- .../ee/components/app-rail/app-rail-hoc.tsx | 4 +- .../components/automations/create-button.tsx | 4 +- .../main-content/actions/change-property.tsx | 4 +- .../main-content/actions/comment-block.tsx | 58 +- .../details/main-content/actions/root.tsx | 4 +- .../main-content/common/add-node-button.tsx | 4 +- .../main-content/common/block-wrapper.tsx | 4 +- .../main-content/common/conjunction-label.tsx | 4 +- .../main-content/common/section-wrapper.tsx | 4 +- .../details/main-content/header/root.tsx | 2 +- .../details/main-content/loader.tsx | 143 +- .../automations/details/main-content/root.tsx | 2 +- .../details/main-content/scope/root.tsx | 4 +- .../trigger/condition/condition-item.tsx | 67 +- .../main-content/trigger/condition/root.tsx | 98 +- .../details/main-content/trigger/root.tsx | 4 +- .../automations/details/quick-actions.tsx | 4 +- .../details/sidebar/action-buttons.tsx | 4 +- .../form/configuration/add_comment/root.tsx | 4 +- .../change-property/change-type-select.tsx | 2 +- .../change-property/property-name-select.tsx | 2 +- .../change-property/property-value-select.tsx | 2 +- .../configuration/change-property/root.tsx | 116 +- .../actions/form/configuration/root.tsx | 4 +- .../sidebar/actions/form/handler/icon.tsx | 4 +- .../sidebar/actions/form/handler/root.tsx | 4 +- .../sidebar/actions/form/header-button.tsx | 4 +- .../details/sidebar/actions/form/root.tsx | 268 +-- .../details/sidebar/actions/root.tsx | 2 +- .../sidebar/activity/activity-log-item.tsx | 4 +- .../sidebar/activity/header-filters.tsx | 104 +- .../details/sidebar/activity/list-item.tsx | 4 +- .../details/sidebar/activity/list.tsx | 4 +- .../details/sidebar/activity/loader.tsx | 52 +- .../details/sidebar/activity/root.tsx | 4 +- .../sidebar/activity/run-history-item.tsx | 194 +- .../automations/details/sidebar/content.tsx | 2 +- .../sidebar/delete-confirmation-modal.tsx | 6 +- .../automations/details/sidebar/footer.tsx | 2 +- .../automations/details/sidebar/header.tsx | 2 +- .../automations/details/sidebar/root.tsx | 2 +- .../details/sidebar/section-wrapper.tsx | 4 +- .../trigger/condition/filter-provider.tsx | 4 +- .../sidebar/trigger/condition/root.tsx | 118 +- .../details/sidebar/trigger/icon.tsx | 4 +- .../details/sidebar/trigger/root.tsx | 2 +- .../automations/details/wrapper.tsx | 4 +- .../ee/components/automations/list/root.tsx | 2 +- .../automations/list/table/empty-state.tsx | 30 +- .../automations/list/table/indicator.tsx | 2 +- .../automations/list/table/loader.tsx | 150 +- .../automations/list/table/root.tsx | 4 +- .../automations/list/table/status-badge.tsx | 4 +- .../components/automations/list/wrapper.tsx | 4 +- .../modals/create-update-modal.tsx | 2 +- .../automations/modals/delete-modal.tsx | 4 +- .../components/automations/no-automations.tsx | 2 +- apps/web/ee/components/automations/root.tsx | 4 +- .../web/ee/components/automations/upgrade.tsx | 4 +- .../breadcrumbs/project-feature.tsx | 6 +- .../web/ee/components/breadcrumbs/project.tsx | 4 +- .../ee/components/breadcrumbs/teamspace.tsx | 4 +- .../work-item-actions/change-state-list.tsx | 2 +- .../command-palette/modals/project-level.tsx | 2 +- .../modals/work-item-level.tsx | 12 +- .../modals/workspace-level.tsx | 2 +- .../plane-ai/commands-list.tsx | 4 +- .../command-palette/plane-ai/pages/root.tsx | 4 +- .../command-palette/plane-ai/provider.tsx | 4 +- .../power-k/menus/customers.tsx | 28 +- .../power-k/menus/initiatives.tsx | 44 +- .../power-k/menus/teamspaces.tsx | 28 +- .../pages/context-based/initiative/root.tsx | 4 +- .../context-based/initiative/states-menu.tsx | 4 +- .../power-k/pages/context-based/root.tsx | 4 +- .../work-item/state-menu-item.tsx | 6 +- .../open-entity-actions/customers-menu.tsx | 4 +- .../open-entity-actions/initiatives-menu.tsx | 4 +- .../pages/open-entity-actions/root.tsx | 4 +- .../open-entity-actions/teamspaces-menu.tsx | 4 +- .../power-k/search/no-results-command.tsx | 66 +- .../shortcuts-modal/commands-list.tsx | 4 +- .../command-palette/shortcuts-modal/modal.tsx | 4 +- .../command-palette/wiki/commands-list.tsx | 4 +- .../wiki/pages/context-based/root.tsx | 4 +- .../command-palette/wiki/pages/root.tsx | 4 +- .../command-palette/wiki/provider.tsx | 4 +- .../command-palette/wiki/search-menu.tsx | 6 +- .../wiki/search-results-map.tsx | 2 - .../command-palette/wiki/search-results.tsx | 4 +- .../ee/components/comments/comment-block.tsx | 2 +- .../comments/replies/replies-list.tsx | 2 +- .../comments/replies/reply-quick-actions.tsx | 2 +- apps/web/ee/components/common/beta.tsx | 4 +- .../components/common/extended-app-header.tsx | 2 +- .../common/image-toolbar/download.tsx | 4 +- .../image-toolbar/full-screen/modal.tsx | 8 +- .../common/image-toolbar/full-screen/root.tsx | 4 +- .../components/common/image-toolbar/root.tsx | 4 +- .../components/common/input/title-input.tsx | 4 +- .../common/layout/main/common/empty-state.tsx | 6 +- .../layout/main/common/section-wrapper.tsx | 6 +- .../common/layout/main/main-wrapper.tsx | 6 +- .../layout/main/sections/collapsible-root.tsx | 6 +- .../common/layout/main/sections/info-root.tsx | 6 +- .../layout/main/sections/overview-root.tsx | 6 +- .../layout/main/sections/progress-root.tsx | 6 +- apps/web/ee/components/common/layout/root.tsx | 6 +- .../common/layout/sidebar/content-wrapper.tsx | 6 +- .../components/common/layout/sidebar/root.tsx | 6 +- .../common/layout/sidebar/sidebar-wrapper.tsx | 6 +- .../common/modal/upload-app-image.tsx | 4 +- .../ee/components/common/pagination-bar.tsx | 6 +- .../common/quick-actions-factory.tsx | 2 +- .../subscription/subscription-button.tsx | 4 +- .../common/subscription/subscription-pill.tsx | 2 +- .../customers/actions/delete-modal.tsx | 4 +- .../customers/actions/quick-actions.tsx | 4 +- .../actions/request-delete-modal.tsx | 4 +- .../actions/requests-quick-actions.tsx | 4 +- .../customers/additiona-properties/create.tsx | 96 +- .../property-value-select.tsx | 40 +- .../customers/additiona-properties/root.tsx | 4 +- .../customers/additiona-properties/update.tsx | 128 +- .../customer-modal/additional-properties.tsx | 6 +- .../customer-create-toast-actions.tsx | 5 +- .../customer-modal/default-properties.tsx | 4 +- .../customers/customer-modal/form.tsx | 4 +- .../customers/customer-modal/modal.tsx | 2 +- .../customers/customer-modal/provider.tsx | 2 +- .../customers/detail/default-properties.tsx | 9 +- .../customers/detail/empty-state.tsx | 5 +- .../ee/components/customers/detail/header.tsx | 3 +- .../customers/detail/logo-input.tsx | 2 +- .../ee/components/customers/detail/main.tsx | 2 +- .../ee/components/customers/detail/root.tsx | 2 +- .../components/customers/detail/sidebar.tsx | 2 +- .../customers/dropdowns/contract-status.tsx | 4 +- .../components/customers/dropdowns/stage.tsx | 4 +- .../ee/components/customers/list/header.tsx | 3 +- .../components/customers/list/list-item.tsx | 2 +- .../ee/components/customers/list/loader.tsx | 54 +- .../web/ee/components/customers/list/root.tsx | 2 +- .../ee/components/customers/list/search.tsx | 4 +- .../attachments/add-attachment-btn.tsx | 4 +- .../attachments/attachment-collapsible.tsx | 2 +- .../requests/attachments/attachment-item.tsx | 6 +- .../requests/attachments/attachment-list.tsx | 2 +- .../attachments/collapsible-title.tsx | 4 +- .../requests/attachments/content.tsx | 5 +- .../requests/attachments/delete-modal.tsx | 2 +- .../customers/requests/attachments/helper.tsx | 1 - .../requests/attachments/upload-item.tsx | 4 +- .../requests/create-update-source-modal.tsx | 2 +- .../customers/requests/customer-dropdown.tsx | 2 +- .../customers/requests/empty-state-search.tsx | 2 +- .../customers/requests/empty-state.tsx | 4 +- .../ee/components/customers/requests/form.tsx | 2 +- .../customers/requests/request-list-item.tsx | 2 +- .../ee/components/customers/requests/root.tsx | 2 +- .../components/customers/requests/search.tsx | 4 +- .../customers/requests/source-item.tsx | 4 +- .../customers/settings/disabled.tsx | 4 +- .../components/customers/settings/loader.tsx | 14 +- .../settings/properties/custom-properties.tsx | 2 +- .../properties/default-properties.tsx | 4 +- .../settings/properties/empty-state.tsx | 4 +- .../customers/settings/properties/root.tsx | 14 +- .../ee/components/customers/settings/root.tsx | 2 +- apps/web/ee/components/customers/upgrade.tsx | 4 +- .../work-items/customer-work-item.tsx | 6 +- .../customers/work-items/helper.tsx | 1 - .../work-items/work-item-collapsible.tsx | 2 +- .../work-items/work-item-empty-state.tsx | 4 +- .../customers/work-items/work-items-list.tsx | 2 +- .../components/cycles/active-cycle/base.tsx | 4 +- .../cycles/active-cycle/cycle-chart/chart.tsx | 10 +- .../active-cycle/cycle-chart/labels.tsx | 2 +- .../cycle-chart/sidebar-chart.tsx | 2 +- .../cycles/active-cycle/cycle-chart/ticks.tsx | 18 +- .../active-cycle/cycle-chart/tooltip.tsx | 8 +- .../cycles/active-cycle/details.tsx | 2 +- .../cycles/active-cycle/formatter.ts | 8 +- .../cycles/active-cycle/progress-donut.tsx | 5 +- .../cycles/active-cycle/progress-header.tsx | 6 +- .../components/cycles/active-cycle/root.tsx | 11 +- .../cycles/active-cycle/scope-delta.tsx | 11 +- .../cycles/active-cycle/selection.tsx | 40 +- .../cycles/active-cycle/summary.tsx | 2 +- .../cycles/active-cycles/header.tsx | 4 +- .../components/cycles/additional-actions.tsx | 2 +- .../cycles/analytics-sidebar/base.tsx | 4 +- .../cycles/analytics-sidebar/root.tsx | 10 +- .../ee/components/cycles/end-cycle/modal.tsx | 5 +- .../cycles/settings/auto-schedule-cycles.tsx | 4 +- .../components/cycles/start-cycle/modal.tsx | 4 +- .../dashboards/details/empty-state.tsx | 2 +- .../ee/components/dashboards/details/root.tsx | 2 +- .../dashboards/details/widgets-grid-root.tsx | 2 +- .../dashboards/feature-flag-fallback.tsx | 5 +- .../dashboards/list/list-item-actions.tsx | 2 +- .../components/dashboards/list/list-item.tsx | 2 +- .../ee/components/dashboards/list/loader.tsx | 34 +- .../ee/components/dashboards/list/root.tsx | 2 +- .../ee/components/dashboards/list/search.tsx | 4 +- .../dashboards/modals/create-update-modal.tsx | 2 +- .../dashboards/modals/delete-modal.tsx | 4 +- .../components/dashboards/quick-actions.tsx | 2 +- .../axis-config/circular-chart-config.tsx | 4 +- .../sidebar/axis-config/date-group-select.tsx | 4 +- .../sidebar/axis-config/grouping-config.tsx | 4 +- .../sidebar/axis-config/metric-select.tsx | 4 +- .../sidebar/axis-config/property-select.tsx | 4 +- .../dashboards/sidebar/axis-config/root.tsx | 4 +- .../sidebar/axis-config/x-axis-config.tsx | 4 +- .../sidebar/axis-config/y-axis-config.tsx | 4 +- .../dashboards/sidebar/basic-config/root.tsx | 4 +- .../dashboards/sidebar/basic-config/title.tsx | 4 +- .../sidebar/filters/filter-conditions.tsx | 38 +- .../dashboards/sidebar/filters/root.tsx | 18 +- .../components/dashboards/sidebar/header.tsx | 4 +- .../dashboards/sidebar/property-wrapper.tsx | 4 +- .../ee/components/dashboards/sidebar/root.tsx | 4 +- .../dashboards/sidebar/select-button.tsx | 4 +- .../area-chart-comparison-line.tsx | 4 +- .../appearance-config/area-chart.tsx | 4 +- .../appearance-config/bar-chart.tsx | 4 +- .../appearance-config/color-picker.tsx | 4 +- .../appearance-config/color-scheme-select.tsx | 4 +- .../appearance-config/donut-chart.tsx | 4 +- .../appearance-config/line-chart.tsx | 4 +- .../appearance-config/line-type-select.tsx | 4 +- .../style-config/appearance-config/number.tsx | 4 +- .../appearance-config/pie-chart-grouping.tsx | 4 +- .../appearance-config/pie-chart.tsx | 4 +- .../style-config/appearance-config/root.tsx | 4 +- .../sidebar/style-config/guides-config.tsx | 4 +- .../dashboards/sidebar/style-config/root.tsx | 2 +- .../widgets/chart-types/area-chart.tsx | 10 +- .../widgets/chart-types/bar-chart.tsx | 10 +- .../widgets/chart-types/content.tsx | 4 +- .../widgets/chart-types/donut-chart.tsx | 10 +- .../dashboards/widgets/chart-types/header.tsx | 2 +- .../widgets/chart-types/line-chart.tsx | 10 +- .../dashboards/widgets/chart-types/number.tsx | 2 +- .../widgets/chart-types/pie-chart.tsx | 10 +- .../dashboards/widgets/chart-types/root.tsx | 2 +- .../dashboards/widgets/delete-modal.tsx | 4 +- .../dashboards/widgets/dropdown/option.tsx | 4 +- .../dashboards/widgets/dropdown/root.tsx | 2 +- .../widgets/empty-states/empty-state.tsx | 2 +- .../empty-states/not-configured-state.tsx | 2 +- .../empty-states/upgrade-required-state.tsx | 2 +- .../ee/components/dashboards/widgets/icon.tsx | 4 +- .../components/dashboards/widgets/loader.tsx | 2 +- .../workspace-dashboard-details-root.tsx | 2 +- .../ee/components/de-dupe/de-dupe-button.tsx | 3 +- .../de-dupe/duplicate-modal/block-header.tsx | 5 +- .../de-dupe/duplicate-modal/block-root.tsx | 5 +- .../de-dupe/duplicate-modal/root.tsx | 6 +- .../duplicate-popover/block-header.tsx | 3 +- .../de-dupe/duplicate-popover/block-root.tsx | 6 +- .../de-dupe/duplicate-popover/root.tsx | 4 +- .../de-dupe/issue-block/block-content.tsx | 4 +- .../de-dupe/issue-block/block-wrapper.tsx | 4 +- .../de-dupe/issue-block/button-label.tsx | 6 +- .../ee/components/desktop/context/index.tsx | 4 +- apps/web/ee/components/desktop/navigation.tsx | 4 +- apps/web/ee/components/desktop/root.tsx | 2 - .../ee/components/desktop/sidebar-toggle.tsx | 2 - apps/web/ee/components/dropdowns/epics.tsx | 2 +- .../editor/embeds/mentions/root.tsx | 4 +- .../embeds/mentions/work-item/content.tsx | 2 +- .../editor/embeds/mentions/work-item/logo.tsx | 2 +- .../embeds/mentions/work-item/preview.tsx | 2 +- .../editor/embeds/mentions/work-item/root.tsx | 8 +- .../ee/components/epics/conversions/icon.tsx | 5 +- .../ee/components/epics/conversions/root.tsx | 4 +- .../components/epics/details/empty-state.tsx | 6 +- .../ee/components/epics/details/helper.tsx | 2 - .../epics/details/main/info-section-root.tsx | 4 +- .../main/info-section/action-items.tsx | 4 +- .../main/info-section/indicator-item.tsx | 4 +- .../details/main/overview-section-root.tsx | 4 +- .../main/overview-section/customers-root.tsx | 2 +- .../main/overview-section/issues-root.tsx | 3 +- .../main/overview-section/modals-root.tsx | 2 +- .../main/overview-section/relation-root.tsx | 3 +- .../overview-section/work-items-actions.tsx | 2 +- .../details/main/progress-section-root.tsx | 4 +- .../ee/components/epics/details/main/root.tsx | 4 +- apps/web/ee/components/epics/details/root.tsx | 4 +- .../details/sidebar/activity-tab-root.tsx | 6 +- .../sidebar/activity/activity-block.tsx | 4 +- .../details/sidebar/comment-tab-root.tsx | 4 +- .../details/sidebar/properties-tab-root.tsx | 3 +- .../components/epics/details/sidebar/root.tsx | 4 +- .../ee/components/epics/epic-modal/base.tsx | 4 +- .../components/default-properties.tsx | 4 +- .../ee/components/epics/epic-modal/form.tsx | 4 +- .../ee/components/epics/epic-modal/modal.tsx | 9 +- .../components/epics/epic-modal/provider.tsx | 2 +- .../components/epics/peek-overview/error.tsx | 6 +- .../components/epics/peek-overview/header.tsx | 4 +- .../components/epics/peek-overview/loader.tsx | 6 +- .../components/epics/peek-overview/root.tsx | 4 +- .../components/epics/peek-overview/view.tsx | 2 +- .../epics/quick-actions/epic-quick-action.tsx | 4 +- .../quick-actions/layout-quick-actions.tsx | 4 +- .../components/epics/settings/empty-state.tsx | 11 +- .../epics/settings/epics-properties.tsx | 4 +- .../web/ee/components/epics/settings/root.tsx | 6 +- apps/web/ee/components/epics/upgrade.tsx | 11 +- .../estimates/estimate-list-item-buttons.tsx | 2 +- .../estimates/inputs/time-input.tsx | 4 +- .../ee/components/estimates/points/delete.tsx | 4 +- .../components/estimates/points/edit-root.tsx | 2 +- .../estimates/points/select-dropdown.tsx | 6 +- .../points/switch/estimate-dropdown.tsx | 4 +- .../estimates/points/switch/preview.tsx | 4 +- .../estimates/points/switch/root.tsx | 2 +- .../ee/components/estimates/update/modal.tsx | 2 +- .../components/estimates/update/stage-one.tsx | 6 +- .../feature-flags/with-feature-flag-hoc.tsx | 2 +- .../gantt-chart/blocks/block-row-list.tsx | 2 +- .../gantt-chart/blocks/blocks-list.tsx | 2 +- .../blockDraggables/left-draggable.tsx | 2 +- .../blockDraggables/right-draggable.tsx | 4 +- .../dependency/dependency-line-svg.tsx | 28 +- .../dependency/dependency-modal.tsx | 4 +- .../dependency/dependency-path-item.tsx | 8 +- .../dependency/dependency-paths.tsx | 2 +- .../dependency/draggable-dependency-path.tsx | 4 +- .../global/product-updates/header.tsx | 2 +- .../ee/components/global/version-number.tsx | 4 +- apps/web/ee/components/home/header.tsx | 2 +- .../web/ee/components/home/peek-overviews.tsx | 2 - apps/web/ee/components/iframe/silo-iframe.tsx | 6 +- .../importers/asana/authentication/o-auth.tsx | 4 +- .../authentication/personal-access-token.tsx | 4 +- .../importers/asana/authentication/root.tsx | 4 +- .../importers/asana/dashboard/root.tsx | 4 +- .../asana/steps/configure-asana/root.tsx | 4 +- .../steps/configure-asana/select-project.tsx | 8 +- .../configure-asana/select-workspace.tsx | 6 +- .../steps/map-priority/priority-selection.tsx | 4 +- .../asana/steps/map-priority/root.tsx | 8 +- .../map-priority/select-priority-field.tsx | 6 +- .../importers/asana/steps/map-states/root.tsx | 10 +- .../steps/map-states/state-selection.tsx | 6 +- .../components/importers/asana/steps/root.tsx | 4 +- .../asana/steps/select-plane-project/root.tsx | 4 +- .../importers/asana/steps/summary/root.tsx | 6 +- .../authentication/personal-access-token.tsx | 4 +- .../importers/clickup/authentication/root.tsx | 4 +- .../importers/clickup/dashboard/root.tsx | 4 +- .../clickup/steps/configure-clickup/root.tsx | 4 +- .../steps/configure-clickup/select-folder.tsx | 17 +- .../steps/configure-clickup/select-space.tsx | 8 +- .../steps/configure-clickup/select-team.tsx | 8 +- .../skip-additional-data.tsx | 6 +- .../steps/map-priority/priority-selection.tsx | 4 +- .../clickup/steps/map-priority/root.tsx | 8 +- .../clickup/steps/map-states/root.tsx | 10 +- .../steps/map-states/state-selection.tsx | 4 +- .../importers/clickup/steps/root.tsx | 4 +- .../steps/select-plane-project/root.tsx | 4 +- .../importers/clickup/steps/summary/root.tsx | 4 +- .../common/dashboard/base-dashboard.tsx | 4 +- .../common/dashboard/empty-state.tsx | 6 +- .../common/dashboard/icon-field-render.tsx | 6 +- .../common/dashboard/loader/header.tsx | 18 +- .../common/dashboard/loader/root.tsx | 14 +- .../common/dashboard/loader/table.tsx | 38 +- .../common/dashboard/modals/cancel-modal.tsx | 6 +- .../common/dashboard/modals/rerun-modal.tsx | 6 +- .../importers/common/dashboard/status.tsx | 4 +- .../importers/flatfile/dashboard/root.tsx | 4 +- .../steps/configure-flatfile/provider.tsx | 8 +- .../steps/configure-flatfile/root.tsx | 4 +- .../importers/flatfile/steps/root.tsx | 2 +- .../steps/select-plane-project/root.tsx | 8 +- apps/web/ee/components/importers/header.tsx | 5 +- .../authentication/personal-access-token.tsx | 4 +- .../jira-server/authentication/root.tsx | 4 +- .../importers/jira-server/dashboard/root.tsx | 4 +- .../jira-server/steps/configure-jira/root.tsx | 4 +- .../steps/configure-jira/select-project.tsx | 8 +- .../steps/configure-jira/select-resource.tsx | 8 +- .../steps/map-priority/priority-selection.tsx | 4 +- .../jira-server/steps/map-priority/root.tsx | 8 +- .../jira-server/steps/map-states/root.tsx | 10 +- .../steps/map-states/state-selection.tsx | 4 +- .../importers/jira-server/steps/root.tsx | 4 +- .../steps/select-plane-project/root.tsx | 4 +- .../jira-server/steps/summary/root.tsx | 6 +- .../importers/jira/authentication/o-auth.tsx | 4 +- .../authentication/personal-access-token.tsx | 4 +- .../importers/jira/authentication/root.tsx | 4 +- .../importers/jira/dashboard/root.tsx | 4 +- .../jira/steps/configure-jira/root.tsx | 4 +- .../steps/configure-jira/select-project.tsx | 8 +- .../steps/configure-jira/select-resource.tsx | 8 +- .../steps/import-users-from-jira/root.tsx | 5 +- .../import-users-from-jira/upload-csv.tsx | 6 +- .../steps/map-priority/priority-selection.tsx | 4 +- .../jira/steps/map-priority/root.tsx | 8 +- .../importers/jira/steps/map-states/root.tsx | 10 +- .../jira/steps/map-states/state-selection.tsx | 4 +- .../components/importers/jira/steps/root.tsx | 4 +- .../jira/steps/select-plane-project/root.tsx | 4 +- .../importers/jira/steps/summary/root.tsx | 6 +- .../linear/authentication/o-auth.tsx | 4 +- .../authentication/personal-access-token.tsx | 4 +- .../importers/linear/authentication/root.tsx | 4 +- .../importers/linear/dashboard/root.tsx | 4 +- .../linear/steps/configure-linear/root.tsx | 4 +- .../steps/configure-linear/select-team.tsx | 8 +- .../linear/steps/map-states/root.tsx | 10 +- .../steps/map-states/state-selection.tsx | 4 +- .../importers/linear/steps/root.tsx | 4 +- .../steps/select-plane-project/root.tsx | 4 +- .../importers/linear/steps/summary/root.tsx | 4 +- .../web/ee/components/importers/list-item.tsx | 4 +- apps/web/ee/components/importers/list.tsx | 2 +- .../importers/ui/add-seats-alert-banner.tsx | 4 +- .../importers/ui/auth-form-input.tsx | 6 +- .../ee/components/importers/ui/dropdown.tsx | 6 +- .../components/importers/ui/error-banner.tsx | 2 - .../importers/ui/skip-user-import-toggle.tsx | 6 +- .../ee/components/importers/ui/stepper.tsx | 10 +- apps/web/ee/components/importers/ui/table.tsx | 4 +- .../importers/zip-importer/dashboard/root.tsx | 8 +- .../importers/zip-importer/steps/root.tsx | 3 +- .../steps/select-destination/root.tsx | 2 +- .../zip-importer/steps/upload-zip/root.tsx | 2 +- .../initiatives/common/add-scope-button.tsx | 2 +- .../initiatives/common/multi-select-modal.tsx | 2 +- .../initiatives/common/update-status.tsx | 4 +- .../create-update-initiatives-modal.tsx | 2 +- .../initiatives/components/form.tsx | 4 +- .../initiatives/components/group-header.tsx | 2 +- .../components/initiative-block.tsx | 2 +- .../initiative-date-range-dropdown.tsx | 6 +- .../components/initiative-delete-modal.tsx | 4 +- .../components/initiative-gantt-block.tsx | 6 +- .../components/initiative-kanban-card.tsx | 2 +- .../components/initiative-layout-loader.tsx | 6 +- .../initiatives-block-properties.tsx | 3 +- .../components/initiatives-group.tsx | 2 +- .../components/initiatives-root.tsx | 2 +- .../create-update-initiative-label-inline.tsx | 2 - .../labels/delete-initiative-label-modal.tsx | 4 +- .../labels/initiative-label-block.tsx | 6 +- .../initiative-label-drag-n-drop-HOC.tsx | 8 +- .../labels/initiative-label-dropdown.tsx | 33 +- .../labels/initiative-label-item.tsx | 2 +- .../labels/initiative-label-list.tsx | 4 +- .../labels/initiative-label-name.tsx | 4 +- .../initiative-label-property-dropdown.tsx | 6 +- .../labels/initiative-label-property.tsx | 112 +- .../components/labels/initiative-labels.tsx | 154 +- .../initiatives/components/layouts/gantt.tsx | 4 +- .../initiatives/components/layouts/kanban.tsx | 4 +- .../initiatives/components/layouts/list.tsx | 4 +- .../components/property-block-wrapper.tsx | 6 +- .../initiatives/components/quick-actions.tsx | 4 +- .../components/rich-filters/context.tsx | 112 +- .../components/rich-filters/row.tsx | 2 +- .../components/rich-filters/toggle.tsx | 2 +- .../states/initiative-state-dropdown.tsx | 4 +- .../initiatives/details/empty-state.tsx | 6 +- .../details/main/collapsible-section-root.tsx | 4 +- .../attachment/attachment-list-item.tsx | 4 +- .../attachment-list-upload-item.tsx | 4 +- .../attachment/attachments-section.tsx | 3 +- .../attachment/delete-attachment-modal.tsx | 2 +- .../collapsible-section/attachment/root.tsx | 3 +- .../attachment/use-attachments.tsx | 1 - .../collapsible-section/epics/content.tsx | 4 +- .../epics/epic-list-item/epics-list-group.tsx | 2 +- .../epics/epic-list-item/properties.tsx | 4 +- .../epics/epic-list-item/quick-action.tsx | 4 +- .../epics/epic-list-item/root.tsx | 4 +- .../epics/epics-section.tsx | 3 +- .../epics/issue-search-modal-empty-state.tsx | 12 +- .../epics/title-actions.tsx | 2 +- .../epics/workspace-epic-modal.tsx | 3 +- .../links/link-components/content.tsx | 5 +- .../link-items/create-update-link-modal.tsx | 6 +- .../links/link-items/link-item.tsx | 4 +- .../links/link-items/link-list.tsx | 2 +- .../links/links-section.tsx | 3 +- .../collapsible-section/projects/content.tsx | 6 +- .../projects/project-list-item/index.tsx | 2 +- .../project-list-item/quick-actions.tsx | 2 +- .../projects/project-list.tsx | 2 +- .../projects/projects-section.tsx | 3 +- .../details/main/info-section-root.tsx | 4 +- .../main/info-section/action-button.tsx | 3 +- .../main/info-section/action-items.tsx | 4 +- .../main/info-section/attachment-button.tsx | 4 +- .../main/info-section/indicator-item.tsx | 4 +- .../details/main/info-section/link-button.tsx | 3 +- .../details/main/info-section/reactions.tsx | 4 +- .../initiatives/details/main/modals.tsx | 4 +- .../details/main/progress-section-root.tsx | 4 +- .../initiatives/details/main/root.tsx | 4 +- .../details/main/scope-breakdown.tsx | 6 +- .../components/initiatives/details/root.tsx | 2 +- .../details/sidebar/activity-tab-root.tsx | 5 +- .../sidebar/activity/activity-block.tsx | 4 +- .../details/sidebar/comment-tab-root.tsx | 4 +- .../initiatives/details/sidebar/helper.tsx | 2 - .../details/sidebar/properties-tab-root.tsx | 4 +- .../initiatives/details/sidebar/root.tsx | 4 +- .../actions/overview-header-actions.tsx | 2 +- .../header/actions/scope-header-actions.tsx | 5 +- .../display-filters-selection.tsx | 2 +- .../header/display-filters/group-by.tsx | 2 +- .../header/display-filters/order-by.tsx | 2 +- .../header/filters/header/filters/lead.tsx | 4 +- .../filters/header/filters/start-date.tsx | 2 +- .../filters/header/filters/target-date.tsx | 2 +- .../header/filters/header/header.tsx | 3 +- .../filters/header/helpers/dropdown.tsx | 6 +- .../filters/header/helpers/filter-header.tsx | 26 +- .../filters/header/helpers/filter-option.tsx | 4 +- .../initiatives/header/filters/index.tsx | 4 +- .../ee/components/initiatives/header/root.tsx | 5 +- .../ee/components/initiatives/layout/page.tsx | 18 +- .../initiatives/peek-overview/error.tsx | 6 +- .../initiatives/peek-overview/header.tsx | 6 +- .../initiatives/peek-overview/loader.tsx | 6 +- .../initiatives/peek-overview/root.tsx | 4 +- .../initiatives/peek-overview/view.tsx | 4 +- .../scope/gantt/chart/chart-root.tsx | 2 +- .../scope/gantt/chart/group-chart.tsx | 2 +- .../initiatives/scope/gantt/root.tsx | 4 +- .../scope/gantt/sidebar/epic-block.tsx | 2 +- .../initiatives/scope/gantt/sidebar/root.tsx | 2 +- .../initiatives/scope/list/header.tsx | 4 +- .../initiatives/scope/list/root.tsx | 2 +- .../ee/components/initiatives/scope/root.tsx | 2 +- .../web/ee/components/initiatives/upgrade.tsx | 11 +- .../intake/additional-information.tsx | 6 +- .../ee/components/intake/property-values.tsx | 8 +- apps/web/ee/components/intake/source-pill.tsx | 2 +- .../components/integrations/empty-state.tsx | 2 +- .../authentication/connect-organization.tsx | 4 +- .../connect-personal-account.tsx | 6 +- .../github/authentication/root.tsx | 4 +- .../github/authentication/server-app-form.tsx | 363 ++-- .../common/select-github-repository.tsx | 4 +- .../github/common/select-project-state.tsx | 2 +- .../github/common/select-project.tsx | 4 +- .../integrations/github/sections/header.tsx | 4 +- .../sections/pr-state-mapping/entity-item.tsx | 4 +- .../form/common/map-project-pr-state.tsx | 6 +- .../sections/pr-state-mapping/form/create.tsx | 4 +- .../sections/pr-state-mapping/form/edit.tsx | 4 +- .../github/sections/pr-state-mapping/root.tsx | 6 +- .../project-issue-sync/entity-item.tsx | 6 +- .../form/common/map-project-issue-state.tsx | 6 +- .../common/select-issue-sync-direction.tsx | 6 +- .../project-issue-sync/form/create.tsx | 6 +- .../sections/project-issue-sync/form/edit.tsx | 4 +- .../sections/project-issue-sync/root.tsx | 6 +- .../integrations/github/sections/root.tsx | 16 +- .../github/sections/user-mapping/root.tsx | 10 +- .../authentication/connect-organization.tsx | 4 +- .../gitlab/authentication/root.tsx | 14 +- .../gitlab/authentication/server-app-form.tsx | 263 ++- .../integrations/gitlab/sections/header.tsx | 4 +- .../repository-mapping/entity-item.tsx | 4 +- .../repository-mapping/form/create-entity.tsx | 4 +- .../form/create-project-entity.tsx | 4 +- .../repository-mapping/form/create.tsx | 4 +- .../sections/repository-mapping/form/edit.tsx | 4 +- .../repository-mapping/form/entity-form.tsx | 4 +- .../repository-mapping/form/project-form.tsx | 4 +- .../form/state-form/root.tsx | 6 +- .../form/state-form/selection.tsx | 4 +- .../sections/repository-mapping/root.tsx | 6 +- .../integrations/gitlab/sections/root.tsx | 14 +- .../ee/components/integrations/list-item.tsx | 4 +- apps/web/ee/components/integrations/list.tsx | 2 +- .../sentry/connected-app-card.tsx | 2 +- .../components/integrations/sentry/root.tsx | 2 +- .../sections/state-mapping/form/form.tsx | 7 +- .../state-mapping/form/state-mapping-form.tsx | 6 +- .../sentry/sections/state-mapping/root.tsx | 10 +- .../state-mapping/state-mapping-item.tsx | 4 +- .../integrations/slack/connected-app-card.tsx | 2 +- .../ee/components/integrations/slack/root.tsx | 2 +- .../sections/project-updates/entity-item.tsx | 4 +- .../project-updates/form/channel-map.tsx | 2 +- .../sections/project-updates/form/form.tsx | 6 +- .../slack/sections/project-updates/root.tsx | 4 +- .../integrations/ui/installation-card.tsx | 2 +- .../integrations/ui/integrations-mapping.tsx | 4 +- .../integrations/ui/mapping-loader.tsx | 52 +- .../ui/personal-account-installation-card.tsx | 4 +- .../integrations/ui/project-entity-item.tsx | 4 +- .../issue-types/common/icon-picker.tsx | 2 +- .../issue-types/common/issue-type-logo.tsx | 8 +- .../issue-types/common/lucide-icons-list.tsx | 4 +- .../issue-types/create-update/form.tsx | 4 +- .../issue-types/create-update/modal.tsx | 2 +- .../issue-types/dropdowns/issue-type.tsx | 2 +- .../ee/components/issue-types/empty-state.tsx | 3 +- .../issue-type-delete-confirmation-modal.tsx | 2 +- .../issue-types/issue-type-list-item.tsx | 2 +- .../issue-types/issue-types-list.tsx | 2 +- .../properties/active-checkbox.tsx | 2 +- .../properties/attributes/attribute-pill.tsx | 22 +- .../properties/attributes/boolean.tsx | 2 +- .../common/property-multi-select.tsx | 2 +- .../property-settings-configuration.tsx | 104 +- .../properties/attributes/date-picker.tsx | 2 +- .../properties/attributes/dropdown.tsx | 2 +- .../properties/attributes/member-picker.tsx | 2 +- .../properties/attributes/number.tsx | 2 +- .../options/default-option-select.tsx | 2 +- .../properties/attributes/options/option.tsx | 4 +- .../properties/attributes/options/root.tsx | 2 +- .../properties/attributes/text.tsx | 2 +- .../properties/common/issue-property-logo.tsx | 4 +- .../properties/delete-confirmation-modal.tsx | 2 +- .../dropdowns/property-attributes.tsx | 2 +- .../properties/dropdowns/property-title.tsx | 6 +- .../properties/dropdowns/property-type.tsx | 2 +- .../selected-attribute-properties.tsx | 4 +- .../issue-types/properties/empty-state.tsx | 4 +- .../properties/mandatory-field.tsx | 4 +- .../issue-types/properties/property-icon.tsx | 4 +- .../properties/property-list-item.tsx | 3 +- .../issue-types/properties/property-list.tsx | 2 +- .../issue-types/properties/quick-actions.tsx | 4 +- .../issue-types/properties/root.tsx | 6 +- .../components/issue-types/quick-actions.tsx | 4 +- apps/web/ee/components/issue-types/root.tsx | 3 +- .../addition-properties-update-base.tsx | 145 +- .../values/addition-properties-update.tsx | 160 +- .../values/components/boolean-input.tsx | 2 +- .../values/components/date-select.tsx | 4 +- .../values/components/member-select.tsx | 6 +- .../values/components/number-input.tsx | 2 +- .../values/components/option-select.tsx | 2 +- .../values/components/text-input.tsx | 2 +- .../values/components/truncated-url.tsx | 6 +- .../values/components/url-input.tsx | 2 +- .../components/issue-types/values/create.tsx | 108 +- .../ee/components/issue-types/values/root.tsx | 4 +- .../issue-types/values/value-select.tsx | 48 +- .../ee/components/issues/advanced-header.tsx | 6 +- .../bulk-operations/actions/archive.tsx | 2 +- .../issues/bulk-operations/actions/delete.tsx | 2 +- .../issues/bulk-operations/actions/root.tsx | 2 +- .../bulk-operations/actions/subscribe.tsx | 2 +- .../modals/bulk-archive-modal.tsx | 2 +- .../modals/bulk-delete-modal.tsx | 2 +- .../modals/bulk-subscribe-modal.tsx | 2 +- .../issues/bulk-operations/properties.tsx | 8 +- .../issues/bulk-operations/root.tsx | 2 +- .../issues/conversion-toast-action-items.tsx | 5 +- .../filters/applied-filters/issue-types.tsx | 4 +- .../components/issues/filters/issue-types.tsx | 4 +- .../issues/filters/team-project.tsx | 4 +- apps/web/ee/components/issues/header.tsx | 4 +- .../issue-detail-widgets/action-buttons.tsx | 4 +- .../issue-detail-widgets/collapsibles.tsx | 62 +- .../customer-requests/content.tsx | 2 +- .../customer-requests/form.tsx | 2 +- .../customer-requests/quick-action-button.tsx | 2 +- .../customer-requests/request-list-item.tsx | 2 +- .../customer-requests/root.tsx | 2 +- .../customer-requests/title.tsx | 3 +- .../issues/issue-detail-widgets/modals.tsx | 4 +- .../issue-detail-widgets/pages/block.tsx | 2 +- .../issue-detail-widgets/pages/content.tsx | 2 +- .../pages/multi-select-modal.tsx | 442 ++-- .../pages/quick-action-button.tsx | 3 +- .../issue-detail-widgets/pages/root.tsx | 2 +- .../issue-detail-widgets/pages/title.tsx | 3 +- .../additional-activity-root.tsx | 4 +- .../issue-details/additional-properties.tsx | 4 +- .../issues/issue-details/convert.tsx | 2 +- .../issue-details/customer-activity.tsx | 4 +- .../customer-request-activity.tsx | 4 +- .../issue-details/epic-activity-root.tsx | 2 +- .../issue-details/estimate-time-activity.tsx | 4 +- .../issues/issue-details/issue-creator.tsx | 4 +- .../issues/issue-details/issue-identifier.tsx | 8 +- .../common/activity-block.tsx | 6 +- .../common/issue-user.tsx | 4 +- .../issue-properties-activity/root.tsx | 4 +- .../issue-details/issue-type-activity.tsx | 6 +- .../issue-details/issue-type-switcher.tsx | 2 +- .../issue-details/milestone-activity-root.tsx | 4 +- .../components/issues/issue-details/page.tsx | 2 +- .../issue-details/parent-select-root.tsx | 4 +- .../issues/issue-details/properties.tsx | 3 +- .../sidebar/customer-list-item.tsx | 2 +- .../sidebar/customer-list-root.tsx | 4 +- .../issue-details/sidebar/customer-select.tsx | 2 +- .../issue-details/sidebar/customers-list.tsx | 2 +- .../issue-details/sidebar/date-alert.tsx | 4 +- .../milestones/milestones-dropdown.tsx | 4 +- .../issue-details/sidebar/milestones/root.tsx | 4 +- .../issues/issue-details/sidebar/preview.tsx | 21 +- .../sidebar/transfer-hop-info.tsx | 54 +- .../issue-layouts/additional-properties.tsx | 4 +- .../board/teamspace-view-root.tsx | 2 +- .../issue-layouts/calendar-epic-root.tsx | 6 +- .../calendar/teamspace-view-root.tsx | 2 +- .../empty-states/team-issues.tsx | 2 +- .../empty-states/team-project.tsx | 2 +- .../empty-states/team-view-issues.tsx | 2 +- .../issues/issue-layouts/epic-layout-root.tsx | 8 +- .../issues/issue-layouts/export-modal.tsx | 4 +- .../issues/issue-layouts/gantt/root.tsx | 2 +- .../gantt/workspace-gantt-chart.tsx | 2 +- .../issues/issue-layouts/issue-stats.tsx | 4 +- .../issues/issue-layouts/kanban-epic-root.tsx | 6 +- .../issues/issue-layouts/list-epic-root.tsx | 2 +- .../list/teamspace-view-root.tsx | 2 +- .../duplicate-modal.tsx | 2 +- .../project-dropdown.tsx | 26 +- .../roots/teamspace-layout-root.tsx | 50 +- .../roots/teamspace-project-root.tsx | 6 +- .../roots/teamspace-view-layout-root.tsx | 6 +- .../issue-layouts/spreadsheet-epic-root.tsx | 6 +- .../spreadsheet/customer-requests.tsx | 2 +- .../issue-layouts/spreadsheet/customers.tsx | 2 +- .../table/teamspace-view-root.tsx | 2 +- .../additional-properties-base.tsx | 6 +- .../issue-modal/additional-properties.tsx | 6 +- .../issues/issue-modal/issue-type-select.tsx | 6 +- .../modal-additional-properties.tsx | 72 +- .../issues/issue-modal/provider.tsx | 2 +- .../issues/issue-modal/template-select.tsx | 4 +- .../template-sub-workitems-list.tsx | 2 +- .../ee/components/issues/quick-add/root.tsx | 2 +- .../issues/worklog/activity/filter-root.tsx | 4 +- .../issues/worklog/activity/root.tsx | 4 +- .../activity/worklog-create-button.tsx | 6 +- .../issues/worklog/create-update/create.tsx | 6 +- .../issues/worklog/create-update/form.tsx | 6 +- .../issues/worklog/create-update/update.tsx | 6 +- .../issues/worklog/property/button.tsx | 6 +- .../issues/worklog/property/root.tsx | 4 +- .../components/license/activation/helper.tsx | 10 +- .../license/activation/license-file-form.tsx | 4 +- .../license/activation/license-key-form.tsx | 4 +- .../components/license/activation/modal.tsx | 6 +- .../components/license/badge/cloud-badge.tsx | 4 +- .../license/badge/plane-one-badge.tsx | 4 +- .../license/badge/self-hosted-badge.tsx | 4 +- .../license/banner/seats-banner.tsx | 4 +- .../license/banner/trial-banner.tsx | 5 +- .../license/modal/success-modal.tsx | 5 +- .../components/license/modal/trial-button.tsx | 8 +- .../license/modal/upgrade-modal.tsx | 18 +- .../license/plans-card/business.tsx | 4 +- .../license/plans-card/cloud-free.tsx | 4 +- .../license/plans-card/common/plan-card.tsx | 4 +- .../common/self-managed-license-actions.tsx | 6 +- .../license/plans-card/enterprise.tsx | 4 +- .../ee/components/license/plans-card/one.tsx | 57 +- .../ee/components/license/plans-card/pro.tsx | 4 +- .../license/plans-card/self-hosted-free.tsx | 4 +- .../components/license/workspace-disabled.tsx | 4 +- .../applications/applications-upgrade.tsx | 4 +- .../applications/details/delete-modal.tsx | 4 +- .../marketplace/applications/details/list.tsx | 5 +- .../applications/details/menu-item.tsx | 4 +- .../applications/details/menu-options.tsx | 6 +- .../applications/details/revoke-modal.tsx | 4 +- .../marketplace/applications/details/root.tsx | 3 +- .../applications/details/tile-logo.tsx | 4 +- .../marketplace/applications/details/tile.tsx | 4 +- .../applications/form/client-secret-modal.tsx | 6 +- .../applications/form/create-update.tsx | 4 +- .../applications/form/fields/base-field.tsx | 30 +- .../applications/form/fields/input-field.tsx | 4 +- .../form/fields/rich-text-field.tsx | 4 +- .../applications/form/form-section.tsx | 4 +- .../form/regenerate-client-secret-modal.tsx | 4 +- .../form/regenerate-client-secret.tsx | 4 +- .../form/regenerate-confirm-modal.tsx | 4 +- .../applications/form/select-categories.tsx | 4 +- .../form/select-supported-plans.tsx | 4 +- .../applications/form/upload-attachments.tsx | 8 +- .../applications/installation/details.tsx | 10 +- .../applications/publish/publish-modal.tsx | 3 +- .../marketplace/applications/ui/checkbox.tsx | 4 +- .../marketplace/oauth/app-consent.tsx | 482 +++-- .../mobile/authentication/banner.tsx | 4 +- .../forms/email-confirmation.tsx | 6 +- .../forms/password-strength-meter.tsx | 6 +- .../mobile/authentication/forms/password.tsx | 6 +- .../authentication/forms/unique-code.tsx | 6 +- .../mobile/authentication/header.tsx | 6 +- .../mobile/authentication/o-auth/github.tsx | 6 +- .../mobile/authentication/o-auth/google.tsx | 6 +- .../mobile/authentication/o-auth/oidc.tsx | 6 +- .../mobile/authentication/o-auth/root.tsx | 6 +- .../mobile/authentication/o-auth/saml.tsx | 6 +- .../components/mobile/authentication/root.tsx | 8 +- .../authentication/terms-and-conditions.tsx | 34 +- .../authentication/wrappers/invitation.tsx | 6 +- .../components/navigations/top-nav-search.tsx | 2 +- .../navigations/top-navigation-root.tsx | 2 +- .../components/pages/badge/archived-badge.tsx | 6 +- apps/web/ee/components/pages/badge/badge.tsx | 14 +- .../ee/components/pages/badge/moved-badge.tsx | 4 +- .../components/pages/collaborators-list.tsx | 2 +- .../pages/comments/comment-avatar.tsx | 6 +- .../comments/comment-creation-handler.tsx | 247 +-- .../pages/comments/comment-display.tsx | 7 +- .../comments/comment-filter-controls.tsx | 5 +- .../pages/comments/comment-form.tsx | 2 +- .../comments/comment-reply-controller.tsx | 47 +- .../comments/comment-timestamp-display.tsx | 24 +- .../pages/comments/comment-user-details.tsx | 6 +- .../comments-navigation-extension.tsx | 8 +- .../pages/comments/comments-sidebar-panel.tsx | 2 +- .../pages/comments/comments-thread-list.tsx | 49 +- .../pages/comments/reply-loading-skeleton.tsx | 42 +- .../comments/thread-loading-skeleton.tsx | 192 +- .../pages/comments/thread-reply-list.tsx | 81 +- .../pages/editor/ai/ask-pi-menu.tsx | 4 +- .../ee/components/pages/editor/ai/menu.tsx | 6 +- .../editor/embed/issue-embed-upgrade-card.tsx | 4 +- .../pages/editor/embed/issue-embed.tsx | 2 +- .../editor/external-embed/embed-handler.tsx | 30 +- .../pages/editor/template-picker.tsx | 2 +- .../web/ee/components/pages/embed/content.tsx | 2 +- .../web/ee/components/pages/embed/preview.tsx | 2 +- apps/web/ee/components/pages/embed/root.tsx | 20 +- .../web/ee/components/pages/extra-actions.tsx | 4 +- .../pages/header/comment-control.tsx | 4 +- .../components/pages/header/lock-control.tsx | 4 +- .../components/pages/header/move-control.tsx | 4 +- .../components/pages/header/share-control.tsx | 4 +- apps/web/ee/components/pages/list/root.tsx | 2 +- .../pages/modals/confirmation-modal.tsx | 4 +- .../pages/modals/create-page-modal.tsx | 2 +- .../modals/delete-multiple-pages-modal.tsx | 4 +- .../pages/modals/delete-page-modal.tsx | 4 +- .../pages/modals/lock-page-modal.tsx | 6 +- .../web/ee/components/pages/modals/modals.tsx | 4 +- .../ee/components/pages/modals/move/body.tsx | 4 +- .../components/pages/modals/move/footer.tsx | 4 +- .../ee/components/pages/modals/move/input.tsx | 4 +- .../pages/modals/move/list-item.tsx | 4 +- .../pages/modals/move/list-section.tsx | 4 +- .../ee/components/pages/modals/move/root.tsx | 2 +- .../modals/move/sections/projects-list.tsx | 2 +- .../pages/modals/move/sections/root.tsx | 2 +- .../modals/move/sections/teamspaces-list.tsx | 2 +- .../pages/modals/publish-page-modal.tsx | 2 +- .../pages/modals/share-page-root-modal.tsx | 446 ++-- .../pages/modals/template-select-modal.tsx | 2 +- .../navigation-pane/tab-panels/assets.tsx | 4 +- .../tab-panels/empty-states/assets.tsx | 4 +- .../tab-panels/empty-states/outline.tsx | 4 +- .../pages/navigation-pane/tab-panels/root.tsx | 6 +- .../ee/components/pages/publish-actions.tsx | 2 +- .../ee/components/pages/share/access-menu.tsx | 104 +- .../ee/components/pages/share/empty-state.tsx | 85 +- .../pages/share/existing-users-section.tsx | 8 +- .../components/pages/share/member-search.tsx | 30 +- .../components/pages/share/modal-footer.tsx | 48 +- .../components/pages/share/modal-header.tsx | 32 +- .../pages/share/pending-users-section.tsx | 8 +- .../pages/share/share-page-modal.tsx | 6 +- .../components/pages/share/user-list-item.tsx | 10 +- .../pages/sidebar/list-item-root.tsx | 4 +- .../ee/components/pages/sidebar/list-item.tsx | 4 +- apps/web/ee/components/pages/sidebar/list.tsx | 4 +- apps/web/ee/components/pages/sidebar/menu.tsx | 2 +- .../pages/sidebar/quick-actions.tsx | 2 +- .../section/components/section-content.tsx | 261 +-- .../section/components/section-header.tsx | 101 +- .../pages/sidebar/section/section-root.tsx | 2 +- .../ee/components/pages/version/editor.tsx | 2 +- .../pi-chat/actions/action-status-block.tsx | 4 +- .../actions/artifacts/artifact-block-mini.tsx | 4 +- .../actions/artifacts/detail/cycle.tsx | 2 +- .../pi-chat/actions/artifacts/detail/epic.tsx | 2 +- .../actions/artifacts/detail/follow-up.tsx | 2 +- .../actions/artifacts/detail/footer.tsx | 5 +- .../actions/artifacts/detail/header.tsx | 4 +- .../actions/artifacts/detail/module.tsx | 2 +- .../actions/artifacts/detail/page/details.tsx | 2 +- .../actions/artifacts/detail/page/editor.tsx | 2 +- .../actions/artifacts/detail/page/root.tsx | 4 +- .../pi-chat/actions/artifacts/detail/root.tsx | 48 +- .../actions/artifacts/detail/template.tsx | 4 +- .../actions/artifacts/detail/toast.tsx | 4 +- .../actions/artifacts/detail/work-item.tsx | 2 +- .../pi-chat/actions/artifacts/list/root.tsx | 4 +- .../artifacts/preview-cards/add-remove.tsx | 2 +- .../actions/artifacts/preview-cards/cycle.tsx | 2 +- .../preview-cards/delete-archieve.tsx | 2 +- .../artifacts/preview-cards/module.tsx | 2 +- .../actions/artifacts/preview-cards/page.tsx | 2 +- .../artifacts/preview-cards/project.tsx | 4 +- .../artifacts/preview-cards/properties.tsx | 11 +- .../actions/artifacts/preview-cards/root.tsx | 2 +- .../artifacts/preview-cards/template.tsx | 2 +- .../actions/artifacts/preview-cards/view.tsx | 2 +- .../preview-cards/with-preview-hoc.tsx | 7 +- .../artifacts/preview-cards/work-item.tsx | 2 +- .../pi-chat/actions/confirm-block.tsx | 4 +- .../pi-chat/actions/preview-block.tsx | 8 +- .../ee/components/pi-chat/actions/summary.tsx | 2 +- .../pi-chat/conversation/ai-message.tsx | 4 +- .../pi-chat/conversation/feedback.tsx | 2 +- .../pi-chat/conversation/loading.tsx | 2 +- .../pi-chat/conversation/messages.tsx | 2 +- .../pi-chat/conversation/my-message.tsx | 2 +- .../pi-chat/conversation/new-converstaion.tsx | 4 +- .../pi-chat/conversation/reasoning.tsx | 4 +- .../pi-chat/conversation/thinking.tsx | 14 +- .../pi-chat/conversation/typing.tsx | 29 +- .../pi-chat/converse/voice-chart.tsx | 4 +- .../pi-chat/converse/voice-input.tsx | 4 +- apps/web/ee/components/pi-chat/detail.tsx | 3 +- apps/web/ee/components/pi-chat/empty.tsx | 5 +- .../ee/components/pi-chat/floating-bot.tsx | 2 +- .../ee/components/pi-chat/header/header.tsx | 4 +- .../pi-chat/header/models-dropdown.tsx | 9 +- .../components/pi-chat/input/dnd-wrapper.tsx | 4 +- .../pi-chat/input/feedback-modal.tsx | 2 +- .../components/pi-chat/input/focus-filter.tsx | 4 +- apps/web/ee/components/pi-chat/input/mode.tsx | 4 +- .../pi-chat/input/quick-action-button.tsx | 4 +- apps/web/ee/components/pi-chat/input/root.tsx | 4 +- apps/web/ee/components/pi-chat/layout.tsx | 6 +- .../ee/components/pi-chat/list/list-item.tsx | 4 +- apps/web/ee/components/pi-chat/list/list.tsx | 4 +- .../web/ee/components/pi-chat/list/loader.tsx | 5 +- apps/web/ee/components/pi-chat/list/root.tsx | 2 +- .../pi-chat/modals/delete-modal.tsx | 4 +- .../components/pi-chat/modals/edit-form.tsx | 6 +- .../pi-chat/modals/save-page-modal.tsx | 4 +- .../components/pi-chat/sidebar/favorites.tsx | 4 +- .../ee/components/pi-chat/sidebar/recents.tsx | 4 +- .../pi-chat/sidebar/right-side-panel.tsx | 4 +- .../ee/components/pi-chat/sidebar/root.tsx | 6 +- .../pi-chat/sidebar/sidebar-item.tsx | 4 +- .../ee/components/pi-chat/sidebar/toolbar.tsx | 4 +- .../ee/components/pi-chat/system-prompts.tsx | 6 +- .../ee/components/pi-chat/unauthorized.tsx | 6 +- apps/web/ee/components/pi-chat/upgrade.tsx | 5 +- .../pi-chat/uploads/image-preview.tsx | 4 +- .../pi-chat/uploads/input-preview-uploads.tsx | 2 +- .../ee/components/pi-chat/uploads/root.tsx | 2 +- .../pi-chat/uploads/template-preview.tsx | 4 +- .../preferences/smooth-cursor-toggle.tsx | 64 +- .../components/preferences/theme-switcher.tsx | 156 +- apps/web/ee/components/profile/loader.tsx | 56 +- .../profile/user-connections-view.tsx | 221 +- .../details/main/collapsible-section-root.tsx | 6 +- .../attachment/attachment-list-item.tsx | 4 +- .../attachment-list-upload-item.tsx | 4 +- .../attachment/delete-attachment-modal.tsx | 2 +- .../attachment/quick-action-button.tsx | 4 +- .../collaspible-section/attachment/root.tsx | 3 +- .../attachment/use-attachments.tsx | 1 - .../links/create-update-link-modal.tsx | 6 +- .../collaspible-section/links/link-detail.tsx | 4 +- .../main/collaspible-section/links/links.tsx | 2 +- .../main/collaspible-section/links/root.tsx | 4 +- .../quick-action-button.tsx | 3 +- .../details/main/info-section-root.tsx | 4 +- .../details/main/info-section/actions.tsx | 4 +- .../main/info-section/description-box.tsx | 3 +- .../main/info-section/hero-section.tsx | 2 +- .../main/info-section/update-reaction.tsx | 4 +- .../main/milestones/add-milestone-button.tsx | 4 +- .../main/milestones/collapsible-root.tsx | 2 +- .../main/milestones/create-update-modal.tsx | 6 +- .../details/main/milestones/helper.tsx | 5 +- .../main/milestones/milestone-card.tsx | 2 +- .../main/milestones/milestone-work-item.tsx | 2 +- .../main/milestones/milestone-work-items.tsx | 2 +- .../main/milestones/quick-action-button.tsx | 4 +- .../details/main/milestones/root.tsx | 2 +- .../details/main/modal-root.tsx | 4 +- .../details/main/progress-section-root.tsx | 6 +- .../project-overview/details/main/root.tsx | 6 +- .../project-overview/details/root.tsx | 4 +- .../details/sidebar/activity-tab-root.tsx | 4 +- .../details/sidebar/properties-tab-root.tsx | 6 +- .../project-overview/details/sidebar/root.tsx | 4 +- .../details/sidebar/update-upgrade.tsx | 4 +- .../details/sidebar/updates-tab-root.tsx | 4 +- .../details/sidebar/updates/block.tsx | 4 +- .../updates/comments/comment-block.tsx | 4 +- .../sidebar/updates/comments/comment-list.tsx | 2 +- .../details/sidebar/updates/comments/edit.tsx | 4 +- .../sidebar/updates/delete-update-modal.tsx | 2 +- .../details/sidebar/updates/empty.tsx | 4 +- .../details/sidebar/updates/loader.tsx | 16 +- .../details/sidebar/updates/new-update.tsx | 4 +- .../details/sidebar/updates/properties.tsx | 4 +- .../details/sidebar/updates/quick-actions.tsx | 4 +- .../details/sidebar/updates/root.tsx | 2 +- .../sidebar/updates/status-dropdown.tsx | 9 +- .../sidebar/updates/update-reaction.tsx | 4 +- .../details/sidebar/updates/upgrade.tsx | 4 +- .../components/project-overview/upgrade.tsx | 11 +- .../projects/applied-filters/access.tsx | 2 +- .../projects/applied-filters/date.tsx | 2 +- .../projects/applied-filters/members.tsx | 4 +- .../projects/applied-filters/priority.tsx | 2 +- .../project-display-filters.tsx | 2 +- .../projects/applied-filters/root.tsx | 6 +- .../projects/applied-filters/state.tsx | 2 +- .../projects/common/join-button.tsx | 4 +- .../components/projects/create/attributes.tsx | 6 +- .../ee/components/projects/create/loader.tsx | 4 +- .../components/projects/create/provider.tsx | 2 +- .../ee/components/projects/create/root.tsx | 16 +- .../projects/create/template-select.tsx | 4 +- .../projects/dropdowns/members-dropdown.tsx | 30 +- .../projects/dropdowns/priority-dropdown.tsx | 18 +- .../projects/dropdowns/scope-dropdown.tsx | 46 +- .../projects/dropdowns/state-dropdown.tsx | 4 +- .../header/attributes-dropdown/access.tsx | 6 +- .../header/attributes-dropdown/priority.tsx | 6 +- .../header/attributes-dropdown/root.tsx | 6 +- .../header/attributes-dropdown/state.tsx | 4 +- .../header/attributes-dropdown/users.tsx | 4 +- .../projects/header/create-project-button.tsx | 5 +- .../display-filters-dropdown/group-by.tsx | 2 +- .../header/display-filters-dropdown/root.tsx | 4 +- .../display-filters-dropdown/sort-by.tsx | 2 +- .../display-filters-dropdown/sort-order.tsx | 2 +- .../projects/header/layout-selection.tsx | 4 +- .../ee/components/projects/header/root.tsx | 4 +- .../projects/header/search-projects.tsx | 4 +- .../projects/layouts/attributes.tsx | 2 +- .../layouts/board/group-drag-overlay.tsx | 4 +- .../layouts/board/group-item-header/root.tsx | 6 +- .../projects/layouts/board/group-item.tsx | 4 +- .../projects/layouts/board/group.tsx | 4 +- .../projects/layouts/board/list-item.tsx | 4 +- .../projects/layouts/board/list.tsx | 4 +- .../projects/layouts/board/root.tsx | 4 +- .../layouts/gallery/base-gallery-root.tsx | 2 +- .../projects/layouts/gallery/card.tsx | 4 +- .../projects/layouts/gallery/details.tsx | 2 +- .../layouts/gantt/base-gantt-root.tsx | 2 +- .../projects/layouts/gantt/blocks.tsx | 8 +- .../projects/layouts/gantt/sidebar.tsx | 4 +- .../projects/layouts/list/base-list-root.tsx | 2 +- .../projects/layouts/list/block.tsx | 4 +- .../projects/layouts/list/blocks-list.tsx | 4 +- .../projects/layouts/list/default.tsx | 2 +- .../layouts/list/headers/group-by-card.tsx | 4 +- .../projects/layouts/list/list-group.tsx | 37 +- .../projects/layouts/project-layout-HOC.tsx | 6 +- .../ee/components/projects/layouts/root.tsx | 8 +- .../spreadsheet/base-spreadsheet-root.tsx | 6 +- .../spreadsheet/columns/header-column.tsx | 6 +- .../spreadsheet/columns/issue-column.tsx | 2 +- .../spreadsheet/columns/lead-column.tsx | 2 +- .../spreadsheet/columns/members-column.tsx | 2 +- .../spreadsheet/columns/priority-column.tsx | 2 +- .../spreadsheet/columns/state-column.tsx | 2 +- .../spreadsheet/columns/updated-on-column.tsx | 2 +- .../layouts/spreadsheet/project-column.tsx | 2 +- .../layouts/spreadsheet/project-row.tsx | 6 +- .../spreadsheet/spreadsheet-header-column.tsx | 2 +- .../spreadsheet/spreadsheet-header.tsx | 2 +- .../layouts/spreadsheet/spreadsheet-table.tsx | 2 +- .../layouts/spreadsheet/spreadsheet-view.tsx | 2 +- .../ee/components/projects/mobile-header.tsx | 2 +- apps/web/ee/components/projects/page.tsx | 4 +- .../ee/components/projects/quick-actions.tsx | 4 +- apps/web/ee/components/projects/root.tsx | 4 +- .../projects/settings/features-list.tsx | 4 +- .../settings/intake/feature-children.tsx | 5 +- .../projects/settings/intake/forms-root.tsx | 11 +- .../settings/intake/header/quick-actions.tsx | 4 +- .../projects/settings/intake/header/root.tsx | 4 +- .../settings/intake/intake-responsibility.tsx | 2 +- .../intake/intake-sub-features-upgrade.tsx | 2 +- .../settings/intake/intake-sub-features.tsx | 4 +- .../settings/intake/intake-tooltip.tsx | 2 +- .../projects/settings/intake/renew-modal.tsx | 6 +- .../intake/type-forms/create-update-form.tsx | 2 +- .../settings/intake/type-forms/form-link.tsx | 4 +- .../intake/type-forms/form-list-item.tsx | 2 +- .../intake/type-forms/form-preview-modal.tsx | 2 +- .../intake/type-forms/properties-dropdown.tsx | 2 +- .../type-forms/properties-list-item.tsx | 2 +- .../settings/intake/type-forms/root.tsx | 4 +- .../intake/type-forms/select-types-modal.tsx | 2 +- .../teamspaces/link-teamspace-modal.tsx | 6 +- .../projects/teamspaces/list-loader.tsx | 36 +- .../teamspaces/teamspace-list-item.tsx | 4 +- .../projects/teamspaces/teamspace-list.tsx | 4 +- .../settings/activity/activity-helpers.tsx | 2 +- .../settings/activity/list-item.tsx | 6 +- .../settings/activity/root.tsx | 6 +- .../settings/create-button.tsx | 4 +- .../settings/create-update/form.tsx | 461 ++-- .../create-update/interval-dropdown.tsx | 6 +- .../settings/create-update/loader.tsx | 50 +- .../settings/create-update/root.tsx | 4 +- .../settings/empty-state.tsx | 4 +- .../settings/list/list-item.tsx | 4 +- .../settings/list/quick-actions.tsx | 6 +- .../settings/list/root.tsx | 4 +- .../recurring-work-items/settings/root.tsx | 4 +- .../recurring-work-items/settings/upgrade.tsx | 4 +- .../filter-value-input/boolean/root.tsx | 56 +- .../filter-value-input/number/range.tsx | 286 +-- .../filter-value-input/number/single.tsx | 4 +- .../rich-filters/filter-value-input/root.tsx | 107 +- .../shared/popover-filter-input.tsx | 2 +- .../filter-value-input/text/root.tsx | 4 +- .../ee/components/sidebar/app-switcher.tsx | 2 +- .../sidebar/project-navigation-root.tsx | 4 +- .../teamspaces/actions/delete-modal.tsx | 6 +- .../teamspaces/actions/join-teamspace.tsx | 2 +- .../teamspaces/actions/members/button.tsx | 57 +- .../teamspaces/actions/members/modal.tsx | 2 +- .../teamspaces/actions/projects/button.tsx | 4 +- .../actions/projects/link-modal.tsx | 2 +- .../teamspaces/actions/properties.tsx | 2 +- .../teamspaces/actions/quick-actions.tsx | 4 +- .../teamspaces/create-update/form.tsx | 4 +- .../teamspaces/create-update/modal.tsx | 4 +- .../teamspaces/cycles/completed.tsx | 2 +- .../components/teamspaces/cycles/current.tsx | 2 +- .../components/teamspaces/cycles/upcoming.tsx | 2 +- .../headers/detail-header/issues.tsx | 4 +- .../headers/detail-header/overview.tsx | 4 +- .../headers/detail-header/pages-list.tsx | 4 +- .../headers/detail-header/projects-list.tsx | 4 +- .../teamspaces/headers/detail-header/root.tsx | 4 +- .../headers/detail-header/views-list.tsx | 4 +- .../headers/detail-header/work-items.tsx | 4 +- .../list-header/filters-dropdown/root.tsx | 4 +- .../teamspaces/headers/list-header/root.tsx | 4 +- .../headers/list-header/search-teamspaces.tsx | 3 +- .../list-header/teamspace-scope-dropdown.tsx | 41 +- .../components/teamspaces/issues/filters.tsx | 4 +- .../ee/components/teamspaces/list/loader.tsx | 54 +- .../ee/components/teamspaces/list/root.tsx | 4 +- .../teamspaces/list/teamspace-list-item.tsx | 2 +- .../teamspaces/list/teamspaces-list.tsx | 2 +- .../teamspaces/overview/add-projects.tsx | 2 +- .../teamspaces/overview/content.tsx | 2 +- .../teamspaces/overview/description-input.tsx | 6 +- .../teamspaces/overview/name-input.tsx | 4 +- .../teamspaces/overview/progress/banner.tsx | 2 +- .../teamspaces/overview/progress/chart.tsx | 4 +- .../teamspaces/overview/progress/root.tsx | 10 +- .../teamspaces/overview/progress/summary.tsx | 8 +- .../teamspaces/overview/properties.tsx | 2 +- .../teamspaces/overview/quick-links.tsx | 2 +- .../overview/relations/list-item.tsx | 4 +- .../teamspaces/overview/relations/list.tsx | 4 +- .../teamspaces/overview/relations/root.tsx | 12 +- .../components/teamspaces/overview/root.tsx | 4 +- .../teamspaces/overview/sidebar/activity.tsx | 8 +- .../teamspaces/overview/sidebar/comments.tsx | 6 +- .../teamspaces/overview/sidebar/members.tsx | 4 +- .../overview/sidebar/properties/list.tsx | 10 +- .../overview/sidebar/properties/loader.tsx | 20 +- .../overview/sidebar/properties/root.tsx | 4 +- .../teamspaces/overview/sidebar/root.tsx | 10 +- .../teamspaces/overview/statistics/chart.tsx | 2 +- .../overview/statistics/filters/data-key.tsx | 4 +- .../statistics/filters/dependency.tsx | 4 +- .../overview/statistics/filters/due-by.tsx | 4 +- .../overview/statistics/filters/legend.tsx | 2 +- .../statistics/filters/state-group.tsx | 4 +- .../overview/statistics/filters/value-key.tsx | 4 +- .../teamspaces/overview/statistics/root.tsx | 8 +- .../teamspaces/pages/header/index.tsx | 2 +- .../pages/header/tab-navigation.tsx | 4 +- .../teamspaces/pages/list/index.tsx | 2 +- .../teamspaces/pages/pages-list-view.tsx | 4 +- .../teamspaces/pages/pages-list.tsx | 2 +- .../teamspaces/projects/block-list.tsx | 4 +- .../components/teamspaces/projects/block.tsx | 6 +- .../teamspaces/projects/filters.tsx | 4 +- .../teamspaces/projects/grouping-root.tsx | 4 +- .../teamspaces/projects/non-grouping-root.tsx | 4 +- apps/web/ee/components/teamspaces/upgrade.tsx | 5 +- .../teamspaces/views/filters/list.tsx | 2 +- .../views/modals/create-update/form.tsx | 4 +- .../views/modals/create-update/modal.tsx | 4 +- .../teamspaces/views/modals/delete.tsx | 4 +- .../teamspaces/views/modals/publish.tsx | 4 +- .../teamspaces/views/quick-actions.tsx | 4 +- .../views/view-list-item-action.tsx | 2 +- .../teamspaces/views/view-list-item.tsx | 4 +- .../teamspaces/views/views-list.tsx | 2 +- .../templates/dropdowns/project.tsx | 2 +- .../templates/dropdowns/work-item.tsx | 4 +- .../settings/common/collapsible-wrapper.tsx | 4 +- .../settings/common/form/template-details.tsx | 4 +- .../templates/settings/create-button.tsx | 2 +- .../templates/settings/discard-modal.tsx | 4 +- .../settings/list/action-wrapper.tsx | 4 +- .../templates/settings/list/list-item.tsx | 4 +- .../templates/settings/list/list-wrapper.tsx | 2 +- .../templates/settings/list/project-root.tsx | 4 +- .../templates/settings/list/quick-actions.tsx | 558 +++-- .../settings/list/workspace-root.tsx | 4 +- .../templates/settings/no-templates.tsx | 2 +- .../templates/settings/page/create-update.tsx | 2 +- .../templates/settings/page/form/editor.tsx | 2 +- .../settings/page/form/page-details.tsx | 2 +- .../templates/settings/page/form/root.tsx | 4 +- .../settings/page/form/template-details.tsx | 4 +- .../templates/settings/page/loader.tsx | 46 +- .../templates/settings/project-root.tsx | 4 +- .../settings/project/create-update.tsx | 4 +- .../settings/project/form/attributes/root.tsx | 2 +- .../templates/settings/project/form/base.tsx | 2 +- .../settings/project/form/epics/root.tsx | 2 +- .../project/form/features/children.tsx | 4 +- .../settings/project/form/features/root.tsx | 2 +- .../settings/project/form/labels/root.tsx | 2 +- .../settings/project/form/loader.tsx | 60 +- .../settings/project/form/project-details.tsx | 2 +- .../settings/project/form/states/root.tsx | 2 +- .../work-item-types/create-update-modal.tsx | 2 +- .../form/work-item-types/delete-modal.tsx | 2 +- .../project/form/work-item-types/root.tsx | 2 +- .../publish/form/additional-details.tsx | 2 +- .../templates/settings/publish/form/base.tsx | 106 +- .../settings/publish/form/basic-details.tsx | 268 ++- .../settings/publish/form/loader.tsx | 134 +- .../form/template-categories-dropdown.tsx | 4 +- .../form/template-cover-image-upload.tsx | 2 +- .../templates/settings/publish/root.tsx | 4 +- .../components/templates/settings/upgrade.tsx | 4 +- .../blueprint/form/default-properties.tsx | 6 +- .../form/properties-with-additional-props.tsx | 4 +- .../blueprint/form/properties-with-mobx.tsx | 74 +- .../blueprint/form/selection-dropdown.tsx | 4 +- .../blueprint/form/work-item-details.tsx | 4 +- .../work-item/blueprint/list/list-item.tsx | 4 +- .../work-item/blueprint/list/root.tsx | 380 ++-- .../work-item/blueprint/modal/form.tsx | 142 +- .../work-item/blueprint/modal/modal.tsx | 8 +- .../settings/work-item/create-update.tsx | 4 +- .../templates/settings/work-item/form.tsx | 438 ++-- .../templates/settings/work-item/loader.tsx | 58 +- .../templates/settings/workspace-root.tsx | 4 +- apps/web/ee/components/updates/block.tsx | 2 +- .../updates/comments/comment-block.tsx | 2 +- .../updates/comments/comment-list.tsx | 2 +- .../ee/components/updates/comments/edit.tsx | 4 +- .../updates/delete-update-modal.tsx | 2 +- apps/web/ee/components/updates/empty.tsx | 4 +- apps/web/ee/components/updates/new-update.tsx | 4 +- apps/web/ee/components/updates/progress.tsx | 4 +- .../ee/components/updates/quick-actions.tsx | 4 +- .../ee/components/updates/read-only-list.tsx | 6 +- apps/web/ee/components/updates/root.tsx | 188 +- .../ee/components/updates/status-dropdown.tsx | 9 +- .../ee/components/updates/status-icons.tsx | 6 +- .../ee/components/updates/update-reaction.tsx | 4 +- .../ee/components/views/access-controller.tsx | 4 +- .../views/filters/access-filter.tsx | 4 +- apps/web/ee/components/views/helper.tsx | 12 +- .../web/ee/components/views/publish/modal.tsx | 4 +- .../wiki/download-nested-pages-modal/root.tsx | 2 +- .../sub-page-item.tsx | 2 +- .../wiki/nested-pages-download-banner.tsx | 2 +- .../wiki/settings-upgrade-screen.tsx | 4 +- .../web/ee/components/wiki/upgrade-screen.tsx | 2 +- .../filters-hoc/teamspace-level.tsx | 4 +- .../workflow/page/change-history.tsx | 12 +- .../workflow/page/quick-actions.tsx | 4 +- apps/web/ee/components/workflow/page/root.tsx | 4 +- .../ee/components/workflow/page/upgrade.tsx | 4 +- .../workflow/page/workflow-state-item.tsx | 4 +- .../workflow/page/workflow-state-list.tsx | 4 +- .../workflow/state/dropdown/state-option.tsx | 2 +- .../transitions/add-state-transition.tsx | 2 +- .../state/transitions/state-item-child.tsx | 2 +- .../state/transitions/state-item-content.tsx | 2 +- .../state-transition-approvers.tsx | 2 +- .../transitions/state-transition-count.tsx | 2 +- .../transitions/state-transition-item.tsx | 2 +- .../workflow/workflow-tree/state-pill.tsx | 2 +- .../workflow-disabled-message.tsx | 2 +- .../workflow-disabled-overlay.tsx | 2 +- .../workflow-enabled-message.tsx | 2 +- .../workflow-tree/workflow-group-tree.tsx | 2 +- .../workflow/workflow-tree/workflow-tree.tsx | 2 +- .../workspace/download/download-button.tsx | 6 +- .../workspace/download/download-item/root.tsx | 6 +- .../download/download-item/status.tsx | 6 +- .../workspace/download/download-list.tsx | 6 +- .../worklogs/workspace/download/empty.tsx | 12 +- .../worklogs/workspace/download/loader.tsx | 6 +- .../workspace/download/pagination-bar.tsx | 6 +- .../worklogs/workspace/download/refresh.tsx | 6 +- .../worklogs/workspace/download/root.tsx | 6 +- .../components/worklogs/workspace/empty.tsx | 6 +- .../header/applied-filters/date-range.tsx | 6 +- .../header/applied-filters/group-item.tsx | 6 +- .../header/applied-filters/group.tsx | 6 +- .../header/applied-filters/projects.tsx | 6 +- .../workspace/header/applied-filters/root.tsx | 6 +- .../header/applied-filters/users.tsx | 6 +- .../workspace/header/filters/date-range.tsx | 6 +- .../workspace/header/filters/projects.tsx | 6 +- .../workspace/header/filters/root.tsx | 6 +- .../workspace/header/filters/users.tsx | 6 +- .../worklogs/workspace/header/root.tsx | 6 +- .../components/worklogs/workspace/loader.tsx | 6 +- .../ee/components/worklogs/workspace/root.tsx | 4 +- .../components/worklogs/workspace/upgrade.tsx | 4 +- .../worklogs-paginated-table-bar.tsx | 6 +- .../workspace/worklogs-paginated-table.tsx | 6 +- .../notification-card/item.tsx | 4 +- .../notification-card/options/archive.tsx | 6 +- .../notification-card/options/read.tsx | 6 +- .../notification-card/options/root.tsx | 4 +- .../notification-card/options/snooze/root.tsx | 6 +- .../preview/acitvity-block.tsx | 6 +- .../preview/preview-activity.tsx | 6 +- .../notification-card/preview/root.tsx | 6 +- .../notification-card/root.tsx | 4 +- .../workspace-notifications/root.tsx | 2 +- .../project-state-icon/cancelled.tsx | 6 +- .../project-state-icon/completed.tsx | 6 +- .../project-state-icon/draft.tsx | 6 +- .../project-state-icon/execution.tsx | 6 +- .../project-state-icon/monitoring.tsx | 6 +- .../project-state-icon/planning.tsx | 6 +- .../project-state-icon/root.tsx | 6 +- .../settings/create-update/create.tsx | 6 +- .../settings/create-update/form.tsx | 24 +- .../settings/create-update/update.tsx | 6 +- .../settings/empty-state.tsx | 6 +- .../settings/group-list-item.tsx | 4 +- .../settings/group-list.tsx | 4 +- .../settings/loader.tsx | 22 +- .../settings/options/delete.tsx | 6 +- .../settings/options/mark-as-default.tsx | 6 +- .../settings/root.tsx | 6 +- .../settings/state-list-item.tsx | 8 +- .../settings/state-list.tsx | 4 +- .../settings/upgrade.tsx | 23 +- .../ee/components/workspace/app-switcher.tsx | 5 +- .../billing/billing-actions-button.tsx | 4 +- .../billing/comparison/frequency-toggle.tsx | 2 +- .../billing/comparison/plan-detail.tsx | 2 +- .../workspace/billing/comparison/root.tsx | 2 +- .../comparison/subscription-button.tsx | 4 +- .../billing/comparison/trial-detail.tsx | 2 +- .../billing/manage-seats/add-seats/form.tsx | 4 +- .../manage-seats/add-seats/modal-footer.tsx | 4 +- .../billing/manage-seats/add-seats/modal.tsx | 4 +- .../add-seats/steps/confirm-price.tsx | 4 +- .../add-seats/steps/select-seats.tsx | 4 +- .../billing/manage-seats/common/form-card.tsx | 4 +- .../manage-seats/common/number-input.tsx | 6 +- .../billing/manage-seats/common/price-row.tsx | 4 +- .../remove-unused-seats-modal.tsx | 4 +- .../ee/components/workspace/billing/root.tsx | 4 +- .../ee/components/workspace/cancel-trial.tsx | 4 +- .../components/workspace/content-wrapper.tsx | 7 +- .../workspace/delete-workspace-modal.tsx | 4 +- .../workspace/delete-workspace-section.tsx | 2 +- .../ee/components/workspace/edition-badge.tsx | 2 +- .../members/invite-modal/description.tsx | 2 +- .../invite-modal/limit-reached-info.tsx | 4 +- .../workspace/members/invite-modal/root.tsx | 6 +- .../workspace/search/recents/root.tsx | 2 +- .../workspace/search/results/comment-item.tsx | 8 +- .../workspace/search/results/root.tsx | 2 +- .../workspace/search/results/search-item.tsx | 1 - .../ee/components/workspace/search/root.tsx | 2 +- .../sidebar/extended-sidebar-item.tsx | 2 +- .../workspace/sidebar/sidebar-item.tsx | 4 +- .../sidebar/teamspaces/list-item.tsx | 2 +- .../workspace/sidebar/teamspaces/root.tsx | 4 +- .../ee/components/workspace/upgrade-badge.tsx | 2 +- .../workspace/upgrade-empty-state-button.tsx | 135 +- .../ee/components/workspace/upgrade-toast.tsx | 22 +- apps/web/ee/constants/importers/clickup.tsx | 1 - .../ee/constants/importers/jira-server.tsx | 2 - apps/web/ee/constants/importers/jira.tsx | 2 - apps/web/ee/constants/importers/linear.tsx | 1 - apps/web/ee/constants/project/spreadsheet.ts | 1 - .../work-item-custom-property-activity.tsx | 4 +- apps/web/ee/hooks/app-rail/provider.tsx | 6 +- .../use-custom-property-filters-config.tsx | 2 +- apps/web/ee/hooks/use-page-actions-menu.tsx | 98 +- apps/web/ee/hooks/use-timeline-chart.ts | 2 +- apps/web/ee/layouts/project-wrapper.tsx | 2 +- apps/web/ee/layouts/workspace-wrapper.tsx | 4 +- .../ee/lib/context/issue-property-option.tsx | 4 +- apps/web/ee/services/inbox-issue.service.ts | 2 - .../integrations/github/data.service.ts | 2 +- .../integrations/gitlab/data.service.ts | 2 +- apps/web/ee/silo/contexts/base-importer.tsx | 6 +- apps/web/ee/silo/contexts/job-importer.tsx | 6 +- .../ee/silo/hooks/service/use-sync-config.ts | 2 +- apps/web/ee/silo/ui/auth-form-input.tsx | 6 +- apps/web/ee/silo/ui/dropdown.tsx | 6 +- apps/web/ee/silo/ui/stepper.tsx | 10 +- .../ee/store/importers/asana/auth.store.ts | 8 +- .../ee/store/importers/asana/data.store.ts | 12 +- apps/web/ee/store/importers/base.store.ts | 6 +- .../ee/store/importers/clickup/auth.store.ts | 6 +- .../ee/store/importers/clickup/data.store.ts | 8 +- .../ee/store/importers/flatfile/root.store.ts | 2 +- .../store/importers/jira-server/auth.store.ts | 6 +- .../store/importers/jira-server/data.store.ts | 14 +- .../web/ee/store/importers/jira/auth.store.ts | 8 +- .../web/ee/store/importers/jira/data.store.ts | 14 +- apps/web/ee/store/importers/job.store.ts | 12 +- .../ee/store/importers/linear/auth.store.ts | 8 +- .../ee/store/importers/linear/data.store.ts | 12 +- .../importers/zip-importer/root.store.ts | 2 +- .../initiatives/initiative-epics.store.ts | 2 +- .../ee/store/initiatives/initiatives.store.ts | 6 +- .../store/integration-importer-base.store.ts | 2 +- .../web/ee/store/issue/epic/analytic.store.ts | 2 +- apps/web/ee/store/issue/epic/filter.store.ts | 2 +- .../store/issue/team-project/filter.store.ts | 2 +- .../ee/store/issue/team-views/filter.store.ts | 2 +- apps/web/ee/store/issue/team/filter.store.ts | 2 +- apps/web/ee/store/pi-chat/pi-chat.ts | 2 +- apps/web/ee/store/projects/projects.ts | 2 - apps/web/ee/store/state.store.ts | 4 +- .../self-hosted-subscription.store.ts | 2 - apps/web/ee/store/templates/instance/base.ts | 7 +- .../ee/store/timeline/base-timeline.store.ts | 2 +- .../filters/filters.ts | 2 - .../workspace-project-states/project-state.ts | 2 - .../workspace-worklog/worklog-download.ts | 2 - .../web/ee/store/workspace-worklog/worklog.ts | 2 - apps/web/google.d.ts | 2 +- apps/web/helpers/authentication.helper.tsx | 9 +- eslint.config.mjs | 15 +- package.json | 8 +- packages/codemods/function-declaration.ts | 74 +- .../tests/function-declaration.spec.ts | 141 +- packages/constants/src/workspace.ts | 4 +- .../editors/document/collaborative-editor.tsx | 19 +- .../components/editors/editor-container.tsx | 4 +- .../components/editors/editor-content.tsx | 4 +- .../src/core/components/menus/block-menu.tsx | 4 +- .../menus/bubble-menu/comment-selector.tsx | 4 +- .../components/menus/bubble-menu/root.tsx | 4 +- .../core/extensions/callout/logo-selector.tsx | 2 +- .../custom-image/components/block.tsx | 2 +- .../custom-image/components/node-view.tsx | 2 +- .../editor/src/core/extensions/emoji/emoji.ts | 2 +- .../src/core/extensions/emoji/extension.ts | 2 +- packages/editor/src/core/extensions/keymap.ts | 1 - .../src/core/extensions/trailing-node.ts | 1 - ...insert-empty-paragraph-at-node-boundary.ts | 2 +- .../editor/src/core/helpers/scroll-to-node.ts | 1 - .../src/core/hooks/use-realtime-events.ts | 2 +- .../editor/src/core/hooks/use-yjs-setup.ts | 2 +- packages/editor/src/core/types/editor.ts | 2 +- .../src/ee/components/badges/pro-badge.tsx | 24 +- .../editors/pi-chat-editor/editor.tsx | 13 +- .../src/ee/components/embed-link-modal.tsx | 4 +- .../components/embed-link-view-container.tsx | 4 +- .../src/ee/components/embed-link-view.tsx | 4 +- .../src/ee/components/link-container.tsx | 16 +- .../selection-conversion/modal.tsx | 4 +- .../bubble-menu/selection-conversion/root.tsx | 4 +- .../src/ee/components/modal/upgrade-modal.tsx | 45 +- .../attachments/components/block.tsx | 4 +- .../attachments/components/flagged-state.tsx | 36 +- .../attachments/components/node-view.tsx | 4 +- .../attachments/components/upload-status.tsx | 4 +- .../components/uploader-details.tsx | 4 +- .../attachments/components/uploader.tsx | 4 +- .../attachments/components/video-preview.tsx | 4 +- .../ee/extensions/attachments/extension.tsx | 4 +- .../src/ee/extensions/document-extensions.tsx | 4 +- .../ee/extensions/drawio/components/block.tsx | 2 +- .../extensions/drawio/components/iframe.tsx | 69 +- .../drawio/components/input-block.tsx | 47 +- .../extensions/drawio/components/loading.tsx | 22 +- .../drawio/components/node-view.tsx | 2 +- .../extensions/drawio/components/wrapper.tsx | 4 +- .../src/ee/extensions/drawio/extension.tsx | 5 +- .../external-embed/components/block.tsx | 2 +- .../components/floating-input-modal.tsx | 6 +- .../external-embed/components/input-view.tsx | 8 +- .../external-embed/components/node-view.tsx | 4 +- .../extensions/external-embed/extension.tsx | 5 +- .../suggestions-renderer.tsx | 13 +- .../block-math/components/container.tsx | 6 +- .../block-math/components/empty-state.tsx | 14 +- .../block-math/components/error-state.tsx | 4 +- .../block-math/components/node-view.tsx | 4 +- .../block-math/components/view.tsx | 4 +- .../mathematics/components/floating-modal.tsx | 6 +- .../mathematics/components/input-modal.tsx | 4 +- .../inline-math/components/container.tsx | 6 +- .../inline-math/components/empty-state.tsx | 14 +- .../inline-math/components/error-state.tsx | 14 +- .../inline-math/components/node-view.tsx | 4 +- .../inline-math/components/view.tsx | 4 +- .../ee/extensions/page-embed/extension.tsx | 5 +- .../page-embed/read-only-extension.tsx | 5 +- .../pi-chat-editor/mention/extension.tsx | 4 +- .../mention/mentions-dropdown-section.tsx | 4 +- .../mention/mentions-list-dropdown.tsx | 5 +- .../pi-chat-editor/mention/node-view.tsx | 4 +- .../ee/extensions/rich-text-extensions.tsx | 4 +- .../src/ee/helpers/extended-editor-ref.ts | 2 +- packages/etl/src/asana/etl/pull.ts | 8 +- packages/etl/src/asana/etl/transform.ts | 4 +- packages/etl/src/asana/helpers/etl.ts | 2 +- packages/etl/src/clickup/helpers/entities.ts | 2 +- .../etl/src/gitlab/etl/transform-to-plane.ts | 4 +- packages/etl/src/jira-server/etl/pull-v2.ts | 2 +- packages/etl/src/jira-server/etl/pull.ts | 8 +- packages/etl/src/jira-server/etl/transform.ts | 4 +- .../src/jira-server/services/api.service.ts | 4 +- packages/etl/src/jira/etl/pull.ts | 8 +- packages/etl/src/jira/etl/transform.ts | 4 +- packages/etl/src/jira/services/api.service.ts | 2 +- .../etl/src/slack/services/auth.service.ts | 4 +- .../hooks/src/use-prevent-outside-click.tsx | 2 +- packages/i18n/src/store/index.ts | 5 +- .../src/components/common/badge.tsx | 14 +- .../document-editor/document-editor.tsx | 4 +- .../document-editor/page-content-loader.tsx | 71 +- .../src/components/editor/editor-wrapper.tsx | 4 +- .../embed/issue/issue-embed-upgrade.tsx | 40 +- .../components/embed/issue/issue-embed.tsx | 4 +- .../embed/issue/issue-identifier.tsx | 4 +- .../src/components/embed/page/root.tsx | 2 +- .../src/components/mentions/mention-root.tsx | 4 +- .../src/components/mentions/user-mention.tsx | 2 +- .../mobile-editor/src/hooks/use-toolbar.ts | 2 - .../mobile-editor/src/lib/store-context.tsx | 8 +- packages/mobile-editor/src/provider.tsx | 6 +- .../propel/src/charts/line-chart/root.tsx | 1 - .../propel/src/charts/scatter-chart/root.tsx | 1 - .../custom-property-inputs/boolean-input.tsx | 4 +- .../custom-property-inputs/date-select.tsx | 4 +- .../custom-property-inputs/number-input.tsx | 4 +- .../custom-property-inputs/option-select.tsx | 9 +- .../custom-property-inputs/text-input.tsx | 4 +- .../custom-property-inputs/url-input.tsx | 4 +- .../intake-form/intake-publish-form.tsx | 6 +- .../attachment-preview-list-item.tsx | 4 +- .../work-items/attachment-preview-list.tsx | 4 +- .../propel/src/domain/work-items/helpers.tsx | 4 +- .../propel/src/emoji-icon-picker/logo.tsx | 2 +- .../src/icons/actions/add-circle-icon.tsx | 4 +- .../src/icons/actions/add-workitem-icon.tsx | 18 +- .../src/icons/actions/preferences-icon.tsx | 18 +- .../propel/src/icons/actions/search-icon.tsx | 18 +- packages/propel/src/icons/ai-search.tsx | 38 +- packages/propel/src/icons/ai-write.tsx | 40 +- packages/propel/src/icons/approver-icon.tsx | 74 +- packages/propel/src/icons/buildings-icon.tsx | 38 +- packages/propel/src/icons/chat-icon.tsx | 36 +- .../src/icons/customer-request-icon.tsx | 22 +- packages/propel/src/icons/customers-icon.tsx | 36 +- .../icons/editor/convert-to-work-items.tsx | 34 +- packages/propel/src/icons/empty-page-icon.tsx | 34 +- packages/propel/src/icons/filled-check.tsx | 36 +- packages/propel/src/icons/filled-cross.tsx | 36 +- packages/propel/src/icons/github-icon.tsx | 128 +- packages/propel/src/icons/initiative-icon.tsx | 37 +- .../src/icons/initiative/active-icon.tsx | 40 +- .../src/icons/initiative/closed-icon.tsx | 40 +- .../src/icons/initiative/completed-icon.tsx | 40 +- .../src/icons/initiative/drafts-icon.tsx | 72 +- .../initiative/initiative-states-icon.tsx | 9 +- .../src/icons/initiative/planned-icon.tsx | 44 +- packages/propel/src/icons/milestone.tsx | 22 +- packages/propel/src/icons/moved-icon.tsx | 46 +- packages/propel/src/icons/moved-page-icon.tsx | 72 +- packages/propel/src/icons/overview-icon.tsx | 36 +- packages/propel/src/icons/plane-ai-icon.tsx | 22 +- .../propel/src/icons/plane/plane-icon.tsx | 18 +- .../propel/src/icons/plane/plane-one-icon.tsx | 30 +- .../propel/src/icons/project-states-icon.tsx | 36 +- .../src/icons/properties/comment-icon.tsx | 22 +- .../icons/properties/comment-reply-icon.tsx | 18 +- .../src/icons/properties/eye-open-icon.tsx | 18 +- .../src/icons/properties/pencil-left-icon.tsx | 4 +- .../src/icons/properties/scrope-icon.tsx | 18 +- .../src/icons/properties/transfer-hop.tsx | 26 +- .../src/icons/recurring-work-item/base.tsx | 80 +- .../src/icons/recurring-work-item/failure.tsx | 110 +- .../src/icons/recurring-work-item/success.tsx | 110 +- packages/propel/src/icons/restricted-icon.tsx | 68 +- .../propel/src/icons/restricted-page-icon.tsx | 62 +- packages/propel/src/icons/scope-icon.tsx | 70 +- packages/propel/src/icons/slack-icon.tsx | 60 +- .../icons/state/intake-state-group-icon.tsx | 6 +- .../src/icons/state/triage-group-icon.tsx | 6 +- packages/propel/src/icons/subscribe-icon.tsx | 176 +- packages/propel/src/icons/teams.tsx | 62 +- packages/propel/src/icons/triangle-alert.tsx | 22 +- .../propel/src/icons/widget/area-chart.tsx | 227 +- .../propel/src/icons/widget/bar-chart.tsx | 174 +- .../propel/src/icons/widget/donut-chart.tsx | 131 +- .../propel/src/icons/widget/line-chart.tsx | 95 +- packages/propel/src/icons/widget/number.tsx | 50 +- .../propel/src/icons/widget/pie-chart.tsx | 68 +- packages/propel/src/icons/workflow-icon.tsx | 54 +- .../icons/workspace/multiple-sticky-icon.tsx | 18 +- packages/propel/src/pill/pill.tsx | 21 +- packages/propel/src/project/project-logo.tsx | 4 +- .../tab-navigation/tab-navigation-item.tsx | 50 +- .../tab-navigation/tab-navigation-list.tsx | 12 +- .../propel/src/video-player/video-player.tsx | 2 +- .../adapter/templates/separator-based.ts | 2 +- .../src/store/rich-filters/config.ts | 5 +- .../src/store/work-item-filters/adapter.ts | 6 +- .../src/etl/workspace-connection-config.ts | 6 +- .../src/rich-filters/derived/extended.ts | 6 +- packages/ui/src/dropdowns/combo-box.tsx | 2 +- .../ui/src/editor/cross-origin-loader.tsx | 7 +- packages/ui/src/editor/embed-loading.tsx | 4 +- packages/ui/src/editor/error-state.tsx | 4 +- packages/ui/src/editor/html-content.tsx | 4 +- .../src/editor/icons/access-denied-dark.tsx | 910 ++++---- .../src/editor/icons/access-denied-light.tsx | 910 ++++---- .../ui/src/editor/icons/broken-link-dark.tsx | 916 ++++---- .../ui/src/editor/icons/broken-link-light.tsx | 916 ++++---- packages/ui/src/editor/icons/error-dark.tsx | 926 ++++---- packages/ui/src/editor/icons/error-light.tsx | 926 ++++---- .../ui/src/editor/icons/not-found-dark.tsx | 958 ++++----- .../ui/src/editor/icons/not-found-light.tsx | 958 ++++----- .../editor/icons/thumbnail-not-found-dark.tsx | 1112 +++++----- .../icons/thumbnail-not-found-light.tsx | 1112 +++++----- packages/ui/src/editor/is-in-viewport.tsx | 4 +- packages/ui/src/editor/rich-card.tsx | 4 +- packages/ui/src/editor/twitter-embed.tsx | 4 +- .../ui/src/form-fields/checkbox-select.tsx | 6 +- packages/ui/src/form-fields/pill-input.tsx | 5 +- packages/ui/src/sortable/sortable.tsx | 2 - packages/ui/src/tabs/tab-list.tsx | 98 +- packages/ui/src/tooltip/tooltip.tsx | 7 +- packages/utils/src/auth.ts | 7 +- packages/utils/src/cycle.ts | 11 +- packages/utils/src/editor/common.ts | 2 +- .../utils/src/editor/markdown-parser/root.ts | 25 +- packages/utils/src/estimates.ts | 2 +- packages/utils/src/mobile/auth.tsx | 6 +- .../rich-filters/operations/traversal/core.ts | 6 +- .../src/rich-filters/operators/extended.ts | 2 +- .../configs/filters/milestone.ts | 6 +- packages/utils/src/work-item/modal.ts | 2 +- pnpm-lock.yaml | 1884 ++++++++--------- 2187 files changed, 17562 insertions(+), 18425 deletions(-) diff --git a/.github/workflows/pull-request-build-lint-web-apps.yml b/.github/workflows/pull-request-build-lint-web-apps.yml index 7ddaceb796..15d296d6a5 100644 --- a/.github/workflows/pull-request-build-lint-web-apps.yml +++ b/.github/workflows/pull-request-build-lint-web-apps.yml @@ -27,6 +27,7 @@ jobs: env: TURBO_SCM_BASE: ${{ github.event.pull_request.base.sha }} TURBO_SCM_HEAD: ${{ github.sha }} + NODE_OPTIONS: --max-old-space-size=4096 steps: - name: Checkout code uses: actions/checkout@v4 diff --git a/.npmrc b/.npmrc index c5234f9ce1..a812e420aa 100644 --- a/.npmrc +++ b/.npmrc @@ -45,15 +45,3 @@ prefer-frozen-lockfile = true # Use isolated linker (best compatibility with Node ecosystem tools) node-linker = isolated - - -# ------------------------------ -# Hoisting Strategy -# ------------------------------ - -# Hoist commonly used tools to the root to prevent duplicates and speed up resolution -public-hoist-pattern[] = typescript -public-hoist-pattern[] = eslint -public-hoist-pattern[] = *@plane/* -public-hoist-pattern[] = vite -public-hoist-pattern[] = turbo diff --git a/apps/admin/app/(all)/(dashboard)/authentication/github/mobile-form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/github/mobile-form.tsx index 460bc626dc..de30e964e0 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/github/mobile-form.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/github/mobile-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { isEmpty } from "lodash-es"; import { Smartphone } from "lucide-react"; @@ -10,7 +8,7 @@ import { CodeBlock } from "@/components/common/code-block"; import type { TCopyField } from "@/components/common/copy-field"; import { CopyField } from "@/components/common/copy-field"; -export const GithubMobileForm: FC = () => { +export function GithubMobileForm() { const originURL = !isEmpty(API_BASE_URL) ? API_BASE_URL : typeof window !== "undefined" ? window.location.origin : ""; const GITHUB_MOBILE_SERVICE_DETAILS: TCopyField[] = [ @@ -48,4 +46,4 @@ export const GithubMobileForm: FC = () => { ); -}; +} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/google/mobile-form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/google/mobile-form.tsx index 08db12f0f0..e5e732e555 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/google/mobile-form.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/google/mobile-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { isEmpty } from "lodash-es"; import { Smartphone } from "lucide-react"; @@ -10,7 +8,7 @@ import { CodeBlock } from "@/components/common/code-block"; import type { TCopyField } from "@/components/common/copy-field"; import { CopyField } from "@/components/common/copy-field"; -export const GoogleMobileForm: FC = () => { +export function GoogleMobileForm() { const originURL = !isEmpty(API_BASE_URL) ? API_BASE_URL : typeof window !== "undefined" ? window.location.origin : ""; const GOOGLE_MOBILE_SERVICE_DETAILS: TCopyField[] = [ @@ -48,4 +46,4 @@ export const GoogleMobileForm: FC = () => { ); -}; +} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/oidc/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/oidc/form.tsx index 65e3b4424e..3c23e9a52a 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/oidc/form.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/oidc/form.tsx @@ -24,7 +24,7 @@ type Props = { type OIDCConfigFormValues = Record; -export const InstanceOIDCConfigForm: FC = (props) => { +export function InstanceOIDCConfigForm(props: Props) { const { config } = props; // states const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false); @@ -293,4 +293,4 @@ export const InstanceOIDCConfigForm: FC = (props) => { ); -}; +} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/oidc/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/oidc/page.tsx index 47cac9c34e..dd71345d95 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/oidc/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/oidc/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -19,7 +17,7 @@ import { useInstanceFlag } from "@/plane-admin/hooks/store/use-instance-flag"; import type { Route } from "./+types/page"; import { InstanceOIDCConfigForm } from "./form"; -const InstanceOIDCAuthenticationPage = observer>(() => { +const InstanceOIDCAuthenticationPage = observer(function InstanceOIDCAuthenticationPage(_props: Route.ComponentProps) { // state const [isSubmitting, setIsSubmitting] = useState(false); // store diff --git a/apps/admin/app/(all)/(dashboard)/authentication/saml/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/saml/form.tsx index c01509e07d..7f54702526 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/saml/form.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/saml/form.tsx @@ -26,7 +26,7 @@ type Props = { type SAMLConfigFormValues = Record; -export const InstanceSAMLConfigForm: FC = (props) => { +export function InstanceSAMLConfigForm(props: Props) { const { config } = props; // states const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false); @@ -301,4 +301,4 @@ export const InstanceSAMLConfigForm: FC = (props) => { ); -}; +} diff --git a/apps/admin/app/(all)/(dashboard)/authentication/saml/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/saml/page.tsx index 5aac096fac..f9c61172e0 100644 --- a/apps/admin/app/(all)/(dashboard)/authentication/saml/page.tsx +++ b/apps/admin/app/(all)/(dashboard)/authentication/saml/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -19,7 +17,7 @@ import { useInstanceFlag } from "@/plane-admin/hooks/store/use-instance-flag"; import type { Route } from "./+types/page"; import { InstanceSAMLConfigForm } from "./form"; -const InstanceSAMLAuthenticationPage = observer>(() => { +const InstanceSAMLAuthenticationPage = observer(function InstanceSAMLAuthenticationPage(_props: Route.ComponentProps) { // state const [isSubmitting, setIsSubmitting] = useState(false); // store diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx index d4c06a630e..8af5a6e26a 100644 --- a/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx +++ b/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx @@ -11,7 +11,7 @@ import { cn } from "@plane/utils"; // hooks import { useInstance, useTheme } from "@/hooks/store"; // assets -// eslint-disable-next-line import/order + import packageJson from "package.json"; const helpOptions = [ diff --git a/apps/admin/app/(all)/(home)/auth-helpers.tsx b/apps/admin/app/(all)/(home)/auth-helpers.tsx index 504bc7cd1a..c079759a4b 100644 --- a/apps/admin/app/(all)/(home)/auth-helpers.tsx +++ b/apps/admin/app/(all)/(home)/auth-helpers.tsx @@ -26,7 +26,7 @@ export enum EErrorAlertType { } const errorCodeMessages: { - [key in EAdminAuthErrorCodes]: { title: string; message: (email?: string | undefined) => React.ReactNode }; + [key in EAdminAuthErrorCodes]: { title: string; message: (email?: string) => React.ReactNode }; } = { // admin [EAdminAuthErrorCodes.ADMIN_ALREADY_EXIST]: { @@ -79,14 +79,11 @@ const errorCodeMessages: { }, [EAdminAuthErrorCodes.ADMIN_USER_DEACTIVATED]: { title: `User account deactivated`, - message: () => `User account deactivated. Please contact ${!!SUPPORT_EMAIL ? SUPPORT_EMAIL : "administrator"}.`, + message: () => `User account deactivated. Please contact ${SUPPORT_EMAIL ? SUPPORT_EMAIL : "administrator"}.`, }, }; -export const authErrorHandler = ( - errorCode: EAdminAuthErrorCodes, - email?: string | undefined -): TAdminAuthErrorInfo | undefined => { +export const authErrorHandler = (errorCode: EAdminAuthErrorCodes, email?: string): TAdminAuthErrorInfo | undefined => { const bannerAlertErrorCodes = [ EAdminAuthErrorCodes.ADMIN_ALREADY_EXIST, EAdminAuthErrorCodes.REQUIRED_ADMIN_EMAIL_PASSWORD_FIRST_NAME, diff --git a/apps/admin/app/entry.client.tsx b/apps/admin/app/entry.client.tsx index 82ea2d9381..9cf1c32deb 100644 --- a/apps/admin/app/entry.client.tsx +++ b/apps/admin/app/entry.client.tsx @@ -1,4 +1,3 @@ -/* eslint-disable import/order */ import * as Sentry from "@sentry/react-router"; import { startTransition, StrictMode } from "react"; import { hydrateRoot } from "react-dom/client"; diff --git a/apps/admin/ce/components/common/upgrade-button.tsx b/apps/admin/ce/components/common/upgrade-button.tsx index 6ef0334e61..51b6eb6c4d 100644 --- a/apps/admin/ce/components/common/upgrade-button.tsx +++ b/apps/admin/ce/components/common/upgrade-button.tsx @@ -11,6 +11,7 @@ export function UpgradeButton() { href="https://plane.so/pricing?mode=self-hosted" target="_blank" className={cn(getButtonStyling("primary", "sm"))} + rel="noreferrer" > Upgrade diff --git a/apps/admin/core/components/workspace/list-item.tsx b/apps/admin/core/components/workspace/list-item.tsx index 31252a3157..01855eec84 100644 --- a/apps/admin/core/components/workspace/list-item.tsx +++ b/apps/admin/core/components/workspace/list-item.tsx @@ -24,6 +24,7 @@ export const WorkspaceListItem = observer(function WorkspaceListItem({ workspace 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" + rel="noreferrer" >
TIn }, ]; -export const AuthenticationModes: React.FC = observer((props) => { +export const AuthenticationModes = observer(function AuthenticationModes(props: TAuthenticationModeProps) { const { disabled, updateConfig } = props; // next-themes const { resolvedTheme } = useTheme(); diff --git a/apps/admin/ee/components/authentication/oidc-config.tsx b/apps/admin/ee/components/authentication/oidc-config.tsx index 1341fde2fd..dd8dfd5d76 100644 --- a/apps/admin/ee/components/authentication/oidc-config.tsx +++ b/apps/admin/ee/components/authentication/oidc-config.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -18,7 +16,7 @@ type Props = { updateConfig: (key: TInstanceEnterpriseAuthenticationMethodKeys, value: string) => void; }; -export const OIDCConfiguration: React.FC = observer((props) => { +export const OIDCConfiguration = observer(function OIDCConfiguration(props: Props) { const { disabled, updateConfig } = props; // store const { formattedConfig } = useInstance(); diff --git a/apps/admin/ee/components/authentication/saml-attribute-mapping-table.tsx b/apps/admin/ee/components/authentication/saml-attribute-mapping-table.tsx index 276c65b6ee..0098b3df6d 100644 --- a/apps/admin/ee/components/authentication/saml-attribute-mapping-table.tsx +++ b/apps/admin/ee/components/authentication/saml-attribute-mapping-table.tsx @@ -1,28 +1,30 @@ -export const SAMLAttributeMappingTable = () => ( - - - - - - - - - - - - - - - - - - - - - - - - - -
IdPPlane
Name ID formatemailAddress
first_nameuser.firstName
last_nameuser.lastName
emailuser.email
-); +export function SAMLAttributeMappingTable() { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + +
IdPPlane
Name ID formatemailAddress
first_nameuser.firstName
last_nameuser.lastName
emailuser.email
+ ); +} diff --git a/apps/admin/ee/components/authentication/saml-config.tsx b/apps/admin/ee/components/authentication/saml-config.tsx index 4897dc131d..a303ba370a 100644 --- a/apps/admin/ee/components/authentication/saml-config.tsx +++ b/apps/admin/ee/components/authentication/saml-config.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -18,7 +16,7 @@ type Props = { updateConfig: (key: TInstanceEnterpriseAuthenticationMethodKeys, value: string) => void; }; -export const SAMLConfiguration: React.FC = observer((props) => { +export const SAMLConfiguration = observer(function SAMLConfiguration(props: Props) { const { disabled, updateConfig } = props; // store const { formattedConfig } = useInstance(); diff --git a/apps/admin/ee/components/common/upgrade-button.tsx b/apps/admin/ee/components/common/upgrade-button.tsx index 6d712d5a1f..65e7c74871 100644 --- a/apps/admin/ee/components/common/upgrade-button.tsx +++ b/apps/admin/ee/components/common/upgrade-button.tsx @@ -1,12 +1,10 @@ -"use client"; - import React from "react"; // plane internal packages import { WEB_BASE_URL } from "@plane/constants"; import { Button } from "@plane/propel/button"; import { AlertModalCore } from "@plane/ui"; -export const UpgradeButton: React.FC = () => { +export function UpgradeButton() { // states const [isActivationModalOpen, setIsActivationModalOpen] = React.useState(false); // derived values @@ -36,4 +34,4 @@ export const UpgradeButton: React.FC = () => { ); -}; +} diff --git a/apps/live/src/controllers/admin.controller.ts b/apps/live/src/controllers/admin.controller.ts index 1954cc9f0d..5736b0d62e 100644 --- a/apps/live/src/controllers/admin.controller.ts +++ b/apps/live/src/controllers/admin.controller.ts @@ -88,7 +88,7 @@ export class AdminController { // Validate and map error code to ForceCloseReason let reason: ForceCloseReason; if (isValidForceCloseReason(errorCode)) { - reason = errorCode as ForceCloseReason; + reason = errorCode; } else { logger.warn(`[ADMIN] Invalid error code "${errorCode}", defaulting to ADMIN_REQUEST`); reason = ForceCloseReason.ADMIN_REQUEST; diff --git a/apps/live/src/controllers/broadcast.controller.ts b/apps/live/src/controllers/broadcast.controller.ts index cca3f9e8c1..462bf0330f 100644 --- a/apps/live/src/controllers/broadcast.controller.ts +++ b/apps/live/src/controllers/broadcast.controller.ts @@ -168,7 +168,7 @@ export class BroadcastController { if (matchingEmbeds.length > 0) { matchingEmbeds.forEach(({ parent, indexInParent }) => { const newPageEmbedNode = new Y.XmlElement("pageEmbedComponent"); - newPageEmbedNode.setAttribute("entity_identifier", data.new_page_id as string); + newPageEmbedNode.setAttribute("entity_identifier", data.new_page_id); newPageEmbedNode.setAttribute("entity_name", "sub_page"); newPageEmbedNode.setAttribute("id", uuidv4()); newPageEmbedNode.setAttribute("workspace_identifier", workspace_slug || ""); diff --git a/apps/live/src/extensions/force-close-handler.ts b/apps/live/src/extensions/force-close-handler.ts index 5a474cdf61..19c06fe17f 100644 --- a/apps/live/src/extensions/force-close-handler.ts +++ b/apps/live/src/extensions/force-close-handler.ts @@ -12,7 +12,7 @@ export class ForceCloseHandler implements Extension { priority = 999; async onConfigure({ instance }: onConfigurePayload) { - const redisExt = instance.configuration.extensions.find((ext) => ext instanceof Redis) as Redis | undefined; + const redisExt = instance.configuration.extensions.find((ext) => ext instanceof Redis); if (!redisExt) { logger.warn("[FORCE_CLOSE_HANDLER] Redis extension not found"); @@ -149,7 +149,7 @@ export const forceCloseDocumentAcrossServers = async ( logger.info(`[FORCE_CLOSE] Closed ${closedCount}/${connectionsBefore} local connections`); // STEP 4: BROADCAST TO OTHER SERVERS - const redisExt = instance.configuration.extensions.find((ext) => ext instanceof Redis) as Redis | undefined; + const redisExt = instance.configuration.extensions.find((ext) => ext instanceof Redis); if (redisExt) { const commandData: ForceCloseCommandData = { diff --git a/apps/live/src/lib/markdown-parser.ts/index.ts b/apps/live/src/lib/markdown-parser.ts/index.ts index 4f2cc8731c..dbae3fd342 100644 --- a/apps/live/src/lib/markdown-parser.ts/index.ts +++ b/apps/live/src/lib/markdown-parser.ts/index.ts @@ -34,24 +34,21 @@ function addSpacesToCheckboxes() { child.properties && child.properties["data-type"] === "taskItem" ) { - const liElement = child as HASTElement; + const liElement = child; // Find the label and div elements - const label = liElement.children?.find( - (c) => c.type === "element" && (c as HASTElement).tagName === "label" - ) as HASTElement | undefined; + const label = liElement.children?.find((c) => c.type === "element" && c.tagName === "label") as + | HASTElement + | undefined; - const contentDiv = liElement.children?.find( - (c) => c.type === "element" && (c as HASTElement).tagName === "div" - ) as HASTElement | undefined; + const contentDiv = liElement.children?.find((c) => c.type === "element" && c.tagName === "div") as + | HASTElement + | undefined; if (label && contentDiv) { // Find the checkbox input const checkbox = label.children?.find( - (c) => - c.type === "element" && - (c as HASTElement).tagName === "input" && - (c as HASTElement).properties?.type === "checkbox" + (c) => c.type === "element" && c.tagName === "input" && c.properties?.type === "checkbox" ) as HASTElement | undefined; if (checkbox) { @@ -59,9 +56,9 @@ function addSpacesToCheckboxes() { const textContent: ElementContent[] = []; if (contentDiv.children) { for (const child of contentDiv.children) { - if (child.type === "element" && (child as HASTElement).tagName === "p") { + if (child.type === "element" && child.tagName === "p") { // Unwrap paragraph - add its children directly - const pElement = child as HASTElement; + const pElement = child; if (pElement.children) { textContent.push(...pElement.children); } @@ -81,7 +78,7 @@ function addSpacesToCheckboxes() { } } } else if (child && child.type === "element") { - helper(child as HASTElement); + helper(child); } } }; diff --git a/apps/live/src/lib/stateless.ts b/apps/live/src/lib/stateless.ts index c01c34ad04..995d99c6ba 100644 --- a/apps/live/src/lib/stateless.ts +++ b/apps/live/src/lib/stateless.ts @@ -11,7 +11,7 @@ import { serverAgentManager } from "@/agents/server-agent"; * @param param0 */ export const onStateless = async ({ payload, document, connection }: onStatelessPayload) => { - const payloadStr = payload as string; + const payloadStr = payload; // Function to safely parse JSON without throwing exceptions const safeJsonParse = (str: string) => { @@ -26,7 +26,7 @@ export const onStateless = async ({ payload, document, connection }: onStateless const documentEvent = DocumentCollaborativeEvents[payload as TDocumentEventsServer]?.client; if (documentEvent) { - const eventType = documentEvent as keyof EventToPayloadMap; + const eventType = documentEvent; let eventData: Partial = { user_id: connection.context.userId, diff --git a/apps/live/src/start.ts b/apps/live/src/start.ts index 7929b9b9bc..ced70a209b 100644 --- a/apps/live/src/start.ts +++ b/apps/live/src/start.ts @@ -1,4 +1,3 @@ -// eslint-disable-next-line import/order import { setupSentry } from "./instrument"; setupSentry(); diff --git a/apps/live/src/utils/broadcast-error.ts b/apps/live/src/utils/broadcast-error.ts index ff1c07fc78..d9dbbc485b 100644 --- a/apps/live/src/utils/broadcast-error.ts +++ b/apps/live/src/utils/broadcast-error.ts @@ -1,7 +1,7 @@ import type { Hocuspocus } from "@hocuspocus/server"; import { createRealtimeEvent } from "@plane/editor"; import { logger } from "@plane/logger"; -import type { FetchPayloadWithContext, StorePayloadWithContext } from "@/types"; +import type { HocusPocusServerContext } from "@/types"; import { broadcastMessageToPage } from "./broadcast-message"; // Helper to broadcast error to frontend @@ -10,7 +10,7 @@ export const broadcastError = async ( pageId: string, errorMessage: string, errorType: "fetch" | "store", - context: FetchPayloadWithContext["context"] | StorePayloadWithContext["context"], + context: HocusPocusServerContext, errorCode?: "content_too_large" | "page_locked" | "page_archived", shouldDisconnect?: boolean ) => { diff --git a/apps/silo/src/apps/asana-importer/migrator/transformers/etl.ts b/apps/silo/src/apps/asana-importer/migrator/transformers/etl.ts index 03a287ae43..cef8c695a5 100644 --- a/apps/silo/src/apps/asana-importer/migrator/transformers/etl.ts +++ b/apps/silo/src/apps/asana-importer/migrator/transformers/etl.ts @@ -130,5 +130,5 @@ export const getTransformedCustomFieldValues = ( export const getTransformedComments = (entities: AsanaEntity): Partial[] => { const issueComments = entities.comments.map((comment) => transformComments(comment, entities.users)); - return issueComments.filter(Boolean) as Partial[]; + return issueComments.filter(Boolean); }; diff --git a/apps/silo/src/apps/clickup-importer/migrator/clickup-additional.migrator.ts b/apps/silo/src/apps/clickup-importer/migrator/clickup-additional.migrator.ts index f613467e6a..6aaa402a7b 100644 --- a/apps/silo/src/apps/clickup-importer/migrator/clickup-additional.migrator.ts +++ b/apps/silo/src/apps/clickup-importer/migrator/clickup-additional.migrator.ts @@ -131,7 +131,7 @@ export class ClickUpAdditionalDataMigrator extends TaskHandler { * Sometimes, we're getting multiple messages being injected for the same page. * We should lock the page to prevent same page being pulled multiple times. */ - const lock = new Lock(this.store!, { + const lock = new Lock(this.store, { type: "custom", lockKey: `clickup_pull_${job.id}_${job.config.team.id}_${job.config.folder.id}_${page}`, ttl: 15 * 60, // 15 minutes TTL diff --git a/apps/silo/src/apps/engine/controllers/app.controller.ts b/apps/silo/src/apps/engine/controllers/app.controller.ts index 51226f3f2a..5766daeba4 100644 --- a/apps/silo/src/apps/engine/controllers/app.controller.ts +++ b/apps/silo/src/apps/engine/controllers/app.controller.ts @@ -57,7 +57,7 @@ export class AppController { const { workspaceId } = req.params; try { const allConnections = await integrationConnectionHelper.getWorkspaceConnections({ - workspace_id: workspaceId as string, + workspace_id: workspaceId, }); // Extract unique connection types diff --git a/apps/silo/src/apps/github/controllers/index.ts b/apps/silo/src/apps/github/controllers/index.ts index dc7f030a6f..cd4665112f 100644 --- a/apps/silo/src/apps/github/controllers/index.ts +++ b/apps/silo/src/apps/github/controllers/index.ts @@ -403,7 +403,7 @@ export default class GithubController { const { github_code, encoded_github_state } = githubState; - const authState: GithubUserAuthState = JSON.parse(Buffer.from(encoded_github_state as string, "base64").toString()); + const authState: GithubUserAuthState = JSON.parse(Buffer.from(encoded_github_state, "base64").toString()); let redirectUri = `${env.APP_BASE_URL}/${authState.workspace_slug}/settings/integrations/github/`; if (authState.profile_redirect) { @@ -412,7 +412,7 @@ export default class GithubController { try { const { response, state } = await githubAuthService.getUserAccessToken({ - code: github_code as string, + code: github_code, state: authState, }); diff --git a/apps/silo/src/apps/github/helpers/helpers.ts b/apps/silo/src/apps/github/helpers/helpers.ts index 3a77917226..7f726874d3 100644 --- a/apps/silo/src/apps/github/helpers/helpers.ts +++ b/apps/silo/src/apps/github/helpers/helpers.ts @@ -21,7 +21,7 @@ export const getConnDetailsForGithubToPlaneSync = async (props: { const { wsAdminCredentials: credentials, isEnterprise, type, repositoryId, planeProjectId } = props; // Get the workspace connection for the installation const workspaceConnection = await apiClient.workspaceConnection.listWorkspaceConnections({ - workspace_id: credentials.workspace_id!, + workspace_id: credentials.workspace_id, credential_id: credentials.id, }); @@ -30,7 +30,7 @@ export const getConnDetailsForGithubToPlaneSync = async (props: { } const entityConnections = await apiClient.workspaceEntityConnection.listWorkspaceEntityConnections({ - workspace_id: credentials.workspace_id!, + workspace_id: credentials.workspace_id, entity_type: isEnterprise ? E_INTEGRATION_KEYS.GITHUB_ENTERPRISE : E_INTEGRATION_KEYS.GITHUB, type: type, }); @@ -87,9 +87,9 @@ export const getConnDetailsForPlaneToGithubSync = async ( const credentials = await apiClient.workspaceCredential.getWorkspaceCredential(workspaceConnection.credential_id); return { - credentials: credentials as TWorkspaceCredential, - entityConnection: entityConnection as TGithubEntityConnection, - workspaceConnection: workspaceConnection as TGithubWorkspaceConnection, + credentials: credentials, + entityConnection: entityConnection, + workspaceConnection: workspaceConnection, }; }; diff --git a/apps/silo/src/apps/github/helpers/transform.ts b/apps/silo/src/apps/github/helpers/transform.ts index ef47c473b4..17114855fa 100644 --- a/apps/silo/src/apps/github/helpers/transform.ts +++ b/apps/silo/src/apps/github/helpers/transform.ts @@ -245,7 +245,7 @@ export const transformGitHubComment = async ( githubService, }); - comment_html = replaceIssueNumber(comment_html!, repository); + comment_html = replaceIssueNumber(comment_html, repository); comment_html = replaceMentionedGhUsers(comment_html, workspaceSlug, userMap, planeUsers); return { diff --git a/apps/silo/src/apps/github/workers/github/event-handlers/installation.handler.ts b/apps/silo/src/apps/github/workers/github/event-handlers/installation.handler.ts index 7572e7e99e..ed70b8b7de 100644 --- a/apps/silo/src/apps/github/workers/github/event-handlers/installation.handler.ts +++ b/apps/silo/src/apps/github/workers/github/event-handlers/installation.handler.ts @@ -15,7 +15,7 @@ type GithubWebhookInstallationDeleted = GithubWebhookPayload["webhook-installati export const handleInstallationEvents = async (action: string, data: unknown): Promise => { switch (action) { case "deleted": { - await handleInstallationDeletion(data as unknown as GithubWebhookInstallationDeleted); + await handleInstallationDeletion(data as GithubWebhookInstallationDeleted); return true; } default: { diff --git a/apps/silo/src/apps/github/workers/github/event-handlers/issue-comment.handler.ts b/apps/silo/src/apps/github/workers/github/event-handlers/issue-comment.handler.ts index 99880d059a..2b1dd14b60 100644 --- a/apps/silo/src/apps/github/workers/github/event-handlers/issue-comment.handler.ts +++ b/apps/silo/src/apps/github/workers/github/event-handlers/issue-comment.handler.ts @@ -71,7 +71,7 @@ export const syncCommentWithPlane = async ( const { workspaceConnection, entityConnectionForRepository: entityConnection } = await getConnDetailsForGithubToPlaneSync({ - wsAdminCredentials: wsAdminCredentials as TWorkspaceCredential, + wsAdminCredentials: wsAdminCredentials, type: EGithubEntityConnectionType.PROJECT_ISSUE_SYNC, repositoryId: data.repository.id.toString(), isEnterprise: data.isEnterprise, @@ -91,11 +91,7 @@ export const syncCommentWithPlane = async ( let planeClient: PlaneClient = await getPlaneAPIClient(wsAdminCredentials, ghIntegrationKey); - const ghService = getGithubService( - workspaceConnection as TGithubWorkspaceConnection, - data.installation?.id.toString(), - data.isEnterprise - ); + const ghService = getGithubService(workspaceConnection, data.installation?.id.toString(), data.isEnterprise); const commentHtml = await ghService.getCommentHtml( data.repository.owner.login, data.repository.name, diff --git a/apps/silo/src/apps/github/workers/github/event-handlers/issue.handler.ts b/apps/silo/src/apps/github/workers/github/event-handlers/issue.handler.ts index 2a29444dbd..0cee70c223 100644 --- a/apps/silo/src/apps/github/workers/github/event-handlers/issue.handler.ts +++ b/apps/silo/src/apps/github/workers/github/event-handlers/issue.handler.ts @@ -62,7 +62,7 @@ export const syncIssueWithPlane = async (store: Store, action: IssueWebhookActio const { workspaceConnection, entityConnectionForRepository: entityConnection } = await getConnDetailsForGithubToPlaneSync({ - wsAdminCredentials: wsAdminCredentials as TWorkspaceCredential, + wsAdminCredentials: wsAdminCredentials, isEnterprise: data.isEnterprise, type: EGithubEntityConnectionType.PROJECT_ISSUE_SYNC, repositoryId: data.repositoryId.toString(), @@ -77,11 +77,7 @@ export const syncIssueWithPlane = async (store: Store, action: IssueWebhookActio let issue: ExIssue | null = null; - const ghService = getGithubService( - workspaceConnection as TGithubWorkspaceConnection, - data.installationId.toString(), - data.isEnterprise - ); + const ghService = getGithubService(workspaceConnection, data.installationId.toString(), data.isEnterprise); const ghIssue = await ghService.getIssue(data.owner, data.repositoryName, Number(data.issueNumber)); const bodyHtml = await ghService.getBodyHtml(data.owner, data.repositoryName, Number(data.issueNumber)); // replace the issue body with the html body @@ -181,7 +177,7 @@ export const syncIssueWithPlane = async (store: Store, action: IssueWebhookActio return l.id; } }) - .filter((l) => l !== undefined) as string[]; + .filter((l) => l !== undefined); } if (planeIssue.created_by) { diff --git a/apps/silo/src/apps/github/workers/github/event-handlers/pull-request.handler.ts b/apps/silo/src/apps/github/workers/github/event-handlers/pull-request.handler.ts index ce83a362c5..336a733862 100644 --- a/apps/silo/src/apps/github/workers/github/event-handlers/pull-request.handler.ts +++ b/apps/silo/src/apps/github/workers/github/event-handlers/pull-request.handler.ts @@ -12,7 +12,7 @@ import { getPlaneAPIClient } from "@/helpers/plane-api-client"; import { PullRequestBehaviour } from "@/lib/behaviours"; export const handlePullRequestEvents = async (action: PullRequestWebhookActions, data: unknown) => { - await handlePullRequestOpened(data as unknown as GithubPullRequestDedupPayload); + await handlePullRequestOpened(data as GithubPullRequestDedupPayload); return true; }; @@ -44,7 +44,7 @@ const handlePullRequestOpened = async (data: GithubPullRequestDedupPayload) => { // Get the workspace connection for the installation // get all entity connections for the installation and do pr automation on them const { workspaceConnection, allEntityConnections } = await getConnDetailsForGithubToPlaneSync({ - wsAdminCredentials: wsAdminCredentials as TWorkspaceCredential, + wsAdminCredentials: wsAdminCredentials, type: EGithubEntityConnectionType.PROJECT_PR_AUTOMATION, isEnterprise: data.isEnterprise, }); @@ -55,7 +55,7 @@ const handlePullRequestOpened = async (data: GithubPullRequestDedupPayload) => { // Create the pull request service based on the type of integration let pullRequestService: GithubIntegrationService; if (data.isEnterprise) { - const appConfig = (workspaceConnection as TGithubWorkspaceConnection)?.connection_data?.appConfig; + const appConfig = workspaceConnection?.connection_data?.appConfig; if (!appConfig) { logger.error("[PULL-REQUEST] GitHub Enterprise app config not found", { installationId: data.installationId, diff --git a/apps/silo/src/apps/github/workers/plane/event-handlers/issue-comment.handler.ts b/apps/silo/src/apps/github/workers/plane/event-handlers/issue-comment.handler.ts index 43ec9776c4..3537d43755 100644 --- a/apps/silo/src/apps/github/workers/plane/event-handlers/issue-comment.handler.ts +++ b/apps/silo/src/apps/github/workers/plane/event-handlers/issue-comment.handler.ts @@ -107,11 +107,7 @@ const handleCommentSync = async (store: Store, payload: PlaneWebhookPayload) => return; } - const githubService = getGithubService( - workspaceConnection as TGithubWorkspaceConnection, - credentials.source_access_token, - payload.isEnterprise - ); + const githubService = getGithubService(workspaceConnection, credentials.source_access_token, payload.isEnterprise); const comment = await planeClient.issueComment.getComment( entityConnection.workspace_slug, @@ -188,11 +184,7 @@ const createOrUpdateGitHubComment = async ( let userGithubService = githubService; if (userCredential?.source_access_token) { - userGithubService = getGithubUserService( - workspaceConnection as TGithubWorkspaceConnection, - userCredential.source_access_token, - isEnterprise - ); + userGithubService = getGithubUserService(workspaceConnection, userCredential.source_access_token, isEnterprise); } if (comment.external_id && comment.external_source && comment.external_source === ghIntegrationKey) { diff --git a/apps/silo/src/apps/github/workers/plane/event-handlers/issue.handler.ts b/apps/silo/src/apps/github/workers/plane/event-handlers/issue.handler.ts index bc5666964a..04bde60065 100644 --- a/apps/silo/src/apps/github/workers/plane/event-handlers/issue.handler.ts +++ b/apps/silo/src/apps/github/workers/plane/event-handlers/issue.handler.ts @@ -77,11 +77,7 @@ const handleIssueSync = async (store: Store, payload: PlaneWebhookPayload) => { const planeClient = await getPlaneAPIClient(credentials, ghIntegrationKey); // Create or update issue in GitHub - const githubService = getGithubService( - workspaceConnection as TGithubWorkspaceConnection, - credentials.source_access_token, - payload.isEnterprise - ); + const githubService = getGithubService(workspaceConnection, credentials.source_access_token, payload.isEnterprise); const issue = await planeClient.issue.getIssue(entityConnection.workspace_slug, payload.project, payload.id); @@ -185,11 +181,7 @@ const createOrUpdateGitHubIssue = async ( // If the user has a credential, create a new github service for the user if (userCredential?.source_access_token) { - githubUserService = getGithubUserService( - workspaceConnection as TGithubWorkspaceConnection, - userCredential.source_access_token, - isEnterprise - ); + githubUserService = getGithubUserService(workspaceConnection, userCredential.source_access_token, isEnterprise); } // If the issue has already been created with the external source as GITHUB, update the issue diff --git a/apps/silo/src/apps/gitlab-enterprise/controllers/index.ts b/apps/silo/src/apps/gitlab-enterprise/controllers/index.ts index 615fd7233d..33e7400234 100644 --- a/apps/silo/src/apps/gitlab-enterprise/controllers/index.ts +++ b/apps/silo/src/apps/gitlab-enterprise/controllers/index.ts @@ -217,7 +217,7 @@ export default class GitlabEnterpriseController { }); } - const appConfig = wsConnection.connection_data.appConfig as TGitlabAppConfig; + const appConfig = wsConnection.connection_data.appConfig; const gitlabClientService = await getGitlabClientService( entityConnection.workspace_id, diff --git a/apps/silo/src/apps/gitlab/controller/index.ts b/apps/silo/src/apps/gitlab/controller/index.ts index 73be710db9..e12b2484cc 100644 --- a/apps/silo/src/apps/gitlab/controller/index.ts +++ b/apps/silo/src/apps/gitlab/controller/index.ts @@ -146,9 +146,7 @@ export default class GitlabController { const { gitlab_code, encoded_gitlab_state } = gitlabState; - const gitlabAuthState: GitLabAuthorizeState = JSON.parse( - Buffer.from(encoded_gitlab_state as string, "base64").toString() - ); + const gitlabAuthState: GitLabAuthorizeState = JSON.parse(Buffer.from(encoded_gitlab_state, "base64").toString()); const redirectUri = `${env.APP_BASE_URL}/${gitlabAuthState.workspace_slug}/settings/integrations/gitlab/`; try { @@ -159,7 +157,7 @@ export default class GitlabController { }); const { response: token, state: authState } = await gitlabAuthService.getAccessToken({ - code: gitlab_code as string, + code: gitlab_code, state: encoded_gitlab_state, }); diff --git a/apps/silo/src/apps/gitlab/workers/gitlab/handlers/merge-request.handler.ts b/apps/silo/src/apps/gitlab/workers/gitlab/handlers/merge-request.handler.ts index d739e96a64..eba5f0f796 100644 --- a/apps/silo/src/apps/gitlab/workers/gitlab/handlers/merge-request.handler.ts +++ b/apps/silo/src/apps/gitlab/workers/gitlab/handlers/merge-request.handler.ts @@ -48,7 +48,7 @@ export const handleMergeRequest = async (data: GitlabMergeRequestEvent) => { source_access_token: access_token, source_refresh_token: refresh_token, workspace_id: workspaceConnection.workspace_id, - user_id: credentials.user_id!, + user_id: credentials.user_id, }); }; diff --git a/apps/silo/src/apps/jira-importer/controllers/index.ts b/apps/silo/src/apps/jira-importer/controllers/index.ts index 8953eb3f6e..9a780a6df0 100644 --- a/apps/silo/src/apps/jira-importer/controllers/index.ts +++ b/apps/silo/src/apps/jira-importer/controllers/index.ts @@ -358,7 +358,7 @@ async function fetchJiraResources(axiosInstance: AxiosInstance, credentials: TWo if (isRetry) { throw new JiraApiError("Invalid access token", 401); } else { - return await refreshAndRetry(credentials.workspace_id!, credentials.user_id!, credentials, axiosInstance); + return await refreshAndRetry(credentials.workspace_id, credentials.user_id, credentials, axiosInstance); } } throw error; diff --git a/apps/silo/src/apps/jira-importer/helpers/migration-helpers.ts b/apps/silo/src/apps/jira-importer/helpers/migration-helpers.ts index 51163d9877..aae3c28b55 100644 --- a/apps/silo/src/apps/jira-importer/helpers/migration-helpers.ts +++ b/apps/silo/src/apps/jira-importer/helpers/migration-helpers.ts @@ -119,7 +119,7 @@ export const createJiraClient = ( isPAT: false, accessToken: credentials.source_access_token!, refreshToken: credentials.source_refresh_token!, - cloudId: job.config?.resource.id as string, + cloudId: job.config?.resource.id, refreshTokenFunc: jiraAuth.getRefreshToken.bind(jiraAuth), refreshTokenCallback: refreshTokenCallback, }); @@ -129,9 +129,9 @@ export const createJiraClient = ( } return new JiraService({ isPAT: true, - patToken: credentials.source_access_token!, + patToken: credentials.source_access_token, hostname: credentials.source_hostname, - userEmail: credentials.source_auth_email!, + userEmail: credentials.source_auth_email, }); } }; diff --git a/apps/silo/src/apps/jira-server-importer/helpers/migration-helpers.ts b/apps/silo/src/apps/jira-server-importer/helpers/migration-helpers.ts index 4d4f4e7d91..5b14577e71 100644 --- a/apps/silo/src/apps/jira-server-importer/helpers/migration-helpers.ts +++ b/apps/silo/src/apps/jira-server-importer/helpers/migration-helpers.ts @@ -98,7 +98,7 @@ export const createJiraClient = ( return new JiraV2Service({ email: credentials.source_auth_email, - patToken: credentials.source_access_token!, + patToken: credentials.source_access_token, hostname: credentials.source_hostname, authenticationType, }); diff --git a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/cycles.step.ts b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/cycles.step.ts index a23423877f..21151bf675 100644 --- a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/cycles.step.ts +++ b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/cycles.step.ts @@ -192,7 +192,7 @@ export class JiraCyclesStep implements IStep { // Store mappings: sprint_external_id -> cycle_id const mappings = created ?.map((c) => ({ - externalId: c.external_id!, + externalId: c.external_id, planeId: c.id, })) .filter((m) => m.externalId && m.planeId); diff --git a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-properties.step.ts b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-properties.step.ts index a663e0b918..087f36dd8f 100644 --- a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-properties.step.ts +++ b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-properties.step.ts @@ -273,7 +273,7 @@ export class JiraIssuePropertiesStep implements IStep { const mappings = properties .filter((prop) => prop.external_id && prop.id) .map((prop) => ({ - externalId: prop.external_id!, + externalId: prop.external_id, planeId: prop.id!, })); @@ -282,9 +282,9 @@ export class JiraIssuePropertiesStep implements IStep { // Store raw data including original Jira fields for options step const propertiesData: TIssuePropertiesData = properties.map((prop) => ({ id: prop.id!, - external_id: prop.external_id!, - display_name: prop.display_name!, - property_type: prop.property_type!, + external_id: prop.external_id, + display_name: prop.display_name, + property_type: prop.property_type, relation_type: prop.relation_type, })); diff --git a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-property-options.step.ts b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-property-options.step.ts index 6caecb9db5..e9d97aecd6 100644 --- a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-property-options.step.ts +++ b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-property-options.step.ts @@ -93,7 +93,7 @@ export class JiraIssuePropertyOptionsStep implements IStep { transformIssueFieldOptions({ resourceId, projectId: job.project_id, source: this.source }, option) ) || [] ) - .filter(Boolean) as Partial[]; + .filter(Boolean); logger.info(`[${job.id}] [${this.name}] Transformed options`, { jobId: job.id, @@ -245,7 +245,7 @@ export class JiraIssuePropertyOptionsStep implements IStep { const mappings = options .filter((option) => option.external_id && option.id) .map((option) => ({ - externalId: option.external_id!, + externalId: option.external_id, planeId: option.id!, })); diff --git a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-types.step.ts b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-types.step.ts index 4875ced6c3..bec6ee49e8 100644 --- a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-types.step.ts +++ b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/issue-types.step.ts @@ -316,7 +316,7 @@ export class JiraIssueTypesStep implements IStep { // Store mappings: external_id -> issue_type_id const validIssueTypes = issueTypes.filter((type) => type.external_id && type.id); const mappings = validIssueTypes.map((type) => ({ - externalId: type.external_id!, + externalId: type.external_id, planeId: type.id!, })); @@ -325,7 +325,7 @@ export class JiraIssueTypesStep implements IStep { // Store raw issue types data for dependent steps const issueTypesData: TIssueTypesData = validIssueTypes.map((type) => ({ id: type.id!, - external_id: type.external_id!, + external_id: type.external_id, name: type.name || "", is_default: type.is_default || false, is_epic: type.is_epic || false, diff --git a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/modules.step.ts b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/modules.step.ts index 5703ee9af9..ab45eacd54 100644 --- a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/modules.step.ts +++ b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/modules.step.ts @@ -134,7 +134,7 @@ export class JiraModulesStep implements IStep { .filter((module) => module.external_id && module.id) .map((module) => ({ externalId: module.external_id, - planeId: module.id!, + planeId: module.id, })); await storage.storeMapping(job.id, this.name, mappings); diff --git a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/users.step.ts b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/users.step.ts index 9c63c557c6..444d6adc9c 100644 --- a/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/users.step.ts +++ b/apps/silo/src/apps/jira-server-importer/v2/migrator/steps/shared/entities/users.step.ts @@ -275,13 +275,13 @@ export class JiraUsersStep implements IStep { ? [ { externalId: email, - planeId: user.id!, + planeId: user.id, }, ] : []), { externalId: displayName, - planeId: user.id!, + planeId: user.id, }, ]; }); diff --git a/apps/silo/src/apps/linear-importer/migrator/tranformers/etl.ts b/apps/silo/src/apps/linear-importer/migrator/tranformers/etl.ts index 441308241e..20dfc8e9df 100644 --- a/apps/silo/src/apps/linear-importer/migrator/tranformers/etl.ts +++ b/apps/silo/src/apps/linear-importer/migrator/tranformers/etl.ts @@ -136,7 +136,7 @@ export const getTransformedDocuments = async ( userMap: userMap, }; - const pages = await Promise.all(documents.map((document) => transformDocument(document as LinearDocument, options))); + const pages = await Promise.all(documents.map((document) => transformDocument(document, options))); return pages; }; @@ -173,5 +173,5 @@ export const getTransformedProjects = (job: TImportJob, entities: }; }); - return modules as Partial[]; + return modules; }; diff --git a/apps/silo/src/apps/notion-importer/worker/phases/base.ts b/apps/silo/src/apps/notion-importer/worker/phases/base.ts index b8d7f89033..71f17b172b 100644 --- a/apps/silo/src/apps/notion-importer/worker/phases/base.ts +++ b/apps/silo/src/apps/notion-importer/worker/phases/base.ts @@ -98,7 +98,7 @@ export abstract class NotionMigratorBase extends TaskHandler { return JSON.parse(credentials) as TWorkspaceCredential; } - const credentialsData = await getJobCredentials(job as TImportJob); + const credentialsData = await getJobCredentials(job); this.store.set(credentialsKey, JSON.stringify(credentialsData), 60 * 60 * 4); // 4 hours return credentialsData; } @@ -131,7 +131,7 @@ export abstract class NotionMigratorBase extends TaskHandler { // Get the services required for the migration const zipManager = await this.getZipManager(fileId); const client = await this.getPlaneClient(job as TImportJob); - const zipDriver = await this.getZipDriver(zipManager, type as EZipDriverType); + const zipDriver = await this.getZipDriver(zipManager, type); // Determine the current node to process let currentNode: TZipFileNode | undefined = data.node; @@ -233,7 +233,7 @@ export abstract class NotionMigratorBase extends TaskHandler { * @throws Error if access token is not available */ async getPlaneClient(job: TImportJob): Promise { - const credentials = await this.getCachesJobCredentials(job as TImportJob); + const credentials = await this.getCachesJobCredentials(job); if (!credentials?.target_access_token) { throw new Error(`Job ${job.id} has no target access token`); } diff --git a/apps/silo/src/apps/sentry/worker/handlers/handle-alert-event.ts b/apps/silo/src/apps/sentry/worker/handlers/handle-alert-event.ts index 3706427415..a745bbe2fc 100644 --- a/apps/silo/src/apps/sentry/worker/handlers/handle-alert-event.ts +++ b/apps/silo/src/apps/sentry/worker/handlers/handle-alert-event.ts @@ -124,11 +124,11 @@ export class SentryAlertHandler implements ISentryTaskHandler { const state = sentryEventAlert.data.issue_alert.settings.find((setting) => setting.name === "state"); if (assigneeIds?.value && !Array.isArray(assigneeIds.value)) { - assigneeIds.value = [assigneeIds.value as string]; + assigneeIds.value = [assigneeIds.value]; } if (labels?.value && !Array.isArray(labels.value)) { - labels.value = [labels.value as string]; + labels.value = [labels.value]; } return { diff --git a/apps/silo/src/apps/slack/controllers/index.ts b/apps/silo/src/apps/slack/controllers/index.ts index 95916f36f1..83679eb471 100644 --- a/apps/silo/src/apps/slack/controllers/index.ts +++ b/apps/silo/src/apps/slack/controllers/index.ts @@ -275,9 +275,7 @@ export default class SlackController { const { slack_code, encoded_slack_state } = slackState; - const authState = JSON.parse( - Buffer.from(encoded_slack_state as string, "base64").toString("utf-8") - ) as SlackUserAuthState; + const authState = JSON.parse(Buffer.from(encoded_slack_state, "base64").toString("utf-8")) as SlackUserAuthState; let redirectUri = `${env.APP_BASE_URL}/${authState.workspaceSlug}/settings/integrations/slack/`; if (authState.profileRedirect) { redirectUri = `${env.APP_BASE_URL}/${authState.workspaceSlug}/settings/account/connections/?workspaceId=${authState.workspaceId}`; @@ -285,7 +283,7 @@ export default class SlackController { try { const { state, response } = await slackAuth.getUserAuthToken({ - code: slack_code as string, + code: slack_code, state: authState, }); diff --git a/apps/silo/src/apps/slack/helpers/connection-details.ts b/apps/silo/src/apps/slack/helpers/connection-details.ts index ca01916d25..ca82d0fab9 100644 --- a/apps/silo/src/apps/slack/helpers/connection-details.ts +++ b/apps/silo/src/apps/slack/helpers/connection-details.ts @@ -44,8 +44,8 @@ export const getConnectionDetails = async ( // Create admin-based SlackService that we can use regardless of user credential state const refreshHandler = getRefreshCredentialHandler( workspaceConnection.workspace_id, - adminCredentials.user_id as string, - adminCredentials.target_access_token as string + adminCredentials.user_id, + adminCredentials.target_access_token ); const slackService = createSlackService( @@ -130,7 +130,7 @@ export const findPlaneUserId = async ( slackUser: { id: string; email?: string } ): Promise => { // Check for the userId in the workspace connection map - const config = workspaceConnection.config as TSlackWorkspaceConnectionConfig; + const config = workspaceConnection.config; let planeUser: string | null = null; @@ -190,7 +190,7 @@ export const updateUserMap = async ( slackUserId: string | null ): Promise => { const existingConfig = workspaceConnection.config || {}; - const existingUserMap = (existingConfig as TSlackWorkspaceConnectionConfig)?.userMap || []; + const existingUserMap = existingConfig?.userMap || []; // If both IDs are null, no changes needed if (!planeUserId && !slackUserId) return; // Filter out any existing mappings that match either ID being removed diff --git a/apps/silo/src/apps/slack/views/issue-modal-full.ts b/apps/silo/src/apps/slack/views/issue-modal-full.ts index f3f7b97abb..bcc568df7b 100644 --- a/apps/silo/src/apps/slack/views/issue-modal-full.ts +++ b/apps/silo/src/apps/slack/views/issue-modal-full.ts @@ -21,7 +21,6 @@ export type IssueModalViewFull = { }; export type IssueModalViewBlocks = ( - | StaticSelectInputBlock | StaticSelectInputBlock | PlainTextInputBlock | RichTextInputBlock diff --git a/apps/silo/src/etl/migrator/cycles.migrator.ts b/apps/silo/src/etl/migrator/cycles.migrator.ts index ac2e70a7f8..4b59eea412 100644 --- a/apps/silo/src/etl/migrator/cycles.migrator.ts +++ b/apps/silo/src/etl/migrator/cycles.migrator.ts @@ -73,7 +73,7 @@ export const createCycles = async ( workspaceSlug, projectId, cycleId, - cycleIssueIds.filter((issue: string | undefined) => issue !== undefined) as string[] + cycleIssueIds.filter((issue: string | undefined) => issue !== undefined) ); } catch (error) { logger.error(`[${jobId.slice(0, 7)}] Error while adding issues to the cycle: ${cycle.name}`, error); diff --git a/apps/silo/src/etl/migrator/issue-types/issue-property.migrator.ts b/apps/silo/src/etl/migrator/issue-types/issue-property.migrator.ts index c18cdaddb3..5450cd794e 100644 --- a/apps/silo/src/etl/migrator/issue-types/issue-property.migrator.ts +++ b/apps/silo/src/etl/migrator/issue-types/issue-property.migrator.ts @@ -82,7 +82,7 @@ export const createOrUpdateIssueProperties = async ( // Process all issue properties in batches of 5 const createdUpdatedIssueProperties = await processBatchPromises(issueProperties, processIssueProperty, 2); - return createdUpdatedIssueProperties.filter((property) => property !== undefined) as ExIssueProperty[]; + return createdUpdatedIssueProperties.filter((property) => property !== undefined); }; export const createOrUpdateIssuePropertiesOptions = async ( @@ -145,5 +145,5 @@ export const createOrUpdateIssuePropertiesOptions = async ( 2 ); - return createdUpdatedIssuePropertiesOptions.filter((option) => option !== undefined) as ExIssuePropertyOption[]; + return createdUpdatedIssuePropertiesOptions.filter((option) => option !== undefined); }; diff --git a/apps/silo/src/etl/migrator/issue-types/issue-type.migrator.ts b/apps/silo/src/etl/migrator/issue-types/issue-type.migrator.ts index 590ec351cb..6ceec82484 100644 --- a/apps/silo/src/etl/migrator/issue-types/issue-type.migrator.ts +++ b/apps/silo/src/etl/migrator/issue-types/issue-type.migrator.ts @@ -64,5 +64,5 @@ export const createOrUpdateIssueTypes = async (props: TCreateOrUpdateIssueTypes) const createdUpdatedIssueTypes = await processBatchPromises(issueTypes, createOrUpdateIssueType, 2); - return createdUpdatedIssueTypes.filter((issueType) => issueType !== undefined) as ExIssueType[]; + return createdUpdatedIssueTypes.filter((issueType) => issueType !== undefined); }; diff --git a/apps/silo/src/etl/migrator/issues.migrator.ts b/apps/silo/src/etl/migrator/issues.migrator.ts index 1125e003cb..1d340d19f5 100644 --- a/apps/silo/src/etl/migrator/issues.migrator.ts +++ b/apps/silo/src/etl/migrator/issues.migrator.ts @@ -61,13 +61,13 @@ export const createIssuesWithParent = async (payload: IssueWithParentPayload): P // If the parent issue is not found, then try to find the issue from // external id and source from the api try { - const parent = (await protect( + const parent = await protect( planeClient.issue.getIssueWithExternalId.bind(planeClient.issue), workspaceSlug, projectId, issue.parent, issue.external_source - )) as ExIssue; + ); issue.parent = parent.id; } catch (error) { logger.error("Error while fetching the parent issue", error); @@ -588,7 +588,7 @@ export const createOrUpdateIssue = async ( logger.info( `[${issue.external_source}][${issue.external_id.slice(0, 5)}...][${meta.batchId}] Created Issue: ${issue.external_id.slice(0, 7)} ----------- [${issueProcessIndex} / ${meta.batch_end}][${meta.total.issues}]` ); - return createdIssue as ExIssue; + return createdIssue; } catch (error) { if (AssertAPIErrorResponse(error)) { // Update the issue if the issue already exist @@ -959,7 +959,7 @@ const getPlaneIssueLabels = (issue: ExIssue, planeLabels: ExIssueLabel[]): strin return createdLabel.id; } }) - .filter((label) => label !== undefined) as string[]; + .filter((label) => label !== undefined); } return []; }; diff --git a/apps/silo/src/etl/migrator/labels.migrator.ts b/apps/silo/src/etl/migrator/labels.migrator.ts index 70a9113d9e..9b2495fb9e 100644 --- a/apps/silo/src/etl/migrator/labels.migrator.ts +++ b/apps/silo/src/etl/migrator/labels.migrator.ts @@ -33,5 +33,5 @@ export const createLabelsForIssues = async ( }; const createdLabels = await processBatchPromises(labels, createOrUpdateLabel, 2); - return createdLabels.filter((label) => label !== undefined) as ExIssueLabel[]; + return createdLabels.filter((label) => label !== undefined); }; diff --git a/apps/silo/src/etl/migrator/projects.migrator.ts b/apps/silo/src/etl/migrator/projects.migrator.ts index 9af5887ab7..8d880b317e 100644 --- a/apps/silo/src/etl/migrator/projects.migrator.ts +++ b/apps/silo/src/etl/migrator/projects.migrator.ts @@ -48,7 +48,7 @@ export const createProjects = async ( const createdProjects = await processBatchPromises(projects, createProject, 2); - return createdProjects.filter((project) => project !== undefined) as ExProject[]; + return createdProjects.filter((project) => project !== undefined); }; export const enableIssueTypeForProject = async ( diff --git a/apps/silo/src/etl/migrator/states.migrator.ts b/apps/silo/src/etl/migrator/states.migrator.ts index c562d99482..8acbd2c63e 100644 --- a/apps/silo/src/etl/migrator/states.migrator.ts +++ b/apps/silo/src/etl/migrator/states.migrator.ts @@ -59,5 +59,5 @@ export const createStates = async ( // batch the state creation const createdStates = await processBatchPromises(states, createState, 2); - return createdStates.filter((state) => state !== undefined) as TCreateState[]; + return createdStates.filter((state) => state !== undefined); }; diff --git a/apps/silo/src/helpers/connection-details.ts b/apps/silo/src/helpers/connection-details.ts index 58082471dd..757dd3ecec 100644 --- a/apps/silo/src/helpers/connection-details.ts +++ b/apps/silo/src/helpers/connection-details.ts @@ -75,6 +75,6 @@ export async function getConnectionDetails { const imgTags = root.querySelectorAll("img"); imgTags.forEach((img) => { - const parent = img.parentNode as HTMLElement; + const parent = img.parentNode; // Check if the parent is a tag if (parent && parent.tagName === "SPAN") { @@ -47,7 +47,7 @@ export const splitStringTillPart = (input: string, part: string): string => { return "/" + result; }; -export const downloadFile = async (url: string, authToken?: string | undefined): Promise => { +export const downloadFile = async (url: string, authToken?: string): Promise => { try { const response = await axios({ url, diff --git a/apps/silo/src/lib/behaviours/git/pull-request.behaviour.ts b/apps/silo/src/lib/behaviours/git/pull-request.behaviour.ts index 958901ab37..7fa6bd3661 100644 --- a/apps/silo/src/lib/behaviours/git/pull-request.behaviour.ts +++ b/apps/silo/src/lib/behaviours/git/pull-request.behaviour.ts @@ -294,7 +294,7 @@ export class PullRequestBehaviour { prDetails.repository.owner, prDetails.repository.name, prDetails.number.toString() - ) as Promise; + ); } /** diff --git a/apps/silo/src/lib/decorators.ts b/apps/silo/src/lib/decorators.ts index 11242b5ae1..465c172132 100644 --- a/apps/silo/src/lib/decorators.ts +++ b/apps/silo/src/lib/decorators.ts @@ -1,7 +1,7 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ /* eslint-disable @typescript-eslint/no-unused-vars */ /* eslint-disable @typescript-eslint/no-wrapper-object-types */ -/* eslint-disable @typescript-eslint/no-unsafe-function-type */ + import "reflect-metadata"; // external middlewares import type { E_INTEGRATION_KEYS } from "@plane/types"; diff --git a/apps/silo/src/services/form-fields/options-fields.ts b/apps/silo/src/services/form-fields/options-fields.ts index a17c311c86..aacaaf2f8b 100644 --- a/apps/silo/src/services/form-fields/options-fields.ts +++ b/apps/silo/src/services/form-fields/options-fields.ts @@ -51,7 +51,7 @@ export class OptionFormFieldsService { const baseField = { id: `${issueTypeId}:${property.id}`, name: property.displayName ?? "", - type: property.propertyType as PropertyTypeEnum, + type: property.propertyType, required: property.isRequired ?? false, visible: property.isActive ?? true, order: property.sortOrder ?? 0, diff --git a/apps/silo/src/services/oauth/controller.ts b/apps/silo/src/services/oauth/controller.ts index 3c78f17f69..aefb62fd03 100644 --- a/apps/silo/src/services/oauth/controller.ts +++ b/apps/silo/src/services/oauth/controller.ts @@ -368,7 +368,7 @@ export class OAuthController { client_id: planeAppClientId, client_secret: planeAppClientSecret, grant_type: EOAuthGrantType.AUTHORIZATION_CODE, - code: planeOAuthCode as string, + code: planeOAuthCode, redirect_uri: `${env.SILO_API_BASE_URL}${env.SILO_BASE_PATH}/api/oauth/${providerUrlSlug}/plane-oauth/callback`, app_installation_id: credential.target_identifier as string, user_id: authState.user_id, diff --git a/apps/silo/src/services/oauth/helpers.ts b/apps/silo/src/services/oauth/helpers.ts index 335453b8ce..65fad79d93 100644 --- a/apps/silo/src/services/oauth/helpers.ts +++ b/apps/silo/src/services/oauth/helpers.ts @@ -16,7 +16,7 @@ export const convertProviderToIntegrationKey = (provider: string): E_INTEGRATION export const convertIntegrationKeyToProvider = (integrationKey: E_INTEGRATION_KEYS): string => { // Validate if the integration key is a valid E_INTEGRATION_KEYS - if (!Object.values(E_INTEGRATION_KEYS).includes(integrationKey as E_INTEGRATION_KEYS)) { + if (!Object.values(E_INTEGRATION_KEYS).includes(integrationKey)) { throw new Error(`Invalid integration key: ${integrationKey}`); } // Convert "GITHUB" to "github" diff --git a/apps/silo/src/services/oauth/strategies/github.strategy.ts b/apps/silo/src/services/oauth/strategies/github.strategy.ts index 5a72a93b8c..037c08fd0b 100644 --- a/apps/silo/src/services/oauth/strategies/github.strategy.ts +++ b/apps/silo/src/services/oauth/strategies/github.strategy.ts @@ -47,7 +47,7 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { if (!state.config_key) { throw new Error(E_SILO_ERROR_CODES.INVALID_APP_CREDENTIALS.toString()); } - const githubAuthService = await this.getGithubAuthService(state.config_key as string); + const githubAuthService = await this.getGithubAuthService(state.config_key); return githubAuthService.getAuthUrl(state); } @@ -63,7 +63,7 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { // add the config key to the state to be used in getUserAuthUrl and handleUserCallback state.config_key = configKey; - const githubAuthService = await this.getGithubAuthService(state.config_key as string); + const githubAuthService = await this.getGithubAuthService(state.config_key); return githubAuthService.getUserAuthUrl(state); } @@ -71,7 +71,7 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { code: string, state: string ): Promise<{ stateBuffer: string; redirectUri?: string }> { - const authState: GithubUserAuthState = JSON.parse(Buffer.from(state as string, "base64").toString()); + const authState: GithubUserAuthState = JSON.parse(Buffer.from(state, "base64").toString()); let redirectUri = `${env.APP_BASE_URL}/${authState.workspace_slug}/settings/integrations/github-enterprise/`; if (authState.profile_redirect) { @@ -79,8 +79,8 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { } const githubState: GithubPlaneOAuthState = { - github_code: code as string, - encoded_github_state: state as string, + github_code: code, + encoded_github_state: state, }; const stateBuffer = Buffer.from(JSON.stringify(githubState)).toString("base64"); @@ -101,11 +101,11 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { throw new Error(E_SILO_ERROR_CODES.INVALID_INSTALLATION_ACCOUNT.toString()); } - const authState: GithubAuthorizeState = JSON.parse(Buffer.from(state as string, "base64").toString()); + const authState: GithubAuthorizeState = JSON.parse(Buffer.from(state, "base64").toString()); const redirectUri = `${env.APP_BASE_URL}/${authState.workspace_slug}/settings/integrations/github-enterprise/`; // Create github service from the installation id - const service = await this.getGithubService(installation_id as string, authState.config_key as string); + const service = await this.getGithubService(installation_id, authState.config_key as string); // Get the installation details const installation = await service.getInstallation(Number(installation_id)); @@ -120,7 +120,7 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { response: { identifier: installation.data.account.id.toString(), authorization_type: ESourceAuthorizationType.TOKEN, - access_token: installation_id as string, + access_token: installation_id, connection_id: installation.data.account.id.toString(), // @ts-expect-error - Ignoring ts error for dynamic key assignment connection_slug: installation.data.account.login, @@ -144,13 +144,11 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { async handlePlaneOAuthCallback( encodedIntegrationState: string ): Promise<{ response: OAuthTokenResponse; state: OAuthState; redirectUri?: string }> { - const githubState: GithubPlaneOAuthState = JSON.parse( - Buffer.from(encodedIntegrationState as string, "base64").toString() - ); + const githubState: GithubPlaneOAuthState = JSON.parse(Buffer.from(encodedIntegrationState, "base64").toString()); const { github_code: code, encoded_github_state } = githubState; - const authState: GithubUserAuthState = JSON.parse(Buffer.from(encoded_github_state as string, "base64").toString()); + const authState: GithubUserAuthState = JSON.parse(Buffer.from(encoded_github_state, "base64").toString()); let redirectUri = `${env.APP_BASE_URL}/${authState.workspace_slug}/settings/integrations/github-enterprise/`; @@ -160,7 +158,7 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { const githubAuthService = await this.getGithubAuthService(authState.config_key as string); const { response, state: githubUserState } = await githubAuthService.getUserAccessToken({ - code: code as string, + code: code, state: authState, }); @@ -204,7 +202,7 @@ export class GithubEnterpriseStrategy implements OAuthStrategy { } const githubService = getGithubService( wsConnection as TGithubWorkspaceConnection, - wsCredential.source_access_token as string, + wsCredential.source_access_token, true ); const installation = await githubService.getInstallation(Number(wsCredential.source_access_token)); diff --git a/apps/silo/src/services/oauth/strategies/gitlab.strategy.ts b/apps/silo/src/services/oauth/strategies/gitlab.strategy.ts index 9501ef4022..807f67786e 100644 --- a/apps/silo/src/services/oauth/strategies/gitlab.strategy.ts +++ b/apps/silo/src/services/oauth/strategies/gitlab.strategy.ts @@ -43,7 +43,7 @@ export class GitlabEnterpriseStrategy implements OAuthStrategy { if (!state.config_key) { throw new Error(E_SILO_ERROR_CODES.INVALID_APP_CREDENTIALS.toString()); } - const gitlabAuthService = await this.getGitlabAuthService(state.config_key as string); + const gitlabAuthService = await this.getGitlabAuthService(state.config_key); return gitlabAuthService.getAuthUrl(state); } @@ -56,15 +56,15 @@ export class GitlabEnterpriseStrategy implements OAuthStrategy { throw new Error(E_SILO_ERROR_CODES.INVALID_INSTALLATION_ACCOUNT.toString()); } - const authState: GitLabAuthorizeState = JSON.parse(Buffer.from(state as string, "base64").toString()); + const authState: GitLabAuthorizeState = JSON.parse(Buffer.from(state, "base64").toString()); const redirectUri = getIntegrationPageUrl(authState.workspace_slug, this.integrationKey); // Create gitlab auth service const gitlabAuthService = await this.getGitlabAuthService(authState.config_key as string); const { response: tokenResponse } = await gitlabAuthService.getAccessToken({ - code: code as string, - state: state as string, + code: code, + state: state, }); if (!tokenResponse || !tokenResponse.access_token) { diff --git a/apps/silo/src/services/oauth/strategies/sentry-oauth.strategy.ts b/apps/silo/src/services/oauth/strategies/sentry-oauth.strategy.ts index c661ad4501..8268e17677 100644 --- a/apps/silo/src/services/oauth/strategies/sentry-oauth.strategy.ts +++ b/apps/silo/src/services/oauth/strategies/sentry-oauth.strategy.ts @@ -33,7 +33,7 @@ export class SentryOAuthStrategy implements OAuthStrategy { state: string, additionalParams: Record ): Promise<{ response: OAuthTokenResponse; state: OAuthState; redirectUri?: string }> { - const sentryAuthState: SentryAuthState = JSON.parse(Buffer.from(state as string, "base64").toString()); + const sentryAuthState: SentryAuthState = JSON.parse(Buffer.from(state, "base64").toString()); const installationId = additionalParams.installationId; const org = additionalParams.orgSlug; diff --git a/apps/space/app/entry.client.tsx b/apps/space/app/entry.client.tsx index 82ea2d9381..9cf1c32deb 100644 --- a/apps/space/app/entry.client.tsx +++ b/apps/space/app/entry.client.tsx @@ -1,4 +1,3 @@ -/* eslint-disable import/order */ import * as Sentry from "@sentry/react-router"; import { startTransition, StrictMode } from "react"; import { hydrateRoot } from "react-dom/client"; diff --git a/apps/space/app/intake/[anchor]/page.tsx b/apps/space/app/intake/[anchor]/page.tsx index 65b4ce5e26..9236a23248 100644 --- a/apps/space/app/intake/[anchor]/page.tsx +++ b/apps/space/app/intake/[anchor]/page.tsx @@ -1,12 +1,10 @@ -"use client"; - import { observer } from "mobx-react"; // hooks import { usePublish } from "@/hooks/store/publish"; import CreateIssueModal from "@/plane-web/components/intake/create/create-issue-modal"; import type { Route } from "./+types/page"; -const IssuesPage = observer((props: Route.ComponentProps) => { +const IssuesPage = observer(function IssuesPage(props: Route.ComponentProps) { const { params } = props; const { anchor } = params; // params diff --git a/apps/space/app/intake/forms/[anchor]/page.tsx b/apps/space/app/intake/forms/[anchor]/page.tsx index 4bb5858b5d..9748dd03b4 100644 --- a/apps/space/app/intake/forms/[anchor]/page.tsx +++ b/apps/space/app/intake/forms/[anchor]/page.tsx @@ -1,11 +1,9 @@ -"use client"; - import { observer } from "mobx-react"; import CreateTypeFormModal from "@/plane-web/components/intake/create/create-type-form-modal"; import { useIntake } from "@/plane-web/hooks/store/use-intake"; import type { Route } from "./+types/page"; -const TypeFormPage = observer((props: Route.ComponentProps) => { +const TypeFormPage = observer(function TypeFormPage(props: Route.ComponentProps) { const { params } = props; const { anchor } = params; diff --git a/apps/space/app/pages/[anchor]/page.tsx b/apps/space/app/pages/[anchor]/page.tsx index aea702351c..be1254e337 100644 --- a/apps/space/app/pages/[anchor]/page.tsx +++ b/apps/space/app/pages/[anchor]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import useSWR from "swr"; // hooks import { useMember } from "@/hooks/store/use-member"; diff --git a/apps/space/app/views/[anchor]/page.tsx b/apps/space/app/views/[anchor]/page.tsx index c6cec42547..52a4f233ff 100644 --- a/apps/space/app/views/[anchor]/page.tsx +++ b/apps/space/app/views/[anchor]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams, useSearchParams } from "next/navigation"; // components @@ -9,7 +7,7 @@ import { usePublish } from "@/hooks/store/publish"; // plane-web import { ViewLayoutsRoot } from "@/plane-web/components/issue-layouts/root"; -const ViewsPage = observer(() => { +const ViewsPage = observer(function ViewsPage() { // params const params = useParams<{ anchor: string }>(); const { anchor } = params; diff --git a/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx b/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx index 8527732f93..629478606b 100644 --- a/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx +++ b/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx @@ -11,7 +11,7 @@ interface Props { subGroupId: string | undefined, isSubGroupCumulative: boolean ) => number | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; } export const IssueLayoutHOC = observer(function IssueLayoutHOC(props: Props) { diff --git a/apps/space/core/components/issues/issue-layouts/kanban/default.tsx b/apps/space/core/components/issues/issue-layouts/kanban/default.tsx index c4d0c0ad2a..d0ca2a7b9e 100644 --- a/apps/space/core/components/issues/issue-layouts/kanban/default.tsx +++ b/apps/space/core/components/issues/issue-layouts/kanban/default.tsx @@ -37,7 +37,7 @@ export interface IKanBan { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; scrollableContainerRef?: MutableRefObject; showEmptyGroup?: boolean; } diff --git a/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx b/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx index 28570eca15..e7c770afdf 100644 --- a/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx +++ b/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx @@ -29,7 +29,7 @@ interface IKanbanGroup { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; scrollableContainerRef?: MutableRefObject; } diff --git a/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx b/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx index e3d53b40a6..5ff8634c5f 100644 --- a/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx +++ b/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx @@ -37,7 +37,7 @@ export interface IKanBanSwimLanes { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; showEmptyGroup: boolean; scrollableContainerRef?: MutableRefObject; orderBy: TIssueOrderByOptions | undefined; @@ -163,7 +163,7 @@ interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; scrollableContainerRef?: MutableRefObject; loadMoreIssues: (groupId?: string, subGroupId?: string) => void; } @@ -220,7 +220,7 @@ interface ISubGroup { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; scrollableContainerRef?: MutableRefObject; loadMoreIssues: (groupId?: string, subGroupId?: string) => void; } diff --git a/apps/space/core/components/issues/issue-layouts/list/default.tsx b/apps/space/core/components/issues/issue-layouts/list/default.tsx index 7088090861..5ca48216f0 100644 --- a/apps/space/core/components/issues/issue-layouts/list/default.tsx +++ b/apps/space/core/components/issues/issue-layouts/list/default.tsx @@ -32,7 +32,7 @@ export interface IList { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; } export const List = observer(function List(props: IList) { diff --git a/apps/space/core/components/issues/issue-layouts/list/list-group.tsx b/apps/space/core/components/issues/issue-layouts/list/list-group.tsx index 0510e171a9..36b61e3dac 100644 --- a/apps/space/core/components/issues/issue-layouts/list/list-group.tsx +++ b/apps/space/core/components/issues/issue-layouts/list/list-group.tsx @@ -32,7 +32,7 @@ interface Props { isSubGroupCumulative: boolean ) => number | undefined; getPaginationData: (groupId: string | undefined, subGroupId: string | undefined) => TPaginationData | undefined; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; } // List loader component diff --git a/apps/space/core/components/issues/issue-layouts/properties/state.tsx b/apps/space/core/components/issues/issue-layouts/properties/state.tsx index 35299fdd44..c88ecff58d 100644 --- a/apps/space/core/components/issues/issue-layouts/properties/state.tsx +++ b/apps/space/core/components/issues/issue-layouts/properties/state.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane ui import { StateGroupIcon } from "@plane/propel/icons"; diff --git a/apps/space/core/components/issues/issue-layouts/utils.tsx b/apps/space/core/components/issues/issue-layouts/utils.tsx index d0751da737..db46d269f1 100644 --- a/apps/space/core/components/issues/issue-layouts/utils.tsx +++ b/apps/space/core/components/issues/issue-layouts/utils.tsx @@ -41,7 +41,7 @@ export const getGroupByColumns = ( case "labels": return getLabelsColumns(label) as any; case "assignees": - return getAssigneeColumns(member) as any; + return getAssigneeColumns(member); case "created_by": return getCreatedByColumns(member) as any; default: @@ -62,7 +62,7 @@ const getCycleColumns = (cycleStore: ICycleStore): IGroupByColumn[] | undefined cycleGroups.push({ id: cycle.id, name: cycle.name, - icon: , + icon: , payload: { cycle_id: cycle.id }, }); } @@ -193,11 +193,8 @@ export const getDisplayPropertiesCount = ( return count; }; -export const getIssueBlockId = ( - issueId: string | undefined, - groupId: string | undefined, - subGroupId?: string | undefined -) => `issue_${issueId}_${groupId}_${subGroupId}`; +export const getIssueBlockId = (issueId: string | undefined, groupId: string | undefined, subGroupId?: string) => + `issue_${issueId}_${groupId}_${subGroupId}`; /** * returns empty Array if groupId is None diff --git a/apps/space/core/hooks/use-clipboard-write-permission.tsx b/apps/space/core/hooks/use-clipboard-write-permission.tsx index 1f89b82919..687a574c29 100644 --- a/apps/space/core/hooks/use-clipboard-write-permission.tsx +++ b/apps/space/core/hooks/use-clipboard-write-permission.tsx @@ -6,7 +6,7 @@ const useClipboardWritePermission = () => { useEffect(() => { const checkClipboardWriteAccess = () => { navigator.permissions - //eslint-disable-next-line no-undef + .query({ name: "clipboard-write" as PermissionName }) .then((result) => { if (result.state === "granted") { diff --git a/apps/space/core/hooks/use-intersection-observer.tsx b/apps/space/core/hooks/use-intersection-observer.tsx index 0fb1a26664..e2f2fd71eb 100644 --- a/apps/space/core/hooks/use-intersection-observer.tsx +++ b/apps/space/core/hooks/use-intersection-observer.tsx @@ -32,7 +32,6 @@ export const useIntersectionObserver = ( observer.observe(elementRef); return () => { if (elementRef) { - // eslint-disable-next-line react-hooks/exhaustive-deps observer.unobserve(elementRef); } }; diff --git a/apps/space/core/store/helpers/base-issues.store.ts b/apps/space/core/store/helpers/base-issues.store.ts index e02b31887f..be45cf6101 100644 --- a/apps/space/core/store/helpers/base-issues.store.ts +++ b/apps/space/core/store/helpers/base-issues.store.ts @@ -105,15 +105,15 @@ export abstract class BaseIssuesStore implements IBaseIssuesStore { const allIssues = groupedIssueIds[ALL_ISSUES] ?? []; if (allIssues && Array.isArray(allIssues)) { - return allIssues as string[]; + return allIssues; } if (groupId && groupedIssueIds?.[groupId] && Array.isArray(groupedIssueIds[groupId])) { - return (groupedIssueIds[groupId] ?? []) as string[]; + return groupedIssueIds[groupId] ?? []; } if (groupId && subGroupId) { - return ((groupedIssueIds as TSubGroupedIssues)[groupId]?.[subGroupId] ?? []) as string[]; + return (groupedIssueIds as TSubGroupedIssues)[groupId]?.[subGroupId] ?? []; } return undefined; @@ -445,7 +445,7 @@ export abstract class BaseIssuesStore implements IBaseIssuesStore { // if groupedIssueIds is an array, update the `groupedIssueIds` store at the issuePath if (groupedIssueIds && Array.isArray(groupedIssueIds)) { update(this, ["groupedIssueIds", ...issuePath], (issueIds: string[] = []) => - uniq(concat(issueIds, groupedIssueIds as string[])) + uniq(concat(issueIds, groupedIssueIds)) ); // return true to indicate the store has been updated return true; diff --git a/apps/space/ee/components/editor/embeds/mentions/root.tsx b/apps/space/ee/components/editor/embeds/mentions/root.tsx index 20720f6649..fbfdcec68b 100644 --- a/apps/space/ee/components/editor/embeds/mentions/root.tsx +++ b/apps/space/ee/components/editor/embeds/mentions/root.tsx @@ -8,7 +8,7 @@ export type TEditorMentionComponentProps = TCallbackMentionComponentProps & { getMentionDetails?: (mentionType: TEditorMentionType, entityId: string) => TEditorMentionItem | undefined; }; -export const EditorAdditionalMentionsRoot: React.FC = (props) => { +export function EditorAdditionalMentionsRoot(props: TEditorMentionComponentProps) { const { entity_name } = props; switch (entity_name) { @@ -17,4 +17,4 @@ export const EditorAdditionalMentionsRoot: React.FC = observer((props) => { +export const EditorWorkItemMentionContent = observer(function EditorWorkItemMentionContent(props: Props) { const { workItemDetails } = props; // derived values const trimmedName = diff --git a/apps/space/ee/components/editor/embeds/mentions/work-item/logo.tsx b/apps/space/ee/components/editor/embeds/mentions/work-item/logo.tsx index 4c3c3d144c..318687e693 100644 --- a/apps/space/ee/components/editor/embeds/mentions/work-item/logo.tsx +++ b/apps/space/ee/components/editor/embeds/mentions/work-item/logo.tsx @@ -9,7 +9,7 @@ type Props = { stateGroup: TStateGroups; }; -export const EditorWorkItemMentionLogo: React.FC = observer((props) => { +export const EditorWorkItemMentionLogo = observer(function EditorWorkItemMentionLogo(props: Props) { const { className, stateColor, stateGroup } = props; return ; diff --git a/apps/space/ee/components/editor/embeds/mentions/work-item/preview.tsx b/apps/space/ee/components/editor/embeds/mentions/work-item/preview.tsx index 99e92d56a8..5b5f242337 100644 --- a/apps/space/ee/components/editor/embeds/mentions/work-item/preview.tsx +++ b/apps/space/ee/components/editor/embeds/mentions/work-item/preview.tsx @@ -7,7 +7,7 @@ type Props = { workItemDetails: TEditorWorkItemMention; }; -export const EditorWorkItemMentionPreview: React.FC = observer((props) => { +export const EditorWorkItemMentionPreview = observer(function EditorWorkItemMentionPreview(props: Props) { const { workItemDetails } = props; return ( diff --git a/apps/space/ee/components/editor/embeds/mentions/work-item/root.tsx b/apps/space/ee/components/editor/embeds/mentions/work-item/root.tsx index 108513d66e..ebcc6ba493 100644 --- a/apps/space/ee/components/editor/embeds/mentions/work-item/root.tsx +++ b/apps/space/ee/components/editor/embeds/mentions/work-item/root.tsx @@ -6,7 +6,7 @@ import type { TEditorMentionComponentProps } from "../root"; import { EditorWorkItemMentionContent } from "./content"; import { EditorWorkItemMentionPreview } from "./preview"; -export const EditorWorkItemMention: React.FC = observer((props) => { +export const EditorWorkItemMention = observer(function EditorWorkItemMention(props: TEditorMentionComponentProps) { const { entity_identifier: workItemId, getMentionDetails } = props; // derived values const workItemDetails = getMentionDetails?.("issue_mention", workItemId); diff --git a/apps/space/ee/components/editor/external-embed/embed-handler.tsx b/apps/space/ee/components/editor/external-embed/embed-handler.tsx index 75ea7704a4..7713e73e93 100644 --- a/apps/space/ee/components/editor/external-embed/embed-handler.tsx +++ b/apps/space/ee/components/editor/external-embed/embed-handler.tsx @@ -18,7 +18,7 @@ export const EmbedHandler: React.FC = memo( )) ); -const EmbedHandlerRender: React.FC = observer((props) => { +const EmbedHandlerRender = observer(function EmbedHandlerRender(props: ExternalEmbedNodeViewProps) { const { node } = props; const { src, diff --git a/apps/space/ee/components/gantt-chart/blocks/block.tsx b/apps/space/ee/components/gantt-chart/blocks/block.tsx index 024111b6fe..d43552d6b1 100644 --- a/apps/space/ee/components/gantt-chart/blocks/block.tsx +++ b/apps/space/ee/components/gantt-chart/blocks/block.tsx @@ -12,13 +12,13 @@ import type { ChartDataType, IGanttBlock } from "../types"; type Props = { blockId: string; - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock | undefined; + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock | undefined; showAllBlocks: boolean; blockToRender: (data: any) => React.ReactNode; ganttContainerRef: React.RefObject; }; -export const GanttChartBlock: React.FC = observer((props) => { +export const GanttChartBlock = observer(function GanttChartBlock(props: Props) { const { blockId, getBlockById, showAllBlocks, blockToRender, ganttContainerRef } = props; // store hooks const { currentViewData, updateActiveBlockId, isBlockActive } = useGanttChart(); diff --git a/apps/space/ee/components/gantt-chart/blocks/blocks-list.tsx b/apps/space/ee/components/gantt-chart/blocks/blocks-list.tsx index e253fb02c7..dd1bc0aeb0 100644 --- a/apps/space/ee/components/gantt-chart/blocks/blocks-list.tsx +++ b/apps/space/ee/components/gantt-chart/blocks/blocks-list.tsx @@ -10,13 +10,13 @@ import { GanttChartBlock } from "./block"; export type GanttChartBlocksProps = { itemsContainerWidth: number; blockIds: string[]; - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock | undefined; + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock | undefined; blockToRender: (data: any) => React.ReactNode; ganttContainerRef: React.RefObject; showAllBlocks: boolean; }; -export const GanttChartBlocksList: FC = (props) => { +export function GanttChartBlocksList(props: GanttChartBlocksProps) { const { itemsContainerWidth, blockIds, blockToRender, getBlockById, ganttContainerRef, showAllBlocks } = props; return ( @@ -39,4 +39,4 @@ export const GanttChartBlocksList: FC = (props) => { ))}
); -}; +} diff --git a/apps/space/ee/components/gantt-chart/chart/header.tsx b/apps/space/ee/components/gantt-chart/chart/header.tsx index c4a6d818ce..fe78208c33 100644 --- a/apps/space/ee/components/gantt-chart/chart/header.tsx +++ b/apps/space/ee/components/gantt-chart/chart/header.tsx @@ -7,7 +7,7 @@ type Props = { toggleFullScreenMode: () => void; }; -export const GanttChartHeader: React.FC = observer((props) => { +export const GanttChartHeader = observer(function GanttChartHeader(props: Props) { const { fullScreenMode, handleToday, toggleFullScreenMode } = props; // chart hook diff --git a/apps/space/ee/components/gantt-chart/chart/main-content.tsx b/apps/space/ee/components/gantt-chart/chart/main-content.tsx index 1dc41d47b8..6d870eae2a 100644 --- a/apps/space/ee/components/gantt-chart/chart/main-content.tsx +++ b/apps/space/ee/components/gantt-chart/chart/main-content.tsx @@ -21,7 +21,7 @@ import { useGanttChart } from "../hooks/use-gantt-chart"; type Props = { blockIds: string[]; - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock | undefined; + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock | undefined; canLoadMoreBlocks?: boolean; loadMoreBlocks?: () => void; blockToRender: (data: any) => React.ReactNode; @@ -33,7 +33,7 @@ type Props = { updateCurrentViewRenderPayload: (direction: "left" | "right", currentView: TGanttViews) => void; }; -export const GanttChartMainContent: React.FC = observer((props) => { +export const GanttChartMainContent = observer(function GanttChartMainContent(props: Props) { const { blockIds, getBlockById, diff --git a/apps/space/ee/components/gantt-chart/chart/root.tsx b/apps/space/ee/components/gantt-chart/chart/root.tsx index afa0c6bb81..05ccb24d48 100644 --- a/apps/space/ee/components/gantt-chart/chart/root.tsx +++ b/apps/space/ee/components/gantt-chart/chart/root.tsx @@ -20,12 +20,12 @@ type ChartViewRootProps = { sidebarToRender: (props: any) => React.ReactNode; bottomSpacing: boolean; showAllBlocks: boolean; - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock | undefined; + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock | undefined; loadMoreBlocks?: () => void; canLoadMoreBlocks?: boolean; }; -export const ChartViewRoot: FC = observer((props) => { +export const ChartViewRoot = observer(function ChartViewRoot(props: ChartViewRootProps) { const { border, title, diff --git a/apps/space/ee/components/gantt-chart/chart/views/bi-week.tsx b/apps/space/ee/components/gantt-chart/chart/views/bi-week.tsx index 949bd16ba4..1643ceef9f 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/bi-week.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/bi-week.tsx @@ -3,8 +3,7 @@ import { observer } from "mobx-react"; import { useGanttChart } from "../.."; // hooks -export const BiWeekChartView: FC = observer(() => { - // eslint-disable-next-line @typescript-eslint/no-unused-vars +export const BiWeekChartView = observer(function BiWeekChartView(_props: any) { const { currentViewData, renderView } = useGanttChart(); return ( diff --git a/apps/space/ee/components/gantt-chart/chart/views/day.tsx b/apps/space/ee/components/gantt-chart/chart/views/day.tsx index 1da644ebcb..0ea2eb587f 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/day.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/day.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react"; // hooks import { useGanttChart } from "../.."; -export const DayChartView: FC = observer(() => { +export const DayChartView = observer(function DayChartView(_props: any) { const { currentViewData, renderView } = useGanttChart(); return ( diff --git a/apps/space/ee/components/gantt-chart/chart/views/hours.tsx b/apps/space/ee/components/gantt-chart/chart/views/hours.tsx index b9b0e8b85e..adde8f8ce9 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/hours.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/hours.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react"; // hooks import { useGanttChart } from "../.."; -export const HourChartView: FC = observer(() => { +export const HourChartView = observer(function HourChartView(_props: any) { const { currentViewData, renderView } = useGanttChart(); return ( diff --git a/apps/space/ee/components/gantt-chart/chart/views/month.tsx b/apps/space/ee/components/gantt-chart/chart/views/month.tsx index b4ed632b8f..5ea6265155 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/month.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/month.tsx @@ -7,7 +7,7 @@ import { useGanttChart } from "../.."; import { HEADER_HEIGHT, SIDEBAR_WIDTH } from "../../constants"; import type { IMonthBlock } from "../../views"; -export const MonthChartView: FC = observer(() => { +export const MonthChartView = observer(function MonthChartView(_props: any) { // chart hook const { currentViewData, renderView } = useGanttChart(); const monthBlocks: IMonthBlock[] = renderView; diff --git a/apps/space/ee/components/gantt-chart/chart/views/quarter.tsx b/apps/space/ee/components/gantt-chart/chart/views/quarter.tsx index 040e0a3dac..5c5942754e 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/quarter.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/quarter.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react"; // hooks import { useGanttChart } from "../.."; -export const QuarterChartView: FC = observer(() => { +export const QuarterChartView = observer(function QuarterChartView(_props: any) { const { currentViewData, renderView } = useGanttChart(); return ( diff --git a/apps/space/ee/components/gantt-chart/chart/views/week.tsx b/apps/space/ee/components/gantt-chart/chart/views/week.tsx index 40b2777a42..28f51a2c76 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/week.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/week.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react"; // hooks import { useGanttChart } from "../.."; -export const WeekChartView: FC = observer(() => { +export const WeekChartView = observer(function WeekChartView(_props: any) { const { currentViewData, renderView } = useGanttChart(); return ( diff --git a/apps/space/ee/components/gantt-chart/chart/views/year.tsx b/apps/space/ee/components/gantt-chart/chart/views/year.tsx index 0147c874dc..4645853f37 100644 --- a/apps/space/ee/components/gantt-chart/chart/views/year.tsx +++ b/apps/space/ee/components/gantt-chart/chart/views/year.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react"; // hooks import { useGanttChart } from "../.."; -export const YearChartView: FC = observer(() => { +export const YearChartView = observer(function YearChartView(_props: any) { const { currentViewData, renderView } = useGanttChart(); return ( diff --git a/apps/space/ee/components/gantt-chart/contexts/index.tsx b/apps/space/ee/components/gantt-chart/contexts/index.tsx index ba4a93979b..36e65fe755 100644 --- a/apps/space/ee/components/gantt-chart/contexts/index.tsx +++ b/apps/space/ee/components/gantt-chart/contexts/index.tsx @@ -17,7 +17,7 @@ type GanttStoreProviderProps = { children: React.ReactNode; }; -export const GanttStoreProvider: FC = ({ children }) => { +export function GanttStoreProvider({ children }: GanttStoreProviderProps) { const store = initializeStore(); return {children}; -}; +} diff --git a/apps/space/ee/components/gantt-chart/data/index.ts b/apps/space/ee/components/gantt-chart/data/index.ts index f63316c04b..368d1c0928 100644 --- a/apps/space/ee/components/gantt-chart/data/index.ts +++ b/apps/space/ee/components/gantt-chart/data/index.ts @@ -46,7 +46,7 @@ export const timePreview = (date: Date) => { export const datePreview = (date: Date, includeTime: boolean = false) => { const day = date.getDate(); let month: number | WeekMonthDataType = date.getMonth(); - month = months[month as number] as WeekMonthDataType; + month = months[month]; const year = date.getFullYear(); return `${charCapitalize(month?.shortTitle)} ${day}, ${year}${includeTime ? `, ${timePreview(date)}` : ``}`; diff --git a/apps/space/ee/components/gantt-chart/helpers/Scrollable.tsx b/apps/space/ee/components/gantt-chart/helpers/Scrollable.tsx index 9c5d2748be..f3effb8fac 100644 --- a/apps/space/ee/components/gantt-chart/helpers/Scrollable.tsx +++ b/apps/space/ee/components/gantt-chart/helpers/Scrollable.tsx @@ -13,7 +13,7 @@ type Props = { ganttContainerRef: React.RefObject; }; -export const ChartScrollable: React.FC = observer((props) => { +export const ChartScrollable = observer(function ChartScrollable(props: Props) { const { block, blockToRender, ganttContainerRef } = props; // states const [isHidden, setIsHidden] = useState(true); diff --git a/apps/space/ee/components/gantt-chart/root.tsx b/apps/space/ee/components/gantt-chart/root.tsx index fbf5b237c7..8b352bd2e4 100644 --- a/apps/space/ee/components/gantt-chart/root.tsx +++ b/apps/space/ee/components/gantt-chart/root.tsx @@ -11,14 +11,14 @@ type GanttChartRootProps = { blockIds: string[]; blockToRender: (data: any) => React.ReactNode; sidebarToRender: (props: any) => React.ReactNode; - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock | undefined; + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock | undefined; canLoadMoreBlocks?: boolean; loadMoreBlocks?: () => void; bottomSpacing?: boolean; showAllBlocks?: boolean; }; -export const GanttChartRoot: FC = (props) => { +export function GanttChartRoot(props: GanttChartRootProps) { const { border = true, title, @@ -48,4 +48,4 @@ export const GanttChartRoot: FC = (props) => { /> ); -}; +} diff --git a/apps/space/ee/components/gantt-chart/sidebar/issues/block.tsx b/apps/space/ee/components/gantt-chart/sidebar/issues/block.tsx index b280098ebd..4deea1cde3 100644 --- a/apps/space/ee/components/gantt-chart/sidebar/issues/block.tsx +++ b/apps/space/ee/components/gantt-chart/sidebar/issues/block.tsx @@ -17,7 +17,7 @@ type Props = { block: IGanttBlock; }; -export const IssuesSidebarBlock = observer((props: Props) => { +export const IssuesSidebarBlock = observer(function IssuesSidebarBlock(props: Props) { const { block } = props; // store hooks const { updateActiveBlockId, isBlockActive } = useGanttChart(); diff --git a/apps/space/ee/components/gantt-chart/sidebar/issues/sidebar.tsx b/apps/space/ee/components/gantt-chart/sidebar/issues/sidebar.tsx index 5517d8b3df..9dc503e0c9 100644 --- a/apps/space/ee/components/gantt-chart/sidebar/issues/sidebar.tsx +++ b/apps/space/ee/components/gantt-chart/sidebar/issues/sidebar.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { RefObject } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -18,11 +16,11 @@ type Props = { loadMoreBlocks?: () => void; ganttContainerRef: RefObject; blockIds: string[]; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; showAllBlocks?: boolean; }; -export const IssueGanttSidebar: React.FC = observer((props) => { +export const IssueGanttSidebar = observer(function IssueGanttSidebar(props: Props) { const { blockIds, getBlockById, diff --git a/apps/space/ee/components/gantt-chart/sidebar/root.tsx b/apps/space/ee/components/gantt-chart/sidebar/root.tsx index f57f537f5a..47d2ad7c8c 100644 --- a/apps/space/ee/components/gantt-chart/sidebar/root.tsx +++ b/apps/space/ee/components/gantt-chart/sidebar/root.tsx @@ -14,10 +14,10 @@ type Props = { ganttContainerRef: RefObject; sidebarToRender: (props: any) => React.ReactNode; title: string; - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock | undefined; + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock | undefined; }; -export const GanttChartSidebar: React.FC = observer((props) => { +export const GanttChartSidebar = observer(function GanttChartSidebar(props: Props) { const { blockIds, sidebarToRender, getBlockById, loadMoreBlocks, canLoadMoreBlocks, ganttContainerRef, title } = props; diff --git a/apps/space/ee/components/gantt-chart/sidebar/utils.ts b/apps/space/ee/components/gantt-chart/sidebar/utils.ts index 58085f1d3a..75a8ac6d0c 100644 --- a/apps/space/ee/components/gantt-chart/sidebar/utils.ts +++ b/apps/space/ee/components/gantt-chart/sidebar/utils.ts @@ -5,7 +5,7 @@ export const handleOrderChange = ( droppedBlockId: string | undefined, dropAtEndOfList: boolean, blockIds: string[] | null, - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock, + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock, blockUpdateHandler: (block: any, payload: IBlockUpdateData) => void ) => { if (!blockIds || !draggingBlockId || !droppedBlockId) return; diff --git a/apps/space/ee/components/intake/create/create-issue-modal.tsx b/apps/space/ee/components/intake/create/create-issue-modal.tsx index 106671301d..722bf3a426 100644 --- a/apps/space/ee/components/intake/create/create-issue-modal.tsx +++ b/apps/space/ee/components/intake/create/create-issue-modal.tsx @@ -29,7 +29,7 @@ export type TFormData = { name: string; }; -const CreateIssueModal = ({ project, anchor }: TProps) => { +function CreateIssueModal({ project, anchor }: TProps) { // state const [success, setSuccess] = useState(false); const [formSubmitting, setFormSubmitting] = useState(false); @@ -125,5 +125,6 @@ const CreateIssueModal = ({ project, anchor }: TProps) => { ); -}; +} + export default CreateIssueModal; diff --git a/apps/space/ee/components/intake/create/create-type-form-modal.tsx b/apps/space/ee/components/intake/create/create-type-form-modal.tsx index 367f07e97a..ed66a72846 100644 --- a/apps/space/ee/components/intake/create/create-type-form-modal.tsx +++ b/apps/space/ee/components/intake/create/create-type-form-modal.tsx @@ -29,7 +29,7 @@ type TFormSubmitData = { attachment_ids: string[]; }; -const CreateTypeFormModal = ({ formSettings, anchor }: TProps) => { +function CreateTypeFormModal({ formSettings, anchor }: TProps) { // state const [success, setSuccess] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false); @@ -185,6 +185,6 @@ const CreateTypeFormModal = ({ formSettings, anchor }: TProps) => { ); -}; +} export default CreateTypeFormModal; diff --git a/apps/space/ee/components/intake/create/form.tsx b/apps/space/ee/components/intake/create/form.tsx index 6c8ebb48a2..5f1e450c2e 100644 --- a/apps/space/ee/components/intake/create/form.tsx +++ b/apps/space/ee/components/intake/create/form.tsx @@ -26,7 +26,7 @@ type TProps = { placeholder?: string | ((isFocused: boolean, value: string) => string); }; -const IssueForm = observer((props: TProps) => { +const IssueForm = observer(function IssueForm(props: TProps) { const { project, isSubmitting, descriptionEditorRef, anchor } = props; // store hooks const { workspace: workspaceID, project_details } = usePublish(anchor); diff --git a/apps/space/ee/components/intake/create/success.tsx b/apps/space/ee/components/intake/create/success.tsx index d43d4cf012..0ac8878e1f 100644 --- a/apps/space/ee/components/intake/create/success.tsx +++ b/apps/space/ee/components/intake/create/success.tsx @@ -8,7 +8,7 @@ import { cn } from "@plane/utils"; import SuccessDark from "@/app/assets/instance/intake-sent-dark.png?url"; import SuccessLight from "@/app/assets/instance/intake-sent-light.png?url"; -const FormSuccess = ({ onReset }: { onReset: () => void }) => { +function FormSuccess({ onReset }: { onReset: () => void }) { const { resolvedTheme } = useTheme(); const { t } = useTranslation(); return ( @@ -35,5 +35,6 @@ const FormSuccess = ({ onReset }: { onReset: () => void }) => { ); -}; +} + export default FormSuccess; diff --git a/apps/space/ee/components/intake/info.tsx b/apps/space/ee/components/intake/info.tsx index afd5f9dea7..9bd7680f51 100644 --- a/apps/space/ee/components/intake/info.tsx +++ b/apps/space/ee/components/intake/info.tsx @@ -12,7 +12,7 @@ const info = [ "To check for the status of that work item, get in touch with the project’s manager, admin, or whoever sent you the link to this page.", ]; -const IntakeInfo = () => { +function IntakeInfo() { const popoverButtonRef = useRef(null); const { t } = useTranslation(); return ( @@ -56,5 +56,6 @@ const IntakeInfo = () => { ); -}; +} + export default IntakeInfo; diff --git a/apps/space/ee/components/issue-layouts/calendar/base-calendar-root.tsx b/apps/space/ee/components/issue-layouts/calendar/base-calendar-root.tsx index 2ff07e5cdf..5ea45ef886 100644 --- a/apps/space/ee/components/issue-layouts/calendar/base-calendar-root.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/base-calendar-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect } from "react"; import { observer } from "mobx-react"; // plane @@ -17,7 +15,7 @@ interface IBaseCalendarRoot { anchor: string; } -export const BaseCalendarRoot = observer((props: IBaseCalendarRoot) => { +export const BaseCalendarRoot = observer(function BaseCalendarRoot(props: IBaseCalendarRoot) { const { anchor } = props; const { viewData } = useView(); diff --git a/apps/space/ee/components/issue-layouts/calendar/calendar.tsx b/apps/space/ee/components/issue-layouts/calendar/calendar.tsx index 3a73e2f0ba..45906fa8a9 100644 --- a/apps/space/ee/components/issue-layouts/calendar/calendar.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/calendar.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef, useState } from "react"; import { observer } from "mobx-react"; // plane @@ -28,12 +26,12 @@ type Props = { showWeekends: boolean; issueCalendarView: ICalendarStore; loadMoreIssues: (dateString: string) => void; - getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader; + getIssueLoader: (groupId?: string, subGroupId?: string) => TLoader; getPaginationData: (groupId: string | undefined) => TPaginationData | undefined; getGroupIssueCount: (groupId: string | undefined) => number | undefined; }; -export const CalendarChart: React.FC = observer((props) => { +export const CalendarChart = observer(function CalendarChart(props: Props) { const { getIssueById, groupedIssueIds, diff --git a/apps/space/ee/components/issue-layouts/calendar/day-tile.tsx b/apps/space/ee/components/issue-layouts/calendar/day-tile.tsx index 053d609b40..b73acbe39c 100644 --- a/apps/space/ee/components/issue-layouts/calendar/day-tile.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/day-tile.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef } from "react"; import { observer } from "mobx-react"; // types @@ -25,7 +23,7 @@ type Props = { setSelectedDate: (date: Date) => void; }; -export const CalendarDayTile: React.FC = observer((props) => { +export const CalendarDayTile = observer(function CalendarDayTile(props: Props) { const { date, getIssueById, diff --git a/apps/space/ee/components/issue-layouts/calendar/dropdowns/months-dropdown.tsx b/apps/space/ee/components/issue-layouts/calendar/dropdowns/months-dropdown.tsx index d2db3ec09f..ffb8ef9241 100644 --- a/apps/space/ee/components/issue-layouts/calendar/dropdowns/months-dropdown.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/dropdowns/months-dropdown.tsx @@ -13,7 +13,7 @@ type Props = { calendarLayout: "month" | "week" | undefined; }; -export const CalendarMonthsDropdown: React.FC = observer((props: Props) => { +export const CalendarMonthsDropdown = observer(function CalendarMonthsDropdown(props: Props) { const { calendarLayout } = props; const issueCalendarView = useCalendarView(); diff --git a/apps/space/ee/components/issue-layouts/calendar/header.tsx b/apps/space/ee/components/issue-layouts/calendar/header.tsx index 976c978931..a1b6e8e355 100644 --- a/apps/space/ee/components/issue-layouts/calendar/header.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/header.tsx @@ -11,7 +11,7 @@ interface ICalendarHeader { setSelectedDate: (date: Date) => void; } -export const CalendarHeader: React.FC = observer((props) => { +export const CalendarHeader = observer(function CalendarHeader(props: ICalendarHeader) { const { setSelectedDate, calendarLayout } = props; const issueCalendarView = useCalendarView(); diff --git a/apps/space/ee/components/issue-layouts/calendar/issue-block-root.tsx b/apps/space/ee/components/issue-layouts/calendar/issue-block-root.tsx index b94f9511dd..dcdb3cd006 100644 --- a/apps/space/ee/components/issue-layouts/calendar/issue-block-root.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/issue-block-root.tsx @@ -9,7 +9,7 @@ type Props = { issueId: string; }; -export const CalendarIssueBlockRoot: React.FC = (props) => { +export function CalendarIssueBlockRoot(props: Props) { const { getIssueById, issueId } = props; const issueRef = useRef(null); @@ -19,4 +19,4 @@ export const CalendarIssueBlockRoot: React.FC = (props) => { if (!issue) return null; return ; -}; +} diff --git a/apps/space/ee/components/issue-layouts/calendar/issue-block.tsx b/apps/space/ee/components/issue-layouts/calendar/issue-block.tsx index 5b66928a7f..325344ceda 100644 --- a/apps/space/ee/components/issue-layouts/calendar/issue-block.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/issue-block.tsx @@ -1,5 +1,3 @@ -"use client"; - /* eslint-disable react/display-name */ import { useRef, forwardRef } from "react"; import { observer } from "mobx-react"; diff --git a/apps/space/ee/components/issue-layouts/calendar/issue-blocks.tsx b/apps/space/ee/components/issue-layouts/calendar/issue-blocks.tsx index 4d749b85bd..1106bedb7c 100644 --- a/apps/space/ee/components/issue-layouts/calendar/issue-blocks.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/issue-blocks.tsx @@ -18,7 +18,7 @@ type Props = { issueIdList: string[]; }; -export const CalendarIssueBlocks: React.FC = observer((props) => { +export const CalendarIssueBlocks = observer(function CalendarIssueBlocks(props: Props) { const { date, getIssueById, issueIdList, loadMoreIssues } = props; const formattedDatePayload = renderFormattedPayloadDate(date); diff --git a/apps/space/ee/components/issue-layouts/calendar/week-days.tsx b/apps/space/ee/components/issue-layouts/calendar/week-days.tsx index 404b438730..6e630f55d7 100644 --- a/apps/space/ee/components/issue-layouts/calendar/week-days.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/week-days.tsx @@ -20,7 +20,7 @@ type Props = { setSelectedDate: (date: Date) => void; }; -export const CalendarWeekDays: React.FC = observer((props) => { +export const CalendarWeekDays = observer(function CalendarWeekDays(props: Props) { const { getIssueById, groupedIssueIds, diff --git a/apps/space/ee/components/issue-layouts/calendar/week-header.tsx b/apps/space/ee/components/issue-layouts/calendar/week-header.tsx index 1a876d05b6..ed269d1b8d 100644 --- a/apps/space/ee/components/issue-layouts/calendar/week-header.tsx +++ b/apps/space/ee/components/issue-layouts/calendar/week-header.tsx @@ -7,7 +7,7 @@ type Props = { showWeekends: boolean; }; -export const CalendarWeekHeader: React.FC = observer((props) => { +export const CalendarWeekHeader = observer(function CalendarWeekHeader(props: Props) { const { isLoading, showWeekends } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/cycle.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/cycle.tsx index 05f0355d4d..1ff2b875a3 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/cycle.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/cycle.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { CloseIcon, CycleGroupIcon } from "@plane/propel/icons"; import type { TCycleGroups } from "@plane/types"; @@ -13,7 +11,7 @@ type Props = { values: string[]; }; -export const AppliedCycleFilters: React.FC = observer((props) => { +export const AppliedCycleFilters = observer(function AppliedCycleFilters(props: Props) { const { handleRemove, values } = props; // store hooks const { getCycleById } = useCycle(); diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/date.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/date.tsx index 840363f01d..dc457f5a0f 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/date.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/date.tsx @@ -12,7 +12,7 @@ type Props = { values: string[]; }; -export const AppliedDateFilters: React.FC = observer((props) => { +export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) { const { handleRemove, values } = props; const getDateLabel = (value: string): string => { diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/filters-list.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/filters-list.tsx index 01b6719a7d..0c94b8679a 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/filters-list.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/filters-list.tsx @@ -24,7 +24,7 @@ type Props = { const membersFilters = ["assignees", "mentions", "created_by", "subscriber"]; const dateFilters = ["start_date", "target_date"]; -export const AppliedFiltersList: React.FC = observer((props) => { +export const AppliedFiltersList = observer(function AppliedFiltersList(props: Props) { const { appliedFilters, handleClearAllFilters, handleRemoveFilter } = props; if (!appliedFilters) return null; diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/label.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/label.tsx index b1baac35ab..f4b04ff3fe 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/label.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/label.tsx @@ -9,7 +9,7 @@ type Props = { values: string[]; }; -export const AppliedLabelsFilters: React.FC = observer((props) => { +export const AppliedLabelsFilters = observer(function AppliedLabelsFilters(props: Props) { const { handleRemove, values } = props; const { getLabelsByIds } = useLabel(); diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/members.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/members.tsx index 41e951352e..f3e1edb2bf 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/members.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/members.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { CloseIcon } from "@plane/propel/icons"; // ui @@ -12,7 +10,7 @@ type Props = { values: string[]; }; -export const AppliedMembersFilters: React.FC = observer((props) => { +export const AppliedMembersFilters = observer(function AppliedMembersFilters(props: Props) { const { handleRemove, values } = props; const { getMemberById } = useMember(); diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/module.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/module.tsx index 8131bfe5d6..444d3fec44 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/module.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/module.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { CloseIcon, DiceIcon } from "@plane/propel/icons"; // hooks @@ -11,7 +9,7 @@ type Props = { values: string[]; }; -export const AppliedModuleFilters: React.FC = observer((props) => { +export const AppliedModuleFilters = observer(function AppliedModuleFilters(props: Props) { const { handleRemove, values } = props; // store hooks const { getModuleById } = useModule(); diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/priority.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/priority.tsx index 64f4e17929..7be7a3edfd 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/priority.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/priority.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // icons @@ -12,7 +10,7 @@ type Props = { values: string[]; }; -export const AppliedPriorityFilters: React.FC = observer((props) => { +export const AppliedPriorityFilters = observer(function AppliedPriorityFilters(props: Props) { const { handleRemove, values } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/root.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/root.tsx index b49afe785b..9ead1c3a94 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/root.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback } from "react"; import { cloneDeep } from "lodash-es"; @@ -15,7 +13,7 @@ type Props = { anchor: string; }; -export const ViewAppliedFilters: FC = observer((props) => { +export const ViewAppliedFilters = observer(function ViewAppliedFilters(props: Props) { const { anchor } = props; // store hooks const { getIssueFilters, initIssueFilters, updateIssueFilters } = useViewIssuesFilter(); diff --git a/apps/space/ee/components/issue-layouts/filters/applied-filters/state.tsx b/apps/space/ee/components/issue-layouts/filters/applied-filters/state.tsx index a3102afa90..f3c2afb495 100644 --- a/apps/space/ee/components/issue-layouts/filters/applied-filters/state.tsx +++ b/apps/space/ee/components/issue-layouts/filters/applied-filters/state.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EIconSize } from "@plane/constants"; @@ -12,7 +10,7 @@ type Props = { values: string[]; }; -export const AppliedStateFilters: React.FC = observer((props) => { +export const AppliedStateFilters = observer(function AppliedStateFilters(props: Props) { const { handleRemove, values } = props; const { getStateById } = useStates(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/assignee.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/assignee.tsx index 0584170eb8..08e5ae442f 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/assignee.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/assignee.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterAssignees: React.FC = observer((props: Props) => { +export const FilterAssignees = observer(function FilterAssignees(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; // store const { getMembersByIds, members: storeMembers } = useMember(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/created-by.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/created-by.tsx index d3acd5a55f..84eda5e4e5 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/created-by.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/created-by.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterCreatedBy: React.FC = observer((props: Props) => { +export const FilterCreatedBy = observer(function FilterCreatedBy(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; // store const { getMembersByIds, members: storeMembers } = useMember(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/cycle.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/cycle.tsx index 19be6c991e..38a10ebde3 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/cycle.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/cycle.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterCycle: React.FC = observer((props) => { +export const FilterCycle = observer(function FilterCycle(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; // hooks diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/filters-selection.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/filters-selection.tsx index 47c4c2be44..f9f166a53d 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/filters-selection.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/filters-selection.tsx @@ -23,7 +23,7 @@ type Props = { handleFiltersUpdate: (key: keyof IIssueFilterOptions, value: string | string[]) => void; }; -export const FilterSelection: React.FC = observer((props) => { +export const FilterSelection = observer(function FilterSelection(props: Props) { const { filters, possibleFiltersForView, handleFiltersUpdate } = props; // states const [filtersSearchQuery, setFiltersSearchQuery] = useState(""); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/labels.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/labels.tsx index b38ff67652..2327df7057 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/labels.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/labels.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -9,9 +7,9 @@ import { FilterHeader } from "@/components/issues/filters/helpers/filter-header" import { FilterOption } from "@/components/issues/filters/helpers/filter-option"; import { useLabel } from "@/hooks/store/use-label"; -const LabelIcons = ({ color }: { color: string }) => ( - -); +function LabelIcons({ color }: { color: string }) { + return ; +} type Props = { appliedFilters: string[] | null; @@ -20,7 +18,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterLabels: React.FC = observer((props) => { +export const FilterLabels = observer(function FilterLabels(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; // store const { getLabelsByIds, labels: storeLabels } = useLabel(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/module.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/module.tsx index 8178c61362..f5ea3ad817 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/module.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/module.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -19,7 +17,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterModule: React.FC = observer((props) => { +export const FilterModule = observer(function FilterModule(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; // hooks const { getModulesByIds, modules: storeModules } = useModule(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/priority.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/priority.tsx index 8c480e4d25..f4288ff19b 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/priority.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/priority.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; // plane internal packages @@ -17,7 +15,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterPriority: React.FC = observer((props) => { +export const FilterPriority = observer(function FilterPriority(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; // i18n const { t } = useTranslation(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/start-date.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/start-date.tsx index e3ed0c183a..f0c97f2dd9 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/start-date.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/start-date.tsx @@ -13,7 +13,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterStartDate: React.FC = observer((props) => { +export const FilterStartDate = observer(function FilterStartDate(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; const [previewEnabled, setPreviewEnabled] = useState(true); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/state.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/state.tsx index 9a04a6e582..61c53690bb 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/state.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/state.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterState: React.FC = observer((props) => { +export const FilterState = observer(function FilterState(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; //store const { sortedStates: storeStates } = useStates(); diff --git a/apps/space/ee/components/issue-layouts/filters/header/filters/target-date.tsx b/apps/space/ee/components/issue-layouts/filters/header/filters/target-date.tsx index 1418b4c21e..49a7a66533 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/filters/target-date.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/filters/target-date.tsx @@ -13,7 +13,7 @@ type Props = { allowedValues: string[] | undefined; }; -export const FilterTargetDate: React.FC = observer((props) => { +export const FilterTargetDate = observer(function FilterTargetDate(props: Props) { const { appliedFilters, handleUpdate, searchQuery, allowedValues } = props; const [previewEnabled, setPreviewEnabled] = useState(true); diff --git a/apps/space/ee/components/issue-layouts/filters/header/helpers/dropdown.tsx b/apps/space/ee/components/issue-layouts/filters/header/helpers/dropdown.tsx index 4159b5c9c9..400cbbea98 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/helpers/dropdown.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/helpers/dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { Fragment, useState } from "react"; import type { Placement } from "@popperjs/core"; import { usePopper } from "react-popper"; @@ -21,7 +19,7 @@ type Props = { isFiltersApplied?: boolean; }; -export const FiltersDropdown: React.FC = (props) => { +export function FiltersDropdown(props: Props) { const { children, icon, @@ -108,4 +106,4 @@ export const FiltersDropdown: React.FC = (props) => { }} ); -}; +} diff --git a/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-header.tsx b/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-header.tsx index e326d7a692..b120ca5323 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-header.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-header.tsx @@ -8,15 +8,17 @@ interface IFilterHeader { handleIsPreviewEnabled: () => void; } -export const FilterHeader = ({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) => ( -
-
{title}
- -
-); +export function FilterHeader({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) { + return ( +
+
{title}
+ +
+ ); +} diff --git a/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-option.tsx b/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-option.tsx index 26c7bfaf55..f05e80faa7 100644 --- a/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-option.tsx +++ b/apps/space/ee/components/issue-layouts/filters/header/helpers/filter-option.tsx @@ -11,7 +11,7 @@ type Props = { activePulse?: boolean; }; -export const FilterOption: React.FC = (props) => { +export function FilterOption(props: Props) { const { icon, isChecked, multiple = true, onClick, title, activePulse = false } = props; return ( @@ -36,4 +36,4 @@ export const FilterOption: React.FC = (props) => { )} ); -}; +} diff --git a/apps/space/ee/components/issue-layouts/filters/root.tsx b/apps/space/ee/components/issue-layouts/filters/root.tsx index fbb2509ac6..cf2ee97803 100644 --- a/apps/space/ee/components/issue-layouts/filters/root.tsx +++ b/apps/space/ee/components/issue-layouts/filters/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback } from "react"; import { cloneDeep } from "lodash-es"; @@ -18,7 +16,7 @@ type Props = { anchor: string; }; -export const ViewIssueFilters: FC = observer((props) => { +export const ViewIssueFilters = observer(function ViewIssueFilters(props: Props) { const { anchor } = props; // hooks const { possibleFiltersForView } = useView(); diff --git a/apps/space/ee/components/issue-layouts/gantt/base-gantt-root.tsx b/apps/space/ee/components/issue-layouts/gantt/base-gantt-root.tsx index c6d960ff43..4be2065f84 100644 --- a/apps/space/ee/components/issue-layouts/gantt/base-gantt-root.tsx +++ b/apps/space/ee/components/issue-layouts/gantt/base-gantt-root.tsx @@ -22,7 +22,7 @@ interface IBaseGanttRoot { anchor: string; } -export const BaseGanttRoot: React.FC = observer((props: IBaseGanttRoot) => { +export const BaseGanttRoot = observer(function BaseGanttRoot(props: IBaseGanttRoot) { const { anchor } = props; // rstore const { @@ -66,7 +66,7 @@ export const BaseGanttRoot: React.FC = observer((props: IBaseGan if (!Array.isArray(issueIds)) return null; const getBlockById = useCallback( - (id: string, currentViewData?: ChartDataType | undefined) => { + (id: string, currentViewData?: ChartDataType) => { const issue = getIssueById(id); if (!issue) return; diff --git a/apps/space/ee/components/issue-layouts/gantt/blocks.tsx b/apps/space/ee/components/issue-layouts/gantt/blocks.tsx index b6b12bf93d..a5c4683735 100644 --- a/apps/space/ee/components/issue-layouts/gantt/blocks.tsx +++ b/apps/space/ee/components/issue-layouts/gantt/blocks.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { useParams } from "next/navigation"; @@ -18,7 +16,7 @@ type Props = { issueId: string; }; -export const IssueGanttBlock: React.FC = observer((props) => { +export const IssueGanttBlock = observer(function IssueGanttBlock(props: Props) { const { issueId } = props; // store hooks const { getStateById } = useStates(); @@ -62,7 +60,7 @@ export const IssueGanttBlock: React.FC = observer((props) => { }); // rendering issues on gantt sidebar -export const IssueGanttSidebarBlock: React.FC = observer((props) => { +export const IssueGanttSidebarBlock = observer(function IssueGanttSidebarBlock(props: Props) { const { issueId } = props; // router const { anchor } = useParams(); diff --git a/apps/space/ee/components/issue-layouts/kanban/base-kanban-root.tsx b/apps/space/ee/components/issue-layouts/kanban/base-kanban-root.tsx index b038856572..56158129bf 100644 --- a/apps/space/ee/components/issue-layouts/kanban/base-kanban-root.tsx +++ b/apps/space/ee/components/issue-layouts/kanban/base-kanban-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useRef } from "react"; import { debounce } from "lodash-es"; import { observer } from "mobx-react"; @@ -15,7 +13,7 @@ import { useViewIssues } from "@/plane-web/hooks/store/use-view-issues"; type Props = { anchor: string; }; -export const BaseKanBanRoot: React.FC = observer((props: Props) => { +export const BaseKanBanRoot = observer(function BaseKanBanRoot(props: Props) { const { anchor } = props; // store hooks const { diff --git a/apps/space/ee/components/issue-layouts/list/base-list-root.tsx b/apps/space/ee/components/issue-layouts/list/base-list-root.tsx index 68aa0f10f7..58acbc4af1 100644 --- a/apps/space/ee/components/issue-layouts/list/base-list-root.tsx +++ b/apps/space/ee/components/issue-layouts/list/base-list-root.tsx @@ -14,7 +14,7 @@ type Props = { anchor: string; }; -export const BaseListRoot = observer((props: Props) => { +export const BaseListRoot = observer(function BaseListRoot(props: Props) { const { anchor } = props; // store hooks const { diff --git a/apps/space/ee/components/issue-layouts/root.tsx b/apps/space/ee/components/issue-layouts/root.tsx index a2d9f87c0c..3cb45619a7 100644 --- a/apps/space/ee/components/issue-layouts/root.tsx +++ b/apps/space/ee/components/issue-layouts/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect } from "react"; import { observer } from "mobx-react"; @@ -30,7 +28,7 @@ type Props = { publishSettings: PublishStore; }; -export const ViewLayoutsRoot: FC = observer((props) => { +export const ViewLayoutsRoot = observer(function ViewLayoutsRoot(props: Props) { const { peekId, publishSettings } = props; // router const router = useRouter(); diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/base-spreadsheet-root.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/base-spreadsheet-root.tsx index 2f652d7dbf..326834e2ca 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/base-spreadsheet-root.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/base-spreadsheet-root.tsx @@ -15,7 +15,7 @@ type Props = { anchor: string; }; -export const BaseSpreadsheetRoot = observer((props: Props) => { +export const BaseSpreadsheetRoot = observer(function BaseSpreadsheetRoot(props: Props) { const { anchor } = props; const { groupedIssueIds, diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/assignee-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/assignee-column.tsx index 208a6b1fac..6e0944a6be 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/assignee-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/assignee-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetAssigneeColumn: React.FC = observer((props: Props) => { +export const SpreadsheetAssigneeColumn = observer(function SpreadsheetAssigneeColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/attachment-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/attachment-column.tsx index 13cd64332a..c8563cda16 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/attachment-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/attachment-column.tsx @@ -7,7 +7,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetAttachmentColumn: React.FC = observer((props) => { +export const SpreadsheetAttachmentColumn = observer(function SpreadsheetAttachmentColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/created-on-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/created-on-column.tsx index d56e1bd60d..fe0e6ad995 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/created-on-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/created-on-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetCreatedOnColumn: React.FC = observer((props: Props) => { +export const SpreadsheetCreatedOnColumn = observer(function SpreadsheetCreatedOnColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/cycle-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/cycle-column.tsx index 8bf4c95acd..7c38a00584 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/cycle-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/cycle-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetCycleColumn: React.FC = observer((props) => { +export const SpreadsheetCycleColumn = observer(function SpreadsheetCycleColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/due-date-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/due-date-column.tsx index 079c5a3ce0..8aa778d3da 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/due-date-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/due-date-column.tsx @@ -11,7 +11,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetDueDateColumn: React.FC = observer((props: Props) => { +export const SpreadsheetDueDateColumn = observer(function SpreadsheetDueDateColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/header-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/header-column.tsx index e0dc1cb2e3..ae1892e2dd 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/header-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/header-column.tsx @@ -1,5 +1,3 @@ -"use client"; - //ui import type { IIssueDisplayProperties } from "@plane/types"; import { SPREADSHEET_PROPERTY_DETAILS } from ".."; @@ -11,7 +9,7 @@ interface Props { property: keyof IIssueDisplayProperties; } -export const HeaderColumn = (props: Props) => { +export function HeaderColumn(props: Props) { const { property } = props; const propertyDetails = SPREADSHEET_PROPERTY_DETAILS[property]; @@ -26,4 +24,4 @@ export const HeaderColumn = (props: Props) => { ); -}; +} diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/label-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/label-column.tsx index d47137f294..ca718410a1 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/label-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/label-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetLabelColumn: React.FC = observer((props: Props) => { +export const SpreadsheetLabelColumn = observer(function SpreadsheetLabelColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/link-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/link-column.tsx index 6eb9ac62a1..5e5105549b 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/link-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/link-column.tsx @@ -7,7 +7,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetLinkColumn: React.FC = observer((props: Props) => { +export const SpreadsheetLinkColumn = observer(function SpreadsheetLinkColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/module-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/module-column.tsx index 36ebae7050..b620ad5789 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/module-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/module-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetModuleColumn: React.FC = observer((props) => { +export const SpreadsheetModuleColumn = observer(function SpreadsheetModuleColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/priority-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/priority-column.tsx index 4dc6dfd761..0c0777e738 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/priority-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/priority-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetPriorityColumn: React.FC = observer((props: Props) => { +export const SpreadsheetPriorityColumn = observer(function SpreadsheetPriorityColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/start-date-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/start-date-column.tsx index 1cb5c1b7fe..f51b0bad04 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/start-date-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/start-date-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetStartDateColumn: React.FC = observer((props: Props) => { +export const SpreadsheetStartDateColumn = observer(function SpreadsheetStartDateColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/state-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/state-column.tsx index a3c361b5e1..60b12f960e 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/state-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/state-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetStateColumn: React.FC = observer((props) => { +export const SpreadsheetStateColumn = observer(function SpreadsheetStateColumn(props: Props) { const { issue } = props; if (!issue.state_id) return null; diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/sub-issue-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/sub-issue-column.tsx index c22aad0ff5..cb352a4937 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/sub-issue-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/sub-issue-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetSubIssueColumn: React.FC = observer((props: Props) => { +export const SpreadsheetSubIssueColumn = observer(function SpreadsheetSubIssueColumn(props: Props) { const { issue } = props; const subIssueCount = issue?.sub_issues_count ?? 0; diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/columns/updated-on-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/columns/updated-on-column.tsx index 6f861c5842..66784237fb 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/columns/updated-on-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/columns/updated-on-column.tsx @@ -9,7 +9,7 @@ type Props = { issue: IIssue; }; -export const SpreadsheetUpdatedOnColumn: React.FC = observer((props: Props) => { +export const SpreadsheetUpdatedOnColumn = observer(function SpreadsheetUpdatedOnColumn(props: Props) { const { issue } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/issue-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/issue-column.tsx index fc08c3b432..fef1d1d37a 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/issue-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/issue-column.tsx @@ -12,7 +12,7 @@ type Props = { property: keyof IIssueDisplayProperties; }; -export const IssueColumn = observer((props: Props) => { +export const IssueColumn = observer(function IssueColumn(props: Props) { const { displayProperties, issueDetail, property } = props; // router diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/issue-row.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/issue-row.tsx index 5be6ff0d20..447b7ab22c 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/issue-row.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/issue-row.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { MutableRefObject } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,7 @@ interface Props { spreadsheetColumnsList: (keyof IIssueDisplayProperties)[]; } -export const SpreadsheetIssueRow = observer((props: Props) => { +export const SpreadsheetIssueRow = observer(function SpreadsheetIssueRow(props: Props) { const { displayProperties, issueId, isScrolled, spreadsheetColumnsList } = props; return ( @@ -49,7 +47,7 @@ interface IssueRowDetailsProps { spreadsheetColumnsList: (keyof IIssueDisplayProperties)[]; } -const IssueRowDetails = observer((props: IssueRowDetailsProps) => { +const IssueRowDetails = observer(function IssueRowDetails(props: IssueRowDetailsProps) { const { anchor } = useParams(); const { project_details } = usePublish(anchor.toString()); const { displayProperties, issueId, isScrolled, spreadsheetColumnsList } = props; diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header-column.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header-column.tsx index b28279edae..24a77c89fa 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header-column.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header-column.tsx @@ -9,7 +9,7 @@ interface Props { displayProperties: IIssueDisplayProperties; property: keyof IIssueDisplayProperties; } -export const SpreadsheetHeaderColumn = observer((props: Props) => { +export const SpreadsheetHeaderColumn = observer(function SpreadsheetHeaderColumn(props: Props) { const { displayProperties, property } = props; return ( diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header.tsx index 1a54bfa8d2..e7d40e22cb 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-header.tsx @@ -9,7 +9,7 @@ interface Props { spreadsheetColumnsList: (keyof IIssueDisplayProperties)[]; } -export const SpreadsheetHeader = observer((props: Props) => { +export const SpreadsheetHeader = observer(function SpreadsheetHeader(props: Props) { const { displayProperties, spreadsheetColumnsList } = props; // router diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-table.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-table.tsx index d6366af982..ab48ea468b 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-table.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-table.tsx @@ -21,25 +21,27 @@ type Props = { spreadsheetColumnsList: (keyof IIssueDisplayProperties)[]; }; -const SpreadsheetIssueRowLoader = (props: { columnCount: number }) => ( - - -
- - -
- - {[...Array(props.columnCount)].map((_, colIndex) => ( - -
- +function SpreadsheetIssueRowLoader(props: { columnCount: number }) { + return ( + + +
+ +
- ))} - -); + {[...Array(props.columnCount)].map((_, colIndex) => ( + +
+ +
+ + ))} + + ); +} -export const SpreadsheetTable = observer((props: Props) => { +export const SpreadsheetTable = observer(function SpreadsheetTable(props: Props) { const { displayProperties, issueIds, canLoadMoreIssues, containerRef, loadMoreIssues, spreadsheetColumnsList } = props; diff --git a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-view.tsx b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-view.tsx index 5641ad446a..2e863abe90 100644 --- a/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-view.tsx +++ b/apps/space/ee/components/issue-layouts/spreadsheet/spreadsheet-view.tsx @@ -16,7 +16,7 @@ type Props = { loadMoreIssues: () => void; }; -export const SpreadsheetView: React.FC = observer((props) => { +export const SpreadsheetView = observer(function SpreadsheetView(props: Props) { const { displayProperties, issueIds, canLoadMoreIssues, loadMoreIssues } = props; // refs const containerRef = useRef(null); diff --git a/apps/space/ee/components/navbar/controls.tsx b/apps/space/ee/components/navbar/controls.tsx index dcb839b648..6bf5ecbc8f 100644 --- a/apps/space/ee/components/navbar/controls.tsx +++ b/apps/space/ee/components/navbar/controls.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect } from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ export type NavbarControlsProps = { publishSettings: PublishStore; }; -export const ViewNavbarControls: FC = observer((props) => { +export const ViewNavbarControls = observer(function ViewNavbarControls(props: NavbarControlsProps) { // props const { publishSettings } = props; // hooks diff --git a/apps/space/ee/components/navbar/root.tsx b/apps/space/ee/components/navbar/root.tsx index e35f222662..896d4e866d 100644 --- a/apps/space/ee/components/navbar/root.tsx +++ b/apps/space/ee/components/navbar/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // ui @@ -15,7 +13,7 @@ type Props = { publishSettings: PublishStore; }; -export const ViewNavbarRoot: FC = observer((props) => { +export const ViewNavbarRoot = observer(function ViewNavbarRoot(props: Props) { const { publishSettings } = props; const { viewData } = useView(); diff --git a/apps/space/ee/components/pages/error.tsx b/apps/space/ee/components/pages/error.tsx index f657995dbf..9eb98ef7da 100644 --- a/apps/space/ee/components/pages/error.tsx +++ b/apps/space/ee/components/pages/error.tsx @@ -1,16 +1,18 @@ // assets import SomethingWentWrongImage from "@/app/assets/something-went-wrong.svg?url"; -export const PageDetailsError = () => ( -
-
-
-
- Oops! Something went wrong +export function PageDetailsError() { + return ( +
+
+
+
+ Oops! Something went wrong +
+

Oops! Something went wrong.

+

The page does not exist. Please check the URL.

-

Oops! Something went wrong.

-

The page does not exist. Please check the URL.

-
-); + ); +} diff --git a/apps/space/ee/components/pages/main-content.tsx b/apps/space/ee/components/pages/main-content.tsx index 938aa12d06..f80ce33c3c 100644 --- a/apps/space/ee/components/pages/main-content.tsx +++ b/apps/space/ee/components/pages/main-content.tsx @@ -25,7 +25,7 @@ type Props = { anchor: string; }; -export const PageDetailsMainContent: React.FC = observer((props) => { +export const PageDetailsMainContent = observer(function PageDetailsMainContent(props: Props) { const { anchor } = props; const editorRef = useRef(null); diff --git a/apps/space/ee/components/pages/page-head.tsx b/apps/space/ee/components/pages/page-head.tsx index 733255548f..e87da5b0c4 100644 --- a/apps/space/ee/components/pages/page-head.tsx +++ b/apps/space/ee/components/pages/page-head.tsx @@ -6,17 +6,19 @@ import type { IPage } from "@/plane-web/store/pages"; type Props = { pageDetails: IPage; }; -export const PageHeader: React.FC = observer(({ pageDetails }) => ( -
-
-
- {pageDetails.logo_props?.in_use ? ( - - ) : ( - - )} +export const PageHeader = observer(function PageHeader({ pageDetails }: Props) { + return ( +
+
+
+ {pageDetails.logo_props?.in_use ? ( + + ) : ( + + )} +
+

{pageDetails.name}

-

{pageDetails.name}

-
-)); + ); +}); diff --git a/apps/space/ee/components/pages/page/root.tsx b/apps/space/ee/components/pages/page/root.tsx index 118da4dfc4..b8e9ed37b6 100644 --- a/apps/space/ee/components/pages/page/root.tsx +++ b/apps/space/ee/components/pages/page/root.tsx @@ -15,16 +15,18 @@ export const getPageName = (name: string | undefined) => { return name; }; -export const ArchivedBadge: React.FC = () => ( - } /> -); +export function ArchivedBadge() { + return } />; +} -export const Badge = ({ text, icon }: { text: string; icon?: React.ReactNode }) => ( -
- {icon} - {text} -
-); +export function Badge({ text, icon }: { text: string; icon?: React.ReactNode }) { + return ( +
+ {icon} + {text} +
+ ); +} type Props = { pageId: string; @@ -41,7 +43,7 @@ type PageDisplayState = { bgColor?: string; }; -export const PageEmbedCardRoot: React.FC = observer((props) => { +export const PageEmbedCardRoot = observer(function PageEmbedCardRoot(props: Props) { const router = useRouter(); const { pageId } = props; diff --git a/apps/space/ee/components/pages/work-item-embed.tsx b/apps/space/ee/components/pages/work-item-embed.tsx index 52d931a37f..4402237a1c 100644 --- a/apps/space/ee/components/pages/work-item-embed.tsx +++ b/apps/space/ee/components/pages/work-item-embed.tsx @@ -13,7 +13,7 @@ type Props = { workItemId: string; }; -export const WorkItemEmbedCard: React.FC = observer((props) => { +export const WorkItemEmbedCard = observer(function WorkItemEmbedCard(props: Props) { const { anchor, workItemId } = props; // store hooks const pageDetails = usePage(anchor); diff --git a/apps/space/helpers/authentication.helper.tsx b/apps/space/helpers/authentication.helper.tsx index d2472665de..9981f7c37d 100644 --- a/apps/space/helpers/authentication.helper.tsx +++ b/apps/space/helpers/authentication.helper.tsx @@ -86,7 +86,7 @@ export type TAuthErrorInfo = { }; const errorCodeMessages: { - [key in EAuthenticationErrorCodes]: { title: string; message: (email?: string | undefined) => React.ReactNode }; + [key in EAuthenticationErrorCodes]: { title: string; message: (email?: string) => React.ReactNode }; } = { // global [EAuthenticationErrorCodes.INSTANCE_NOT_CONFIGURED]: { @@ -156,7 +156,7 @@ const errorCodeMessages: { // sign in [EAuthenticationErrorCodes.USER_ACCOUNT_DEACTIVATED]: { title: `User account deactivated`, - message: () => `User account deactivated. Please contact ${!!SUPPORT_EMAIL ? SUPPORT_EMAIL : "administrator"}.`, + message: () => `User account deactivated. Please contact ${SUPPORT_EMAIL ? SUPPORT_EMAIL : "administrator"}.`, }, [EAuthenticationErrorCodes.USER_DOES_NOT_EXIST]: { @@ -332,10 +332,7 @@ const errorCodeMessages: { }, }; -export const authErrorHandler = ( - errorCode: EAuthenticationErrorCodes, - email?: string | undefined -): TAuthErrorInfo | undefined => { +export const authErrorHandler = (errorCode: EAuthenticationErrorCodes, email?: string): TAuthErrorInfo | undefined => { const bannerAlertErrorCodes = [ EAuthenticationErrorCodes.INSTANCE_NOT_CONFIGURED, EAuthenticationErrorCodes.INVALID_EMAIL, diff --git a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/[chatId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/[chatId]/page.tsx index fcc5512f12..5bd1f88bf9 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/[chatId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/[chatId]/page.tsx @@ -1,6 +1,7 @@ -"use client"; - import { PiChatDetail } from "@/plane-web/components/pi-chat/detail"; -const PiChatPage = () => ; +function PiChatPage() { + return ; +} + export default PiChatPage; diff --git a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/layout.tsx index 97065411cc..770fd204de 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; // plane web imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/new/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/new/page.tsx index fa44ae456d..54cb354d0e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/new/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/new/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { cn } from "@plane/utils"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/page.tsx index 7a4241513a..3387a96129 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/sidebar.tsx index 68e3413673..8ff88b9b32 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/sidebar.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(pi)/pi-chat/sidebar.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -10,7 +9,7 @@ import { ResizableSidebar } from "@/components/sidebar/resizable-sidebar"; import { useAppTheme } from "@/hooks/store/use-app-theme"; import { PiSidebar } from "@/plane-web/components/pi-chat/sidebar"; -export const PiAppSidebar: FC = observer(() => { +export const PiAppSidebar = observer(function PiAppSidebar() { // store hooks const { sidebarCollapsed, diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/error.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/error.tsx index 10051d6e74..d5d9891eb2 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/error.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/error.tsx @@ -1,5 +1,3 @@ -"use client"; - import { CustomError } from "@/components/common/custom-error"; export default function ActiveCyclesError() { 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 7c7beab995..fcd2ead391 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState, useEffect } from "react"; import { observer } from "mobx-react"; import { useRouter } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/epic-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/epic-header.tsx index bbc14b2367..61f525b4f9 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/epic-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/epic-header.tsx @@ -1,4 +1,3 @@ -"use client"; import React, { useRef } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -27,7 +26,7 @@ import { ConvertWorkItemAction } from "@/plane-web/components/epics/conversions" import { ProjectEpicQuickActions } from "@/plane-web/components/epics/quick-actions/epic-quick-action"; import { WithFeatureFlagHOC } from "@/plane-web/components/feature-flags"; -export const EpicItemDetailsHeader = observer(() => { +export const EpicItemDetailsHeader = observer(function EpicItemDetailsHeader() { // router const router = useAppRouter(); const { workspaceSlug, workItem } = useParams(); 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 bb9a541e0c..a1d983b81f 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 @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -16,7 +14,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; // plane web imports import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common"; -export const WorkItemDetailsHeader = observer(() => { +export const WorkItemDetailsHeader = observer(function WorkItemDetailsHeader() { // router const router = useAppRouter(); const { workspaceSlug, workItem } = useParams(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/layout.tsx index 8c7dd211d4..49be39cf6e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/page.tsx index 608e4d37f2..b2fad5ad21 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(detail)/[customerId]/page.tsx @@ -1,7 +1,7 @@ -"use client"; - import { CustomerDetailRoot } from "@/plane-web/components/customers"; -const CustomerDetailPage = () => ; +function CustomerDetailPage() { + return ; +} export default CustomerDetailPage; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/layout.tsx index a7b67c3398..6959dd6b0b 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/page.tsx index dfc9630f2d..433e0492ed 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/(list)/page.tsx @@ -1,4 +1,3 @@ -"use client"; // components import { PageHead } from "@/components/core/page-title"; // hooks @@ -6,7 +5,7 @@ import { useWorkspace } from "@/hooks/store/use-workspace"; // plane web components import { CustomersListRoot } from "@/plane-web/components/customers/list"; -const CustomersListPage = () => { +function CustomersListPage() { // store const { currentWorkspace } = useWorkspace(); // derived values @@ -18,6 +17,6 @@ const CustomersListPage = () => { ); -}; +} export default CustomersListPage; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/layout.tsx index 4dea135c71..92dd484800 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/customers/layout.tsx @@ -1,4 +1,3 @@ -"use client"; import { observer } from "mobx-react"; import { Outlet } from "react-router"; import { IssuePeekOverview } from "@/components/issues/peek-overview"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/header.tsx index 47199b3e79..6cf1f74c99 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/header.tsx @@ -18,7 +18,7 @@ import { DashboardWidgetChartTypesDropdown } from "@/plane-web/components/dashbo // plane web hooks import { useDashboards } from "@/plane-web/hooks/store"; -export const WorkspaceDashboardDetailsHeader = observer(() => { +export const WorkspaceDashboardDetailsHeader = observer(function WorkspaceDashboardDetailsHeader() { // refs const parentRef = useRef(null); // states diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/layout.tsx index 8dbc7891e0..4f3819001d 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/page.tsx index 647a07bfab..054236eeea 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(detail)/[dashboardId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { WorkspaceDashboardDetailsRoot } from "@/plane-web/components/dashboards/workspace-dashboard-details-root"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/header.tsx index 466b96e3d1..318069ed7f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/header.tsx @@ -10,7 +10,7 @@ import { DashboardsListSearch } from "@/plane-web/components/dashboards/list/sea // plane web hooks import { useDashboards } from "@/plane-web/hooks/store"; -export const WorkspaceDashboardsListHeader = observer(() => { +export const WorkspaceDashboardsListHeader = observer(function WorkspaceDashboardsListHeader() { // store hooks const { workspaceDashboards: { canCurrentUserCreateDashboard, toggleCreateUpdateModal, searchQuery, updateSearchQuery }, diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/layout.tsx index 2b256cbb74..c7b7c46a99 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/page.tsx index 18fdc6717c..5605652287 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { DashboardsListLayoutRoot } from "@/plane-web/components/dashboards/list"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/layout.tsx index bef570d547..02991a4fa5 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/dashboards/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import useSWR from "swr"; // plane web components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/layout.tsx index 9904bf86bf..b97aac1305 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // layouts import { Outlet } from "react-router"; import { EInitiativeNavigationItem } from "@plane/types"; @@ -7,13 +5,15 @@ import { AppHeader } from "@/components/core/app-header"; import { ContentWrapper } from "@/components/core/content-wrapper"; import { InitiativesDetailsHeader } from "@/plane-web/components/initiatives/header/root"; -const ProjectDetailLayout = () => ( - <> - } /> - - - - -); +function ProjectDetailLayout() { + return ( + <> + } /> + + + + + ); +} export default ProjectDetailLayout; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/page.tsx index de8163cd04..285346e754 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/(overview)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useTheme } from "next-themes"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/layout.tsx index 05f552effb..83558e59bf 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // layouts import { Outlet } from "react-router"; import { EInitiativeNavigationItem } from "@plane/types"; @@ -7,12 +5,15 @@ import { AppHeader } from "@/components/core/app-header"; import { ContentWrapper } from "@/components/core/content-wrapper"; import { InitiativesDetailsHeader } from "@/plane-web/components/initiatives/header/root"; -const InitiativeScopeLayout = () => ( - <> - } /> - - - - -); +function InitiativeScopeLayout() { + return ( + <> + } /> + + + + + ); +} + export default InitiativeScopeLayout; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/page.tsx index e3d7603d36..6a5dba9b26 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(detail)/[initiativeId]/scope/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useTheme } from "next-themes"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/header.tsx index b32fe00d4e..d0868d6b4e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // plane imports @@ -23,7 +21,7 @@ import { HeaderFilters } from "@/plane-web/components/initiatives/header/filters import { DEFAULT_INITIATIVE_LAYOUT } from "@/plane-web/constants/initiative"; import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives"; -export const InitiativesListHeader = observer(() => { +export const InitiativesListHeader = observer(function InitiativesListHeader() { // router const router = useAppRouter(); const { workspaceSlug } = useParams(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/layout.tsx index e7b96ec494..efc3aea5fa 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; @@ -9,13 +7,15 @@ import { InitiativesFilterProvider } from "@/plane-web/components/initiatives/co // local components import { InitiativesListHeader } from "./header"; -const InitiativesListLayout = () => ( - - } /> - - - - -); +function InitiativesListLayout() { + return ( + + } /> + + + + + ); +} export default InitiativesListLayout; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/page.tsx index a6f3154c20..cf80033e66 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { PageHead } from "@/components/core/page-title"; // hooks diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/layout.tsx index 92a9bae2ca..e04e3465ee 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/initiatives/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // components import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/header.tsx index 8811b23137..ce0c1766c9 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -28,7 +26,7 @@ type TProps = { workspaceSlug: string; }; -export const ProjectAutomationDetailsHeader = observer((props: TProps) => { +export const ProjectAutomationDetailsHeader = observer(function ProjectAutomationDetailsHeader(props: TProps) { const { automationId, projectId, workspaceSlug } = props; // router const router = useAppRouter(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/layout.tsx index c601690714..487eb30a5e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // components import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/page.tsx index 89b14fdcc6..e462bdafba 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/automations/[automationId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx index 05e5182269..2fb3229022 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx @@ -50,11 +50,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() { const [analyticsModal, setAnalyticsModal] = useState(false); // router const router = useAppRouter(); - const { workspaceSlug, projectId, cycleId } = useParams() as { - workspaceSlug: string; - projectId: string; - cycleId: string; - }; + const { workspaceSlug, projectId, cycleId } = useParams(); // i18n const { t } = useTranslation(); // store hooks diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/[epicId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/[epicId]/page.tsx index 9053df082e..ce6bebdac4 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/[epicId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/[epicId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useTheme } from "next-themes"; import { redirect } from "react-router"; // assets diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/header.tsx index 2a3230e6d4..d6831ecef8 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -24,7 +22,7 @@ import { useIssuesActions } from "@/hooks/use-issues-actions"; import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common"; import { ProjectEpicQuickActions } from "@/plane-web/components/epics/quick-actions/epic-quick-action"; -export const ProjectEpicDetailsHeader = observer(() => { +export const ProjectEpicDetailsHeader = observer(function ProjectEpicDetailsHeader() { // router const router = useAppRouter(); const { workspaceSlug, projectId, epicId } = useParams(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/layout.tsx index f564bc6a14..4f11d28a3c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(detail)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/header.tsx index 48f07cf990..e104af7920 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -24,7 +22,7 @@ import { CreateUpdateEpicModal } from "@/plane-web/components/epics/epic-modal"; import { EpicLayoutQuickActions } from "@/plane-web/components/epics/quick-actions/layout-quick-actions"; import { useIssueTypes } from "@/plane-web/hooks/store"; -export const EpicsHeader = observer(() => { +export const EpicsHeader = observer(function EpicsHeader() { const { workspaceSlug, projectId } = useParams(); // states const [isCreateIssueModalOpen, setIsCreateIssueModalOpen] = useState(false); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/layout.tsx index 5b78301b1f..165e6631ea 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/mobile-header.tsx index 7df0084c54..3ec8211968 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/mobile-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/mobile-header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback } from "react"; import { useParams } from "next/navigation"; // plane imports @@ -22,12 +20,9 @@ const SUPPORTED_LAYOUTS = [ { key: "calendar", titleTranslationKey: "issue.layouts.calendar", icon: CalendarLayoutIcon }, ]; -export const ProjectEpicMobileHeader = () => { +export function ProjectEpicMobileHeader() { // router - const { workspaceSlug, projectId } = useParams() as { - workspaceSlug: string; - projectId: string; - }; + const { workspaceSlug, projectId } = useParams(); // plane hooks const { t } = useTranslation(); // store hooks @@ -119,4 +114,4 @@ export const ProjectEpicMobileHeader = () => {
); -}; +} diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/page.tsx index e623357fa8..38e450b15f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // components import { PageHead } from "@/components/core/page-title"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/layout.tsx index 32744ed629..1230fe20b4 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/epics/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx index be30272a85..dd4feed28f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx @@ -22,10 +22,7 @@ export const ProjectIssuesMobileHeader = observer(function ProjectIssuesMobileHe // i18n const { t } = useTranslation(); const [analyticsModal, setAnalyticsModal] = useState(false); - const { workspaceSlug, projectId } = useParams() as { - workspaceSlug: string; - projectId: string; - }; + const { workspaceSlug, projectId } = useParams(); const { currentProjectDetails } = useProject(); // store hooks 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 8c50fc5335..2decac79e2 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 @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; // plane imports 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 801f4f453f..881733489c 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 @@ -25,11 +25,7 @@ const SUPPORTED_LAYOUTS = [ export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHeader() { // router - const { workspaceSlug, projectId, moduleId } = useParams() as { - workspaceSlug: string; - projectId: string; - moduleId: string; - }; + const { workspaceSlug, projectId, moduleId } = useParams(); // states const [analyticsModal, setAnalyticsModal] = useState(false); // plane hooks 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 07280fa963..cad6652921 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 @@ -21,7 +21,7 @@ import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/com export const ModulesListHeader = observer(function ModulesListHeader() { // router const router = useAppRouter(); - const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string }; + const { workspaceSlug, projectId } = useParams(); // store hooks const { toggleCreateModuleModal } = useCommandPalette(); const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/header.tsx index d089e900ca..af540e7d2e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // icons @@ -16,7 +14,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; // plane web imports import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common"; -export const ProjectOverviewHeader = observer(() => { +export const ProjectOverviewHeader = observer(function ProjectOverviewHeader() { // router const router = useAppRouter(); const { workspaceSlug, projectId } = useParams(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/layout.tsx index 81314fc50d..3e30bac416 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/page.tsx index e5c1f7fa2b..13052b269c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/overview/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { ProjectOverviewRoot } from "@/plane-web/components/project-overview/details/root"; import type { Route } from "./+types/page"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx index babe469daf..c59a6c4b79 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx @@ -55,11 +55,13 @@ export const PageDetailsHeader = observer(function PageDetailsHeader() { const rootParentDetails = orderedParentPages?.[0]; // First item is the root const middleParents = orderedParentPages?.slice(1, -1) ?? []; // Middle items (excluding root and current) - const BreadcrumbSeparator = () => ( -
- -
- ); + function BreadcrumbSeparator() { + return ( +
+ +
+ ); + } const switcherOptions = projectPageIds .map((id) => { diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx index a2134477b7..634233eaf6 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx @@ -15,7 +15,7 @@ import { useProject } from "@/hooks/store/use-project"; import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common"; export const ProjectViewsHeader = observer(function ProjectViewsHeader() { - const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string }; + const { workspaceSlug, projectId } = useParams(); // store hooks const { toggleCreateViewModal } = useCommandPalette(); const { loader } = useProject(); diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/[chatId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/[chatId]/page.tsx index 1216e7043f..5cf2db04a7 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/[chatId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/[chatId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane web imports import { PiChatDetail } from "@/plane-web/components/pi-chat/detail"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/layout.tsx index dcd6d4d4ed..578c876fc2 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; // plane web imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/new/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/new/page.tsx index 2ebd5f28c4..092ab3e9cb 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/new/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/new/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { cn } from "@plane/utils"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/page.tsx index 8f62e0c373..56397028de 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/pi-chat/page.tsx @@ -1,4 +1,3 @@ -"use client"; import { useEffect } from "react"; import { observer } from "mobx-react"; import { PiChatDetail } from "@/plane-web/components/pi-chat/detail"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/search/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/search/page.tsx index 2098707357..67c7b71243 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/search/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/search/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane web components import { SidebarHamburgerToggle } from "@/components/core/sidebar/sidebar-menu-hamburger-toggle"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/layout.tsx index e8cbd3c33e..b3d63c6539 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { ETeamspaceNavigationItem } from "@plane/constants"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/page.tsx index 3c4fb4a389..6a96cf422d 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/(overview)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import useSWR from "swr"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/layout.tsx index 211c1d9c4e..05110ea0d6 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { ETeamspaceNavigationItem } from "@plane/constants"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/page.tsx index 5063e09f0d..572a60a3e9 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/cycles/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import useSWR from "swr"; // ui @@ -13,12 +11,13 @@ import { TeamUpcomingCyclesRoot } from "@/plane-web/components/teamspaces/cycles import { useTeamspaceCycles } from "@/plane-web/hooks/store"; import type { Route } from "./+types/page"; -const TeamspaceCyclesLoader = ({ height }: { height: string }) => - Array.from({ length: 3 }).map((_, index) => ( +function TeamspaceCyclesLoader({ height }: { height: string }) { + return Array.from({ length: 3 }).map((_, index) => ( )); +} function TeamspaceCyclesPage({ params }: Route.ComponentProps) { const { workspaceSlug, teamspaceId } = params; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/layout.tsx index 8294b2a171..b8b6e36a23 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { ETeamspaceNavigationItem } from "@plane/constants"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/page.tsx index 9ffcb3b7de..60e3778626 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/issues/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // components import { PageHead } from "@/components/core/page-title"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/layout.tsx index 9dca592e53..0df295060f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import useSWR from "swr"; import { useTeamspaces, useTeamspaceViews } from "@/plane-web/hooks/store"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/[pageId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/[pageId]/page.tsx index f7e2fc02ff..755b73b3b4 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/[pageId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/[pageId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useMemo } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/header.tsx index d8de1d584a..67fcfb5a4a 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; import useSWR from "swr"; @@ -26,7 +24,7 @@ import { useTeamspaces, usePage, EPageStoreType, usePageStore } from "@/plane-we const storeType = EPageStoreType.TEAMSPACE; -export const TeamspacePageDetailHeader: React.FC = observer(() => { +export const TeamspacePageDetailHeader = observer(function TeamspacePageDetailHeader() { // router const { workspaceSlug, teamspaceId, pageId } = useParams(); const router = useAppRouter(); @@ -56,11 +54,13 @@ export const TeamspacePageDetailHeader: React.FC = observer(() => { const rootParentDetails = orderedParentPages?.[0]; // First item is the root const middleParents = orderedParentPages?.slice(1, -1) ?? []; // Middle items (excluding root and current) - const BreadcrumbSeparator = () => ( -
- -
- ); + function BreadcrumbSeparator() { + return ( +
+ +
+ ); + } const switcherOptions = teamspacePageIds ?.map((id) => { diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/layout.tsx index 4dd06db134..83a8bc7bf7 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(detail)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; import { ContentWrapper } from "@/components/core/content-wrapper"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/layout.tsx index 6e1690ce68..32b9163151 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { ETeamspaceNavigationItem } from "@plane/constants"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/page.tsx index bdf2a5242d..21de590901 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useSearchParams } from "next/navigation"; // plane imports import type { TPageNavigationTabs } from "@plane/types"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/layout.tsx index 2482f9de9c..5484ebce03 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/pages/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import useSWR from "swr"; // plane web hooks diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/[projectId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/[projectId]/page.tsx index 302e4b5f29..9355fdc475 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/[projectId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/[projectId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { PageHead } from "@/components/core/page-title"; // plane web components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/header.tsx index 91f813a5a9..3a8766aa41 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // plane imports @@ -20,7 +18,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; import { TeamspaceProjectDetailHeaderActions } from "@/plane-web/components/teamspaces/headers/detail-header/work-items"; import { useTeamspaces } from "@/plane-web/hooks/store"; -export const TeamspaceProjectDetailHeader: React.FC = observer(() => { +export const TeamspaceProjectDetailHeader = observer(function TeamspaceProjectDetailHeader() { // router const { workspaceSlug, teamspaceId, projectId } = useParams(); // store hooks diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/layout.tsx index 2d0f0f8aeb..38ce37b8f2 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(detail)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; import { ContentWrapper } from "@/components/core/content-wrapper"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/layout.tsx index 64d764a9b7..fb8df11a7f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; import { ETeamspaceNavigationItem } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/page.tsx index eaa51cae3f..076c10ff7f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/projects/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useTheme } from "next-themes"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/[viewId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/[viewId]/page.tsx index 0bd5b81a7b..982a251c95 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/[viewId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/[viewId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import useSWR from "swr"; // assets diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/header.tsx index c96a18ada6..326fe12087 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -30,7 +28,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; import { useTeamspaceViews } from "@/plane-web/hooks/store/teamspaces/use-teamspace-views"; import { useTeamspaces } from "@/plane-web/hooks/store/teamspaces/use-teamspaces"; -export const TeamspaceViewWorkItemsHeader: React.FC = observer(() => { +export const TeamspaceViewWorkItemsHeader = observer(function TeamspaceViewWorkItemsHeader() { // router const { workspaceSlug: routerWorkspaceSlug, teamspaceId: routerTeamspaceId, viewId: routerViewId } = useParams(); const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/layout.tsx index c9d7c9d7a7..59027726d3 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(detail)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { AppHeader } from "@/components/core/app-header"; import { ContentWrapper } from "@/components/core/content-wrapper"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/layout.tsx index ba7ddbf047..3f5cf71984 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import { ETeamspaceNavigationItem } from "@plane/constants"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/page.tsx index e54cb69c4f..88a8e664ef 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(detail)/[teamspaceId]/views/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback } from "react"; import { observer } from "mobx-react"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/layout.tsx index f5f4fce238..7ceca2ed7f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/page.tsx index 1d81f57811..7d7a63d4ef 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/(list)/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane web components import TeamspacesListRoot from "@/plane-web/components/teamspaces/list/root"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/layout.tsx index e1269940df..838982773c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/teamspaces/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; // hooks diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/customers/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/customers/page.tsx index d3f6f7d172..06094ced31 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/customers/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/customers/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { E_FEATURE_FLAGS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/asana/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/asana/page.tsx index 9327ab8c46..c260a6975b 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/asana/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/asana/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/clickup/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/clickup/page.tsx index eb2dc4482c..6f335be507 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/clickup/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/clickup/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/confluence/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/confluence/page.tsx index 97ec3a4860..faf878b5af 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/confluence/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/confluence/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/csv/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/csv/page.tsx index b9caa0e0a0..481be39d5e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/csv/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/csv/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira-server/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira-server/page.tsx index 3a12ba5179..888be15673 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira-server/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira-server/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira/page.tsx index 6928f52203..1fcee34efd 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/jira/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/layout.tsx index c250362dc4..aea02b2400 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/linear/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/linear/page.tsx index 2b5febe3df..7571b3a43e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/linear/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/linear/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/notion/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/notion/page.tsx index 0a86c502fd..10e2460097 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/notion/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/imports/(importers)/notion/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/initiatives/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/initiatives/page.tsx index 6e3e4e5640..ccbe6e3ad2 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/initiatives/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/initiatives/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { INITIATIVE_TRACKER_EVENTS, INITIATIVES_TRACKER_ELEMENTS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github-enterprise/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github-enterprise/page.tsx index 0f4655b8bf..1bfe862f6f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github-enterprise/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github-enterprise/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github/page.tsx index 11a9b5ef75..796773e800 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/github/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab-enterprise/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab-enterprise/page.tsx index 3bd458f6b2..d2b3a3f5b4 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab-enterprise/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab-enterprise/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab/page.tsx index 314000d89a..9c0081cecb 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/gitlab/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/layout.tsx index fc3704be8b..9d5d4e22e7 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/sentry/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/sentry/page.tsx index 8fddccb41b..f73a72ee4e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/sentry/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/sentry/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/slack/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/slack/page.tsx index b1756ce66a..f9e98e7128 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/slack/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/(integrations)/slack/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/edit/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/edit/page.tsx index 6e6d78e576..4b871119d6 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/edit/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/edit/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // component diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/install/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/install/page.tsx index 1c061e2248..a739f447f5 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/install/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/install/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // component diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/layout.tsx index 5de9e67763..64243da1d1 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/[appSlug]/layout.tsx @@ -1,4 +1,3 @@ -"use client"; import Link from "next/link"; import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/create/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/create/page.tsx index 74b4803411..fbe5aa1ea1 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/create/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/create/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // component diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/layout.tsx index 539182a375..44fca7d3bf 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/integrations/layout.tsx @@ -1,13 +1,13 @@ -"use client"; - import { Outlet } from "react-router"; // components import { SettingsContentWrapper } from "@/components/settings/content-wrapper"; -const IntegrationsLayout = () => ( - - - -); +function IntegrationsLayout() { + return ( + + + + ); +} export default IntegrationsLayout; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/plane-intelligence/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/plane-intelligence/page.tsx index 154f619948..c34618ba75 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/plane-intelligence/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/plane-intelligence/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/project-states/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/project-states/page.tsx index b364dd943c..678ae0632a 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/project-states/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/project-states/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { PROJECT_GROUPING_TRACKER_EVENTS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/teamspaces/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/teamspaces/page.tsx index faf04f33d3..cd4cff696c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/teamspaces/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/teamspaces/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { TEAMSPACE_TRACKER_ELEMENTS, TEAMSPACE_TRACKER_EVENTS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/layout.tsx index 4dcb606305..3aff8efd24 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/page/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/page/page.tsx index fc631fd18f..8bb68607c8 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/page/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/page/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/[templateId]/publish/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/[templateId]/publish/page.tsx index af75f070a8..69d3fb9e59 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/[templateId]/publish/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/[templateId]/publish/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { E_FEATURE_FLAGS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/page.tsx index 517b020246..5232ef1f82 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/project/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; // plane web imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/work-item/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/work-item/page.tsx index e0f7b428d1..de58247bc6 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/work-item/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/(templates)/work-item/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/page.tsx index 5bc9238484..370b98b804 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/templates/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { E_FEATURE_FLAGS, ETemplateLevel, EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/worklogs/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/worklogs/page.tsx index 379cd71067..5eafe06b91 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/worklogs/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/worklogs/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { EUserWorkspaceRoles } from "@plane/types"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/connections/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/connections/page.tsx index 6654a21974..f3fa417ede 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/connections/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/connections/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // components import { useEffect } from "react"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/epics/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/epics/page.tsx index aa65cd4321..008d5ff430 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/epics/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/epics/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/cycles/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/cycles/page.tsx index e52a9a3649..b2b3fd839c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/cycles/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/cycles/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/intake/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/intake/page.tsx index 5137b1e007..0df0d03536 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/intake/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/features/intake/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { ChevronLeft } from "lucide-react"; @@ -20,7 +18,7 @@ import { IntakeFeatureChildren } from "@/plane-web/components/projects/settings/ import { PROJECT_BASE_FEATURES_LIST } from "@/plane-web/constants/project/settings"; import type { Route } from "./+types/page"; -const IntakeFeatureSettingsPage = observer((props: Route.ComponentProps) => { +const IntakeFeatureSettingsPage = observer(function IntakeFeatureSettingsPage(props: Route.ComponentProps) { const { workspaceSlug, projectId } = props.params; // permissions const { workspaceUserInfo, allowPermissions } = useUserPermissions(); @@ -39,7 +37,7 @@ const IntakeFeatureSettingsPage = observer((props: Route.ComponentProps) => { const handleToggle = async () => { if (!currentProjectDetails) return; - const payload = { inbox_view: !Boolean(currentProjectDetails.inbox_view) }; + const payload = { inbox_view: !currentProjectDetails.inbox_view }; const promise = updateProject(workspaceSlug, projectId, payload); setPromiseToast(promise, { loading: "Updating project feature...", diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/integrations/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/integrations/page.tsx index 84de0c683f..275369cc82 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/integrations/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/integrations/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useTheme } from "next-themes"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/project-updates/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/project-updates/page.tsx index 8c5c3ed7ff..de6fc84a54 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/project-updates/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/project-updates/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/[recurringWorkItemId]/update/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/[recurringWorkItemId]/update/page.tsx index c415b54220..0c770f1543 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/[recurringWorkItemId]/update/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/[recurringWorkItemId]/update/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { E_FEATURE_FLAGS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/create/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/create/page.tsx index 056a498072..1e17780d1d 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/create/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/create/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { E_FEATURE_FLAGS } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/layout.tsx index ec29ea0e3d..21313709dc 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/(details)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { Outlet } from "react-router"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/layout.tsx index 5c7428cf7f..45bf5f06e9 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Outlet } from "react-router"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/page.tsx index fd0c146e0a..3bf5ad2533 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/recurring-work-items/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/layout.tsx index 3014945cb5..7d45fbcb47 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import Link from "next/link"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/page/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/page/page.tsx index 7c5e06eecf..1f81fe0af3 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/page/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/page/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/work-item/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/work-item/page.tsx index 9523cfaeac..ce36558d75 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/work-item/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/(templates)/work-item/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useSearchParams } from "next/navigation"; // plane imports diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/page.tsx index 4e3adeee3d..5f55219714 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/templates/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { E_FEATURE_FLAGS, ETemplateLevel, EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/work-item-types/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/work-item-types/page.tsx index 631bd4e85d..e6efd43996 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/work-item-types/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/work-item-types/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EUserPermissionsLevel } from "@plane/constants"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/workflows/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/workflows/page.tsx index 67b5f1b452..b3de1883ac 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/workflows/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/workflows/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; import useSWR from "swr"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/layout.tsx index 273d86fc1f..fb381e6889 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/page.tsx index f48d31a734..7982032474 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/archived/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // plane web components import { WikiPagesListLayoutRoot } from "@/plane-web/components/pages"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/filters-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/filters-header.tsx index 98bbda5b3e..3e2702650f 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/filters-header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/filters-header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect } from "react"; import { observer } from "mobx-react"; import { usePathname } from "next/navigation"; @@ -12,7 +10,7 @@ import { PageAppliedFiltersList } from "@/components/pages/list/applied-filters/ // plane web hooks import { EPageStoreType, usePageStore } from "@/plane-web/hooks/store"; -export const PageTypeFiltersHeader = observer(() => { +export const PageTypeFiltersHeader = observer(function PageTypeFiltersHeader() { // params const pathname = usePathname(); // store hooks diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/header.tsx index 8f3818e306..9866af387a 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { useParams, usePathname, useRouter } from "next/navigation"; @@ -29,7 +27,7 @@ type Props = { pageType: TPageNavigationTabs; }; -export const PageTypeHeader: React.FC = observer((props) => { +export const PageTypeHeader = observer(function PageTypeHeader(props: Props) { const { pageType } = props; // states const [isCreatingPage, setIsCreatingPage] = useState(false); diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/layout.tsx index 0dbfce04ff..dcdad9d422 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/page.tsx index 0fc8b39614..90025870b5 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/private/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // plane web components import { WikiPagesListLayoutRoot } from "@/plane-web/components/pages"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/layout.tsx index dd78f5df72..b092e9a932 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/page.tsx index 96a4f722e2..7e236d94ee 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/public/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // plane web components import { WikiPagesListLayoutRoot } from "@/plane-web/components/pages"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/empty-shared-pages.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/empty-shared-pages.tsx index 32f7045f99..1fcf1a8775 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/empty-shared-pages.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/empty-shared-pages.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Crown } from "lucide-react"; // plane imports @@ -13,7 +11,7 @@ import { useUserPermissions } from "@/hooks/store/user"; // assets import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const SharedPagesFallback = observer(() => { +export const SharedPagesFallback = observer(function SharedPagesFallback() { // store hooks const { allowPermissions } = useUserPermissions(); const { togglePaidPlanModal } = useWorkspaceSubscription(); @@ -58,6 +56,7 @@ export const SharedPagesFallback = observer(() => { href="https://plane.so/pricing" target="_blank" className={cn(getButtonStyling("link-primary", "sm"), "hover:underline")} + rel="noreferrer" > Talk custom pricing diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/layout.tsx index 530ad74a7c..033739500c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/page.tsx index 9acf2e0d0a..138654cbd9 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/(pageType)/shared/page.tsx @@ -1,5 +1,3 @@ -"use client"; - // plane web components import { WithFeatureFlagHOC } from "@/plane-web/components/feature-flags"; import { WikiPagesListLayoutRoot } from "@/plane-web/components/pages"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/header.tsx index 6518588143..ae17c13166 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; import { observer } from "mobx-react"; import { useParams, useRouter } from "next/navigation"; @@ -25,7 +23,7 @@ export interface IPagesHeaderProps { showButton?: boolean; } -export const PageDetailsHeader = observer(() => { +export const PageDetailsHeader = observer(function PageDetailsHeader() { // params const { workspaceSlug, pageId } = useParams(); const router = useRouter(); @@ -53,11 +51,13 @@ export const PageDetailsHeader = observer(() => { const rootParentDetails = orderedParentPages?.[0]; // First item is the root const middleParents = orderedParentPages?.slice(1, -1) ?? []; // Middle items (excluding root and current) - const BreadcrumbSeparator = () => ( -
- -
- ); + function BreadcrumbSeparator() { + return ( +
+ +
+ ); + } if (!page || !page.canCurrentUserAccessPage) return null; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/layout.tsx index 925e36dbf4..a06d8847cb 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; // components import { AppHeader } from "@/components/core/app-header"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/page.tsx index 597749e43d..3bc7376b3c 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/[pageId]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect, useMemo } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/_sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/_sidebar.tsx index 31a21ff90f..c3dfefc6bc 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/_sidebar.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/_sidebar.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -12,7 +11,7 @@ import { useAppTheme } from "@/hooks/store/use-app-theme"; // local imports import { WikiAppSidebar } from "./sidebar"; -export const PagesAppSidebar: FC = observer(() => { +export const PagesAppSidebar = observer(function PagesAppSidebar() { // store hooks const { sidebarCollapsed, toggleSidebar, sidebarPeek, toggleSidebarPeek, isAnySidebarDropdownOpen } = useAppTheme(); const { storedValue, setValue } = useLocalStorage("sidebarWidth", SIDEBAR_WIDTH); diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/header.tsx index f29e251d19..3f3e1fa23e 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/header.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/header.tsx @@ -1,21 +1,21 @@ -"use client"; - import { HomeIcon } from "@plane/propel/icons"; // plane imports import { Breadcrumbs, Header } from "@plane/ui"; // components import { BreadcrumbLink } from "@/components/common/breadcrumb-link"; -export const PagesAppDashboardHeader = () => ( -
- -
- - } />} - /> - -
- -
-); +export function PagesAppDashboardHeader() { + return ( +
+ +
+ + } />} + /> + +
+ +
+ ); +} diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/layout.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/layout.tsx index 5c322a68dc..36de572b1b 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/layout.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/layout.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Outlet } from "react-router"; import useSWR from "swr"; // components diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/page.tsx index 04207e935f..51e60eafbd 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/page.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useParams } from "next/navigation"; import { ContentWrapper } from "@plane/ui"; import { cn } from "@plane/utils"; diff --git a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/sidebar.tsx index 86d671a359..5e480b8ebf 100644 --- a/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/sidebar.tsx +++ b/apps/web/app/(all)/[workspaceSlug]/(wiki)/wiki/sidebar.tsx @@ -10,7 +10,7 @@ import { PagesAppSidebarList, PagesAppSidebarMenu, PagesAppSidebarQuickActions } // plane web hooks import { EPageStoreType, usePageStore } from "@/plane-web/hooks/store"; -export const WikiAppSidebar = observer(() => { +export const WikiAppSidebar = observer(function WikiAppSidebar() { // params const { workspaceSlug, pageId } = useParams(); const pathname = usePathname(); diff --git a/apps/web/app/(all)/installations/[provider]/page.tsx b/apps/web/app/(all)/installations/[provider]/page.tsx index ebb995a5d2..a3d85fc310 100644 --- a/apps/web/app/(all)/installations/[provider]/page.tsx +++ b/apps/web/app/(all)/installations/[provider]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { useSearchParams } from "next/navigation"; // ui diff --git a/apps/web/app/(all)/profile/connections/page.tsx b/apps/web/app/(all)/profile/connections/page.tsx index 3525caf096..6cef49334e 100644 --- a/apps/web/app/(all)/profile/connections/page.tsx +++ b/apps/web/app/(all)/profile/connections/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { useSearchParams } from "next/navigation"; // plane imports diff --git a/apps/web/app/entry.client.tsx b/apps/web/app/entry.client.tsx index 82ea2d9381..9cf1c32deb 100644 --- a/apps/web/app/entry.client.tsx +++ b/apps/web/app/entry.client.tsx @@ -1,4 +1,3 @@ -/* eslint-disable import/order */ import * as Sentry from "@sentry/react-router"; import { startTransition, StrictMode } from "react"; import { hydrateRoot } from "react-dom/client"; diff --git a/apps/web/app/m/auth/page.tsx b/apps/web/app/m/auth/page.tsx index 3947b976ab..0f52f4ceee 100644 --- a/apps/web/app/m/auth/page.tsx +++ b/apps/web/app/m/auth/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import type { TInstanceConfig } from "@plane/types"; // hooks diff --git a/apps/web/app/oauth/page.tsx b/apps/web/app/oauth/page.tsx index 320bed47f9..8c7cd5e57b 100644 --- a/apps/web/app/oauth/page.tsx +++ b/apps/web/app/oauth/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { useSearchParams } from "next/navigation"; diff --git a/apps/web/app/workspace-selector/[feature]/[identifier]/empty-state.tsx b/apps/web/app/workspace-selector/[feature]/[identifier]/empty-state.tsx index 19d68ae293..4b32fce1cc 100644 --- a/apps/web/app/workspace-selector/[feature]/[identifier]/empty-state.tsx +++ b/apps/web/app/workspace-selector/[feature]/[identifier]/empty-state.tsx @@ -9,7 +9,7 @@ import { cn } from "@plane/utils"; import emptyWorkspaceDarkPng from "@/app/assets/empty-state/marketplace/empty-workspace-dark.png?url"; import emptyWorkspaceLightPng from "@/app/assets/empty-state/marketplace/empty-workspace-light.png?url"; -export const WorkspaceSelectorEmptyState = observer(() => { +export const WorkspaceSelectorEmptyState = observer(function WorkspaceSelectorEmptyState() { // plane hooks const { t } = useTranslation(); const { resolvedTheme } = useTheme(); @@ -30,6 +30,7 @@ export const WorkspaceSelectorEmptyState = observer(() => { href="https://docs.plane.so/core-concepts/workspaces/overview" target="_blank" className={cn(getButtonStyling("outline-primary", "md"), "border-custom-border-200 text-custom-text-100")} + rel="noreferrer" > {t("learn_more_about_workspaces")} diff --git a/apps/web/app/workspace-selector/[feature]/[identifier]/page.tsx b/apps/web/app/workspace-selector/[feature]/[identifier]/page.tsx index 30550904f1..596b768c0b 100644 --- a/apps/web/app/workspace-selector/[feature]/[identifier]/page.tsx +++ b/apps/web/app/workspace-selector/[feature]/[identifier]/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; diff --git a/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-list.tsx b/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-list.tsx index b251e6b085..902b553104 100644 --- a/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-list.tsx +++ b/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-list.tsx @@ -13,7 +13,7 @@ type TWorkspaceList = { handleWorkspaceSelection: (workspace: IWorkspace) => void; }; -export const WorkspaceList = (props: TWorkspaceList) => { +export function WorkspaceList(props: TWorkspaceList) { const { selectedWorkspaceSlug, workspace, handleWorkspaceSelection } = props; return ( @@ -47,4 +47,4 @@ export const WorkspaceList = (props: TWorkspaceList) => {
); -}; +} diff --git a/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-selector.tsx b/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-selector.tsx index 159cd63d88..ca7554bca8 100644 --- a/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-selector.tsx +++ b/apps/web/app/workspace-selector/[feature]/[identifier]/workspace-selector.tsx @@ -46,7 +46,7 @@ type TWorkspaceSelectorProps = { identifier: string; }; -export const WorkspaceSelector = observer((props: TWorkspaceSelectorProps) => { +export const WorkspaceSelector = observer(function WorkspaceSelector(props: TWorkspaceSelectorProps) { const { feature, identifier } = props; // router const router = useAppRouter(); diff --git a/apps/web/ce/components/app-rail/app-rail-hoc.tsx b/apps/web/ce/components/app-rail/app-rail-hoc.tsx index 2dd40c1a2b..2b1d974214 100644 --- a/apps/web/ce/components/app-rail/app-rail-hoc.tsx +++ b/apps/web/ce/components/app-rail/app-rail-hoc.tsx @@ -1,6 +1,4 @@ // hoc/withDockItems.tsx -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -14,7 +12,7 @@ type WithDockItemsProps = { }; export function withDockItems

(WrappedComponent: React.ComponentType

) { - const ComponentWithDockItems = observer((props: Omit) => { + const ComponentWithDockItems = observer(function ComponentWithDockItems(props: Omit) { const { workspaceSlug } = useParams(); const { isProjectsPath, isNotificationsPath } = useWorkspacePaths(); diff --git a/apps/web/ce/components/intake/additional-information.tsx b/apps/web/ce/components/intake/additional-information.tsx index b6244dccf4..57926c3d09 100644 --- a/apps/web/ce/components/intake/additional-information.tsx +++ b/apps/web/ce/components/intake/additional-information.tsx @@ -4,4 +4,6 @@ type TIntakeAdditionalInformationProps = { workItemDetails: TIssue; }; -export const IntakeAdditionalInformation: React.FC = () => <>; +export function IntakeAdditionalInformation(_props: TIntakeAdditionalInformationProps) { + return <>; +} diff --git a/apps/web/ce/components/issues/header.tsx b/apps/web/ce/components/issues/header.tsx index c76e3584cd..9372b44990 100644 --- a/apps/web/ce/components/issues/header.tsx +++ b/apps/web/ce/components/issues/header.tsx @@ -35,7 +35,7 @@ import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/com export const IssuesHeader = observer(function IssuesHeader() { // router const router = useAppRouter(); - const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string }; + const { workspaceSlug, projectId } = useParams(); // store hooks const { issues: { getGroupIssueCount }, diff --git a/apps/web/ce/components/issues/issue-details/page.tsx b/apps/web/ce/components/issues/issue-details/page.tsx index e301c05ee0..fd86b97f52 100644 --- a/apps/web/ce/components/issues/issue-details/page.tsx +++ b/apps/web/ce/components/issues/issue-details/page.tsx @@ -1,8 +1,8 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; export type TIssuePageActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined }; -export const IssuePageActivity: FC = observer(() => <>); +export const IssuePageActivity = observer(function IssuePageActivity(_props: TIssuePageActivity) { + return <>; +}); diff --git a/apps/web/ce/components/license/modal/upgrade-modal.tsx b/apps/web/ce/components/license/modal/upgrade-modal.tsx index 3c83695c79..0f5e651e17 100644 --- a/apps/web/ce/components/license/modal/upgrade-modal.tsx +++ b/apps/web/ce/components/license/modal/upgrade-modal.tsx @@ -69,7 +69,7 @@ export const PaidPlanUpgradeModal = observer(function PaidPlanUpgradeModal(props verticalFeatureList extraFeatures={

- + See full features list

@@ -87,7 +87,11 @@ export const PaidPlanUpgradeModal = observer(function PaidPlanUpgradeModal(props verticalFeatureList extraFeatures={

- + See full features list

@@ -105,7 +109,11 @@ export const PaidPlanUpgradeModal = observer(function PaidPlanUpgradeModal(props verticalFeatureList extraFeatures={

- + See full features list

diff --git a/apps/web/ce/components/navigations/top-navigation-root.tsx b/apps/web/ce/components/navigations/top-navigation-root.tsx index df23006861..5e772b28ac 100644 --- a/apps/web/ce/components/navigations/top-navigation-root.tsx +++ b/apps/web/ce/components/navigations/top-navigation-root.tsx @@ -13,7 +13,7 @@ import { InboxIcon } from "@plane/propel/icons"; import useSWR from "swr"; import { useWorkspaceNotifications } from "@/hooks/store/notifications"; -export const TopNavigationRoot = observer(() => { +export const TopNavigationRoot = observer(function TopNavigationRoot() { // router const { workspaceSlug, projectId, workItem } = useParams(); const pathname = usePathname(); diff --git a/apps/web/ce/components/pages/editor/template-picker.tsx b/apps/web/ce/components/pages/editor/template-picker.tsx index ca234c0292..645a25fe76 100644 --- a/apps/web/ce/components/pages/editor/template-picker.tsx +++ b/apps/web/ce/components/pages/editor/template-picker.tsx @@ -11,4 +11,6 @@ export type TPageTemplatePickerProps = { workspaceSlug: string; }; -export const PageTemplatePicker: React.FC = () => null; +export function PageTemplatePicker(_props: TPageTemplatePickerProps) { + return null; +} diff --git a/apps/web/ce/components/pages/header/comment-control.tsx b/apps/web/ce/components/pages/header/comment-control.tsx index 85b810d407..5c585aec9d 100644 --- a/apps/web/ce/components/pages/header/comment-control.tsx +++ b/apps/web/ce/components/pages/header/comment-control.tsx @@ -1,5 +1,3 @@ -"use client"; - // store import type { EPageStoreType } from "@/plane-web/hooks/store"; import type { TPageInstance } from "@/store/pages/base-page"; @@ -9,4 +7,6 @@ export type TPageCommentControlProps = { storeType: EPageStoreType; }; -export const PageCommentControl = ({}: TPageCommentControlProps) => null; +export function PageCommentControl({}: TPageCommentControlProps) { + return null; +} diff --git a/apps/web/ce/components/projects/settings/useProjectColumns.tsx b/apps/web/ce/components/projects/settings/useProjectColumns.tsx index 8f6941f52c..28edbd4646 100644 --- a/apps/web/ce/components/projects/settings/useProjectColumns.tsx +++ b/apps/web/ce/components/projects/settings/useProjectColumns.tsx @@ -67,7 +67,7 @@ export const useProjectColumns = (props: TUseProjectColumnsProps) => { tdRender: (rowData: RowData) => ( { ), }, 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..75955efdf5 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 @@ -1,4 +1,3 @@ -import React from "react"; import { observer } from "mobx-react"; // plane imports import type { TFilterValue, TFilterProperty } from "@plane/types"; diff --git a/apps/web/ce/components/workspace-notifications/root.tsx b/apps/web/ce/components/workspace-notifications/root.tsx index 55fd68c3ff..cad9c438b8 100644 --- a/apps/web/ce/components/workspace-notifications/root.tsx +++ b/apps/web/ce/components/workspace-notifications/root.tsx @@ -5,4 +5,6 @@ export type TNotificationListRoot = { workspaceId: string; }; -export const NotificationListRoot = (props: TNotificationListRoot) => ; +export function NotificationListRoot(props: TNotificationListRoot) { + return ; +} diff --git a/apps/web/ce/components/workspace/upgrade-empty-state-button.tsx b/apps/web/ce/components/workspace/upgrade-empty-state-button.tsx index 2c3046eb7d..2832ddfec9 100644 --- a/apps/web/ce/components/workspace/upgrade-empty-state-button.tsx +++ b/apps/web/ce/components/workspace/upgrade-empty-state-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { getButtonStyling } from "@plane/propel/button"; @@ -7,13 +5,15 @@ type TUpgradeEmptyStateButtonProps = { workspaceSlug: string; }; -export const UpgradeEmptyStateButton: FC = () => ( - - Stay in loop - -); +export function UpgradeEmptyStateButton(_props: TUpgradeEmptyStateButtonProps) { + return ( + + Stay in loop + + ); +} diff --git a/apps/web/ce/hooks/app-rail/provider.tsx b/apps/web/ce/hooks/app-rail/provider.tsx index f53d7d2eb5..296ed3dc1a 100644 --- a/apps/web/ce/hooks/app-rail/provider.tsx +++ b/apps/web/ce/hooks/app-rail/provider.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { AppRailVisibilityProvider as CoreProvider } from "@/lib/app-rail"; @@ -12,6 +10,8 @@ interface AppRailVisibilityProviderProps { * CE AppRailVisibilityProvider * Wraps core provider with isEnabled hardcoded to false */ -export const AppRailVisibilityProvider = observer(({ children }: AppRailVisibilityProviderProps) => ( - {children} -)); +export const AppRailVisibilityProvider = observer(function AppRailVisibilityProvider({ + children, +}: AppRailVisibilityProviderProps) { + return {children}; +}); diff --git a/apps/web/ce/hooks/use-page-actions-menu.tsx b/apps/web/ce/hooks/use-page-actions-menu.tsx index 150ad9f2e5..01e05572b1 100644 --- a/apps/web/ce/hooks/use-page-actions-menu.tsx +++ b/apps/web/ce/hooks/use-page-actions-menu.tsx @@ -43,7 +43,9 @@ export const usePageActionsMenu = (props: { ]; // Empty modals component - const ModalsComponent = observer(() => <>); + const ModalsComponent = observer(function ModalsComponent() { + return <>; + }); return { customMenuItems, diff --git a/apps/web/core/components/account/auth-forms/auth-root.tsx b/apps/web/core/components/account/auth-forms/auth-root.tsx index 4d03cdbeff..9d6918205c 100644 --- a/apps/web/core/components/account/auth-forms/auth-root.tsx +++ b/apps/web/core/components/account/auth-forms/auth-root.tsx @@ -150,7 +150,7 @@ export const AuthRoot = observer(function AuthRoot(props: TAuthRoot) { }, { id: "oidc", - text: `Continue with ${!!config?.oidc_provider_name ? config.oidc_provider_name : "OIDC"}`, + text: `Continue with ${config?.oidc_provider_name ? config.oidc_provider_name : "OIDC"}`, icon: , onClick: () => { window.location.assign(`${API_BASE_URL}/auth/oidc/${next_path ? `?next_path=${next_path}` : ``}`); @@ -159,7 +159,7 @@ export const AuthRoot = observer(function AuthRoot(props: TAuthRoot) { }, { id: "saml", - text: `Continue with ${!!config?.saml_provider_name ? config.saml_provider_name : "SAML"}`, + text: `Continue with ${config?.saml_provider_name ? config.saml_provider_name : "SAML"}`, icon: , onClick: () => { window.location.assign(`${API_BASE_URL}/auth/saml/${next_path ? `?next_path=${next_path}` : ``}`); diff --git a/apps/web/core/components/api-token/modal/generated-token-details.tsx b/apps/web/core/components/api-token/modal/generated-token-details.tsx index 8fa9c4299c..d3b6ff5c7b 100644 --- a/apps/web/core/components/api-token/modal/generated-token-details.tsx +++ b/apps/web/core/components/api-token/modal/generated-token-details.tsx @@ -49,7 +49,7 @@ export function GeneratedTokenDetails(props: Props) {

{tokenDetails.expired_at - ? `Expires ${renderFormattedDate(tokenDetails.expired_at!)} at ${renderFormattedTime(tokenDetails.expired_at!)}` + ? `Expires ${renderFormattedDate(tokenDetails.expired_at)} at ${renderFormattedTime(tokenDetails.expired_at)}` : "Never expires"}

); -}; +} 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 a31c74492e..77d4236ef9 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 @@ -105,7 +105,7 @@ export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(pro if (!Array.isArray(data.delete_issue_ids)) data.delete_issue_ids = [data.delete_issue_ids]; - await removeBulkIssues(workspaceSlug as string, projectId as string, data.delete_issue_ids) + await removeBulkIssues(workspaceSlug, projectId, data.delete_issue_ids) .then(() => { setToast({ type: TOAST_TYPE.SUCCESS, 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 d081adf2a4..3c963921e5 100644 --- a/apps/web/core/components/core/modals/change-email-modal.tsx +++ b/apps/web/core/components/core/modals/change-email-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { Controller, useForm } from "react-hook-form"; @@ -29,7 +27,7 @@ const defaultValues: TUniqueCodeValuesForm = { email: "", code: "" }; // service initialization const authService = new AuthService(); -export const ChangeEmailModal: React.FC = observer((props) => { +export const ChangeEmailModal = observer(function ChangeEmailModal(props: Props) { const { isOpen, onClose } = props; // states const [currentStep, setCurrentStep] = useState("EMAIL"); diff --git a/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx b/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx index fb03383c54..8ba6a4b68a 100644 --- a/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx +++ b/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx @@ -106,7 +106,7 @@ export const CycleSidebarHeader = observer(function CycleSidebarHeader(props: Pr const dateChecker = async (payload: any) => { try { - const res = await cycleService.cycleDateCheck(workspaceSlug as string, projectId as string, payload); + const res = await cycleService.cycleDateCheck(workspaceSlug, projectId, payload); return res.status; } catch (err) { return false; diff --git a/apps/web/core/components/cycles/modal.tsx b/apps/web/core/components/cycles/modal.tsx index 92bf558d76..9bad7b6519 100644 --- a/apps/web/core/components/cycles/modal.tsx +++ b/apps/web/core/components/cycles/modal.tsx @@ -33,7 +33,7 @@ type CycleModalProps = { // services const cycleService = new CycleService(); -export const CycleCreateUpdateModal: React.FC = observer((props) => { +export const CycleCreateUpdateModal = observer(function CycleCreateUpdateModal(props: CycleModalProps) { const { isOpen, handleClose, data, workspaceSlug, projectId } = props; // states const [activeProject, setActiveProject] = useState(null); diff --git a/apps/web/core/components/dropdowns/intake-state/base.tsx b/apps/web/core/components/dropdowns/intake-state/base.tsx index c51c7cbf7b..76f79d24b7 100644 --- a/apps/web/core/components/dropdowns/intake-state/base.tsx +++ b/apps/web/core/components/dropdowns/intake-state/base.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { ReactNode } from "react"; import { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -41,7 +39,9 @@ export type TWorkItemStateDropdownBaseProps = TDropdownProps & { value: string | undefined | null; }; -export const WorkItemStateDropdownBase: React.FC = observer((props) => { +export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdownBase( + props: TWorkItemStateDropdownBaseProps +) { const { button, buttonClassName, @@ -79,7 +79,7 @@ export const WorkItemStateDropdownBase: React.FC getStateById(stateId)).filter((state) => !!state); const defaultState = statesList?.find((state) => state?.default) || statesList[0]; - const stateValue = !!value ? value : showDefaultState ? defaultState?.id : undefined; + const stateValue = value ? value : showDefaultState ? defaultState?.id : undefined; // popper-js init const { styles, attributes } = usePopper(referenceElement, popperElement, { placement: placement ?? "bottom-start", diff --git a/apps/web/core/components/dropdowns/intake-state/dropdown.tsx b/apps/web/core/components/dropdowns/intake-state/dropdown.tsx index 11a7652e6a..2a0e419885 100644 --- a/apps/web/core/components/dropdowns/intake-state/dropdown.tsx +++ b/apps/web/core/components/dropdowns/intake-state/dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -16,7 +14,7 @@ type TWorkItemStateDropdownProps = Omit< stateIds?: string[]; }; -export const IntakeStateDropdown: React.FC = observer((props) => { +export const IntakeStateDropdown = observer(function IntakeStateDropdown(props: TWorkItemStateDropdownProps) { const { projectId, stateIds: propsStateIds } = props; // router params const { workspaceSlug } = useParams(); diff --git a/apps/web/core/components/dropdowns/state/base.tsx b/apps/web/core/components/dropdowns/state/base.tsx index add4bcc28a..db0849e64e 100644 --- a/apps/web/core/components/dropdowns/state/base.tsx +++ b/apps/web/core/components/dropdowns/state/base.tsx @@ -79,7 +79,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown const { t } = useTranslation(); const statesList = stateIds.map((stateId) => getStateById(stateId)).filter((state) => !!state); const defaultState = statesList?.find((state) => state?.default); - const stateValue = !!value ? value : showDefaultState ? defaultState?.id : undefined; + const stateValue = value ? value : showDefaultState ? defaultState?.id : undefined; // popper-js init const { styles, attributes } = usePopper(referenceElement, popperElement, { placement: placement ?? "bottom-start", diff --git a/apps/web/core/components/estimates/points/create.tsx b/apps/web/core/components/estimates/points/create.tsx index b14c69b493..6d198d74d3 100644 --- a/apps/web/core/components/estimates/points/create.tsx +++ b/apps/web/core/components/estimates/points/create.tsx @@ -82,7 +82,7 @@ export const EstimatePointCreate = observer(function EstimatePointCreate(props: const currentEstimatePointValues = estimatePoints .map((point) => point?.value || undefined) - .filter((value) => value != undefined) as string[]; + .filter((value) => value != undefined); const isRepeated = (estimateType && isEstimatePointValuesRepeated(currentEstimatePointValues, estimateType, estimateInputValue)) || false; diff --git a/apps/web/core/components/estimates/points/update.tsx b/apps/web/core/components/estimates/points/update.tsx index acb4f72e6d..1f60bbd073 100644 --- a/apps/web/core/components/estimates/points/update.tsx +++ b/apps/web/core/components/estimates/points/update.tsx @@ -87,7 +87,7 @@ export const EstimatePointUpdate = observer(function EstimatePointUpdate(props: const currentEstimatePointValues = estimatePoints .map((point) => (point?.key != estimatePoint?.key ? point?.value : undefined)) - .filter((value) => value != undefined) as string[]; + .filter((value) => value != undefined); const isRepeated = (estimateType && isEstimatePointValuesRepeated(currentEstimatePointValues, estimateType, estimateInputValue)) || false; diff --git a/apps/web/core/components/estimates/root.tsx b/apps/web/core/components/estimates/root.tsx index b3dd0c7983..ff4cb53138 100644 --- a/apps/web/core/components/estimates/root.tsx +++ b/apps/web/core/components/estimates/root.tsx @@ -104,6 +104,7 @@ export const EstimateRoot = observer(function EstimateRoot(props: TEstimateRoot) href={"https://docs.plane.so/core-concepts/projects/run-project#estimate"} target="_blank" className="text-custom-primary-100/80 hover:text-custom-primary-100" + rel="noreferrer" > here. diff --git a/apps/web/core/components/exporter/export-form.tsx b/apps/web/core/components/exporter/export-form.tsx index d7138f43fb..fe6fa7afc9 100644 --- a/apps/web/core/components/exporter/export-form.tsx +++ b/apps/web/core/components/exporter/export-form.tsx @@ -102,7 +102,7 @@ export const ExportForm = observer(function ExportForm(props: Props) { rich_filters: formData.filters, }; await projectExportService - .csvExport(workspaceSlug as string, payload) + .csvExport(workspaceSlug, payload) .then(() => { mutateServices(); setExportLoading(false); diff --git a/apps/web/core/components/exporter/export-modal.tsx b/apps/web/core/components/exporter/export-modal.tsx index 0ee01ef437..a07633e921 100644 --- a/apps/web/core/components/exporter/export-modal.tsx +++ b/apps/web/core/components/exporter/export-modal.tsx @@ -74,7 +74,7 @@ export const Exporter = observer(function Exporter(props: Props) { multiple: multiple, }; await projectExportService - .csvExport(workspaceSlug as string, payload) + .csvExport(workspaceSlug, payload) .then(() => { mutateServices(); router.push(`/${workspaceSlug}/settings/exports`); diff --git a/apps/web/core/components/exporter/guide.tsx b/apps/web/core/components/exporter/guide.tsx index f454f17793..b35a9125f0 100644 --- a/apps/web/core/components/exporter/guide.tsx +++ b/apps/web/core/components/exporter/guide.tsx @@ -20,16 +20,11 @@ const IntegrationGuide = observer(function IntegrationGuide() {
<> mutate(EXPORT_SERVICES_LIST(workspaceSlug as string, `${cursor}`, `${per_page}`))} - /> - mutate(EXPORT_SERVICES_LIST(workspaceSlug, `${cursor}`, `${per_page}`))} /> +
diff --git a/apps/web/core/components/exporter/prev-exports.tsx b/apps/web/core/components/exporter/prev-exports.tsx index 01d948a698..ec015045cd 100644 --- a/apps/web/core/components/exporter/prev-exports.tsx +++ b/apps/web/core/components/exporter/prev-exports.tsx @@ -35,15 +35,13 @@ export const PrevExports = observer(function PrevExports(props: Props) { const columns = useExportColumns(); const { data: exporterServices } = useSWR( - workspaceSlug && cursor ? EXPORT_SERVICES_LIST(workspaceSlug as string, cursor, `${per_page}`) : null, - workspaceSlug && cursor - ? () => integrationService.getExportsServicesList(workspaceSlug as string, cursor, per_page) - : null + workspaceSlug && cursor ? EXPORT_SERVICES_LIST(workspaceSlug, cursor, `${per_page}`) : null, + workspaceSlug && cursor ? () => integrationService.getExportsServicesList(workspaceSlug, cursor, per_page) : null ); const handleRefresh = () => { setRefreshing(true); - mutate(EXPORT_SERVICES_LIST(workspaceSlug as string, `${cursor}`, `${per_page}`)).then(() => setRefreshing(false)); + mutate(EXPORT_SERVICES_LIST(workspaceSlug, `${cursor}`, `${per_page}`)).then(() => setRefreshing(false)); }; useEffect(() => { diff --git a/apps/web/core/components/exporter/single-export.tsx b/apps/web/core/components/exporter/single-export.tsx index 32b0bce57d..2af8469454 100644 --- a/apps/web/core/components/exporter/single-export.tsx +++ b/apps/web/core/components/exporter/single-export.tsx @@ -14,7 +14,7 @@ type Props = { export function SingleExport({ service, refreshing }: Props) { const provider = service.provider; - // eslint-disable-next-line @typescript-eslint/no-unused-vars + const [isLoading] = useState(false); const checkExpiry = (inputDateString: string) => { diff --git a/apps/web/core/components/gantt-chart/data/index.ts b/apps/web/core/components/gantt-chart/data/index.ts index 4c11b865e4..50cc76ec5a 100644 --- a/apps/web/core/components/gantt-chart/data/index.ts +++ b/apps/web/core/components/gantt-chart/data/index.ts @@ -59,7 +59,7 @@ export const timePreview = (date: Date) => { export const datePreview = (date: Date, includeTime: boolean = false) => { const day = date.getDate(); let month: number | WeekMonthDataType = date.getMonth(); - month = months[month as number] as WeekMonthDataType; + month = months[month]; const year = date.getFullYear(); return `${charCapitalize(month?.shortTitle)} ${day}, ${year}${includeTime ? `, ${timePreview(date)}` : ``}`; diff --git a/apps/web/core/components/gantt-chart/sidebar/utils.ts b/apps/web/core/components/gantt-chart/sidebar/utils.ts index 28590e3486..1130fd389d 100644 --- a/apps/web/core/components/gantt-chart/sidebar/utils.ts +++ b/apps/web/core/components/gantt-chart/sidebar/utils.ts @@ -5,7 +5,7 @@ export const handleOrderChange = ( droppedBlockId: string | undefined, dropAtEndOfList: boolean, blockIds: string[] | null, - getBlockById: (id: string, currentViewData?: ChartDataType | undefined) => IGanttBlock, + getBlockById: (id: string, currentViewData?: ChartDataType) => IGanttBlock, blockUpdateHandler: (block: any, payload: IBlockUpdateData) => void ) => { if (!blockIds || !draggingBlockId || !droppedBlockId) return; diff --git a/apps/web/core/components/global/product-updates/footer.tsx b/apps/web/core/components/global/product-updates/footer.tsx index 1dbc0a1c02..ba78d45df7 100644 --- a/apps/web/core/components/global/product-updates/footer.tsx +++ b/apps/web/core/components/global/product-updates/footer.tsx @@ -15,6 +15,7 @@ export function ProductUpdatesFooter() { href="https://go.plane.so/p-docs" target="_blank" className="text-sm text-custom-text-200 hover:text-custom-text-100 hover:underline underline-offset-1 outline-none" + rel="noreferrer" > {t("docs")} @@ -26,6 +27,7 @@ export function ProductUpdatesFooter() { href="https://go.plane.so/p-changelog" target="_blank" className="text-sm text-custom-text-200 hover:text-custom-text-100 hover:underline underline-offset-1 outline-none" + rel="noreferrer" > {t("full_changelog")} @@ -36,6 +38,7 @@ export function ProductUpdatesFooter() { href="mailto:support@plane.so" target="_blank" className="text-sm text-custom-text-200 hover:text-custom-text-100 hover:underline underline-offset-1 outline-none" + rel="noreferrer" > {t("support")} @@ -46,6 +49,7 @@ export function ProductUpdatesFooter() { href="https://go.plane.so/p-discord" target="_blank" className="text-sm text-custom-text-200 hover:text-custom-text-100 hover:underline underline-offset-1 outline-none" + rel="noreferrer" > Discord @@ -57,6 +61,7 @@ export function ProductUpdatesFooter() { getButtonStyling("accent-primary", "sm"), "flex gap-1.5 items-center text-center font-medium hover:underline underline-offset-2 outline-none" )} + rel="noreferrer" > {t("powered_by_plane_pages")} diff --git a/apps/web/core/components/home/widgets/manage/widget-item.tsx b/apps/web/core/components/home/widgets/manage/widget-item.tsx index 8a421aa20f..702c0bf847 100644 --- a/apps/web/core/components/home/widgets/manage/widget-item.tsx +++ b/apps/web/core/components/home/widgets/manage/widget-item.tsx @@ -46,7 +46,7 @@ export const WidgetItem = observer(function WidgetItem(props: Props) { const { widgetsMap } = useHome(); const { t } = useTranslation(); // derived values - const widget = widgetsMap[widgetId] as TWidgetEntityData; + const widget = widgetsMap[widgetId]; const widgetTitle = HOME_WIDGETS_LIST[widget.key]?.title; // drag and drop diff --git a/apps/web/core/components/importers/empty-state.tsx b/apps/web/core/components/importers/empty-state.tsx index bb9c1cb486..bbd7e69f8b 100644 --- a/apps/web/core/components/importers/empty-state.tsx +++ b/apps/web/core/components/importers/empty-state.tsx @@ -12,7 +12,7 @@ export type ImportersEmptyStateProps = { theme: string; }; -export const ImportersEmptyState: FC = observer((props) => { +export const ImportersEmptyState = observer(function ImportersEmptyState(props: ImportersEmptyStateProps) { const { theme } = props; const isDarkMode = theme === "dark"; diff --git a/apps/web/core/components/inbox/content/issue-root.tsx b/apps/web/core/components/inbox/content/issue-root.tsx index bd93786201..233ad6300f 100644 --- a/apps/web/core/components/inbox/content/issue-root.tsx +++ b/apps/web/core/components/inbox/content/issue-root.tsx @@ -90,11 +90,10 @@ export const InboxIssueMainContent = observer(function InboxIssueMainContent(pro const issueOperations: TIssueOperations = useMemo( () => ({ - // eslint-disable-next-line @typescript-eslint/no-unused-vars, no-unused-vars, arrow-body-style fetch: async (_workspaceSlug: string, _projectId: string, _issueId: string) => { return; }, - // eslint-disable-next-line @typescript-eslint/no-unused-vars, no-unused-vars, arrow-body-style + remove: async (_workspaceSlug: string, _projectId: string, _issueId: string) => { try { await removeIssue(workspaceSlug, projectId, _issueId); diff --git a/apps/web/core/components/inbox/modals/delete-issue-modal.tsx b/apps/web/core/components/inbox/modals/delete-issue-modal.tsx index 90d893db29..ebdc909e88 100644 --- a/apps/web/core/components/inbox/modals/delete-issue-modal.tsx +++ b/apps/web/core/components/inbox/modals/delete-issue-modal.tsx @@ -43,8 +43,8 @@ export const DeleteInboxIssueModal = observer(function DeleteInboxIssueModal({ .then(() => { setToast({ type: TOAST_TYPE.SUCCESS, - title: `${t("success")!}`, - message: `${t("inbox_issue.modals.delete.success")!}`, + title: `${t("success")}`, + message: `${t("inbox_issue.modals.delete.success")}`, }); }) .catch((errors) => { diff --git a/apps/web/core/components/integration/delete-import-modal.tsx b/apps/web/core/components/integration/delete-import-modal.tsx index 56993f1f81..0040de07f5 100644 --- a/apps/web/core/components/integration/delete-import-modal.tsx +++ b/apps/web/core/components/integration/delete-import-modal.tsx @@ -41,13 +41,13 @@ export function DeleteImportModal({ isOpen, handleClose, data }: Props) { setDeleteLoading(true); mutate( - IMPORTER_SERVICES_LIST(workspaceSlug as string), + IMPORTER_SERVICES_LIST(workspaceSlug), (prevData) => (prevData ?? []).filter((i) => i.id !== data.id), false ); integrationService - .deleteImporterService(workspaceSlug as string, data.service, data.id) + .deleteImporterService(workspaceSlug, data.service, data.id) .catch(() => setToast({ type: TOAST_TYPE.ERROR, diff --git a/apps/web/core/components/integration/github/repo-details.tsx b/apps/web/core/components/integration/github/repo-details.tsx index d0413f13de..f1d6a14009 100644 --- a/apps/web/core/components/integration/github/repo-details.tsx +++ b/apps/web/core/components/integration/github/repo-details.tsx @@ -30,10 +30,10 @@ export function GithubRepoDetails({ selectedRepo, handleStepChange, setUsers, se const { workspaceSlug } = useParams(); const { data: repoInfo } = useSWR( - workspaceSlug && selectedRepo ? GITHUB_REPOSITORY_INFO(workspaceSlug as string, selectedRepo.name) : null, + workspaceSlug && selectedRepo ? GITHUB_REPOSITORY_INFO(workspaceSlug, selectedRepo.name) : null, workspaceSlug && selectedRepo ? () => - githubIntegrationService.getGithubRepoInfo(workspaceSlug as string, { + githubIntegrationService.getGithubRepoInfo(workspaceSlug, { owner: selectedRepo.owner.login, repo: selectedRepo.name, }) diff --git a/apps/web/core/components/integration/github/root.tsx b/apps/web/core/components/integration/github/root.tsx index a6c806353f..a18a031ff2 100644 --- a/apps/web/core/components/integration/github/root.tsx +++ b/apps/web/core/components/integration/github/root.tsx @@ -96,8 +96,8 @@ export function GithubImporterRoot() { const { data: appIntegrations } = useSWR(APP_INTEGRATIONS, () => integrationService.getAppIntegrationsList()); const { data: workspaceIntegrations } = useSWR( - workspaceSlug ? WORKSPACE_INTEGRATIONS(workspaceSlug as string) : null, - workspaceSlug ? () => integrationService.getWorkspaceIntegrationsList(workspaceSlug as string) : null + workspaceSlug ? WORKSPACE_INTEGRATIONS(workspaceSlug) : null, + workspaceSlug ? () => integrationService.getWorkspaceIntegrationsList(workspaceSlug) : null ); const activeIntegrationState = () => { @@ -138,10 +138,10 @@ export function GithubImporterRoot() { }; await githubIntegrationService - .createGithubServiceImport(workspaceSlug as string, payload) + .createGithubServiceImport(workspaceSlug, payload) .then(() => { router.push(`/${workspaceSlug}/settings/imports`); - mutate(IMPORTER_SERVICES_LIST(workspaceSlug as string)); + mutate(IMPORTER_SERVICES_LIST(workspaceSlug)); }) .catch(() => setToast({ diff --git a/apps/web/core/components/integration/guide.tsx b/apps/web/core/components/integration/guide.tsx index 7d699ecc6b..ca8ecdf178 100644 --- a/apps/web/core/components/integration/guide.tsx +++ b/apps/web/core/components/integration/guide.tsx @@ -54,8 +54,8 @@ const IntegrationGuide = observer(function IntegrationGuide() { const { t } = useTranslation(); const { data: importerServices } = useSWR( - workspaceSlug ? IMPORTER_SERVICES_LIST(workspaceSlug as string) : null, - workspaceSlug ? () => integrationService.getImporterServicesList(workspaceSlug as string) : null + workspaceSlug ? IMPORTER_SERVICES_LIST(workspaceSlug) : null, + workspaceSlug ? () => integrationService.getImporterServicesList(workspaceSlug) : null ); const handleDeleteImport = (importService: IImporterService) => { @@ -129,7 +129,7 @@ const IntegrationGuide = observer(function IntegrationGuide() { className="flex flex-shrink-0 items-center gap-1 rounded bg-custom-background-80 px-1.5 py-1 text-xs outline-none" onClick={() => { setRefreshing(true); - mutate(IMPORTER_SERVICES_LIST(workspaceSlug as string)).then(() => setRefreshing(false)); + mutate(IMPORTER_SERVICES_LIST(workspaceSlug)).then(() => setRefreshing(false)); }} > {" "} diff --git a/apps/web/core/components/integration/jira/import-users.tsx b/apps/web/core/components/integration/jira/import-users.tsx index 0fd32f613f..b9479b6333 100644 --- a/apps/web/core/components/integration/jira/import-users.tsx +++ b/apps/web/core/components/integration/jira/import-users.tsx @@ -94,7 +94,7 @@ export function JiraImportUsers() { input value={value} onChange={onChange} - label={{Boolean(value) ? value : ("Ignore" as any)}} + label={{value ? value : ("Ignore" as any)}} > Invite by email Map to existing diff --git a/apps/web/core/components/integration/single-integration-card.tsx b/apps/web/core/components/integration/single-integration-card.tsx index 01f0536803..fb55e5bc9d 100644 --- a/apps/web/core/components/integration/single-integration-card.tsx +++ b/apps/web/core/components/integration/single-integration-card.tsx @@ -60,9 +60,8 @@ export const SingleIntegrationCard = observer(function SingleIntegrationCard({ i slack_client_id: config?.slack_client_id || "", }); - const { data: workspaceIntegrations } = useSWR( - workspaceSlug ? WORKSPACE_INTEGRATIONS(workspaceSlug as string) : null, - () => (workspaceSlug ? integrationService.getWorkspaceIntegrationsList(workspaceSlug as string) : null) + const { data: workspaceIntegrations } = useSWR(workspaceSlug ? WORKSPACE_INTEGRATIONS(workspaceSlug) : null, () => + workspaceSlug ? integrationService.getWorkspaceIntegrationsList(workspaceSlug) : null ); const handleRemoveIntegration = async () => { @@ -73,10 +72,10 @@ export const SingleIntegrationCard = observer(function SingleIntegrationCard({ i setDeletingIntegration(true); await integrationService - .deleteWorkspaceIntegration(workspaceSlug as string, workspaceIntegrationId ?? "") + .deleteWorkspaceIntegration(workspaceSlug, workspaceIntegrationId ?? "") .then(() => { mutate( - WORKSPACE_INTEGRATIONS(workspaceSlug as string), + WORKSPACE_INTEGRATIONS(workspaceSlug), (prevData) => prevData?.filter((i) => i.id !== workspaceIntegrationId), false ); diff --git a/apps/web/core/components/integration/slack/select-channel.tsx b/apps/web/core/components/integration/slack/select-channel.tsx index 0219c20fa2..827b8d438b 100644 --- a/apps/web/core/components/integration/slack/select-channel.tsx +++ b/apps/web/core/components/integration/slack/select-channel.tsx @@ -38,16 +38,10 @@ export const SelectChannel = observer(function SelectChannel({ integration }: Pr }); const { data: projectIntegration } = useSWR( - workspaceSlug && projectId && integration.id - ? SLACK_CHANNEL_INFO(workspaceSlug as string, projectId as string) - : null, + workspaceSlug && projectId && integration.id ? SLACK_CHANNEL_INFO(workspaceSlug, projectId) : null, () => workspaceSlug && projectId && integration.id - ? appInstallationService.getSlackChannelDetail( - workspaceSlug as string, - projectId as string, - integration.id as string - ) + ? appInstallationService.getSlackChannelDetail(workspaceSlug, projectId, integration.id) : null ); @@ -74,7 +68,7 @@ export const SelectChannel = observer(function SelectChannel({ integration }: Pr setSlackChannel(null); }); appInstallationService - .removeSlackChannel(workspaceSlug as string, projectId as string, integration.id as string, slackChannel?.id) + .removeSlackChannel(workspaceSlug, projectId, integration.id, slackChannel?.id) .catch((err) => console.error(err)); }; diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx index 78bdf1efd1..ea60c47dbb 100644 --- a/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx +++ b/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx @@ -186,7 +186,7 @@ export const RelationsCollapsibleContent = observer(function RelationsCollapsibl issueCrudState.delete.issue.id && issueCrudState.delete.issue.project_id ) { - const deleteOperation = !!issueCrudState.delete.issue?.is_epic + const deleteOperation = issueCrudState.delete.issue?.is_epic ? epicOperations.remove : issueOperations.remove; await deleteOperation( @@ -202,7 +202,7 @@ export const RelationsCollapsibleContent = observer(function RelationsCollapsibl {shouldRenderIssueUpdateModal && ( <> - {!!issueCrudState?.update?.issue?.is_epic ? ( + {issueCrudState?.update?.issue?.is_epic ? ( { diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx index 064ad5770d..f71cfbf9c9 100644 --- a/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx +++ b/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx @@ -51,7 +51,7 @@ export const RelationActionButton = observer(function RelationActionButton(props { - handleOnClick(item.key as TIssueRelationTypes); + handleOnClick(item.key); }} >
diff --git a/apps/web/core/components/issues/issue-detail/label/root.tsx b/apps/web/core/components/issues/issue-detail/label/root.tsx index 08ca5d2fc3..9880fecbac 100644 --- a/apps/web/core/components/issues/issue-detail/label/root.tsx +++ b/apps/web/core/components/issues/issue-detail/label/root.tsx @@ -13,7 +13,6 @@ import { useProjectInbox } from "@/hooks/store/use-project-inbox"; // types import { LabelList, IssueLabelSelectRoot } from "./"; // TODO: Fix this import statement, as core should not import from ee -// eslint-disable-next-line import/order export type TIssueLabel = { workspaceSlug: string; diff --git a/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx b/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx index cca5184061..49c4ab9368 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx @@ -39,12 +39,7 @@ import { CalendarWeekDays } from "./week-days"; import { CalendarWeekHeader } from "./week-header"; type Props = { - issuesFilterStore: - | IProjectIssuesFilter - | IModuleIssuesFilter - | ICycleIssuesFilter - | IProjectViewIssuesFilter - | IProjectEpicsFilter; + issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter; issues: TIssueMap | undefined; groupedIssueIds: TGroupedIssues; layout: "month" | "week" | undefined; diff --git a/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx b/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx index a15549aa41..cb770b146c 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx @@ -23,12 +23,7 @@ import type { TRenderQuickActions } from "../list/list-view-types"; import { CalendarIssueBlocks } from "./issue-blocks"; type Props = { - issuesFilterStore: - | IProjectIssuesFilter - | IModuleIssuesFilter - | ICycleIssuesFilter - | IProjectViewIssuesFilter - | IProjectEpicsFilter; + issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter; date: ICalendarDate; issues: TIssueMap | undefined; groupedIssueIds: TGroupedIssues; diff --git a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx index 2dacf1960e..18a1c4b05f 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx @@ -17,12 +17,7 @@ import type { IProjectViewIssuesFilter } from "@/store/issue/project-views"; // helpers interface Props { - issuesFilterStore: - | IProjectIssuesFilter - | IModuleIssuesFilter - | ICycleIssuesFilter - | IProjectViewIssuesFilter - | IProjectEpicsFilter; + issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter; } export const CalendarMonthsDropdown = observer(function CalendarMonthsDropdown(props: Props) { const { issuesFilterStore } = props; diff --git a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx index 8865c2a32d..366541de94 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx @@ -25,12 +25,7 @@ import type { IProjectIssuesFilter } from "@/store/issue/project"; import type { IProjectViewIssuesFilter } from "@/store/issue/project-views"; interface ICalendarHeader { - issuesFilterStore: - | IProjectIssuesFilter - | IModuleIssuesFilter - | ICycleIssuesFilter - | IProjectViewIssuesFilter - | IProjectEpicsFilter; + issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter; updateFilters?: ( projectId: string, filterType: TSupportedFilterTypeForUpdate, diff --git a/apps/web/core/components/issues/issue-layouts/calendar/header.tsx b/apps/web/core/components/issues/issue-layouts/calendar/header.tsx index c985211a94..b3de9b59dc 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/header.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/header.tsx @@ -16,12 +16,7 @@ import type { IProjectViewIssuesFilter } from "@/store/issue/project-views"; import { CalendarMonthsDropdown, CalendarOptionsDropdown } from "./dropdowns"; interface ICalendarHeader { - issuesFilterStore: - | IProjectIssuesFilter - | IModuleIssuesFilter - | ICycleIssuesFilter - | IProjectViewIssuesFilter - | IProjectEpicsFilter; + issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter; updateFilters?: ( projectId: string, filterType: TSupportedFilterTypeForUpdate, diff --git a/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx b/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx index 69a457907b..3c80994d65 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/display-name */ import { useState, useRef, forwardRef } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; diff --git a/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx b/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx index bd22f7fa18..0b695c9c46 100644 --- a/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx +++ b/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx @@ -14,12 +14,7 @@ import type { TRenderQuickActions } from "../list/list-view-types"; import { CalendarDayTile } from "./day-tile"; type Props = { - issuesFilterStore: - | IProjectIssuesFilter - | IModuleIssuesFilter - | ICycleIssuesFilter - | IProjectViewIssuesFilter - | IProjectEpicsFilter; + issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter; issues: TIssueMap | undefined; groupedIssueIds: TGroupedIssues; week: ICalendarWeek | undefined; diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx index eaeaa8732f..10c94718df 100644 --- a/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx +++ b/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx @@ -12,7 +12,7 @@ import { useUserPermissions } from "@/hooks/store/user"; import { CreateUpdateEpicModal } from "@/plane-web/components/epics/epic-modal"; import { useIssueTypes } from "@/plane-web/hooks/store"; -export const ProjectEpicsEmptyState: React.FC = observer(() => { +export const ProjectEpicsEmptyState = observer(function ProjectEpicsEmptyState() { // router const { projectId } = useParams(); // states diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx index a933d48316..9025ae40b6 100644 --- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx +++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx @@ -37,7 +37,7 @@ export const FilterDisplayProperties = observer(function FilterDisplayProperties // states const [previewEnabled, setPreviewEnabled] = React.useState(true); // derived values - const projectId = !!routerProjectId ? routerProjectId?.toString() : undefined; + const projectId = routerProjectId ? routerProjectId?.toString() : undefined; // Filter out "cycle" and "module" keys if cycleViewDisabled or moduleViewDisabled is true // Also filter out display properties that should not be rendered diff --git a/apps/web/core/components/issues/issue-layouts/kanban/default.tsx b/apps/web/core/components/issues/issue-layouts/kanban/default.tsx index b3c6651fcd..463d080c94 100644 --- a/apps/web/core/components/issues/issue-layouts/kanban/default.tsx +++ b/apps/web/core/components/issues/issue-layouts/kanban/default.tsx @@ -152,7 +152,7 @@ export const KanBan = observer(function KanBan(props: IKanBan) { const issueIds = isSubGroup ? ((groupedIssueIds as TSubGroupedIssues)?.[subList.id]?.[sub_group_id] ?? []) : ((groupedIssueIds as TGroupedIssues)?.[subList.id] ?? []); - const issueLength = issueIds?.length as number; + const issueLength = issueIds?.length; const groupHeight = issueLength * approximateCardHeight; return ( diff --git a/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx b/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx index f0c4360141..9c49cc1bb2 100644 --- a/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx +++ b/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx @@ -268,7 +268,7 @@ export const KanbanGroup = observer(function KanbanGroup(props: IKanbanGroup) { const canDragIssuesInCurrentGrouping = !!group_by && DRAG_ALLOWED_GROUPS.includes(group_by) && - (!!sub_group_by ? DRAG_ALLOWED_GROUPS.includes(sub_group_by) : true); + (sub_group_by ? DRAG_ALLOWED_GROUPS.includes(sub_group_by) : true); return (
{ cycles.push({ id: cycle.id, name: cycle.name, - icon: , + icon: , payload: { cycle_id: cycle.id }, isDropDisabled, dropErrorMessage: isDropDisabled ? "Work item cannot be moved to completed cycles" : undefined, @@ -488,11 +488,8 @@ const handleSortOrder = ( return currentIssueState; }; -export const getIssueBlockId = ( - issueId: string | undefined, - groupId: string | undefined, - subGroupId?: string | undefined -) => `issue_${issueId}_${groupId}_${subGroupId}`; +export const getIssueBlockId = (issueId: string | undefined, groupId: string | undefined, subGroupId?: string) => + `issue_${issueId}_${groupId}_${subGroupId}`; /** * returns empty Array if groupId is None diff --git a/apps/web/core/components/issues/issue-modal/components/description-editor.tsx b/apps/web/core/components/issues/issue-modal/components/description-editor.tsx index bd5352a474..e049ab4ac1 100644 --- a/apps/web/core/components/issues/issue-modal/components/description-editor.tsx +++ b/apps/web/core/components/issues/issue-modal/components/description-editor.tsx @@ -180,7 +180,7 @@ export const IssueDescriptionEditor = observer(function IssueDescriptionEditor(p id="issue-modal-editor" initialValue={value ?? ""} value={descriptionHtmlData} - workspaceSlug={workspaceSlug?.toString() as string} + workspaceSlug={workspaceSlug?.toString()} workspaceId={workspaceId} projectId={projectId} onChange={(_description: object, description_html: string) => { diff --git a/apps/web/core/components/issues/layout-quick-actions.tsx b/apps/web/core/components/issues/layout-quick-actions.tsx index fad93fc1da..abb6459bc3 100644 --- a/apps/web/core/components/issues/layout-quick-actions.tsx +++ b/apps/web/core/components/issues/layout-quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; import type { TContextMenuItem } from "@plane/ui"; @@ -13,7 +11,7 @@ type Props = { storeType: "PROJECT" | "EPIC"; }; -export const LayoutQuickActions: React.FC = observer((props) => { +export const LayoutQuickActions = observer(function LayoutQuickActions(props: Props) { const { workspaceSlug, projectId, storeType } = props; const layoutLink = `${workspaceSlug}/projects/${projectId}/${storeType === "EPIC" ? "epics" : "issues"}`; diff --git a/apps/web/core/components/issues/parent-issues-list-item.tsx b/apps/web/core/components/issues/parent-issues-list-item.tsx index d24eb49762..282e0765c7 100644 --- a/apps/web/core/components/issues/parent-issues-list-item.tsx +++ b/apps/web/core/components/issues/parent-issues-list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ type Props = { issue: ISearchIssueResponse; }; -export const ParentIssuesListItem: FC = observer((props) => { +export const ParentIssuesListItem = observer(function ParentIssuesListItem(props: Props) { const { workspaceSlug, issue } = props; const { getIssueTypeById } = useIssueTypes(); diff --git a/apps/web/core/components/issues/parent-issues-list-modal.tsx b/apps/web/core/components/issues/parent-issues-list-modal.tsx index 01379fbf3f..227225aac7 100644 --- a/apps/web/core/components/issues/parent-issues-list-modal.tsx +++ b/apps/web/core/components/issues/parent-issues-list-modal.tsx @@ -72,7 +72,7 @@ export function ParentIssuesListModal({ setIsLoading(true); projectService - .projectIssuesSearch(workspaceSlug as string, projectId as string, { + .projectIssuesSearch(workspaceSlug, projectId, { search: debouncedSearchTerm, parent: searchEpic ? undefined : true, issue_id: issueId, diff --git a/apps/web/core/components/issues/relations/issue-list-item.tsx b/apps/web/core/components/issues/relations/issue-list-item.tsx index 80e80d98db..de106b03a9 100644 --- a/apps/web/core/components/issues/relations/issue-list-item.tsx +++ b/apps/web/core/components/issues/relations/issue-list-item.tsx @@ -63,7 +63,7 @@ export const RelationIssueListItem = observer(function RelationIssueListItem(pro // derived values const issue = getIssueById(relationIssueId); const { handleRedirection } = useIssuePeekOverviewRedirection(!!issue?.is_epic); - const issueOperations = useRelationOperations(!!issue?.is_epic ? EIssueServiceType.EPICS : EIssueServiceType.ISSUES); + const issueOperations = useRelationOperations(issue?.is_epic ? EIssueServiceType.EPICS : EIssueServiceType.ISSUES); const projectDetail = (issue && issue.project_id && project.getProjectById(issue.project_id)) || undefined; const projectId = issue?.project_id; diff --git a/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx b/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx index 3a7f3aa4bd..b9fddeafdb 100644 --- a/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx +++ b/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx @@ -150,7 +150,7 @@ export const LabelDndHOC = observer(function LabelDndHOC(props: Props) { if (instruction === "reorder-below") dropAtEndOfList = true; const sourceData = source.data as TargetData; - if (sourceData.id) onDrop(sourceData.id as string, parentId, droppedLabelId, dropAtEndOfList); + if (sourceData.id) onDrop(sourceData.id, parentId, droppedLabelId, dropAtEndOfList); }, }) ); diff --git a/apps/web/core/components/license/modal/card/talk-to-sales.tsx b/apps/web/core/components/license/modal/card/talk-to-sales.tsx index c1e4b3454d..04096d8e63 100644 --- a/apps/web/core/components/license/modal/card/talk-to-sales.tsx +++ b/apps/web/core/components/license/modal/card/talk-to-sales.tsx @@ -78,6 +78,7 @@ export const TalkToSalesCard = observer(function TalkToSalesCard(props: TalkToSa upgradeButtonStyle, "relative inline-flex items-center justify-center w-56 px-4 py-2 text-sm font-medium rounded-lg focus:outline-none" )} + rel="noreferrer" > Talk to Sales diff --git a/apps/web/core/components/modules/form.tsx b/apps/web/core/components/modules/form.tsx index cb0c505394..63955c8c80 100644 --- a/apps/web/core/components/modules/form.tsx +++ b/apps/web/core/components/modules/form.tsx @@ -36,7 +36,7 @@ const defaultValues: Partial = { member_ids: [], }; -export const ModuleForm: React.FC = (props) => { +export function ModuleForm(props: Props) { const { handleFormSubmit, handleClose, @@ -279,4 +279,4 @@ export const ModuleForm: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/core/components/navigation/app-rail-root.tsx b/apps/web/core/components/navigation/app-rail-root.tsx index 864a81a00f..e2c23ef9ea 100644 --- a/apps/web/core/components/navigation/app-rail-root.tsx +++ b/apps/web/core/components/navigation/app-rail-root.tsx @@ -1,4 +1,3 @@ -"use client"; import { observer } from "mobx-react"; import { useParams, usePathname } from "next/navigation"; import { Check, SettingsIcon } from "lucide-react"; @@ -14,7 +13,7 @@ import { DesktopSidebarWorkspaceMenu } from "@/plane-web/components/desktop"; // local imports import { AppSidebarItemsRoot } from "./items-root"; -export const AppRailRoot = observer(() => { +export const AppRailRoot = observer(function AppRailRoot() { // router const { workspaceSlug } = useParams(); const pathname = usePathname(); diff --git a/apps/web/core/components/navigation/customize-navigation-dialog.tsx b/apps/web/core/components/navigation/customize-navigation-dialog.tsx index eebf19e48f..377fe28933 100644 --- a/apps/web/core/components/navigation/customize-navigation-dialog.tsx +++ b/apps/web/core/components/navigation/customize-navigation-dialog.tsx @@ -39,7 +39,9 @@ const PERSONAL_ITEMS: Array<{ key: TPersonalNavigationItemKey; labelTranslationK { key: "drafts", labelTranslationKey: "drafts" }, ]; -export const CustomizeNavigationDialog: FC = observer((props) => { +export const CustomizeNavigationDialog = observer(function CustomizeNavigationDialog( + props: TCustomizeNavigationDialogProps +) { const { isOpen, onClose } = props; const { t } = useTranslation(); diff --git a/apps/web/core/components/navigation/items-root.tsx b/apps/web/core/components/navigation/items-root.tsx index 3a93caa020..da36dca5d8 100644 --- a/apps/web/core/components/navigation/items-root.tsx +++ b/apps/web/core/components/navigation/items-root.tsx @@ -1,5 +1,4 @@ // components/AppSidebarItemsRoot.tsx -"use client"; import React from "react"; import type { AppSidebarItemData } from "@/components/sidebar/sidebar-item"; @@ -11,14 +10,16 @@ type Props = { showLabel?: boolean; }; -const Component = ({ dockItems, showLabel = true }: Props) => ( - <> - {dockItems - .filter((item) => item.shouldRender) - .map((item) => ( - - ))} - -); +function Component({ dockItems, showLabel = true }: Props) { + return ( + <> + {dockItems + .filter((item) => item.shouldRender) + .map((item) => ( + + ))} + + ); +} export const AppSidebarItemsRoot = withDockItems(Component); diff --git a/apps/web/core/components/navigation/project-actions-menu.tsx b/apps/web/core/components/navigation/project-actions-menu.tsx index e947f9120f..2459495c81 100644 --- a/apps/web/core/components/navigation/project-actions-menu.tsx +++ b/apps/web/core/components/navigation/project-actions-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState, useRef } from "react"; import { useNavigate } from "react-router"; @@ -21,7 +19,7 @@ type Props = { onPublishModal: () => void; }; -export const ProjectActionsMenu: FC = ({ +export function ProjectActionsMenu({ workspaceSlug, project, isAdmin, @@ -29,7 +27,7 @@ export const ProjectActionsMenu: FC = ({ onCopyText, onLeaveProject, onPublishModal, -}) => { +}: Props) { // states const [isMenuActive, setIsMenuActive] = useState(false); // translation @@ -111,4 +109,4 @@ export const ProjectActionsMenu: FC = ({ )} ); -}; +} diff --git a/apps/web/core/components/navigation/project-header.tsx b/apps/web/core/components/navigation/project-header.tsx index a88fd1cad8..6f991899e0 100644 --- a/apps/web/core/components/navigation/project-header.tsx +++ b/apps/web/core/components/navigation/project-header.tsx @@ -22,7 +22,7 @@ type TProjectHeaderProps = { projectId: string; }; -export const ProjectHeader = observer((props: TProjectHeaderProps) => { +export const ProjectHeader = observer(function ProjectHeader(props: TProjectHeaderProps) { const { workspaceSlug, projectId } = props; // router const router = useAppRouter(); diff --git a/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx b/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx index 37caae7ac1..5eacf3fd07 100644 --- a/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx +++ b/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx @@ -24,13 +24,7 @@ type Props = { * Displays items that don't fit in the visible area, with action icons * Shows "Eye" icon for user-hidden items, "Set as default" icon for all items */ -export const TabNavigationOverflowMenu: React.FC = ({ - overflowItems, - isActive, - tabPreferences, - onToggleDefault, - onShow, -}) => { +export function TabNavigationOverflowMenu({ overflowItems, isActive, tabPreferences, onToggleDefault, onShow }: Props) { const { t } = useTranslation(); return ( @@ -97,4 +91,4 @@ export const TabNavigationOverflowMenu: React.FC = ({ })} ); -}; +} diff --git a/apps/web/core/components/navigation/tab-navigation-root.tsx b/apps/web/core/components/navigation/tab-navigation-root.tsx index 00229be763..20740bb894 100644 --- a/apps/web/core/components/navigation/tab-navigation-root.tsx +++ b/apps/web/core/components/navigation/tab-navigation-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useEffect } from "react"; import { observer } from "mobx-react"; @@ -44,7 +42,7 @@ type TTabNavigationRootProps = { projectId: string; }; -export const TabNavigationRoot: FC = observer((props) => { +export const TabNavigationRoot = observer(function TabNavigationRoot(props: TTabNavigationRootProps) { const { workspaceSlug, projectId } = props; const { workItem: workItemIdentifierFromRoute } = useParams(); const location = useLocation(); diff --git a/apps/web/core/components/navigation/tab-navigation-visible-item.tsx b/apps/web/core/components/navigation/tab-navigation-visible-item.tsx index 7ed35fca6b..228598cf5c 100644 --- a/apps/web/core/components/navigation/tab-navigation-visible-item.tsx +++ b/apps/web/core/components/navigation/tab-navigation-visible-item.tsx @@ -23,14 +23,14 @@ export type TTabNavigationVisibleItemProps = { * Individual visible tab navigation item with context menu * Handles right-click actions for setting default and hiding tabs */ -export const TabNavigationVisibleItem: React.FC = ({ +export function TabNavigationVisibleItem({ item, isActive, tabPreferences, onToggleDefault, onHide, itemRef, -}) => { +}: TTabNavigationVisibleItemProps) { const { t } = useTranslation(); const isDefault = item.key === tabPreferences.defaultTab; @@ -76,4 +76,4 @@ export const TabNavigationVisibleItem: React.FC
); -}; +} diff --git a/apps/web/core/components/navigation/top-nav-power-k.tsx b/apps/web/core/components/navigation/top-nav-power-k.tsx index aeb02f3ef7..989adfbe99 100644 --- a/apps/web/core/components/navigation/top-nav-power-k.tsx +++ b/apps/web/core/components/navigation/top-nav-power-k.tsx @@ -15,7 +15,7 @@ import { useUser } from "@/hooks/store/user"; import { useAppRouter } from "@/hooks/use-app-router"; import { useExpandableSearch } from "@/hooks/use-expandable-search"; -export const TopNavPowerK = observer(() => { +export const TopNavPowerK = observer(function TopNavPowerK() { // router const router = useAppRouter(); const params = useParams(); diff --git a/apps/web/core/components/pages/dropdowns/actions.tsx b/apps/web/core/components/pages/dropdowns/actions.tsx index dbe2394e05..2c0d29c188 100644 --- a/apps/web/core/components/pages/dropdowns/actions.tsx +++ b/apps/web/core/components/pages/dropdowns/actions.tsx @@ -44,7 +44,7 @@ type Props = { realtimeEvents?: boolean; }; -export const PageActions: React.FC = observer((props) => { +export const PageActions = observer(function PageActions(props: Props) { const { extraOptions, optionsOrder, page, parentRef, storeType, realtimeEvents = true } = props; // states for common modals diff --git a/apps/web/core/components/pages/editor/breadcrumb-page-item.tsx b/apps/web/core/components/pages/editor/breadcrumb-page-item.tsx index 8ff6b85cf0..87db1ecd3c 100644 --- a/apps/web/core/components/pages/editor/breadcrumb-page-item.tsx +++ b/apps/web/core/components/pages/editor/breadcrumb-page-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Logo } from "@plane/propel/emoji-icon-picker"; import { PageIcon } from "@plane/propel/icons"; @@ -22,83 +20,86 @@ export interface IPageBreadcrumbProps { isEditable?: boolean; } -export const PageBreadcrumbItem: React.FC = observer( - ({ pageId, storeType, href, showLogo = true }) => { - // hooks - const { isMobile } = usePlatformOS(); - const page = usePage({ - pageId: pageId, - storeType: storeType, - }); +export const PageBreadcrumbItem = observer(function PageBreadcrumbItem({ + pageId, + storeType, + href, + showLogo = true, +}: IPageBreadcrumbProps) { + // hooks + const { isMobile } = usePlatformOS(); + const page = usePage({ + pageId: pageId, + storeType: storeType, + }); - const { name, logo_props } = page ?? {}; + const { name, logo_props } = page ?? {}; - // Show loading state when the page data isn't available yet - if (!page) { - const loadingItemClasses = href ? "" : "flex items-center space-x-2"; - - if (href) { - return ( -
- {showLogo &&
} -
-
- ); - } - - return ( -
  • -
    -
    - {showLogo &&
    } -
    -
    -
    -
    • - ); - } + // Show loading state when the page data isn't available yet + if (!page) { + const loadingItemClasses = href ? "" : "flex items-center space-x-2"; if (href) { return ( - - {logo_props?.in_use ? ( - - ) : ( - - )} - - ) - } - /> +
    + {showLogo &&
    } +
    +
    ); } return ( -
  • +
  • - {showLogo && ( - <> - {logo_props?.in_use ? ( - - ) : ( - - )} - - )} - -
    - {getPageName(name)} -
    -     + {showLogo &&
    } +
    • ); } -); + + if (href) { + return ( + + {logo_props?.in_use ? ( + + ) : ( + + )} + + ) + } + /> + ); + } + + return ( +
  • +
    +
    + {showLogo && ( + <> + {logo_props?.in_use ? ( + + ) : ( + + )} + + )} + +
    + {getPageName(name)} +
    +     +
    +
    +
    • + ); +}); diff --git a/apps/web/core/components/pages/editor/content-limit-banner.tsx b/apps/web/core/components/pages/editor/content-limit-banner.tsx index cd16641159..1195fa4e1e 100644 --- a/apps/web/core/components/pages/editor/content-limit-banner.tsx +++ b/apps/web/core/components/pages/editor/content-limit-banner.tsx @@ -6,30 +6,32 @@ type Props = { onDismiss?: () => void; }; -export const ContentLimitBanner: React.FC = ({ className, onDismiss }) => ( -
    -
    - - - - - Content limit reached and live sync is off. Create a new page or use nested pages to continue syncing. - +export function ContentLimitBanner({ className, onDismiss }: Props) { + return ( +
    +
    + + + + + Content limit reached and live sync is off. Create a new page or use nested pages to continue syncing. + +
    + {onDismiss && ( + + )}
    - {onDismiss && ( - - )} -
    -); + ); +} diff --git a/apps/web/core/components/pages/editor/header/root.tsx b/apps/web/core/components/pages/editor/header/root.tsx index 1230511403..86297af7ab 100644 --- a/apps/web/core/components/pages/editor/header/root.tsx +++ b/apps/web/core/components/pages/editor/header/root.tsx @@ -21,7 +21,7 @@ type Props = { workspaceSlug: string; }; -export const PageEditorHeaderRoot: React.FC = observer((props) => { +export const PageEditorHeaderRoot = observer(function PageEditorHeaderRoot(props: Props) { const { isEditorContentEmpty, isPageLoading, page, projectId, titleEditorRef, workspaceSlug } = props; // states const [isLogoPickerOpen, setIsLogoPickerOpen] = useState(false); diff --git a/apps/web/core/components/pages/editor/page-root.tsx b/apps/web/core/components/pages/editor/page-root.tsx index 783aa4f08c..e02d143ffe 100644 --- a/apps/web/core/components/pages/editor/page-root.tsx +++ b/apps/web/core/components/pages/editor/page-root.tsx @@ -48,7 +48,7 @@ type TPageRootProps = { customRealtimeEventHandlers?: TCustomEventHandlers; }; -export const PageRoot = observer((props: TPageRootProps) => { +export const PageRoot = observer(function PageRoot(props: TPageRootProps) { const { config, handlers, diff --git a/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx b/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx index 0eca248c75..572f0babec 100644 --- a/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx +++ b/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx @@ -4,7 +4,6 @@ import { ArrowUpToLine, Clipboard, History } from "lucide-react"; // plane imports import { TOAST_TYPE, setToast } from "@plane/propel/toast"; import { ToggleSwitch } from "@plane/ui"; -import type { TContextMenuItem } from "@plane/ui"; import { copyTextToClipboard } from "@plane/utils"; // hooks import { useAppRouter } from "@/hooks/use-app-router"; @@ -17,7 +16,6 @@ import type { EPageStoreType } from "@/plane-web/hooks/store"; import type { TPageInstance } from "@/store/pages/base-page"; // local imports import { PageActions } from "../../dropdowns"; -import type { TPageActions } from "../../dropdowns"; import { ExportPageModal } from "../../modals/export-page-modal"; import { PAGE_NAVIGATION_PANE_TABS_QUERY_PARAM } from "../../navigation-pane"; @@ -43,70 +41,72 @@ export const PageOptionsDropdown = observer(function PageOptionsDropdown(props: // query params const { updateQueryParams } = useQueryParams(); // menu items list - const EXTRA_MENU_OPTIONS = useMemo<(TContextMenuItem & { key: TPageActions })[]>( - () => [ - { - key: "full-screen", - action: () => handleFullWidth(!isFullWidth), - customContent: ( - <> - Full width - {}} /> - - ), - className: "flex items-center justify-between gap-2", - }, - { - key: "sticky-toolbar", - action: () => handleStickyToolbar(!isStickyToolbarEnabled), - customContent: ( - <> - Sticky toolbar - {}} /> - - ), - className: "flex items-center justify-between gap-2", - shouldRender: isContentEditable, - }, - { - key: "copy-markdown", - action: () => { - if (!editorRef) return; - copyTextToClipboard(editorRef.getMarkDown()).then(() => - setToast({ - type: TOAST_TYPE.SUCCESS, - title: "Success!", - message: "Markdown copied to clipboard.", - }) - ); + const EXTRA_MENU_OPTIONS = useMemo( + function EXTRA_MENU_OPTIONS(): React.ComponentProps["extraOptions"] { + return [ + { + key: "full-screen", + action: () => handleFullWidth(!isFullWidth), + customContent: ( + <> + Full width + {}} /> + + ), + className: "flex items-center justify-between gap-2", }, - title: "Copy markdown", - icon: Clipboard, - shouldRender: true, - }, - { - key: "version-history", - action: () => { - // update query param to show info tab in navigation pane - const updatedRoute = updateQueryParams({ - paramsToAdd: { - [PAGE_NAVIGATION_PANE_TABS_QUERY_PARAM]: "info" satisfies TPageNavigationPaneTab, - }, - }); - router.push(updatedRoute); + { + key: "sticky-toolbar", + action: () => handleStickyToolbar(!isStickyToolbarEnabled), + customContent: ( + <> + Sticky toolbar + {}} /> + + ), + className: "flex items-center justify-between gap-2", + shouldRender: isContentEditable, }, - title: "Version history", - icon: History, - shouldRender: true, - }, - { - key: "export", - action: () => setIsExportModalOpen(true), - title: "Export", - icon: ArrowUpToLine, - shouldRender: true, - }, - ], + { + key: "copy-markdown", + action: () => { + if (!editorRef) return; + copyTextToClipboard(editorRef.getMarkDown()).then(() => + setToast({ + type: TOAST_TYPE.SUCCESS, + title: "Success!", + message: "Markdown copied to clipboard.", + }) + ); + }, + title: "Copy markdown", + icon: Clipboard, + shouldRender: true, + }, + { + key: "version-history", + action: () => { + // update query param to show info tab in navigation pane + const updatedRoute = updateQueryParams({ + paramsToAdd: { + [PAGE_NAVIGATION_PANE_TABS_QUERY_PARAM]: "info" satisfies TPageNavigationPaneTab, + }, + }); + router.push(updatedRoute); + }, + title: "Version history", + icon: History, + shouldRender: true, + }, + { + key: "export", + action: () => setIsExportModalOpen(true), + title: "Export", + icon: ArrowUpToLine, + shouldRender: true, + }, + ]; + }, [ handleFullWidth, isFullWidth, diff --git a/apps/web/core/components/pages/header/base.tsx b/apps/web/core/components/pages/header/base.tsx index 352d0be085..ae347af5a7 100644 --- a/apps/web/core/components/pages/header/base.tsx +++ b/apps/web/core/components/pages/header/base.tsx @@ -25,7 +25,7 @@ type BasePagesListHeaderRootProps = { tabNavigationComponent: ReactNode; }; -export const BasePagesListHeaderRoot: React.FC = observer((props) => { +export const BasePagesListHeaderRoot = observer(function BasePagesListHeaderRoot(props: BasePagesListHeaderRootProps) { const { storeType, tabNavigationComponent } = props; const { t } = useTranslation(); // store hooks diff --git a/apps/web/core/components/pages/header/copy-link-control.tsx b/apps/web/core/components/pages/header/copy-link-control.tsx index 32f22aade5..08ace4b9f7 100644 --- a/apps/web/core/components/pages/header/copy-link-control.tsx +++ b/apps/web/core/components/pages/header/copy-link-control.tsx @@ -13,7 +13,7 @@ type Props = { page: TPageInstance; }; -export const PageCopyLinkControl = observer(({ page }: Props) => { +export const PageCopyLinkControl = observer(function PageCopyLinkControl({ page }: Props) { const [isCopied, setIsCopied] = useState(false); const timerRef = useRef | null>(null); diff --git a/apps/web/core/components/pages/header/root.tsx b/apps/web/core/components/pages/header/root.tsx index be769270a3..e6138ce9f3 100644 --- a/apps/web/core/components/pages/header/root.tsx +++ b/apps/web/core/components/pages/header/root.tsx @@ -13,7 +13,7 @@ type Props = { workspaceSlug: string; }; -export const PagesListHeaderRoot: React.FC = observer((props) => { +export const PagesListHeaderRoot = observer(function PagesListHeaderRoot(props: Props) { const { pageType, projectId, workspaceSlug } = props; return ( diff --git a/apps/web/core/components/pages/header/syncing-badge.tsx b/apps/web/core/components/pages/header/syncing-badge.tsx index 3451117977..056a014152 100644 --- a/apps/web/core/components/pages/header/syncing-badge.tsx +++ b/apps/web/core/components/pages/header/syncing-badge.tsx @@ -6,7 +6,7 @@ type Props = { syncStatus: "syncing" | "synced" | "error"; }; -export const PageSyncingBadge = ({ syncStatus }: Props) => { +export function PageSyncingBadge({ syncStatus }: Props) { const [prevSyncStatus, setPrevSyncStatus] = useState<"syncing" | "synced" | "error" | null>(null); const [isVisible, setIsVisible] = useState(syncStatus !== "synced"); @@ -69,4 +69,4 @@ export const PageSyncingBadge = ({ syncStatus }: Props) => {
    ); -}; +} diff --git a/apps/web/core/components/pages/list/block-root.tsx b/apps/web/core/components/pages/list/block-root.tsx index 2e1c87550e..645df0b9e3 100644 --- a/apps/web/core/components/pages/list/block-root.tsx +++ b/apps/web/core/components/pages/list/block-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect, useRef, useState } from "react"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; import { draggable, dropTargetForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter"; @@ -26,7 +24,7 @@ type TPageListBlock = { sectionType?: "public" | "private" | "archived" | "shared"; }; -export const PageListBlockRoot: React.FC = observer((props) => { +export const PageListBlockRoot = observer(function PageListBlockRoot(props: TPageListBlock) { const { paddingLeft, pageId, storeType, pageType, expandedPageIds = [], setExpandedPageIds, sectionType } = props; // states const [localIsExpanded, setLocalIsExpanded] = useState(false); diff --git a/apps/web/core/components/pages/list/root.tsx b/apps/web/core/components/pages/list/root.tsx index e4d851c3dc..2b7f7a6357 100644 --- a/apps/web/core/components/pages/list/root.tsx +++ b/apps/web/core/components/pages/list/root.tsx @@ -41,7 +41,7 @@ type Props = { projectId: string; }; -export const ProjectPagesListRoot: React.FC = observer((props) => { +export const ProjectPagesListRoot = observer(function ProjectPagesListRoot(props: Props) { const { pageType, workspaceSlug, projectId } = props; // states const [isCreatingPage, setIsCreatingPage] = useState(false); diff --git a/apps/web/core/components/pages/modals/delete-page-modal.tsx b/apps/web/core/components/pages/modals/delete-page-modal.tsx index 3fbcb834c8..c4accd0d86 100644 --- a/apps/web/core/components/pages/modals/delete-page-modal.tsx +++ b/apps/web/core/components/pages/modals/delete-page-modal.tsx @@ -26,7 +26,7 @@ type TConfirmPageDeletionProps = { editorRef?: React.MutableRefObject; }; -export const DeletePageModal: React.FC = observer((props) => { +export const DeletePageModal = observer(function DeletePageModal(props: TConfirmPageDeletionProps) { const { isOpen, onClose, page, storeType, editorRef } = props; // states const [isDeleting, setIsDeleting] = useState(false); diff --git a/apps/web/core/components/pages/pages-list-view.tsx b/apps/web/core/components/pages/pages-list-view.tsx index d435d02512..0126bacf51 100644 --- a/apps/web/core/components/pages/pages-list-view.tsx +++ b/apps/web/core/components/pages/pages-list-view.tsx @@ -15,7 +15,7 @@ type TPageView = { workspaceSlug: string; }; -export const ProjectPagesListView: React.FC = observer((props) => { +export const ProjectPagesListView = observer(function ProjectPagesListView(props: TPageView) { const { pageType, workspaceSlug, projectId } = props; // store hooks const { isAnyPageAvailable } = usePageStore(storeType); diff --git a/apps/web/core/components/pages/version/editor.tsx b/apps/web/core/components/pages/version/editor.tsx index 914668423c..e2de920318 100644 --- a/apps/web/core/components/pages/version/editor.tsx +++ b/apps/web/core/components/pages/version/editor.tsx @@ -21,7 +21,7 @@ export type TVersionEditorProps = { storeType: EPageStoreType; }; -export const PagesVersionEditor: React.FC = observer((props) => { +export const PagesVersionEditor = observer(function PagesVersionEditor(props: TVersionEditorProps) { const { activeVersion, storeType, versionDetails } = props; // params const { workspaceSlug, projectId } = useParams(); diff --git a/apps/web/core/components/profile/profile-issues.tsx b/apps/web/core/components/profile/profile-issues.tsx index c6176f875c..b9a062b750 100644 --- a/apps/web/core/components/profile/profile-issues.tsx +++ b/apps/web/core/components/profile/profile-issues.tsx @@ -21,10 +21,7 @@ type Props = { export const ProfileIssuesPage = observer(function ProfileIssuesPage(props: Props) { const { type } = props; - const { workspaceSlug, userId } = useParams() as { - workspaceSlug: string; - userId: string; - }; + const { workspaceSlug, userId } = useParams(); // store hooks const { issues: { setViewId }, diff --git a/apps/web/core/components/project-states/create-update/create.tsx b/apps/web/core/components/project-states/create-update/create.tsx index c0f6bf4901..7cded141b5 100644 --- a/apps/web/core/components/project-states/create-update/create.tsx +++ b/apps/web/core/components/project-states/create-update/create.tsx @@ -47,7 +47,7 @@ export const StateCreate = observer(function StateCreate(props: TStateCreate) { handleClose(); return { status: "success" }; } catch (error) { - const errorStatus = error as unknown as { status: number; data: { error: string } }; + const errorStatus = error as { status: number; data: { error: string } }; if (shouldTrackEvents) captureError({ eventName: STATE_TRACKER_EVENTS.create, diff --git a/apps/web/core/components/project-states/create-update/update.tsx b/apps/web/core/components/project-states/create-update/update.tsx index f48da1e8d3..a71e913e9e 100644 --- a/apps/web/core/components/project-states/create-update/update.tsx +++ b/apps/web/core/components/project-states/create-update/update.tsx @@ -47,7 +47,7 @@ export const StateUpdate = observer(function StateUpdate(props: TStateUpdate) { handleClose(); return { status: "success" }; } catch (error) { - const errorStatus = error as unknown as { status: number }; + const errorStatus = error as { status: number }; if (errorStatus?.status === 400) { setToast({ type: TOAST_TYPE.ERROR, diff --git a/apps/web/core/components/project-states/options/delete.tsx b/apps/web/core/components/project-states/options/delete.tsx index c49a4ac57f..b9e3d17f90 100644 --- a/apps/web/core/components/project-states/options/delete.tsx +++ b/apps/web/core/components/project-states/options/delete.tsx @@ -48,7 +48,7 @@ export const StateDelete = observer(function StateDelete(props: TStateDelete) { setIsDelete(false); } catch (error) { - const errorStatus = error as unknown as { status: number; data: { error: string } }; + const errorStatus = error as { status: number; data: { error: string } }; if (shouldTrackEvents) { captureError({ eventName: STATE_TRACKER_EVENTS.delete, diff --git a/apps/web/core/components/project-states/state-item.tsx b/apps/web/core/components/project-states/state-item.tsx index c4d1018821..19f1e1b6c2 100644 --- a/apps/web/core/components/project-states/state-item.tsx +++ b/apps/web/core/components/project-states/state-item.tsx @@ -96,10 +96,10 @@ export const StateItem = observer(function StateItem(props: TStateItem) { const destinationData = self.data as TDraggableData; if (sourceData && destinationData && sourceData.id) { - const destinationGroupKey = destinationData.groupKey as TStateGroups; + const destinationGroupKey = destinationData.groupKey; const edge = extractClosestEdge(destinationData) || undefined; const payload: Partial = { - id: sourceData.id as string, + id: sourceData.id, group: destinationGroupKey, sequence: getCurrentStateSequence(groupedStates[destinationGroupKey], destinationData, edge), }; diff --git a/apps/web/core/components/project/integration-card.tsx b/apps/web/core/components/project/integration-card.tsx index f1d1583055..990041821c 100644 --- a/apps/web/core/components/project/integration-card.tsx +++ b/apps/web/core/components/project/integration-card.tsx @@ -34,12 +34,10 @@ const projectService = new ProjectService(); export function IntegrationCard({ integration }: Props) { const { workspaceSlug, projectId } = useParams(); - const { data: syncedGithubRepository } = useSWR( - projectId ? PROJECT_GITHUB_REPOSITORY(projectId as string) : null, - () => - workspaceSlug && projectId && integration - ? projectService.getProjectGithubRepository(workspaceSlug as string, projectId as string, integration.id) - : null + const { data: syncedGithubRepository } = useSWR(projectId ? PROJECT_GITHUB_REPOSITORY(projectId) : null, () => + workspaceSlug && projectId && integration + ? projectService.getProjectGithubRepository(workspaceSlug, projectId, integration.id) + : null ); const handleChange = (repo: any) => { @@ -53,14 +51,14 @@ export function IntegrationCard({ integration }: Props) { } = repo; projectService - .syncGithubRepository(workspaceSlug as string, projectId as string, integration.id, { + .syncGithubRepository(workspaceSlug, projectId, integration.id, { name, owner: login, repository_id: id, url: html_url, }) .then(() => { - mutate(PROJECT_GITHUB_REPOSITORY(projectId as string)); + mutate(PROJECT_GITHUB_REPOSITORY(projectId)); setToast({ type: TOAST_TYPE.SUCCESS, diff --git a/apps/web/core/components/project/settings/helper.tsx b/apps/web/core/components/project/settings/helper.tsx index 98499428fd..7ca9063dfc 100644 --- a/apps/web/core/components/project/settings/helper.tsx +++ b/apps/web/core/components/project/settings/helper.tsx @@ -12,7 +12,7 @@ type Props = { isCreateModal?: boolean; }; -export const ProjectFeatureToggle = (props: Props) => { +export function ProjectFeatureToggle(props: Props) { const { featureItem, value, handleSubmit, disabled, isCreateModal } = props; const handleToggle = () => { @@ -47,4 +47,4 @@ export const ProjectFeatureToggle = (props: Props) => { } return ; -}; +} diff --git a/apps/web/core/components/properties/dates.tsx b/apps/web/core/components/properties/dates.tsx index aeee75f1fd..1d3c1551b8 100644 --- a/apps/web/core/components/properties/dates.tsx +++ b/apps/web/core/components/properties/dates.tsx @@ -2,11 +2,11 @@ import { ArrowRight } from "lucide-react"; import { CalendarLayoutIcon } from "@plane/propel/icons"; import { cn, renderFormattedDate } from "@plane/utils"; -export const DisplayDates = (props: { +export function DisplayDates(props: { startDate: string | null | undefined; endDate: string | null | undefined; className?: string; -}) => { +}) { const { startDate, endDate, className } = props; return (
    @@ -16,4 +16,4 @@ export const DisplayDates = (props: {
    {renderFormattedDate(endDate)}
    ); -}; +} diff --git a/apps/web/core/components/properties/labels.tsx b/apps/web/core/components/properties/labels.tsx index 27f5d3f536..8234fb179b 100644 --- a/apps/web/core/components/properties/labels.tsx +++ b/apps/web/core/components/properties/labels.tsx @@ -1,13 +1,13 @@ import { cn } from "@plane/ui"; import { addSpaceIfCamelCase } from "@plane/utils"; -export const DisplayLabels = (props: { +export function DisplayLabels(props: { className?: string; labels: { color?: string; name: string; }[]; -}) => { +}) { const { labels, className } = props; return (
    @@ -22,4 +22,4 @@ export const DisplayLabels = (props: { ))}
    ); -}; +} diff --git a/apps/web/core/components/properties/priority.tsx b/apps/web/core/components/properties/priority.tsx index 62caf340ab..116c827761 100644 --- a/apps/web/core/components/properties/priority.tsx +++ b/apps/web/core/components/properties/priority.tsx @@ -2,12 +2,12 @@ import { PriorityIcon } from "@plane/propel/icons"; import { cn } from "@plane/propel/utils"; import type { TIssuePriorities } from "@plane/types"; -export const DisplayPriority = (props: { priority: TIssuePriorities; className?: string }) => { +export function DisplayPriority(props: { priority: TIssuePriorities; className?: string }) { const { priority, className } = props; return (
    - +
    {priority}
    ); -}; +} diff --git a/apps/web/core/components/properties/project.tsx b/apps/web/core/components/properties/project.tsx index 3230d0ee5c..831ef4d00c 100644 --- a/apps/web/core/components/properties/project.tsx +++ b/apps/web/core/components/properties/project.tsx @@ -6,25 +6,26 @@ import { cn } from "@plane/propel/utils"; import type { TLogoProps } from "@plane/types"; import { useProject } from "@/hooks/store/use-project"; -export const DisplayProject = observer( - (props: { project: { name: string; id: string; logo_props?: TLogoProps }; className?: string }) => { - const { project, className } = props; - const { getProjectById } = useProject(); - const projectDetails = getProjectById(project.id); - const logoProps = project?.logo_props || projectDetails?.logo_props; - return ( -
    - {!isEmpty(logoProps) ? ( - - ) : ( - - - - )} -
    {project?.name}
    -
    - ); - } -); +export const DisplayProject = observer(function DisplayProject(props: { + project: { name: string; id: string; logo_props?: TLogoProps }; + className?: string; +}) { + const { project, className } = props; + const { getProjectById } = useProject(); + const projectDetails = getProjectById(project.id); + const logoProps = project?.logo_props || projectDetails?.logo_props; + return ( +
    + {!isEmpty(logoProps) ? ( + + ) : ( + + + + )} +
    {project?.name}
    +
    + ); +}); diff --git a/apps/web/core/components/properties/state.tsx b/apps/web/core/components/properties/state.tsx index be73804eb0..0df60f19ea 100644 --- a/apps/web/core/components/properties/state.tsx +++ b/apps/web/core/components/properties/state.tsx @@ -4,7 +4,7 @@ import type { TStateGroups } from "@plane/types"; import { cn } from "@plane/ui"; import { addSpaceIfCamelCase } from "@plane/utils"; -export const DisplayState = (props: { +export function DisplayState(props: { className?: string; state: { group?: TStateGroups; @@ -12,7 +12,7 @@ export const DisplayState = (props: { name: string; }; iconSize?: EIconSize; -}) => { +}) { const { state, className, iconSize } = props; return (
    @@ -22,4 +22,4 @@ export const DisplayState = (props: {
    {addSpaceIfCamelCase(state?.name ?? "")}
    ); -}; +} diff --git a/apps/web/core/components/ui/loader/workspace-active-cycle.tsx b/apps/web/core/components/ui/loader/workspace-active-cycle.tsx index 4b59a1efbe..d055f14958 100644 --- a/apps/web/core/components/ui/loader/workspace-active-cycle.tsx +++ b/apps/web/core/components/ui/loader/workspace-active-cycle.tsx @@ -5,37 +5,41 @@ type Props = { itemCount?: number; }; -const WorkspaceActiveCycleLoaderItem = () => ( -
    -
    -
    - - -
    -
    -
    - - - +function WorkspaceActiveCycleLoaderItem() { + return ( +
    +
    +
    + +
    -
    - - +
    +
    + + + +
    +
    + + +
    +
    +
    + + +
    -
    -
    - - -
    -
    -); + ); +} -export const WorkspaceActiveCycleLoader: FC = ({ itemCount = 2 }) => ( -
    - {[...Array(itemCount)].map((_, index) => ( - - ))} -
    -); +export function WorkspaceActiveCycleLoader({ itemCount = 2 }: Props) { + return ( +
    + {[...Array(itemCount)].map((_, index) => ( + + ))} +
    + ); +} diff --git a/apps/web/core/components/web-hooks/form/individual-event-options.tsx b/apps/web/core/components/web-hooks/form/individual-event-options.tsx index e4d4d21ce6..1f832202d3 100644 --- a/apps/web/core/components/web-hooks/form/individual-event-options.tsx +++ b/apps/web/core/components/web-hooks/form/individual-event-options.tsx @@ -39,25 +39,27 @@ type Props = { control: Control; }; -export const WebhookIndividualEventOptions = ({ control }: Props) => ( -
    - {INDIVIDUAL_WEBHOOK_OPTIONS.map((option) => ( - ( -
    -
    - onChange(!value)} checked={value === true} /> - +export function WebhookIndividualEventOptions({ control }: Props) { + return ( +
    + {INDIVIDUAL_WEBHOOK_OPTIONS.map((option) => ( + ( +
    +
    + onChange(!value)} checked={value === true} /> + +
    +

    {option.description}

    -

    {option.description}

    -
    - )} - /> - ))} -
    -); + )} + /> + ))} +
    + ); +} diff --git a/apps/web/core/components/web-hooks/form/secret-key.tsx b/apps/web/core/components/web-hooks/form/secret-key.tsx index 44cf645047..3591bb6013 100644 --- a/apps/web/core/components/web-hooks/form/secret-key.tsx +++ b/apps/web/core/components/web-hooks/form/secret-key.tsx @@ -44,7 +44,7 @@ export const WebhookSecretKey = observer(function WebhookSecretKey(props: Props) .then(() => setToast({ type: TOAST_TYPE.SUCCESS, - title: `${t("success")!}`, + title: `${t("success")}`, message: t("workspace_settings.settings.webhooks.toasts.secret_key_copied.message"), }) ) @@ -66,7 +66,7 @@ export const WebhookSecretKey = observer(function WebhookSecretKey(props: Props) .then(() => { setToast({ type: TOAST_TYPE.SUCCESS, - title: `${t("success")!}`, + title: `${t("success")}`, message: "New key regenerated successfully.", }); diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx index c98c3e1f14..ff03a9eef0 100644 --- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx +++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx @@ -15,7 +15,7 @@ import { DateDropdown } from "@/components/dropdowns/date"; type TNotificationSnoozeModal = { isOpen: boolean; onClose: () => void; - onSubmit: (dateTime?: Date | undefined) => Promise; + onSubmit: (dateTime?: Date) => Promise; }; type FormValues = { diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/helper.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/helper.tsx index f0a1b76e0e..7d11050992 100644 --- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/helper.tsx +++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/helper.tsx @@ -6,7 +6,7 @@ import type { IFavorite, TLogoProps } from "@plane/types"; // plane web constants import { FAVORITE_ITEM_ICONS, FAVORITE_ITEM_LINKS } from "@/plane-web/constants/sidebar-favorites"; -export const getFavoriteItemIcon = (type: string, logo?: TLogoProps | undefined) => { +export const getFavoriteItemIcon = (type: string, logo?: TLogoProps) => { const Icon = FAVORITE_ITEM_ICONS[type] || PageIcon; return ( diff --git a/apps/web/core/hooks/use-intersection-observer.ts b/apps/web/core/hooks/use-intersection-observer.ts index 5fd2840edf..982894d13e 100644 --- a/apps/web/core/hooks/use-intersection-observer.ts +++ b/apps/web/core/hooks/use-intersection-observer.ts @@ -30,7 +30,6 @@ export const useIntersectionObserver = ( observer.observe(elementRef); return () => { if (elementRef) { - // eslint-disable-next-line react-hooks/exhaustive-deps observer.unobserve(elementRef); } }; diff --git a/apps/web/core/hooks/use-realtime-page-events.tsx b/apps/web/core/hooks/use-realtime-page-events.tsx index a36b7b44b0..e5d7b5b5aa 100644 --- a/apps/web/core/hooks/use-realtime-page-events.tsx +++ b/apps/web/core/hooks/use-realtime-page-events.tsx @@ -57,7 +57,7 @@ export const useRealtimePageEvents = ({ (userId: string | undefined) => { if (!userId) return ""; try { - const userDetails = getUserDetails(userId as string); + const userDetails = getUserDetails(userId); return userDetails?.display_name ? ` by ${userDetails.display_name}` : ""; } catch { return ""; diff --git a/apps/web/core/layouts/access/workspace-wrapper.tsx b/apps/web/core/layouts/access/workspace-wrapper.tsx index 92c5578915..466596df90 100644 --- a/apps/web/core/layouts/access/workspace-wrapper.tsx +++ b/apps/web/core/layouts/access/workspace-wrapper.tsx @@ -9,7 +9,7 @@ interface IWorkspaceAuthWrapper { allowedPermissions?: EUserPermissions[]; } -const WorkspaceAccessWrapper = ({ children, ...props }: IWorkspaceAuthWrapper) => { +function WorkspaceAccessWrapper({ children, ...props }: IWorkspaceAuthWrapper) { const { pageKey, allowedPermissions } = props; // router const { workspaceSlug } = useParams(); @@ -22,6 +22,6 @@ const WorkspaceAccessWrapper = ({ children, ...props }: IWorkspaceAuthWrapper) = // render if (!isAuthorized) return ; return <>{children}; -}; +} export default WorkspaceAccessWrapper; diff --git a/apps/web/core/lib/app-rail/context.tsx b/apps/web/core/lib/app-rail/context.tsx index b1625af363..e2e871e4c8 100644 --- a/apps/web/core/lib/app-rail/context.tsx +++ b/apps/web/core/lib/app-rail/context.tsx @@ -1,5 +1,3 @@ -"use client"; - import { createContext, useContext } from "react"; import type { IAppRailVisibilityContext } from "./types"; diff --git a/apps/web/core/lib/app-rail/provider.tsx b/apps/web/core/lib/app-rail/provider.tsx index 1785a07c57..e51e82c9ce 100644 --- a/apps/web/core/lib/app-rail/provider.tsx +++ b/apps/web/core/lib/app-rail/provider.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useCallback, useMemo } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -16,7 +14,10 @@ interface AppRailVisibilityProviderProps { * AppRailVisibilityProvider - manages app rail visibility state * Base provider that accepts isEnabled as a prop */ -export const AppRailVisibilityProvider = observer(({ children, isEnabled = false }: AppRailVisibilityProviderProps) => { +export const AppRailVisibilityProvider = observer(function AppRailVisibilityProvider({ + children, + isEnabled = false, +}: AppRailVisibilityProviderProps) { const { workspaceSlug } = useParams(); // User preference from localStorage diff --git a/apps/web/core/store/global-view.store.ts b/apps/web/core/store/global-view.store.ts index eba2c44445..fea40218cb 100644 --- a/apps/web/core/store/global-view.store.ts +++ b/apps/web/core/store/global-view.store.ts @@ -174,7 +174,7 @@ export class GlobalViewStore implements IGlobalViewStore { ); this.rootStore.issue.workspaceIssues.fetchIssuesWithExistingPagination(workspaceSlug, viewId, "mutation"); } - return currentView as IWorkspaceView; + return currentView; } catch { Object.keys(data).forEach((key) => { const currentKey = key as keyof IWorkspaceView; diff --git a/apps/web/core/store/inbox/project-inbox.store.ts b/apps/web/core/store/inbox/project-inbox.store.ts index 8f9a583857..13855217d0 100644 --- a/apps/web/core/store/inbox/project-inbox.store.ts +++ b/apps/web/core/store/inbox/project-inbox.store.ts @@ -64,7 +64,7 @@ export interface IProjectInboxStore { workspaceSlug: string, projectId: string, loadingType?: TLoader, - tab?: TInboxIssueCurrentTab | undefined + tab?: TInboxIssueCurrentTab ) => Promise; fetchInboxPaginationIssues: (workspaceSlug: string, projectId: string) => Promise; fetchInboxIssueById: (workspaceSlug: string, projectId: string, inboxIssueId: string) => Promise; diff --git a/apps/web/core/store/issue/cycle/filter.store.ts b/apps/web/core/store/issue/cycle/filter.store.ts index c5234b9826..c6544936e0 100644 --- a/apps/web/core/store/issue/cycle/filter.store.ts +++ b/apps/web/core/store/issue/cycle/filter.store.ts @@ -202,7 +202,7 @@ export class CycleIssuesFilter extends IssueFilterHelperStore implements ICycleI if (isEmpty(this.filters) || isEmpty(this.filters[cycleId])) return; const _filters = { - richFilters: this.filters[cycleId].richFilters as TWorkItemFilterExpression, + richFilters: this.filters[cycleId].richFilters, displayFilters: this.filters[cycleId].displayFilters as IIssueDisplayFilterOptions, displayProperties: this.filters[cycleId].displayProperties as IIssueDisplayProperties, kanbanFilters: this.filters[cycleId].kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/issue/cycle/issue.store.ts b/apps/web/core/store/issue/cycle/issue.store.ts index df56b2483d..a64ac449a0 100644 --- a/apps/web/core/store/issue/cycle/issue.store.ts +++ b/apps/web/core/store/issue/cycle/issue.store.ts @@ -131,7 +131,7 @@ export class CycleIssues extends BaseIssuesStore implements ICycleIssues { * @param projectId * @param id is the cycle Id */ - fetchParentStats = (workspaceSlug: string, projectId?: string | undefined, id?: string | undefined) => { + fetchParentStats = (workspaceSlug: string, projectId?: string, id?: string) => { const cycleId = id ?? this.cycleId; if (projectId && cycleId) { @@ -150,7 +150,7 @@ export class CycleIssues extends BaseIssuesStore implements ICycleIssues { } }; - updateParentStats = (prevIssueState?: TIssue, nextIssueState?: TIssue, id?: string | undefined) => { + updateParentStats = (prevIssueState?: TIssue, nextIssueState?: TIssue, id?: string) => { try { const distributionUpdates = getDistributionPathsPostUpdate( prevIssueState, @@ -305,12 +305,7 @@ export class CycleIssues extends BaseIssuesStore implements ICycleIssues { } ) => { // call API call to transfer issues - const response = await this.cycleService.transferIssues( - workspaceSlug as string, - projectId as string, - cycleId as string, - payload - ); + const response = await this.cycleService.transferIssues(workspaceSlug, projectId, cycleId, payload); // call fetch issues if (this.paginationOptions) { await this.fetchIssues(workspaceSlug, projectId, "mutation", this.paginationOptions, cycleId); diff --git a/apps/web/core/store/issue/helpers/base-issues-utils.ts b/apps/web/core/store/issue/helpers/base-issues-utils.ts index a0f710b115..b0ae994087 100644 --- a/apps/web/core/store/issue/helpers/base-issues-utils.ts +++ b/apps/web/core/store/issue/helpers/base-issues-utils.ts @@ -249,12 +249,12 @@ export const getFilteredWorkItems = (workItems: TIssue[], filters: IIssueFilterO activeFilters.every(([filterKey, filterValues]) => { // Handle date filters separately if (filterKey === "start_date" || filterKey === "target_date") { - return checkIssueDateFilter(workItem, filterKey as "start_date" | "target_date", filterValues as string[]); + return checkIssueDateFilter(workItem, filterKey, filterValues as string[]); } // Handle regular filters const issueKey = FILTER_TO_ISSUE_MAP[filterKey as keyof IIssueFilterOptions]; if (!issueKey) return true; // Skip if no mapping exists - const issueValue = workItem[issueKey as keyof TIssue]; + const issueValue = workItem[issueKey]; // Handle array-based properties vs single value properties if (Array.isArray(issueValue)) { return filterValues!.some((filterValue: any) => issueValue.includes(filterValue)); @@ -338,7 +338,7 @@ export const getGroupedWorkItemIds = ( // Convert to Record type const groupedWorkItemsRecord: Record = {}; Object.entries(groupedWorkItems).forEach(([key, items]) => { - groupedWorkItemsRecord[key] = getOrderedWorkItems(items as TIssue[], orderByKey); + groupedWorkItemsRecord[key] = getOrderedWorkItems(items, orderByKey); }); return groupedWorkItemsRecord; diff --git a/apps/web/core/store/issue/helpers/base-issues.store.ts b/apps/web/core/store/issue/helpers/base-issues.store.ts index 26d01580d3..56095de994 100644 --- a/apps/web/core/store/issue/helpers/base-issues.store.ts +++ b/apps/web/core/store/issue/helpers/base-issues.store.ts @@ -313,15 +313,15 @@ export abstract class BaseIssuesStore implements IBaseIssuesStore { const allIssues = groupedIssueIds[ALL_ISSUES] ?? []; if (!this.groupBy && !this.subGroupBy && allIssues && Array.isArray(allIssues)) { - return allIssues as string[]; + return allIssues; } if (this.groupBy && groupId && groupedIssueIds?.[groupId] && Array.isArray(groupedIssueIds[groupId])) { - return (groupedIssueIds[groupId] ?? []) as string[]; + return groupedIssueIds[groupId] ?? []; } if (this.groupBy && this.subGroupBy && groupId && subGroupId) { - return ((groupedIssueIds as TSubGroupedIssues)[groupId]?.[subGroupId] ?? []) as string[]; + return (groupedIssueIds as TSubGroupedIssues)[groupId]?.[subGroupId] ?? []; } return undefined; @@ -1411,7 +1411,7 @@ export abstract class BaseIssuesStore implements IBaseIssuesStore { // if groupedIssueIds is an array, update the `groupedIssueIds` store at the issuePath if (groupedIssueIds && Array.isArray(groupedIssueIds)) { update(this, ["groupedIssueIds", ...issuePath], (issueIds: string[] = []) => - this.issuesSortWithOrderBy(uniq(concat(issueIds, groupedIssueIds as string[])), this.orderBy) + this.issuesSortWithOrderBy(uniq(concat(issueIds, groupedIssueIds)), this.orderBy) ); // return true to indicate the store has been updated return true; @@ -1623,7 +1623,7 @@ export abstract class BaseIssuesStore implements IBaseIssuesStore { getArrayStringArray = ( issueObject: Partial | undefined, value: string | string[] | undefined | null, - groupByKey?: TIssueGroupByOptions | undefined + groupByKey?: TIssueGroupByOptions ): string[] => { // if issue object is undefined return empty array if (!issueObject) return []; diff --git a/apps/web/core/store/issue/issue-details/root.store.ts b/apps/web/core/store/issue/issue-details/root.store.ts index 76acf3e4dd..bcb6ef6e59 100644 --- a/apps/web/core/store/issue/issue-details/root.store.ts +++ b/apps/web/core/store/issue/issue-details/root.store.ts @@ -227,7 +227,7 @@ export abstract class IssueDetail implements IIssueDetail { this.issue = new IssueStore(this, serviceType); this.reaction = new IssueReactionStore(this, serviceType); this.attachment = new IssueAttachmentStore(rootStore, serviceType); - this.activity = new IssueActivityStore(rootStore.rootStore as RootStore, serviceType); + this.activity = new IssueActivityStore(rootStore.rootStore, serviceType); this.comment = new IssueCommentStore(this, serviceType); this.commentReaction = new IssueCommentReactionStore(this); this.subIssues = new IssueSubIssuesStore(this, serviceType); diff --git a/apps/web/core/store/issue/module/filter.store.ts b/apps/web/core/store/issue/module/filter.store.ts index 42d18c8f51..a2421436f2 100644 --- a/apps/web/core/store/issue/module/filter.store.ts +++ b/apps/web/core/store/issue/module/filter.store.ts @@ -207,7 +207,7 @@ export class ModuleIssuesFilter extends IssueFilterHelperStore implements IModul if (isEmpty(this.filters) || isEmpty(this.filters[moduleId])) return; const _filters = { - richFilters: this.filters[moduleId].richFilters as TWorkItemFilterExpression, + richFilters: this.filters[moduleId].richFilters, displayFilters: this.filters[moduleId].displayFilters as IIssueDisplayFilterOptions, displayProperties: this.filters[moduleId].displayProperties as IIssueDisplayProperties, kanbanFilters: this.filters[moduleId].kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/issue/module/issue.store.ts b/apps/web/core/store/issue/module/issue.store.ts index 540d0aa940..488d183d3d 100644 --- a/apps/web/core/store/issue/module/issue.store.ts +++ b/apps/web/core/store/issue/module/issue.store.ts @@ -85,7 +85,7 @@ export class ModuleIssues extends BaseIssuesStore implements IModuleIssues { * @param projectId * @param id is the module Id */ - fetchParentStats = (workspaceSlug: string, projectId?: string | undefined, id?: string | undefined) => { + fetchParentStats = (workspaceSlug: string, projectId?: string, id?: string) => { const moduleId = id ?? this.moduleId; projectId && moduleId && @@ -98,7 +98,7 @@ export class ModuleIssues extends BaseIssuesStore implements IModuleIssues { * @param nextIssueState * @param id */ - updateParentStats = (prevIssueState?: TIssue, nextIssueState?: TIssue, id?: string | undefined) => { + updateParentStats = (prevIssueState?: TIssue, nextIssueState?: TIssue, id?: string) => { try { // get distribution updates const distributionUpdates = getDistributionPathsPostUpdate( diff --git a/apps/web/core/store/issue/profile/filter.store.ts b/apps/web/core/store/issue/profile/filter.store.ts index fa3f209543..3e2da337af 100644 --- a/apps/web/core/store/issue/profile/filter.store.ts +++ b/apps/web/core/store/issue/profile/filter.store.ts @@ -183,7 +183,7 @@ export class ProfileIssuesFilter extends IssueFilterHelperStore implements IProf if (isEmpty(this.filters) || isEmpty(this.filters[userId])) return; const _filters = { - richFilters: this.filters[userId].richFilters as TWorkItemFilterExpression, + richFilters: this.filters[userId].richFilters, displayFilters: this.filters[userId].displayFilters as IIssueDisplayFilterOptions, displayProperties: this.filters[userId].displayProperties as IIssueDisplayProperties, kanbanFilters: this.filters[userId].kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/issue/project-views/filter.store.ts b/apps/web/core/store/issue/project-views/filter.store.ts index ca7f9e6099..efeacc8b6e 100644 --- a/apps/web/core/store/issue/project-views/filter.store.ts +++ b/apps/web/core/store/issue/project-views/filter.store.ts @@ -216,7 +216,7 @@ export class ProjectViewIssuesFilter extends IssueFilterHelperStore implements I if (isEmpty(this.filters) || isEmpty(this.filters[viewId])) return; const _filters = { - richFilters: this.filters[viewId].richFilters as TWorkItemFilterExpression, + richFilters: this.filters[viewId].richFilters, displayFilters: this.filters[viewId].displayFilters as IIssueDisplayFilterOptions, displayProperties: this.filters[viewId].displayProperties as IIssueDisplayProperties, kanbanFilters: this.filters[viewId].kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/issue/project/filter.store.ts b/apps/web/core/store/issue/project/filter.store.ts index 28af59adfd..1768606c5e 100644 --- a/apps/web/core/store/issue/project/filter.store.ts +++ b/apps/web/core/store/issue/project/filter.store.ts @@ -190,7 +190,7 @@ export class ProjectIssuesFilter extends IssueFilterHelperStore implements IProj if (isEmpty(this.filters) || isEmpty(this.filters[projectId])) return; const _filters = { - richFilters: this.filters[projectId].richFilters as TWorkItemFilterExpression, + richFilters: this.filters[projectId].richFilters, displayFilters: this.filters[projectId].displayFilters as IIssueDisplayFilterOptions, displayProperties: this.filters[projectId].displayProperties as IIssueDisplayProperties, kanbanFilters: this.filters[projectId].kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/issue/workspace-draft/filter.store.ts b/apps/web/core/store/issue/workspace-draft/filter.store.ts index 1ef5a94a56..49941ccfca 100644 --- a/apps/web/core/store/issue/workspace-draft/filter.store.ts +++ b/apps/web/core/store/issue/workspace-draft/filter.store.ts @@ -189,7 +189,7 @@ export class WorkspaceDraftIssuesFilter extends IssueFilterHelperStore implement if (isEmpty(this.filters) || isEmpty(this.filters[workspaceSlug])) return; const _filters = { - richFilters: this.filters[workspaceSlug].richFilters as TWorkItemFilterExpression, + richFilters: this.filters[workspaceSlug].richFilters, displayFilters: this.filters[workspaceSlug].displayFilters as IIssueDisplayFilterOptions, displayProperties: this.filters[workspaceSlug].displayProperties as IIssueDisplayProperties, kanbanFilters: this.filters[workspaceSlug].kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/issue/workspace/filter.store.ts b/apps/web/core/store/issue/workspace/filter.store.ts index b3dfbe9285..630429bb38 100644 --- a/apps/web/core/store/issue/workspace/filter.store.ts +++ b/apps/web/core/store/issue/workspace/filter.store.ts @@ -24,7 +24,7 @@ import type { IBaseIssueFilterStore, IIssueFilterHelperStore } from "../helpers/ import { IssueFilterHelperStore } from "../helpers/issue-filter-helper.store"; import type { IIssueRootStore } from "../root.store"; -type TWorkspaceFilters = TStaticViewTypes | string; +type TWorkspaceFilters = TStaticViewTypes; export type TBaseFilterStore = IBaseIssueFilterStore & IIssueFilterHelperStore; @@ -132,7 +132,7 @@ export class WorkspaceIssuesFilter extends IssueFilterHelperStore implements IWo if (STATIC_VIEW_TYPES.includes(viewId)) { const currentUserId = this.rootIssueStore.currentUserId; - const paramForStaticView = this.getFilterConditionBasedOnViews(currentUserId, viewId as TStaticViewTypes); + const paramForStaticView = this.getFilterConditionBasedOnViews(currentUserId, viewId); if (paramForStaticView) { filterParams = { ...filterParams, ...paramForStaticView }; } @@ -212,7 +212,7 @@ export class WorkspaceIssuesFilter extends IssueFilterHelperStore implements IWo if (!issueFilters) return; const _filters = { - richFilters: issueFilters.richFilters as TWorkItemFilterExpression, + richFilters: issueFilters.richFilters, displayFilters: issueFilters.displayFilters as IIssueDisplayFilterOptions, displayProperties: issueFilters.displayProperties as IIssueDisplayProperties, kanbanFilters: issueFilters.kanbanFilters as TIssueKanbanFilters, diff --git a/apps/web/core/store/notifications/workspace-notifications.store.ts b/apps/web/core/store/notifications/workspace-notifications.store.ts index 7923d8b659..0767179299 100644 --- a/apps/web/core/store/notifications/workspace-notifications.store.ts +++ b/apps/web/core/store/notifications/workspace-notifications.store.ts @@ -144,7 +144,7 @@ export class WorkspaceNotificationStore implements IWorkspaceNotificationStore { } }) // .filter((n) => (this.filters.read ? (n.read_at ? true : false) : n.read_at ? false : true)) - .map((n) => n.id) as string[]; + .map((n) => n.id); return workspaceNotificationIds; }); diff --git a/apps/web/core/store/pages/project-page.store.ts b/apps/web/core/store/pages/project-page.store.ts index 203c4b62e0..e9e01a97b8 100644 --- a/apps/web/core/store/pages/project-page.store.ts +++ b/apps/web/core/store/pages/project-page.store.ts @@ -596,7 +596,7 @@ export class ProjectPageStore implements IProjectPageStore { const existingPage = this.getPageById(page.id); if (existingPage) { // If page already exists, update all fields except name - // eslint-disable-next-line @typescript-eslint/no-unused-vars + const { name, ...otherFields } = page; existingPage.mutateProperties(otherFields, false); } else { diff --git a/apps/web/ee/components/active-cycles/card-v1.tsx b/apps/web/ee/components/active-cycles/card-v1.tsx index 884a84fe9a..8f791162ce 100644 --- a/apps/web/ee/components/active-cycles/card-v1.tsx +++ b/apps/web/ee/components/active-cycles/card-v1.tsx @@ -23,7 +23,7 @@ export type ActiveCycleInfoCardProps = { projectId: string; }; -export const ActiveCycleInfoCard: FC = (props) => { +export function ActiveCycleInfoCard(props: ActiveCycleInfoCardProps) { const { cycle, workspaceSlug, projectId } = props; const { data: progress } = useSWR( @@ -57,4 +57,4 @@ export const ActiveCycleInfoCard: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/active-cycles/card-v2.tsx b/apps/web/ee/components/active-cycles/card-v2.tsx index 101635797d..98240499af 100644 --- a/apps/web/ee/components/active-cycles/card-v2.tsx +++ b/apps/web/ee/components/active-cycles/card-v2.tsx @@ -13,7 +13,7 @@ export type ActiveCycleInfoCardProps = { projectId: string; }; -export const ActiveCycleInfoCard: FC = observer((props) => { +export const ActiveCycleInfoCard = observer(function ActiveCycleInfoCard(props: ActiveCycleInfoCardProps) { const { cycle, workspaceSlug, projectId } = props; const cycleDetails = useCycleDetails({ workspaceSlug, projectId, cycleId: cycle.id, defaultCycle: cycle }); return ( diff --git a/apps/web/ee/components/active-cycles/cycle-stats.tsx b/apps/web/ee/components/active-cycles/cycle-stats.tsx index 896a7c633b..daf17c76b9 100644 --- a/apps/web/ee/components/active-cycles/cycle-stats.tsx +++ b/apps/web/ee/components/active-cycles/cycle-stats.tsx @@ -51,7 +51,7 @@ export type ActiveCycleStatsProps = { cycle: IActiveCycle; }; -export const ActiveCycleStats: FC = observer((props) => { +export const ActiveCycleStats = observer(function ActiveCycleStats(props: ActiveCycleStatsProps) { const { workspaceSlug, projectId, cycle } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/active-cycles/header.tsx b/apps/web/ee/components/active-cycles/header.tsx index 3471bd761f..f43b26bcde 100644 --- a/apps/web/ee/components/active-cycles/header.tsx +++ b/apps/web/ee/components/active-cycles/header.tsx @@ -18,7 +18,7 @@ export type ActiveCycleHeaderProps = { projectId: string; }; -export const ActiveCycleHeader: FC = (props) => { +export function ActiveCycleHeader(props: ActiveCycleHeaderProps) { const { cycle, workspaceSlug, projectId } = props; // store const { getUserDetails } = useMember(); @@ -76,4 +76,4 @@ export const ActiveCycleHeader: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/active-cycles/priority-issues.tsx b/apps/web/ee/components/active-cycles/priority-issues.tsx index 3dbac9d74d..129c2d8d67 100644 --- a/apps/web/ee/components/active-cycles/priority-issues.tsx +++ b/apps/web/ee/components/active-cycles/priority-issues.tsx @@ -26,7 +26,9 @@ export type ActiveCyclePriorityIssuesProps = { cycle: IActiveCycle; }; -export const ActiveCyclePriorityIssues: FC = observer((props) => { +export const ActiveCyclePriorityIssues = observer(function ActiveCyclePriorityIssues( + props: ActiveCyclePriorityIssuesProps +) { const { workspaceSlug, projectId, cycle } = props; // store hooks const { diff --git a/apps/web/ee/components/active-cycles/productivity.tsx b/apps/web/ee/components/active-cycles/productivity.tsx index 7931914b27..1c386dc301 100644 --- a/apps/web/ee/components/active-cycles/productivity.tsx +++ b/apps/web/ee/components/active-cycles/productivity.tsx @@ -22,7 +22,7 @@ const cycleBurnDownChartOptions = [ { value: "points", label: "Points" }, ]; -export const ActiveCycleProductivity: FC = observer((props) => { +export const ActiveCycleProductivity = observer(function ActiveCycleProductivity(props: ActiveCycleProductivityProps) { const { cycle, workspaceSlug } = props; const { data: estimate_distribution } = useSWR( diff --git a/apps/web/ee/components/active-cycles/progress.tsx b/apps/web/ee/components/active-cycles/progress.tsx index 88beaf28f5..45d211b830 100644 --- a/apps/web/ee/components/active-cycles/progress.tsx +++ b/apps/web/ee/components/active-cycles/progress.tsx @@ -15,7 +15,7 @@ export type ActiveCycleProgressProps = { cycle: ICycle; }; -export const ActiveCycleProgress: FC = (props) => { +export function ActiveCycleProgress(props: ActiveCycleProgressProps) { const { cycle } = props; // plane hooks const { t } = useTranslation(); @@ -98,4 +98,4 @@ export const ActiveCycleProgress: FC = (props) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/active-cycles/project-title.tsx b/apps/web/ee/components/active-cycles/project-title.tsx index dc0b0727ef..e091b30315 100644 --- a/apps/web/ee/components/active-cycles/project-title.tsx +++ b/apps/web/ee/components/active-cycles/project-title.tsx @@ -8,7 +8,7 @@ export type ActiveCyclesProjectTitleProps = { project: Partial | undefined; }; -export const ActiveCyclesProjectTitle: FC = (props) => { +export function ActiveCyclesProjectTitle(props: ActiveCyclesProjectTitleProps) { const { project } = props; return (
    @@ -16,4 +16,4 @@ export const ActiveCyclesProjectTitle: FC = (prop

    {project?.name}

    ); -}; +} diff --git a/apps/web/ee/components/active-cycles/root.tsx b/apps/web/ee/components/active-cycles/root.tsx index 24ad1723f7..751485829e 100644 --- a/apps/web/ee/components/active-cycles/root.tsx +++ b/apps/web/ee/components/active-cycles/root.tsx @@ -3,7 +3,7 @@ import { useParams } from "next/navigation"; import { WorkspaceActiveCyclesList, WorkspaceActiveCyclesUpgrade } from "@/plane-web/components/active-cycles"; import { WithFeatureFlagHOC } from "@/plane-web/components/feature-flags"; -export const WorkspaceActiveCyclesRoot = () => { +export function WorkspaceActiveCyclesRoot() { // router const { workspaceSlug } = useParams(); @@ -16,4 +16,4 @@ export const WorkspaceActiveCyclesRoot = () => { ); -}; +} diff --git a/apps/web/ee/components/active-cycles/workspace-active-cycle-root.tsx b/apps/web/ee/components/active-cycles/workspace-active-cycle-root.tsx index 2b38dbcc1b..8f67d130df 100644 --- a/apps/web/ee/components/active-cycles/workspace-active-cycle-root.tsx +++ b/apps/web/ee/components/active-cycles/workspace-active-cycle-root.tsx @@ -8,12 +8,12 @@ export type ActiveCycleInfoCardProps = { projectId: string; }; -export const WorkspaceActiveCycleRoot = (props: ActiveCycleInfoCardProps) => { +export function WorkspaceActiveCycleRoot(props: ActiveCycleInfoCardProps) { const { workspaceSlug, cycle } = props; const isFeatureEnabled = useFlag(workspaceSlug.toString(), "CYCLE_PROGRESS_CHARTS"); const ActiveCycle = useMemo( - () => - lazy(() => + function ActiveCycle() { + return lazy(() => isFeatureEnabled ? import(`./card-v2`).then((module) => ({ default: module["ActiveCycleInfoCard"], @@ -21,7 +21,8 @@ export const WorkspaceActiveCycleRoot = (props: ActiveCycleInfoCardProps) => { : import("./card-v1").then((module) => ({ default: module["ActiveCycleInfoCard"], })) - ), + ); + }, [isFeatureEnabled] ); @@ -30,4 +31,4 @@ export const WorkspaceActiveCycleRoot = (props: ActiveCycleInfoCardProps) => { ); -}; +} diff --git a/apps/web/ee/components/active-cycles/workspace-active-cycles-list.tsx b/apps/web/ee/components/active-cycles/workspace-active-cycles-list.tsx index cfe31bd875..8273d51de5 100644 --- a/apps/web/ee/components/active-cycles/workspace-active-cycles-list.tsx +++ b/apps/web/ee/components/active-cycles/workspace-active-cycles-list.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect, useRef, useState } from "react"; import { uniqBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -24,7 +22,7 @@ const perPage = 100; const cycleService = new CycleService(); const DEFAULT_LIMIT = 3; -export const WorkspaceActiveCyclesList = observer(() => { +export const WorkspaceActiveCyclesList = observer(function WorkspaceActiveCyclesList() { // router const { workspaceSlug } = useParams(); // ref @@ -41,7 +39,7 @@ export const WorkspaceActiveCyclesList = observer(() => { // fetching active cycles in workspace const { data: workspaceActiveCycles, isLoading } = useSWR( workspaceSlug && `${perPage}:${pageCount}:0` - ? WORKSPACE_ACTIVE_CYCLES_LIST(workspaceSlug as string, `${perPage}:${pageCount}:0`, `${perPage}`) + ? WORKSPACE_ACTIVE_CYCLES_LIST(workspaceSlug, `${perPage}:${pageCount}:0`, `${perPage}`) : null, workspaceSlug && `${perPage}:${pageCount}:0` ? () => cycleService.workspaceActiveCycles(workspaceSlug.toString(), `${perPage}:${pageCount}:0`, perPage) diff --git a/apps/web/ee/components/active-cycles/workspace-active-cycles-upgrade.tsx b/apps/web/ee/components/active-cycles/workspace-active-cycles-upgrade.tsx index a357cb6076..9a01077dcd 100644 --- a/apps/web/ee/components/active-cycles/workspace-active-cycles-upgrade.tsx +++ b/apps/web/ee/components/active-cycles/workspace-active-cycles-upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { AlertOctagon, BarChart4, CircleDashed, Folder, Microscope, Search, Crown } from "lucide-react"; // ui @@ -54,7 +52,7 @@ const WORKSPACE_ACTIVE_CYCLES_DETAILS = [ }, ]; -export const WorkspaceActiveCyclesUpgrade = observer(() => { +export const WorkspaceActiveCyclesUpgrade = observer(function WorkspaceActiveCyclesUpgrade() { // store hooks const { userProfile: { data: userProfile }, diff --git a/apps/web/ee/components/analytics/cycles/cycle-progress.tsx b/apps/web/ee/components/analytics/cycles/cycle-progress.tsx index 9b1f9a7dcc..ad391a1bc4 100644 --- a/apps/web/ee/components/analytics/cycles/cycle-progress.tsx +++ b/apps/web/ee/components/analytics/cycles/cycle-progress.tsx @@ -21,7 +21,7 @@ import type { ICycleModuleTooltipProps } from "../modules-cycles-tooltip"; import ModulesCyclesTooltip from "../modules-cycles-tooltip"; const analyticsService = new AnalyticsService(); -const CycleProgress = observer(() => { +const CycleProgress = observer(function CycleProgress() { const params = useParams(); const { t } = useTranslation(); const workspaceSlug = params.workspaceSlug.toString(); diff --git a/apps/web/ee/components/analytics/cycles/cycles-insight-table.tsx b/apps/web/ee/components/analytics/cycles/cycles-insight-table.tsx index 64629586ee..6cd616d3ec 100644 --- a/apps/web/ee/components/analytics/cycles/cycles-insight-table.tsx +++ b/apps/web/ee/components/analytics/cycles/cycles-insight-table.tsx @@ -32,9 +32,9 @@ declare module "@tanstack/react-table" { const analyticsService = new AnalyticsService(); -const CyclesInsightTable = observer(() => { +const CyclesInsightTable = observer(function CyclesInsightTable() { const params = useParams(); - const workspaceSlug = params.workspaceSlug as string; + const workspaceSlug = params.workspaceSlug; const { t } = useTranslation(); const { selectedDuration, selectedProjects } = useAnalytics(); const { getUserDetails } = useMember(); diff --git a/apps/web/ee/components/analytics/cycles/root.tsx b/apps/web/ee/components/analytics/cycles/root.tsx index e5a21b305c..b40f682c92 100644 --- a/apps/web/ee/components/analytics/cycles/root.tsx +++ b/apps/web/ee/components/analytics/cycles/root.tsx @@ -4,14 +4,16 @@ import TotalInsights from "@/components/analytics/total-insights"; import CycleProgress from "./cycle-progress"; import CyclesInsightTable from "./cycles-insight-table"; -const Cycles = () => ( - -
    - - - -
    -     -); +function Cycles() { + return ( + +
    + + + +
    +     + ); +} export { Cycles }; diff --git a/apps/web/ee/components/analytics/intake/intake-insight-table.tsx b/apps/web/ee/components/analytics/intake/intake-insight-table.tsx index 6155471c3b..27d1cf037f 100644 --- a/apps/web/ee/components/analytics/intake/intake-insight-table.tsx +++ b/apps/web/ee/components/analytics/intake/intake-insight-table.tsx @@ -18,9 +18,9 @@ import { AnalyticsService } from "@/services/analytics.service"; const analyticsService = new AnalyticsService(); -const IntakeInsightTable = observer(() => { +const IntakeInsightTable = observer(function IntakeInsightTable() { const params = useParams(); - const workspaceSlug = params.workspaceSlug as string; + const workspaceSlug = params.workspaceSlug; const { t } = useTranslation(); const { selectedDuration, selectedProjects, selectedCycle, selectedModule, isPeekView } = useAnalytics(); const { data: intakeData, isLoading } = useSWR( diff --git a/apps/web/ee/components/analytics/intake/intake-trends.tsx b/apps/web/ee/components/analytics/intake/intake-trends.tsx index 139e9f94b8..f3fd070a7e 100644 --- a/apps/web/ee/components/analytics/intake/intake-trends.tsx +++ b/apps/web/ee/components/analytics/intake/intake-trends.tsx @@ -17,7 +17,7 @@ import { AnalyticsService } from "@/services/analytics.service"; // plane web components const analyticsService = new AnalyticsService(); -const IntakeTrends = observer(() => { +const IntakeTrends = observer(function IntakeTrends() { const { selectedDuration, selectedDurationLabel, selectedProjects, selectedCycle, selectedModule, isPeekView } = useAnalytics(); const params = useParams(); diff --git a/apps/web/ee/components/analytics/intake/root.tsx b/apps/web/ee/components/analytics/intake/root.tsx index 0073e304ed..7e730e2aa8 100644 --- a/apps/web/ee/components/analytics/intake/root.tsx +++ b/apps/web/ee/components/analytics/intake/root.tsx @@ -4,14 +4,16 @@ import TotalInsights from "@/components/analytics/total-insights"; import IntakeInsightTable from "./intake-insight-table"; import IntakeTrends from "./intake-trends"; -const Intake = () => ( - -
    - - - -
    -     -); +function Intake() { + return ( + +
    + + + +
    +     + ); +} export { Intake }; diff --git a/apps/web/ee/components/analytics/locked-tab-label.tsx b/apps/web/ee/components/analytics/locked-tab-label.tsx index ca1844a644..32c7225157 100644 --- a/apps/web/ee/components/analytics/locked-tab-label.tsx +++ b/apps/web/ee/components/analytics/locked-tab-label.tsx @@ -10,30 +10,32 @@ interface LockedTabLabelProps { t: (key: string, params?: Record) => string; } -const LockedTabLabel: React.FC = ({ label, t }) => ( - - {t("workspace_analytics.upgrade_to_plan", { - plan: ( - - {t("sidebar.pro")} - - ), - tab: label, - })} +function LockedTabLabel({ label, t }: LockedTabLabelProps) { + return ( + + {t("workspace_analytics.upgrade_to_plan", { + plan: ( + + {t("sidebar.pro")} + + ), + tab: label, + })} +
    + } + > +
    + {label}
    - } - > -
    - {label} -
    - -); + + ); +} export default LockedTabLabel; diff --git a/apps/web/ee/components/analytics/modules-cycles-tooltip.tsx b/apps/web/ee/components/analytics/modules-cycles-tooltip.tsx index 7725bd34bb..8e29f3d07e 100644 --- a/apps/web/ee/components/analytics/modules-cycles-tooltip.tsx +++ b/apps/web/ee/components/analytics/modules-cycles-tooltip.tsx @@ -15,14 +15,14 @@ export interface ICycleModuleTooltipProps { completedCount: number; } -const ModulesCyclesTooltip = ({ +function ModulesCyclesTooltip({ title, startDate, endDate, rows, totalCount, completedCount, -}: ICycleModuleTooltipProps) => { +}: ICycleModuleTooltipProps) { const completionPercentage = useMemo(() => { // Edge case 1: Both are 0 if (completedCount === 0 || totalCount === 0) return 0; @@ -66,6 +66,6 @@ const ModulesCyclesTooltip = ({
    ); -}; +} export default ModulesCyclesTooltip; diff --git a/apps/web/ee/components/analytics/modules/module-insight-table.tsx b/apps/web/ee/components/analytics/modules/module-insight-table.tsx index 6434e0c536..99fea41902 100644 --- a/apps/web/ee/components/analytics/modules/module-insight-table.tsx +++ b/apps/web/ee/components/analytics/modules/module-insight-table.tsx @@ -21,9 +21,9 @@ import { UserAvatarName } from "../user-avatar-name"; const analyticsService = new AnalyticsService(); -const ModulesInsightTable = observer(() => { +const ModulesInsightTable = observer(function ModulesInsightTable() { const params = useParams(); - const workspaceSlug = params.workspaceSlug as string; + const workspaceSlug = params.workspaceSlug; const { t } = useTranslation(); const { selectedDuration, selectedProjects } = useAnalytics(); const { getUserDetails } = useMember(); diff --git a/apps/web/ee/components/analytics/modules/modules-progress.tsx b/apps/web/ee/components/analytics/modules/modules-progress.tsx index 7e809ecae4..8db2500e08 100644 --- a/apps/web/ee/components/analytics/modules/modules-progress.tsx +++ b/apps/web/ee/components/analytics/modules/modules-progress.tsx @@ -20,7 +20,7 @@ import type { ICycleModuleTooltipProps } from "../modules-cycles-tooltip"; import ModulesCyclesTooltip from "../modules-cycles-tooltip"; const analyticsService = new AnalyticsService(); -const ModuleProgress = observer(() => { +const ModuleProgress = observer(function ModuleProgress() { const params = useParams(); const { t } = useTranslation(); const workspaceSlug = params.workspaceSlug.toString(); diff --git a/apps/web/ee/components/analytics/modules/root.tsx b/apps/web/ee/components/analytics/modules/root.tsx index c0464c5b26..35424054af 100644 --- a/apps/web/ee/components/analytics/modules/root.tsx +++ b/apps/web/ee/components/analytics/modules/root.tsx @@ -4,14 +4,16 @@ import TotalInsights from "@/components/analytics/total-insights"; import ModulesInsightTable from "./module-insight-table"; import ModuleProgress from "./modules-progress"; -const Modules = () => ( - -
    - - - -
    -     -); +function Modules() { + return ( + +
    + + + +
    +     + ); +} export { Modules }; diff --git a/apps/web/ee/components/analytics/projects/projects-by-status.tsx b/apps/web/ee/components/analytics/projects/projects-by-status.tsx index da24c7b412..ae5dad1be3 100644 --- a/apps/web/ee/components/analytics/projects/projects-by-status.tsx +++ b/apps/web/ee/components/analytics/projects/projects-by-status.tsx @@ -20,7 +20,7 @@ import { AnalyticsService } from "@/services/analytics.service"; // plane web components const analyticsService = new AnalyticsService(); -const ProjectsByStatus = observer(() => { +const ProjectsByStatus = observer(function ProjectsByStatus() { const { selectedDuration, selectedDurationLabel, selectedProjects, selectedCycle, selectedModule, isPeekView } = useAnalytics(); const params = useParams(); diff --git a/apps/web/ee/components/analytics/projects/projects-insight-table.tsx b/apps/web/ee/components/analytics/projects/projects-insight-table.tsx index d0e8b46525..77243acbab 100644 --- a/apps/web/ee/components/analytics/projects/projects-insight-table.tsx +++ b/apps/web/ee/components/analytics/projects/projects-insight-table.tsx @@ -20,7 +20,7 @@ import { AnalyticsService } from "@/services/analytics.service"; const analyticsService = new AnalyticsService(); -const ProjectsInsightTable = observer(() => { +const ProjectsInsightTable = observer(function ProjectsInsightTable() { // router const params = useParams(); const workspaceSlug = params.workspaceSlug.toString(); diff --git a/apps/web/ee/components/analytics/projects/root.tsx b/apps/web/ee/components/analytics/projects/root.tsx index 60fb5989c9..83472e3896 100644 --- a/apps/web/ee/components/analytics/projects/root.tsx +++ b/apps/web/ee/components/analytics/projects/root.tsx @@ -4,14 +4,16 @@ import TotalInsights from "@/components/analytics/total-insights"; import ProjectsByStatus from "./projects-by-status"; import ProjectsInsightTable from "./projects-insight-table"; -const Projects: React.FC = () => ( - -
    - - - -
    -     -); +function Projects() { + return ( + +
    + + + +
    +     + ); +} export { Projects }; diff --git a/apps/web/ee/components/analytics/user-avatar-name.tsx b/apps/web/ee/components/analytics/user-avatar-name.tsx index 7e892ebca6..23e161395a 100644 --- a/apps/web/ee/components/analytics/user-avatar-name.tsx +++ b/apps/web/ee/components/analytics/user-avatar-name.tsx @@ -10,7 +10,13 @@ import { Avatar, Tooltip } from "@plane/ui"; import { getFileURL } from "@plane/utils"; import { useMember } from "@/hooks/store/use-member"; -export const UserAvatarName: FC<{ userId: string; showName?: boolean }> = observer(({ userId, showName = true }) => { +export const UserAvatarName = observer(function UserAvatarName({ + userId, + showName = true, +}: { + userId: string; + showName?: boolean; +}) { const { t } = useTranslation(); const { workspaceSlug } = useParams(); const { @@ -18,7 +24,7 @@ export const UserAvatarName: FC<{ userId: string; showName?: boolean }> = observ workspace: { isUserSuspended, getWorkspaceMemberDetails }, } = useMember(); const user = getUserDetails(userId); - const isSuspended = workspaceSlug && isUserSuspended(userId, workspaceSlug as string); + const isSuspended = workspaceSlug && isUserSuspended(userId, workspaceSlug); const workspaceMember = getWorkspaceMemberDetails(userId); // Get role badge text diff --git a/apps/web/ee/components/analytics/users/root.tsx b/apps/web/ee/components/analytics/users/root.tsx index 5865515535..4f983499c8 100644 --- a/apps/web/ee/components/analytics/users/root.tsx +++ b/apps/web/ee/components/analytics/users/root.tsx @@ -19,7 +19,7 @@ import WiResolvedVsPending from "./wi-resolved-vs-pending"; const analyticsService = new AnalyticsService(); -const Users: React.FC = observer(() => { +const Users = observer(function Users() { const params = useParams(); const workspaceSlug = params.workspaceSlug.toString(); diff --git a/apps/web/ee/components/analytics/users/user-insight-table.tsx b/apps/web/ee/components/analytics/users/user-insight-table.tsx index 5d8dd2bdb7..ccb1b82d51 100644 --- a/apps/web/ee/components/analytics/users/user-insight-table.tsx +++ b/apps/web/ee/components/analytics/users/user-insight-table.tsx @@ -13,7 +13,7 @@ interface UsersInsightTableProps { isLoading: boolean; } -const UsersInsightTable = observer(({ data: usersData, isLoading }: UsersInsightTableProps) => { +const UsersInsightTable = observer(function UsersInsightTable({ data: usersData, isLoading }: UsersInsightTableProps) { const { t } = useTranslation(); // derived values diff --git a/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/index.tsx b/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/index.tsx index b5623b33ff..96b4ca72de 100644 --- a/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/index.tsx +++ b/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/index.tsx @@ -24,114 +24,111 @@ interface WiResolvedVsPendingProps { selectedDurationLabel: string; } -const WiResolvedVsPending = observer( - ({ - data: resolvedVsPendingData, - isLoading: isResolvedVsPendingLoading, - selectedDurationLabel, - }: WiResolvedVsPendingProps) => { - const { t } = useTranslation(); - const { getUserDetails } = useMember(); +const WiResolvedVsPending = observer(function WiResolvedVsPending({ + data: resolvedVsPendingData, + isLoading: isResolvedVsPendingLoading, + selectedDurationLabel, +}: WiResolvedVsPendingProps) { + const { t } = useTranslation(); + const { getUserDetails } = useMember(); - /** - * derived values - */ + /** + * derived values + */ - const resolvedVsPendingParsedData: TChartData[] = useMemo(() => { - if (!resolvedVsPendingData) return []; - return resolvedVsPendingData.map((datum) => { - const userDetails = getUserDetails(datum.user_id); - return { - ...datum, - pending: datum.started_work_items + datum.un_started_work_items + datum.backlog_work_items, - total: - datum.completed_work_items + - datum.started_work_items + - datum.un_started_work_items + - datum.backlog_work_items, - name: userDetails?.display_name ?? "", - }; - }); - }, [resolvedVsPendingData, getUserDetails]); - - const CustomStyledXAxisTick = useCallback( - ({ x, y, payload }: any) => ( - - - - - - ), - [] - ); + const resolvedVsPendingParsedData: TChartData[] = useMemo(() => { + if (!resolvedVsPendingData) return []; + return resolvedVsPendingData.map((datum) => { + const userDetails = getUserDetails(datum.user_id); + return { + ...datum, + pending: datum.started_work_items + datum.un_started_work_items + datum.backlog_work_items, + total: + datum.completed_work_items + + datum.started_work_items + + datum.un_started_work_items + + datum.backlog_work_items, + name: userDetails?.display_name ?? "", + }; + }); + }, [resolvedVsPendingData, getUserDetails]); + const CustomStyledXAxisTick = useCallback(function CustomStyledXAxisTick({ x, y, payload }: any) { return ( - - {isResolvedVsPendingLoading ? ( - - ) : resolvedVsPendingParsedData && resolvedVsPendingParsedData.length > 0 ? ( - ( - - )} - /> - ) : ( - - )} - + + + + + ); - } -); + }, []); + + return ( + + {isResolvedVsPendingLoading ? ( + + ) : resolvedVsPendingParsedData && resolvedVsPendingParsedData.length > 0 ? ( + ( + + )} + /> + ) : ( + + )} + + ); +}); export default WiResolvedVsPending; diff --git a/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/tooltip.tsx b/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/tooltip.tsx index d0c0d5f4ea..ffccd5eb57 100644 --- a/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/tooltip.tsx +++ b/apps/web/ee/components/analytics/users/wi-resolved-vs-pending/tooltip.tsx @@ -21,7 +21,7 @@ type Props = { member?: IUserLite; }; -export const CustomTooltip = React.memo((props: Props) => { +export const CustomTooltip = React.memo(function CustomTooltip(props: Props) { const { active, payload, member } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/app-rail/app-rail-hoc.tsx b/apps/web/ee/components/app-rail/app-rail-hoc.tsx index 26df01d8da..5cfb0224cc 100644 --- a/apps/web/ee/components/app-rail/app-rail-hoc.tsx +++ b/apps/web/ee/components/app-rail/app-rail-hoc.tsx @@ -1,6 +1,4 @@ // hoc/withDockItems.tsx -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -14,7 +12,7 @@ type WithDockItemsProps = { }; export function withDockItems

    (WrappedComponent: React.ComponentType

    ) { - const ComponentWithDockItems = observer((props: Omit) => { + const ComponentWithDockItems = observer(function ComponentWithDockItems(props: Omit) { const { workspaceSlug } = useParams(); const { isProjectsPath, isWikiPath, isAiPath, isNotificationsPath } = useWorkspacePaths(); diff --git a/apps/web/ee/components/automations/create-button.tsx b/apps/web/ee/components/automations/create-button.tsx index 43601ee9cf..414bf91db7 100644 --- a/apps/web/ee/components/automations/create-button.tsx +++ b/apps/web/ee/components/automations/create-button.tsx @@ -12,7 +12,7 @@ type TProps = { variant?: TButtonVariant; }; -export const CreateAutomationButton = (props: TProps) => { +export function CreateAutomationButton(props: TProps) { const { variant = "primary" } = props; // plane hooks const { t } = useTranslation(); @@ -33,4 +33,4 @@ export const CreateAutomationButton = (props: TProps) => { {t("automations.settings.create_automation")} ); -}; +} diff --git a/apps/web/ee/components/automations/details/main-content/actions/change-property.tsx b/apps/web/ee/components/automations/details/main-content/actions/change-property.tsx index 1ff8ab9ab6..6f4f87cd1b 100644 --- a/apps/web/ee/components/automations/details/main-content/actions/change-property.tsx +++ b/apps/web/ee/components/automations/details/main-content/actions/change-property.tsx @@ -12,7 +12,7 @@ type Props = { projectId: string; }; -export const AutomationDetailsMainContentChangePropertyBlock: React.FC = (props) => { +export function AutomationDetailsMainContentChangePropertyBlock(props: Props) { const { config, projectId } = props; const { configurationMap } = useAutomationActionConfig({ projectId, @@ -60,4 +60,4 @@ export const AutomationDetailsMainContentChangePropertyBlock: React.FC =

    ); -}; +} diff --git a/apps/web/ee/components/automations/details/main-content/actions/comment-block.tsx b/apps/web/ee/components/automations/details/main-content/actions/comment-block.tsx index 91e6eaf932..e3022586e8 100644 --- a/apps/web/ee/components/automations/details/main-content/actions/comment-block.tsx +++ b/apps/web/ee/components/automations/details/main-content/actions/comment-block.tsx @@ -13,33 +13,35 @@ type TProps = { workspaceSlug: string; }; -export const AutomationDetailsMainContentAddCommentBlock: React.FC = observer((props) => { - const { actionId, config, workspaceId, workspaceSlug } = props; - // plane hooks - const { t } = useTranslation(); +export const AutomationDetailsMainContentAddCommentBlock = observer( + function AutomationDetailsMainContentAddCommentBlock(props: TProps) { + const { actionId, config, workspaceId, workspaceSlug } = props; + // plane hooks + const { t } = useTranslation(); - return ( -
    - - - -
    -

    {t("automations.action.comment_block.title")}

    -

    "} - parentClassName="p-0" - showSubmitButton={false} - variant="none" - workspaceId={workspaceId} - workspaceSlug={workspaceSlug} - /> + return ( +
    + + + +
    +

    {t("automations.action.comment_block.title")}

    +

    "} + parentClassName="p-0" + showSubmitButton={false} + variant="none" + workspaceId={workspaceId} + workspaceSlug={workspaceSlug} + /> +
    -
    - ); -}); + ); + } +); diff --git a/apps/web/ee/components/automations/details/main-content/actions/root.tsx b/apps/web/ee/components/automations/details/main-content/actions/root.tsx index eb89bb18d4..a1919aed77 100644 --- a/apps/web/ee/components/automations/details/main-content/actions/root.tsx +++ b/apps/web/ee/components/automations/details/main-content/actions/root.tsx @@ -18,7 +18,9 @@ type TProps = { automationId: string; }; -export const AutomationDetailsMainContentActionsRoot: React.FC = observer((props) => { +export const AutomationDetailsMainContentActionsRoot = observer(function AutomationDetailsMainContentActionsRoot( + props: TProps +) { const { automationId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/main-content/common/add-node-button.tsx b/apps/web/ee/components/automations/details/main-content/common/add-node-button.tsx index 5103ca0839..8df6d61471 100644 --- a/apps/web/ee/components/automations/details/main-content/common/add-node-button.tsx +++ b/apps/web/ee/components/automations/details/main-content/common/add-node-button.tsx @@ -7,7 +7,7 @@ type TProps = { onClick: () => void; }; -export const AutomationDetailsMainContentAddNodeButton: React.FC = (props) => { +export function AutomationDetailsMainContentAddNodeButton(props: TProps) { const { label, isSelected, onClick } = props; return ( @@ -26,4 +26,4 @@ export const AutomationDetailsMainContentAddNodeButton: React.FC = (prop ); -}; +} diff --git a/apps/web/ee/components/automations/details/main-content/common/block-wrapper.tsx b/apps/web/ee/components/automations/details/main-content/common/block-wrapper.tsx index a2d3c2bc9c..19f747821d 100644 --- a/apps/web/ee/components/automations/details/main-content/common/block-wrapper.tsx +++ b/apps/web/ee/components/automations/details/main-content/common/block-wrapper.tsx @@ -8,7 +8,7 @@ type TProps = { onClick?: () => void; }; -export const AutomationDetailsMainContentBlockWrapper: React.FC = (props) => { +export function AutomationDetailsMainContentBlockWrapper(props: TProps) { const { children, isSelected, onClick } = props; return ( @@ -22,4 +22,4 @@ export const AutomationDetailsMainContentBlockWrapper: React.FC = (props {children}
    ); -}; +} diff --git a/apps/web/ee/components/automations/details/main-content/common/conjunction-label.tsx b/apps/web/ee/components/automations/details/main-content/common/conjunction-label.tsx index 2bd99be566..fcae4b7e05 100644 --- a/apps/web/ee/components/automations/details/main-content/common/conjunction-label.tsx +++ b/apps/web/ee/components/automations/details/main-content/common/conjunction-label.tsx @@ -2,8 +2,8 @@ type TProps = { text: string; }; -export const ConjunctionLabel: React.FC = (props) => { +export function ConjunctionLabel(props: TProps) { const { text } = props; return

    {text}

    ; -}; +} diff --git a/apps/web/ee/components/automations/details/main-content/common/section-wrapper.tsx b/apps/web/ee/components/automations/details/main-content/common/section-wrapper.tsx index 4e5ae9ee0a..a3d1711b85 100644 --- a/apps/web/ee/components/automations/details/main-content/common/section-wrapper.tsx +++ b/apps/web/ee/components/automations/details/main-content/common/section-wrapper.tsx @@ -11,7 +11,7 @@ type TProps = { iconVariant?: "outline" | "filled"; }; -export const AutomationDetailsMainContentSectionWrapper: React.FC = (props) => { +export function AutomationDetailsMainContentSectionWrapper(props: TProps) { const { children, title, icon: Icon, iconVariant = "outline" } = props; return ( @@ -63,4 +63,4 @@ export const AutomationDetailsMainContentSectionWrapper: React.FC = (pro )} ); -}; +} diff --git a/apps/web/ee/components/automations/details/main-content/header/root.tsx b/apps/web/ee/components/automations/details/main-content/header/root.tsx index 272ce9991d..be6ee546b4 100644 --- a/apps/web/ee/components/automations/details/main-content/header/root.tsx +++ b/apps/web/ee/components/automations/details/main-content/header/root.tsx @@ -6,7 +6,7 @@ type TProps = { automationId: string; }; -export const AutomationDetailsMainContentHeader: React.FC = observer((props) => { +export const AutomationDetailsMainContentHeader = observer(function AutomationDetailsMainContentHeader(props: TProps) { const { automationId } = props; // store hooks const { diff --git a/apps/web/ee/components/automations/details/main-content/loader.tsx b/apps/web/ee/components/automations/details/main-content/loader.tsx index 9bc651bf09..17e9d38830 100644 --- a/apps/web/ee/components/automations/details/main-content/loader.tsx +++ b/apps/web/ee/components/automations/details/main-content/loader.tsx @@ -1,86 +1,85 @@ import { Loader } from "@plane/ui"; -export const AutomationDetailsMainContentLoader = () => ( - <> - {/* Header Section */} - - - - - - - - - {/* Scope Section */} - {/* - - - - +export function AutomationDetailsMainContentLoader() { + return ( + <> + {/* Header Section */} + + + + - + - - - - - - - - - */} - - {/* Trigger Section */} - - - - - - - - - - - - - - - + {/* Scope Section */} + {/* + + + + + - - - {/* Actions Section */} - - - - - - - - - - - - + + - - - - + - - - - - - + + */} + {/* Trigger Section */} + + + + + + + + + + + + + + + - - -); + {/* Actions Section */} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +} diff --git a/apps/web/ee/components/automations/details/main-content/root.tsx b/apps/web/ee/components/automations/details/main-content/root.tsx index 50b2941412..3ef2373741 100644 --- a/apps/web/ee/components/automations/details/main-content/root.tsx +++ b/apps/web/ee/components/automations/details/main-content/root.tsx @@ -12,7 +12,7 @@ type TProps = { automationId: string; }; -export const AutomationDetailsMainContentRoot: React.FC = observer((props) => { +export const AutomationDetailsMainContentRoot = observer(function AutomationDetailsMainContentRoot(props: TProps) { const { automationId } = props; // store hooks const { diff --git a/apps/web/ee/components/automations/details/main-content/scope/root.tsx b/apps/web/ee/components/automations/details/main-content/scope/root.tsx index a51ec2ac96..3b15040728 100644 --- a/apps/web/ee/components/automations/details/main-content/scope/root.tsx +++ b/apps/web/ee/components/automations/details/main-content/scope/root.tsx @@ -10,7 +10,9 @@ type TProps = { automationId: string; }; -export const AutomationDetailsMainContentScopeRoot: React.FC = observer(() => { +export const AutomationDetailsMainContentScopeRoot = observer(function AutomationDetailsMainContentScopeRoot( + _props: TProps +) { // translation const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/main-content/trigger/condition/condition-item.tsx b/apps/web/ee/components/automations/details/main-content/trigger/condition/condition-item.tsx index 99e13f94a6..26659e2cef 100644 --- a/apps/web/ee/components/automations/details/main-content/trigger/condition/condition-item.tsx +++ b/apps/web/ee/components/automations/details/main-content/trigger/condition/condition-item.tsx @@ -20,38 +20,43 @@ interface FilterItemProps condition: TFilterConditionNodeForDisplay; } -export const AutomationDetailsMainContentTriggerConditionItem: React.FC< - FilterItemProps -> = observer((props) => { - const { filter, condition } = props; - // states - const [options, setOptions] = useState[]>([]); - // derived values - const config = condition?.property ? filter.configManager.getConfigByProperty(condition.property) : undefined; - const selectedOperatorFieldConfig = config?.getOperatorConfig(condition.operator); - const selectedOperatorOption = config?.getDisplayOperatorByValue(condition.operator, condition.value as TFilterValue); - const isFilterEnabled = config?.isEnabled; +export const AutomationDetailsMainContentTriggerConditionItem = observer( + function AutomationDetailsMainContentTriggerConditionItem( + props: FilterItemProps + ) { + const { filter, condition } = props; + // states + const [options, setOptions] = useState[]>([]); + // derived values + const config = condition?.property ? filter.configManager.getConfigByProperty(condition.property) : undefined; + const selectedOperatorFieldConfig = config?.getOperatorConfig(condition.operator); + const selectedOperatorOption = config?.getDisplayOperatorByValue( + condition.operator, + condition.value as TFilterValue + ); + const isFilterEnabled = config?.isEnabled; - useEffect(() => { - if (!selectedOperatorFieldConfig) return; - loadOptions({ config: selectedOperatorFieldConfig, setOptions }); - }, [selectedOperatorFieldConfig]); + useEffect(() => { + if (!selectedOperatorFieldConfig) return; + loadOptions({ config: selectedOperatorFieldConfig, setOptions }); + }, [selectedOperatorFieldConfig]); - if (!isFilterEnabled) return null; + if (!isFilterEnabled) return null; - return ( -
    - {config.icon && ( - - + return ( +
    + {config.icon && ( + + + + )} + {config.label} + + {config.getLabelForOperator(selectedOperatorOption)} - )} - {config.label} - - {config.getLabelForOperator(selectedOperatorOption)} - - {/* TODO: Handle date values */} - -
    - ); -}); + {/* TODO: Handle date values */} + +
    + ); + } +); diff --git a/apps/web/ee/components/automations/details/main-content/trigger/condition/root.tsx b/apps/web/ee/components/automations/details/main-content/trigger/condition/root.tsx index 257720bd3c..b12892762c 100644 --- a/apps/web/ee/components/automations/details/main-content/trigger/condition/root.tsx +++ b/apps/web/ee/components/automations/details/main-content/trigger/condition/root.tsx @@ -13,53 +13,55 @@ type Props = { automationId: string; }; -export const AutomationDetailsMainContentTriggerCondition: React.FC = observer((props) => { - const { automationId } = props; - // store hooks - const { getAutomationById } = useAutomations(); - // derived values - const automation = getAutomationById(automationId); - // translation - const { t } = useTranslation(); - // condition node - const conditionNode = automation?.allConditions[0]; - const { config } = conditionNode ?? {}; - const isFilterApplied = useMemo(() => { - if (!config?.filter_expression) return false; - const firstKey = Object.keys(config.filter_expression)[0]; - if (!firstKey) return false; - const condition = config.filter_expression[firstKey as keyof typeof config.filter_expression] as unknown[]; - if (!condition || condition.length <= 0) return false; - return true; - }, [config]); +export const AutomationDetailsMainContentTriggerCondition = observer( + function AutomationDetailsMainContentTriggerCondition(props: Props) { + const { automationId } = props; + // store hooks + const { getAutomationById } = useAutomations(); + // derived values + const automation = getAutomationById(automationId); + // translation + const { t } = useTranslation(); + // condition node + const conditionNode = automation?.allConditions[0]; + const { config } = conditionNode ?? {}; + const isFilterApplied = useMemo(() => { + if (!config?.filter_expression) return false; + const firstKey = Object.keys(config.filter_expression)[0]; + if (!firstKey) return false; + const condition = config.filter_expression[firstKey as keyof typeof config.filter_expression] as unknown[]; + if (!condition || condition.length <= 0) return false; + return true; + }, [config]); - if (!automation || !isFilterApplied) return null; + if (!automation || !isFilterApplied) return null; - return ( -
    - - - {({ filter }) => ( -
    - {filter && ( -
    - {filter.allConditionsForDisplay.map((condition, index) => ( -
    - - {index < filter.allConditionsForDisplay.length - 1 && ( - - )} -
    - ))} -
    - )} -
    - )} -     -
    - ); -}); + return ( +
    + + + {({ filter }) => ( +
    + {filter && ( +
    + {filter.allConditionsForDisplay.map((condition, index) => ( +
    + + {index < filter.allConditionsForDisplay.length - 1 && ( + + )} +
    + ))} +
    + )} +
    + )} +     +
    + ); + } +); diff --git a/apps/web/ee/components/automations/details/main-content/trigger/root.tsx b/apps/web/ee/components/automations/details/main-content/trigger/root.tsx index 62aa443041..954230ba90 100644 --- a/apps/web/ee/components/automations/details/main-content/trigger/root.tsx +++ b/apps/web/ee/components/automations/details/main-content/trigger/root.tsx @@ -19,7 +19,9 @@ type TProps = { automationId: string; }; -export const AutomationDetailsMainContentTriggerRoot: React.FC = observer((props) => { +export const AutomationDetailsMainContentTriggerRoot = observer(function AutomationDetailsMainContentTriggerRoot( + props: TProps +) { const { automationId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/quick-actions.tsx b/apps/web/ee/components/automations/details/quick-actions.tsx index f5b46fc037..85e4ed8915 100644 --- a/apps/web/ee/components/automations/details/quick-actions.tsx +++ b/apps/web/ee/components/automations/details/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // icons @@ -29,7 +27,7 @@ type TAutomationQuickActionsMenuItem = TContextMenuItem & { tooltipContent?: React.ReactNode; }; -export const AutomationQuickActions = observer((props: TAutomationQuickActionsProps) => { +export const AutomationQuickActions = observer(function AutomationQuickActions(props: TAutomationQuickActionsProps) { const { automationId, deleteAutomation } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/automations/details/sidebar/action-buttons.tsx b/apps/web/ee/components/automations/details/sidebar/action-buttons.tsx index 203c6a8f3e..7712894705 100644 --- a/apps/web/ee/components/automations/details/sidebar/action-buttons.tsx +++ b/apps/web/ee/components/automations/details/sidebar/action-buttons.tsx @@ -23,7 +23,7 @@ type TProps = { borderPosition?: "top" | "bottom"; }; -export const AutomationDetailsSidebarActionButtons: React.FC = (props) => { +export function AutomationDetailsSidebarActionButtons(props: TProps) { const { nextButton, previousButton, borderPosition = "top" } = props; return ( @@ -66,4 +66,4 @@ export const AutomationDetailsSidebarActionButtons: React.FC = (props) =
    ); -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/add_comment/root.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/add_comment/root.tsx index a3b60a5418..18d7c60e8d 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/add_comment/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/add_comment/root.tsx @@ -15,7 +15,9 @@ type TProps = { workspaceSlug: string; }; -export const AutomationActionAddCommentConfiguration: React.FC = observer((props) => { +export const AutomationActionAddCommentConfiguration = observer(function AutomationActionAddCommentConfiguration( + props: TProps +) { const { automationId, editorRef, isDisabled, workspaceId, workspaceSlug } = props; // form hooks const { control } = useFormContext(); diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/change-type-select.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/change-type-select.tsx index 6ea4b33c18..1da209c15d 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/change-type-select.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/change-type-select.tsx @@ -18,7 +18,7 @@ type TProps = { onChangeTypeChange: (changeType: EAutomationChangeType) => void; }; -export const ChangeTypeSelect: React.FC = observer((props) => { +export const ChangeTypeSelect = observer(function ChangeTypeSelect(props: TProps) { const { isDisabled, supportedChangeTypes, onChangeTypeChange } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-name-select.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-name-select.tsx index 91bdfee8b8..ddbd8ae0ec 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-name-select.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-name-select.tsx @@ -17,7 +17,7 @@ type TProps = { onPropertyChange: (property: EAutomationChangePropertyType) => void; }; -export const PropertyNameSelect: React.FC = observer((props) => { +export const PropertyNameSelect = observer(function PropertyNameSelect(props: TProps) { const { isDisabled, onPropertyChange } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-value-select.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-value-select.tsx index 00eb83d2a6..833b354c96 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-value-select.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/property-value-select.tsx @@ -23,7 +23,7 @@ type TProps = { configuration?: TChangePropertyConfiguration; }; -export const PropertyValueSelect: React.FC = observer((props) => { +export const PropertyValueSelect = observer(function PropertyValueSelect(props: TProps) { const { isDisabled, propertyName, changeType, configuration } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/root.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/root.tsx index a160364af4..03489c47a5 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/change-property/root.tsx @@ -18,66 +18,68 @@ type TProps = { projectId: string; }; -export const AutomationActionChangePropertyConfiguration: React.FC = observer((props) => { - const { isDisabled, projectId } = props; - // form hooks - const { watch, setValue } = useFormContext(); - // derived values - const selectedPropertyName = watch("config.property_name"); - const selectedPropertyChangeType = watch("config.change_type"); - // config - const { configurationMap } = useAutomationActionConfig({ - projectId, - }); +export const AutomationActionChangePropertyConfiguration = observer( + function AutomationActionChangePropertyConfiguration(props: TProps) { + const { isDisabled, projectId } = props; + // form hooks + const { watch, setValue } = useFormContext(); + // derived values + const selectedPropertyName = watch("config.property_name"); + const selectedPropertyChangeType = watch("config.change_type"); + // config + const { configurationMap } = useAutomationActionConfig({ + projectId, + }); - const selectedPropertyConfig = useMemo( - () => selectedPropertyName && configurationMap[selectedPropertyName], - [selectedPropertyName, configurationMap] - ); + const selectedPropertyConfig = useMemo( + () => selectedPropertyName && configurationMap[selectedPropertyName], + [selectedPropertyName, configurationMap] + ); - const handlePropertyNameChange = (property: EAutomationChangePropertyType) => { - const config = configurationMap[property]; - // Set the first supported change type as default - setValue("config.change_type", config.supported_change_types[0]); - // Reset property value - setValue("config.property_value", []); - }; + const handlePropertyNameChange = (property: EAutomationChangePropertyType) => { + const config = configurationMap[property]; + // Set the first supported change type as default + setValue("config.change_type", config.supported_change_types[0]); + // Reset property value + setValue("config.property_value", []); + }; - const handleChangeTypeChange = (_changeType: EAutomationChangeType) => { - // Reset property value when change type changes - setValue("config.property_value", []); - }; + const handleChangeTypeChange = (_changeType: EAutomationChangeType) => { + // Reset property value when change type changes + setValue("config.property_value", []); + }; - return ( -
    -
    -
    - + return ( +
    +
    +
    + +
    + {selectedPropertyName && ( + <> +
    + +
    +
    + +
    + + )}
    - {selectedPropertyName && ( - <> -
    - -
    -
    - -
    - - )}
    -
    - ); -}); + ); + } +); diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/root.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/root.tsx index 0125340b1b..f4648a6ad9 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/configuration/root.tsx @@ -16,7 +16,7 @@ type TProps = { workspaceSlug: string; }; -export const AutomationActionConfigurationRoot: React.FC = (props) => { +export function AutomationActionConfigurationRoot(props: TProps) { const { automationId, editorRef, isDisabled, selectedHandlerName, projectId, workspaceId, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); @@ -38,4 +38,4 @@ export const AutomationActionConfigurationRoot: React.FC = (props) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/handler/icon.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/handler/icon.tsx index 2efe3ae650..90c0b27473 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/handler/icon.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/handler/icon.tsx @@ -8,7 +8,7 @@ type Props = { const COMMON_ICON_CLASSNAME = "size-3.5 flex-shrink-0"; -export const AutomationActionHandlerIcon: React.FC = (props) => { +export function AutomationActionHandlerIcon(props: Props) { switch (props.iconKey) { case "message-circle": return ; @@ -17,4 +17,4 @@ export const AutomationActionHandlerIcon: React.FC = (props) => { default: return null; } -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/handler/root.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/handler/root.tsx index f98ef13491..154b19c9d9 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/handler/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/handler/root.tsx @@ -15,7 +15,7 @@ type TProps = { isDisabled?: boolean; }; -export const AutomationActionHandlerDropdown: React.FC = (props) => { +export function AutomationActionHandlerDropdown(props: TProps) { const { value, onChange, isDisabled } = props; // plane hooks const { t } = useTranslation(); @@ -63,4 +63,4 @@ export const AutomationActionHandlerDropdown: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/header-button.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/header-button.tsx index 53029172ea..4fde4f3676 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/header-button.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/header-button.tsx @@ -10,7 +10,7 @@ type TProps = { variant: "default" | "destructive"; }; -export const AutomationDetailsSidebarActionFormHeaderButton: React.FC = (props) => { +export function AutomationDetailsSidebarActionFormHeaderButton(props: TProps) { const { children, isDisabled, onClick, tooltipMessage, variant } = props; return ( @@ -37,4 +37,4 @@ export const AutomationDetailsSidebarActionFormHeaderButton: React.FC = ); -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/actions/form/root.tsx b/apps/web/ee/components/automations/details/sidebar/actions/form/root.tsx index 55a91369f1..debdc41fda 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/form/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/form/root.tsx @@ -71,146 +71,148 @@ type TProps = { workspaceSlug: string; } & (TNewAutomationAction | TExistingAutomationAction); -const AutomationDetailsSidebarActionsFormRootComponent = React.forwardRef((props, ref) => { - const { - automationId, - currentIndex, - defaultOpen = true, - isSubmitting, - onCancel, - onDelete, - onSubmit, - type, - projectId, - workspaceId, - workspaceSlug, - } = props; - // plane hooks - const { t } = useTranslation(); - // editor ref - const editorRef = useRef(null); - // form state - const defaultValueForReset = - type === EAutomationActionFormType.EXISTING - ? merge({}, DEFAULT_AUTOMATION_ACTION_FORM_DATA, props.data) - : DEFAULT_AUTOMATION_ACTION_FORM_DATA; - const methods = useForm({ - defaultValues: defaultValueForReset, - }); - // derived values - const selectedHandlerName = methods.watch("handler_name"); - const selectedConfig = methods.watch("config"); - const isFormDirty = methods.formState.isDirty; - const isDeleteButtonDisabled = - type === EAutomationActionFormType.EXISTING && props.isAutomationEnabled && props.isOnlyActionNode; - const isNextButtonDisabled = () => { - if (!selectedHandlerName || !selectedConfig) return true; - if (selectedHandlerName === EActionNodeHandlerName.CHANGE_PROPERTY) { - const changePropertyConfig = selectedConfig as TChangePropertyActionFormConfig | undefined; - return ( - !changePropertyConfig?.property_name || - !changePropertyConfig?.change_type || - !changePropertyConfig?.property_value || - changePropertyConfig.property_value.length === 0 - ); - } - if (selectedHandlerName === EActionNodeHandlerName.ADD_COMMENT) { - const addCommentConfig = selectedConfig as TAddCommentActionConfig | undefined; - return !addCommentConfig?.comment_text || isCommentEmpty(addCommentConfig?.comment_text); - } - return false; - }; - - const handleHandlerNameChange = (value: EActionNodeHandlerName) => { - methods.setValue("handler_name", value, { - shouldDirty: true, +const AutomationDetailsSidebarActionsFormRootComponent = React.forwardRef( + function AutomationDetailsSidebarActionsFormRootComponent(props: TProps, ref: React.ForwardedRef) { + const { + automationId, + currentIndex, + defaultOpen = true, + isSubmitting, + onCancel, + onDelete, + onSubmit, + type, + projectId, + workspaceId, + workspaceSlug, + } = props; + // plane hooks + const { t } = useTranslation(); + // editor ref + const editorRef = useRef(null); + // form state + const defaultValueForReset = + type === EAutomationActionFormType.EXISTING + ? merge({}, DEFAULT_AUTOMATION_ACTION_FORM_DATA, props.data) + : DEFAULT_AUTOMATION_ACTION_FORM_DATA; + const methods = useForm({ + defaultValues: defaultValueForReset, }); - if (value === EActionNodeHandlerName.CHANGE_PROPERTY) { - methods.setValue("config", DEFAULT_CHANGE_PROPERTY_CONFIG, { + // derived values + const selectedHandlerName = methods.watch("handler_name"); + const selectedConfig = methods.watch("config"); + const isFormDirty = methods.formState.isDirty; + const isDeleteButtonDisabled = + type === EAutomationActionFormType.EXISTING && props.isAutomationEnabled && props.isOnlyActionNode; + const isNextButtonDisabled = () => { + if (!selectedHandlerName || !selectedConfig) return true; + if (selectedHandlerName === EActionNodeHandlerName.CHANGE_PROPERTY) { + const changePropertyConfig = selectedConfig as TChangePropertyActionFormConfig | undefined; + return ( + !changePropertyConfig?.property_name || + !changePropertyConfig?.change_type || + !changePropertyConfig?.property_value || + changePropertyConfig.property_value.length === 0 + ); + } + if (selectedHandlerName === EActionNodeHandlerName.ADD_COMMENT) { + const addCommentConfig = selectedConfig as TAddCommentActionConfig | undefined; + return !addCommentConfig?.comment_text || isCommentEmpty(addCommentConfig?.comment_text); + } + return false; + }; + + const handleHandlerNameChange = (value: EActionNodeHandlerName) => { + methods.setValue("handler_name", value, { shouldDirty: true, }); - } - if (value === EActionNodeHandlerName.ADD_COMMENT) { - methods.setValue("config", DEFAULT_ADD_COMMENT_CONFIG, { - shouldDirty: true, - }); - } - }; + if (value === EActionNodeHandlerName.CHANGE_PROPERTY) { + methods.setValue("config", DEFAULT_CHANGE_PROPERTY_CONFIG, { + shouldDirty: true, + }); + } + if (value === EActionNodeHandlerName.ADD_COMMENT) { + methods.setValue("config", DEFAULT_ADD_COMMENT_CONFIG, { + shouldDirty: true, + }); + } + }; - const handleSubmit = async (data: TAutomationActionFormData): Promise => { - await onSubmit(data); - methods.reset(data); - }; + const handleSubmit = async (data: TAutomationActionFormData): Promise => { + await onSubmit(data); + methods.reset(data); + }; - const handleCancel = () => { - methods.reset(defaultValueForReset); - const config = defaultValueForReset.config as TAddCommentActionConfig | undefined; - editorRef.current?.setEditorValue(config?.comment_text || "

    ", true); - onCancel?.(); - }; + const handleCancel = () => { + methods.reset(defaultValueForReset); + const config = defaultValueForReset.config as TAddCommentActionConfig | undefined; + editorRef.current?.setEditorValue(config?.comment_text || "

    ", true); + onCancel?.(); + }; - return ( - -
    - - } - headerActions={(open) => - open && ( - + + - - - ) - } - > - - {selectedHandlerName && ( - - )} - -
    -     - ); -}); + nextButton={ + isFormDirty + ? { + type: "submit", + label: isSubmitting ? t("common.confirming") : t("common.confirm"), + isDisabled: isNextButtonDisabled() || isSubmitting, + renderIcon: false, + } + : undefined + } + borderPosition="bottom" + /> + } + headerActions={(open) => + open && ( + + + + ) + } + > + + {selectedHandlerName && ( + + )} + + + + ); + } +); AutomationDetailsSidebarActionsFormRootComponent.displayName = "AutomationDetailsSidebarActionsFormRoot"; export const AutomationDetailsSidebarActionsFormRoot = observer(AutomationDetailsSidebarActionsFormRootComponent); diff --git a/apps/web/ee/components/automations/details/sidebar/actions/root.tsx b/apps/web/ee/components/automations/details/sidebar/actions/root.tsx index 62a8760059..9016a6642a 100644 --- a/apps/web/ee/components/automations/details/sidebar/actions/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/actions/root.tsx @@ -25,7 +25,7 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarActionRoot: React.FC = observer((props) => { +export const AutomationDetailsSidebarActionRoot = observer(function AutomationDetailsSidebarActionRoot(props: Props) { const { automationId } = props; // refs const actionFormRef = useRef(null); diff --git a/apps/web/ee/components/automations/details/sidebar/activity/activity-log-item.tsx b/apps/web/ee/components/automations/details/sidebar/activity/activity-log-item.tsx index f7c1e5fd4b..cae71781c6 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/activity-log-item.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/activity-log-item.tsx @@ -16,7 +16,9 @@ type Props = { activityId: string; }; -export const AutomationDetailsSidebarActivityLogItem: React.FC = observer((props) => { +export const AutomationDetailsSidebarActivityLogItem = observer(function AutomationDetailsSidebarActivityLogItem( + props: Props +) { const { automationId, activityId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/activity/header-filters.tsx b/apps/web/ee/components/automations/details/sidebar/activity/header-filters.tsx index 0ee4ed58c9..2990793ae9 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/header-filters.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/header-filters.tsx @@ -14,60 +14,64 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarActivityHeaderFilters: React.FC = observer((props) => { - const { automationId } = props; - // store hooks - const { getAutomationById } = useAutomations(); - // derived values - const { activity } = getAutomationById(automationId) ?? {}; - const { filters, updateFilters } = activity ?? {}; - // derived values - const isShowFailsToggleEnabled = !!filters?.show_fails; - const activityTypeFilter = filters?.type; - // translation - const { t } = useTranslation(); +export const AutomationDetailsSidebarActivityHeaderFilters = observer( + function AutomationDetailsSidebarActivityHeaderFilters(props: Props) { + const { automationId } = props; + // store hooks + const { getAutomationById } = useAutomations(); + // derived values + const { activity } = getAutomationById(automationId) ?? {}; + const { filters, updateFilters } = activity ?? {}; + // derived values + const isShowFailsToggleEnabled = !!filters?.show_fails; + const activityTypeFilter = filters?.type; + // translation + const { t } = useTranslation(); - return ( -
    + return (
    - {t("automations.activity.filters.show_fails")} - { +
    + + {t("automations.activity.filters.show_fails")} + + { + captureClick({ elementName: AUTOMATION_TRACKER_ELEMENTS.SIDEBAR_ACTIVITY_FILTER }); + updateFilters?.({ + show_fails: !isShowFailsToggleEnabled, + }); + }} + className="shrink-0" + /> +
    + { captureClick({ elementName: AUTOMATION_TRACKER_ELEMENTS.SIDEBAR_ACTIVITY_FILTER }); updateFilters?.({ - show_fails: !isShowFailsToggleEnabled, + type: value, }); }} - className="shrink-0" - /> + customButton={ + + } + > + {AUTOMATION_ACTIVITY_TYPE_OPTIONS.map((item) => ( + + {t(item.i18n_label)} + + ))} +
    - { - captureClick({ elementName: AUTOMATION_TRACKER_ELEMENTS.SIDEBAR_ACTIVITY_FILTER }); - updateFilters?.({ - type: value, - }); - }} - customButton={ - - } - > - {AUTOMATION_ACTIVITY_TYPE_OPTIONS.map((item) => ( - - {t(item.i18n_label)} - - ))} - -
    - ); -}); + ); + } +); diff --git a/apps/web/ee/components/automations/details/sidebar/activity/list-item.tsx b/apps/web/ee/components/automations/details/sidebar/activity/list-item.tsx index c066fbd97a..f0e2db5dfa 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/list-item.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/list-item.tsx @@ -12,7 +12,9 @@ type Props = { activityId: string; }; -export const AutomationDetailsSidebarActivityListItem: React.FC = observer((props) => { +export const AutomationDetailsSidebarActivityListItem = observer(function AutomationDetailsSidebarActivityListItem( + props: Props +) { const { automationId, activityId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/activity/list.tsx b/apps/web/ee/components/automations/details/sidebar/activity/list.tsx index 296b77bc34..50177e7e4d 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/list.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/list.tsx @@ -8,7 +8,9 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarActivityList: React.FC = observer((props) => { +export const AutomationDetailsSidebarActivityList = observer(function AutomationDetailsSidebarActivityList( + props: Props +) { const { automationId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/activity/loader.tsx b/apps/web/ee/components/automations/details/sidebar/activity/loader.tsx index 117745d0c0..89f9b63a04 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/loader.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/loader.tsx @@ -1,31 +1,33 @@ // plane imports import { Loader } from "@plane/ui"; -export const AutomationActivityLoader = () => ( - -
    - -
    - - - +export function AutomationActivityLoader() { + return ( + +
    + +
    + + + +
    -
    -
    - -
    - - - +
    + +
    + + + +
    -
    -
    - -
    - - - +
    + +
    + + + +
    -
    - -); + + ); +} diff --git a/apps/web/ee/components/automations/details/sidebar/activity/root.tsx b/apps/web/ee/components/automations/details/sidebar/activity/root.tsx index b07f8b8007..f3456f9296 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/root.tsx @@ -10,7 +10,9 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarActivityRoot: React.FC = observer((props) => { +export const AutomationDetailsSidebarActivityRoot = observer(function AutomationDetailsSidebarActivityRoot( + props: Props +) { const { automationId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/activity/run-history-item.tsx b/apps/web/ee/components/automations/details/sidebar/activity/run-history-item.tsx index 177abae582..e17513f48e 100644 --- a/apps/web/ee/components/automations/details/sidebar/activity/run-history-item.tsx +++ b/apps/web/ee/components/automations/details/sidebar/activity/run-history-item.tsx @@ -26,102 +26,106 @@ type Props = { activityId: string; }; -export const AutomationDetailsSidebarActivityRunHistoryItem: React.FC = observer((props) => { - const { automationId, activityId } = props; - // store hooks - const { getAutomationById } = useAutomations(); - const { getUserDetails } = useMember(); - const { getProjectById } = useProject(); - // derived values - const automation = getAutomationById(automationId); - const { getActivityById } = automation?.activity ?? {}; - const activityDetails = getActivityById?.(activityId); - const runDetails = activityDetails?.automation_run; - const runInitiator = runDetails?.initiator ? getUserDetails(runDetails.initiator) : undefined; - const duration = runDetails?.completed_at ? differenceInSeconds(runDetails.completed_at, runDetails.started_at) : 0; - const projectIdentifier = getProjectById(activityDetails?.project)?.identifier; - // translation - const { t } = useTranslation(); +export const AutomationDetailsSidebarActivityRunHistoryItem = observer( + function AutomationDetailsSidebarActivityRunHistoryItem(props: Props) { + const { automationId, activityId } = props; + // store hooks + const { getAutomationById } = useAutomations(); + const { getUserDetails } = useMember(); + const { getProjectById } = useProject(); + // derived values + const automation = getAutomationById(automationId); + const { getActivityById } = automation?.activity ?? {}; + const activityDetails = getActivityById?.(activityId); + const runDetails = activityDetails?.automation_run; + const runInitiator = runDetails?.initiator ? getUserDetails(runDetails.initiator) : undefined; + const duration = runDetails?.completed_at ? differenceInSeconds(runDetails.completed_at, runDetails.started_at) : 0; + const projectIdentifier = getProjectById(activityDetails?.project)?.identifier; + // translation + const { t } = useTranslation(); - if (!activityDetails) return null; + if (!activityDetails) return null; - return ( - - - {({ open }) => ( - <> -
    - - {runDetails?.status === "success" ? : } - -
    -

    - {projectIdentifier}-{runDetails?.work_item_sequence_id} -

    -

    - {renderFormattedTime(activityDetails.created_at ?? "")} - - {calculateTimeAgo(activityDetails.created_at)} -

    + return ( + + + {({ open }) => ( + <> +
    + + {runDetails?.status === "success" ? : } + +
    +

    + {projectIdentifier}-{runDetails?.work_item_sequence_id} +

    +

    + {renderFormattedTime(activityDetails.created_at ?? "")} + + {calculateTimeAgo(activityDetails.created_at)} +

    +
    +
    +
    + + From{" "} + + {renderFormattedDate(runDetails?.started_at ?? "")}{" "} + {renderFormattedTime(runDetails?.started_at ?? "")} + +
    + to{" "} + + {renderFormattedDate(runDetails?.completed_at ?? "")}{" "} + {renderFormattedTime(runDetails?.completed_at ?? "")} + +
    + } + > + + + {formatDuration(duration)} + + + +
    + + )} + + +
    + {runInitiator && ( +
    +

    {t("automations.activity.run_history.initiator")}

    +
    + + + {runInitiator.display_name ?? t("common.deactivated_user")} +
    -
    - - From{" "} - - {renderFormattedDate(runDetails?.started_at ?? "")}{" "} - {renderFormattedTime(runDetails?.started_at ?? "")} - -
    - to{" "} - - {renderFormattedDate(runDetails?.completed_at ?? "")}{" "} - {renderFormattedTime(runDetails?.completed_at ?? "")} - -
    - } - > - - - {formatDuration(duration)} - - - -
    - - )} -     - -
    - {runInitiator && ( -
    -

    {t("automations.activity.run_history.initiator")}

    -
    - - {runInitiator.display_name ?? t("common.deactivated_user")} -
    -
    - )} -     -     - ); -}); + )} + + + ); + } +); diff --git a/apps/web/ee/components/automations/details/sidebar/content.tsx b/apps/web/ee/components/automations/details/sidebar/content.tsx index 7a02d5c998..f685f4c2c9 100644 --- a/apps/web/ee/components/automations/details/sidebar/content.tsx +++ b/apps/web/ee/components/automations/details/sidebar/content.tsx @@ -14,7 +14,7 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarContent: React.FC = observer((props) => { +export const AutomationDetailsSidebarContent = observer(function AutomationDetailsSidebarContent(props: Props) { const { automationId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/delete-confirmation-modal.tsx b/apps/web/ee/components/automations/details/sidebar/delete-confirmation-modal.tsx index 5ad5b1ea7f..e0e788b238 100644 --- a/apps/web/ee/components/automations/details/sidebar/delete-confirmation-modal.tsx +++ b/apps/web/ee/components/automations/details/sidebar/delete-confirmation-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -15,7 +13,9 @@ type Props = { isOpen: boolean; }; -export const DeleteAutomationNodeConfirmationModal: React.FC = observer((props) => { +export const DeleteAutomationNodeConfirmationModal = observer(function DeleteAutomationNodeConfirmationModal( + props: Props +) { const { nodeType, handleClose, handleDelete, isOpen } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/automations/details/sidebar/footer.tsx b/apps/web/ee/components/automations/details/sidebar/footer.tsx index 23c82eaff3..7efd55324f 100644 --- a/apps/web/ee/components/automations/details/sidebar/footer.tsx +++ b/apps/web/ee/components/automations/details/sidebar/footer.tsx @@ -12,7 +12,7 @@ type TProps = { automationId: string; }; -export const AutomationDetailsSidebarFooter: React.FC = observer((props) => { +export const AutomationDetailsSidebarFooter = observer(function AutomationDetailsSidebarFooter(props: TProps) { const { automationId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/sidebar/header.tsx b/apps/web/ee/components/automations/details/sidebar/header.tsx index 4930e6aaa4..ad6d5c33e4 100644 --- a/apps/web/ee/components/automations/details/sidebar/header.tsx +++ b/apps/web/ee/components/automations/details/sidebar/header.tsx @@ -16,7 +16,7 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarHeader: React.FC = observer((props) => { +export const AutomationDetailsSidebarHeader = observer(function AutomationDetailsSidebarHeader(props: Props) { const { automationId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/root.tsx b/apps/web/ee/components/automations/details/sidebar/root.tsx index 2941b7917e..c5cf88e870 100644 --- a/apps/web/ee/components/automations/details/sidebar/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/root.tsx @@ -10,7 +10,7 @@ type Props = { automationId: string; }; -export const AutomationDetailsSidebarRoot: React.FC = observer((props) => { +export const AutomationDetailsSidebarRoot = observer(function AutomationDetailsSidebarRoot(props: Props) { const { automationId } = props; // store hooks const { getAutomationById } = useAutomations(); diff --git a/apps/web/ee/components/automations/details/sidebar/section-wrapper.tsx b/apps/web/ee/components/automations/details/sidebar/section-wrapper.tsx index 025f510567..966690c413 100644 --- a/apps/web/ee/components/automations/details/sidebar/section-wrapper.tsx +++ b/apps/web/ee/components/automations/details/sidebar/section-wrapper.tsx @@ -12,7 +12,7 @@ type TProps = { title: string; }; -export const AutomationDetailsSidebarSectionWrapper: React.FC = (props) => { +export function AutomationDetailsSidebarSectionWrapper(props: TProps) { const { actionButtons, children, defaultOpen = true, headerActions, title } = props; return ( @@ -51,4 +51,4 @@ export const AutomationDetailsSidebarSectionWrapper: React.FC = (props) )} ); -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/trigger/condition/filter-provider.tsx b/apps/web/ee/components/automations/details/sidebar/trigger/condition/filter-provider.tsx index b8f7ef2241..13ee438ba7 100644 --- a/apps/web/ee/components/automations/details/sidebar/trigger/condition/filter-provider.tsx +++ b/apps/web/ee/components/automations/details/sidebar/trigger/condition/filter-provider.tsx @@ -20,7 +20,9 @@ type TAutomationConditionFilterHOCProps = { workspaceSlug: string; }; -export const AutomationConditionFilterHOC = observer((props: TAutomationConditionFilterHOCProps) => { +export const AutomationConditionFilterHOC = observer(function AutomationConditionFilterHOC( + props: TAutomationConditionFilterHOCProps +) { const { children, projectId, initialFilterExpression, updateFilterExpression, workspaceSlug } = props; // Create new filter instance const conditionFilter = useMemo( diff --git a/apps/web/ee/components/automations/details/sidebar/trigger/condition/root.tsx b/apps/web/ee/components/automations/details/sidebar/trigger/condition/root.tsx index 16990fb276..c287b5bc3c 100644 --- a/apps/web/ee/components/automations/details/sidebar/trigger/condition/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/trigger/condition/root.tsx @@ -16,67 +16,69 @@ type Props = { updateFilterExpression: (updatedFilters: TAutomationConditionFilterExpression) => void; }; -export const AutomationDetailsSidebarTriggerConditionRoot: React.FC = observer((props) => { - const { automationId, initialFilterExpression, updateFilterExpression } = props; - // plane hooks - const { t } = useTranslation(); - // store hooks - const { getAutomationById } = useAutomations(); - // derived values - const automation = getAutomationById(automationId); +export const AutomationDetailsSidebarTriggerConditionRoot = observer( + function AutomationDetailsSidebarTriggerConditionRoot(props: Props) { + const { automationId, initialFilterExpression, updateFilterExpression } = props; + // plane hooks + const { t } = useTranslation(); + // store hooks + const { getAutomationById } = useAutomations(); + // derived values + const automation = getAutomationById(automationId); - if (!automation) return null; + if (!automation) return null; - return ( - - {({ filter }) => ( -
    - {filter && ( -
    -

    {t("automations.condition.label")}

    -
    - {filter.allConditionsForDisplay.map((condition, index) => ( -
    -
    - -
    - {index < filter.allConditionsForDisplay.length - 1 && ( -
    -
    - - {t("automations.conjunctions.and")} - -
    + return ( + + {({ filter }) => ( +
    + {filter && ( +
    +

    {t("automations.condition.label")}

    +
    + {filter.allConditionsForDisplay.map((condition, index) => ( +
    +
    +
    - )} + {index < filter.allConditionsForDisplay.length - 1 && ( +
    +
    + + {t("automations.conjunctions.and")} + +
    +
    + )} +
    + ))} +
    0, + })} + > +
    - ))} -
    0, - })} - > -
    -
    - )} -
    - )} -     - ); -}); + )} +
    + )} +     + ); + } +); diff --git a/apps/web/ee/components/automations/details/sidebar/trigger/icon.tsx b/apps/web/ee/components/automations/details/sidebar/trigger/icon.tsx index 1072e21e0f..c4fdaa4637 100644 --- a/apps/web/ee/components/automations/details/sidebar/trigger/icon.tsx +++ b/apps/web/ee/components/automations/details/sidebar/trigger/icon.tsx @@ -8,7 +8,7 @@ type Props = { const COMMON_ICON_CLASSNAME = "size-3.5 flex-shrink-0"; -export const AutomationTriggerIcon: React.FC = (props) => { +export function AutomationTriggerIcon(props: Props) { switch (props.iconKey) { case "LayersIcon": return ; @@ -21,4 +21,4 @@ export const AutomationTriggerIcon: React.FC = (props) => { default: return null; } -}; +} diff --git a/apps/web/ee/components/automations/details/sidebar/trigger/root.tsx b/apps/web/ee/components/automations/details/sidebar/trigger/root.tsx index 081d4fc638..bd237173d8 100644 --- a/apps/web/ee/components/automations/details/sidebar/trigger/root.tsx +++ b/apps/web/ee/components/automations/details/sidebar/trigger/root.tsx @@ -44,7 +44,7 @@ const AUTOMATION_TRIGGER_SELECT_OPTIONS_WITH_CONTENT: ICustomSearchSelectOption[ ), })); -export const AutomationDetailsSidebarTriggerRoot: React.FC = observer((props) => { +export const AutomationDetailsSidebarTriggerRoot = observer(function AutomationDetailsSidebarTriggerRoot(props: Props) { const { automationId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/details/wrapper.tsx b/apps/web/ee/components/automations/details/wrapper.tsx index 16e4fd1b7d..c466421212 100644 --- a/apps/web/ee/components/automations/details/wrapper.tsx +++ b/apps/web/ee/components/automations/details/wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import useSWR from "swr"; // plane imports @@ -16,7 +14,7 @@ type Props = { children: React.ReactNode; }; -export const AutomationsDetailsWrapper: React.FC = observer((props) => { +export const AutomationsDetailsWrapper = observer(function AutomationsDetailsWrapper(props: Props) { const { automationId, projectId, workspaceSlug, children } = props; // store hooks const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/automations/list/root.tsx b/apps/web/ee/components/automations/list/root.tsx index 95620e1539..abc49dc15b 100644 --- a/apps/web/ee/components/automations/list/root.tsx +++ b/apps/web/ee/components/automations/list/root.tsx @@ -15,7 +15,7 @@ type TProps = { projectId: string; }; -export const AutomationsListRoot: FC = observer((props) => { +export const AutomationsListRoot = observer(function AutomationsListRoot(props: TProps) { const { projectId } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/automations/list/table/empty-state.tsx b/apps/web/ee/components/automations/list/table/empty-state.tsx index cfd5eba455..372f3b8923 100644 --- a/apps/web/ee/components/automations/list/table/empty-state.tsx +++ b/apps/web/ee/components/automations/list/table/empty-state.tsx @@ -10,20 +10,16 @@ interface TableEmptyStateProps { className?: string; } -export const TableEmptyState: React.FC = ({ - icon: Icon, - title, - description, - colSpan, - className = "", -}) => ( - - -
    - {Icon && } -

    {title}

    - {description &&

    {description}

    } -
    -     -     -); +export function TableEmptyState({ icon: Icon, title, description, colSpan, className = "" }: TableEmptyStateProps) { + return ( + + +
    + {Icon && } +

    {title}

    + {description &&

    {description}

    } +
    +     +     + ); +} diff --git a/apps/web/ee/components/automations/list/table/indicator.tsx b/apps/web/ee/components/automations/list/table/indicator.tsx index 448478a5eb..3684d40a75 100644 --- a/apps/web/ee/components/automations/list/table/indicator.tsx +++ b/apps/web/ee/components/automations/list/table/indicator.tsx @@ -7,7 +7,7 @@ type TProps = { totalCount: number; }; -export const SuccessFailureIndicator: React.FC = observer((props) => { +export const SuccessFailureIndicator = observer(function SuccessFailureIndicator(props: TProps) { const { failedCount, successCount, totalCount } = props; if (totalCount === 0) return null; diff --git a/apps/web/ee/components/automations/list/table/loader.tsx b/apps/web/ee/components/automations/list/table/loader.tsx index 48037f9198..5aa554122e 100644 --- a/apps/web/ee/components/automations/list/table/loader.tsx +++ b/apps/web/ee/components/automations/list/table/loader.tsx @@ -9,80 +9,82 @@ const COMMON_TABLE_CELL_CLASSNAME = "text-custom-text-200 text-center"; const COMMON_TABLE_TITLE_CELL_CLASSNAME = "font-medium text-custom-text-100 max-w-72 truncate sticky left-0 bg-custom-background-100 border-r border-custom-border-100 z-10 min-w-[200px] transition-colors duration-75 py-3"; -export const AutomationsTableLoader = () => ( - - {/* Table */} -
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - {Array.from({ length: 5 }).map((_, index) => ( - - {/* Automation title */} - -
    - -
    -     - {/* Last run on */} - - - - {/* Created on */} - +export function AutomationsTableLoader() { + return ( + + {/* Table */} +
    +
    + + + + + + + + + - - {/* Last updated on */} - - - - {/* Last run status */} - - - - {/* Average duration */} - + + + + + + + + + + + - - {/* Owner */} - - - - {/* Executions */} - - - + + + + - ))} - -
    -
    -     -); + + + {Array.from({ length: 5 }).map((_, index) => ( + + {/* Automation title */} + +
    + +
    +     + {/* Last run on */} + + + + {/* Created on */} + + + + {/* Last updated on */} + + + + {/* Last run status */} + + + + {/* Average duration */} + + + + {/* Owner */} + + + + {/* Executions */} + + + +     + ))} +     + +
    + + ); +} diff --git a/apps/web/ee/components/automations/list/table/root.tsx b/apps/web/ee/components/automations/list/table/root.tsx index 5a54105110..51e8c321a0 100644 --- a/apps/web/ee/components/automations/list/table/root.tsx +++ b/apps/web/ee/components/automations/list/table/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { Search } from "lucide-react"; @@ -33,7 +31,7 @@ const COMMON_TABLE_DISABLED_CELL_CLASSNAME = "text-custom-text-400"; const COMMON_TABLE_TITLE_CELL_CLASSNAME = "font-medium text-custom-text-100 max-w-72 truncate sticky left-0 bg-custom-background-100 group-hover:bg-custom-background-90 border-r border-custom-border-100 z-10 min-w-[200px] transition-colors duration-75 py-3"; -export const AutomationsTable: React.FC = observer((props) => { +export const AutomationsTable = observer(function AutomationsTable(props: AutomationsTableProps) { const { automations, onAutomationClick } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/list/table/status-badge.tsx b/apps/web/ee/components/automations/list/table/status-badge.tsx index 042d3ac0c5..1e368bcf13 100644 --- a/apps/web/ee/components/automations/list/table/status-badge.tsx +++ b/apps/web/ee/components/automations/list/table/status-badge.tsx @@ -24,7 +24,7 @@ const statusToVariantMap: Map = (props) => { +export function AutomationRunStatusBadge(props: TAutomationRunStatusBadgeProps) { const { status } = props; // derived values const styles = status ? variantStylesMap.get(statusToVariantMap.get(status)!) : "text-custom-text-400"; @@ -34,4 +34,4 @@ export const AutomationRunStatusBadge: React.FC {status ? getAutomationRunStatusLabel(status) : "--"}
    ); -}; +} diff --git a/apps/web/ee/components/automations/list/wrapper.tsx b/apps/web/ee/components/automations/list/wrapper.tsx index 1f707e2582..d193650d06 100644 --- a/apps/web/ee/components/automations/list/wrapper.tsx +++ b/apps/web/ee/components/automations/list/wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import useSWR from "swr"; // plane imports @@ -15,7 +13,7 @@ type Props = { children: React.ReactNode; }; -export const AutomationsListWrapper: React.FC = observer((props) => { +export const AutomationsListWrapper = observer(function AutomationsListWrapper(props: Props) { const { projectId, workspaceSlug, children } = props; // store hooks const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/automations/modals/create-update-modal.tsx b/apps/web/ee/components/automations/modals/create-update-modal.tsx index 2c2a809109..029f114bb7 100644 --- a/apps/web/ee/components/automations/modals/create-update-modal.tsx +++ b/apps/web/ee/components/automations/modals/create-update-modal.tsx @@ -29,7 +29,7 @@ const defaultValues: Partial = { scope: EAutomationScope.WORK_ITEM, }; -export const CreateUpdateAutomationModal: React.FC = observer((props) => { +export const CreateUpdateAutomationModal = observer(function CreateUpdateAutomationModal(props: Props) { const { data, isOpen, onClose } = props; // app router const router = useAppRouter(); diff --git a/apps/web/ee/components/automations/modals/delete-modal.tsx b/apps/web/ee/components/automations/modals/delete-modal.tsx index 0a30582e0e..c9e217677e 100644 --- a/apps/web/ee/components/automations/modals/delete-modal.tsx +++ b/apps/web/ee/components/automations/modals/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -19,7 +17,7 @@ type Props = { isOpen: boolean; }; -export const DeleteAutomationModal: React.FC = observer((props) => { +export const DeleteAutomationModal = observer(function DeleteAutomationModal(props: Props) { const { automationId, handleClose, handleDelete, isOpen } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/automations/no-automations.tsx b/apps/web/ee/components/automations/no-automations.tsx index 8e2abbf17a..af0d314e20 100644 --- a/apps/web/ee/components/automations/no-automations.tsx +++ b/apps/web/ee/components/automations/no-automations.tsx @@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n"; // local imports import { CreateAutomationButton } from "./create-button"; -export const NoAutomationsEmptyState = observer(() => { +export const NoAutomationsEmptyState = observer(function NoAutomationsEmptyState() { // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/automations/root.tsx b/apps/web/ee/components/automations/root.tsx index 9252a18585..3266ad1207 100644 --- a/apps/web/ee/components/automations/root.tsx +++ b/apps/web/ee/components/automations/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -13,7 +11,7 @@ import { AutomationsListRoot } from "@/plane-web/components/automations/list/roo import { WithFeatureFlagHOC } from "@/plane-web/components/feature-flags/with-feature-flag-hoc"; import { useAutomations } from "@/plane-web/hooks/store/automations/use-automations"; -export const CustomAutomationsRoot: FC = observer((props) => { +export const CustomAutomationsRoot = observer(function CustomAutomationsRoot(props: TCustomAutomationsRootProps) { const { projectId, workspaceSlug } = props; // store hooks const { diff --git a/apps/web/ee/components/automations/upgrade.tsx b/apps/web/ee/components/automations/upgrade.tsx index 7bbbc21957..49f55bab2c 100644 --- a/apps/web/ee/components/automations/upgrade.tsx +++ b/apps/web/ee/components/automations/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -19,7 +17,7 @@ type TAutomationsUpgradeProps = { flag: TSupportedFlagsForUpgrade; }; -export const AutomationsUpgrade: FC = observer((props: TAutomationsUpgradeProps) => { +export const AutomationsUpgrade = observer(function AutomationsUpgrade(props: TAutomationsUpgradeProps) { const { flag } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/breadcrumbs/project-feature.tsx b/apps/web/ee/components/breadcrumbs/project-feature.tsx index 6c4329164e..8b5a258812 100644 --- a/apps/web/ee/components/breadcrumbs/project-feature.tsx +++ b/apps/web/ee/components/breadcrumbs/project-feature.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // ui import { EProjectFeatureKey } from "@plane/constants"; @@ -19,7 +17,9 @@ type TProjectFeatureBreadcrumbProps = { isLast?: boolean; }; -export const ProjectFeatureBreadcrumb = observer((props: TProjectFeatureBreadcrumbProps) => { +export const ProjectFeatureBreadcrumb = observer(function ProjectFeatureBreadcrumb( + props: TProjectFeatureBreadcrumbProps +) { const { workspaceSlug, projectId, featureKey, isLast = false } = props; // store hooks const { getPartialProjectById } = useProject(); diff --git a/apps/web/ee/components/breadcrumbs/project.tsx b/apps/web/ee/components/breadcrumbs/project.tsx index de2e6b009a..e9f2284073 100644 --- a/apps/web/ee/components/breadcrumbs/project.tsx +++ b/apps/web/ee/components/breadcrumbs/project.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // ui // components @@ -15,7 +13,7 @@ type TProjectBreadcrumbProps = { projectId: string; }; -export const ProjectBreadcrumb = observer((props: TProjectBreadcrumbProps) => { +export const ProjectBreadcrumb = observer(function ProjectBreadcrumb(props: TProjectBreadcrumbProps) { const { workspaceSlug, projectId } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/breadcrumbs/teamspace.tsx b/apps/web/ee/components/breadcrumbs/teamspace.tsx index cdffa7b8f8..4631d65794 100644 --- a/apps/web/ee/components/breadcrumbs/teamspace.tsx +++ b/apps/web/ee/components/breadcrumbs/teamspace.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -19,7 +17,7 @@ type TTeamspaceBreadcrumbProps = { isLast?: boolean; }; -export const TeamspaceBreadcrumb: FC = observer((props) => { +export const TeamspaceBreadcrumb = observer(function TeamspaceBreadcrumb(props: TTeamspaceBreadcrumbProps) { const { workspaceSlug, teamspaceId, featureKey, isLast = false } = props; // store hooks diff --git a/apps/web/ee/components/command-palette/actions/work-item-actions/change-state-list.tsx b/apps/web/ee/components/command-palette/actions/work-item-actions/change-state-list.tsx index 654f616b49..c1a7f2bfb6 100644 --- a/apps/web/ee/components/command-palette/actions/work-item-actions/change-state-list.tsx +++ b/apps/web/ee/components/command-palette/actions/work-item-actions/change-state-list.tsx @@ -15,7 +15,7 @@ import { useProjectState } from "@/hooks/store/use-project-state"; // plane web imports import { WorkFlowDisabledMessage } from "@/plane-web/components/workflow"; -export const ChangeWorkItemStateList = observer((props: TChangeWorkItemStateListProps) => { +export const ChangeWorkItemStateList = observer(function ChangeWorkItemStateList(props: TChangeWorkItemStateListProps) { const { projectId, currentStateId, handleStateChange } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/command-palette/modals/project-level.tsx b/apps/web/ee/components/command-palette/modals/project-level.tsx index 9c4dda3605..807b1fe940 100644 --- a/apps/web/ee/components/command-palette/modals/project-level.tsx +++ b/apps/web/ee/components/command-palette/modals/project-level.tsx @@ -5,7 +5,7 @@ import { ProjectLevelModals as BaseProjectLevelModals } from "@/ce/components/co import { CreateUpdateAutomationModal } from "@/plane-web/components/automations/modals/create-update-modal"; import { useAutomations } from "@/plane-web/hooks/store/automations/use-automations"; -export const ProjectLevelModals = observer((props: TProjectLevelModalsProps) => { +export const ProjectLevelModals = observer(function ProjectLevelModals(props: TProjectLevelModalsProps) { // store hooks const { projectAutomations: { createUpdateModalConfig, setCreateUpdateModalConfig }, diff --git a/apps/web/ee/components/command-palette/modals/work-item-level.tsx b/apps/web/ee/components/command-palette/modals/work-item-level.tsx index 2bd3674e41..34a55c8b67 100644 --- a/apps/web/ee/components/command-palette/modals/work-item-level.tsx +++ b/apps/web/ee/components/command-palette/modals/work-item-level.tsx @@ -3,8 +3,10 @@ import { observer } from "mobx-react"; import type { TWorkItemLevelModalsProps } from "@/ce/components/command-palette/modals/work-item-level"; import { WorkItemLevelModals as BaseWorkItemLevelModals } from "@/ce/components/command-palette/modals/work-item-level"; -export const WorkItemLevelModals = observer((props: TWorkItemLevelModalsProps) => ( - <> - - -)); +export const WorkItemLevelModals = observer(function WorkItemLevelModals(props: TWorkItemLevelModalsProps) { + return ( + <> + + + ); +}); diff --git a/apps/web/ee/components/command-palette/modals/workspace-level.tsx b/apps/web/ee/components/command-palette/modals/workspace-level.tsx index ac298f79f6..8624167a2b 100644 --- a/apps/web/ee/components/command-palette/modals/workspace-level.tsx +++ b/apps/web/ee/components/command-palette/modals/workspace-level.tsx @@ -15,7 +15,7 @@ import { CreateUpdateTeamspaceViewModal } from "@/plane-web/components/teamspace import { AddSeatsModal, RemoveUnusedSeatsModal } from "@/plane-web/components/workspace/billing/manage-seats"; import { useDashboards, useSelfHostedSubscription, useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const WorkspaceLevelModals = observer((props: TWorkspaceLevelModalsProps) => { +export const WorkspaceLevelModals = observer(function WorkspaceLevelModals(props: TWorkspaceLevelModalsProps) { // router const { workspaceSlug } = props; // store hooks diff --git a/apps/web/ee/components/command-palette/plane-ai/commands-list.tsx b/apps/web/ee/components/command-palette/plane-ai/commands-list.tsx index 1852c21122..72834b29e3 100644 --- a/apps/web/ee/components/command-palette/plane-ai/commands-list.tsx +++ b/apps/web/ee/components/command-palette/plane-ai/commands-list.tsx @@ -13,7 +13,7 @@ export type TPowerKCommandsListProps = { setSearchTerm: (value: string) => void; }; -export const PlaneAiAppPowerKCommandsList: React.FC = (props) => { +export function PlaneAiAppPowerKCommandsList(props: TPowerKCommandsListProps) { const { activePage, context, handleCommandSelect, handlePageDataSelection } = props; return ( @@ -26,4 +26,4 @@ export const PlaneAiAppPowerKCommandsList: React.FC = /> ); -}; +} diff --git a/apps/web/ee/components/command-palette/plane-ai/pages/root.tsx b/apps/web/ee/components/command-palette/plane-ai/pages/root.tsx index b9c7e3b492..5dfd668a9e 100644 --- a/apps/web/ee/components/command-palette/plane-ai/pages/root.tsx +++ b/apps/web/ee/components/command-palette/plane-ai/pages/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // components @@ -14,7 +12,7 @@ type Props = { onPageDataSelect: (value: unknown) => void; }; -export const PlaneAiAppPowerKModalPagesList: React.FC = observer((props) => { +export const PlaneAiAppPowerKModalPagesList = observer(function PlaneAiAppPowerKModalPagesList(props: Props) { const { activePage, context, onCommandSelect, onPageDataSelect } = props; // Main page content (no specific page) diff --git a/apps/web/ee/components/command-palette/plane-ai/provider.tsx b/apps/web/ee/components/command-palette/plane-ai/provider.tsx index 9910b981d3..c1182a9a96 100644 --- a/apps/web/ee/components/command-palette/plane-ai/provider.tsx +++ b/apps/web/ee/components/command-palette/plane-ai/provider.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ import { usePlaneAiAppPowerKCommands } from "./config/commands"; * MobX-aware wrapper for the Command Palette modal * Connects the modal to the MobX store */ -export const PlaneAiAppPowerKProvider = observer(() => { +export const PlaneAiAppPowerKProvider = observer(function PlaneAiAppPowerKProvider() { // navigation const router = useAppRouter(); const params = useParams(); diff --git a/apps/web/ee/components/command-palette/power-k/menus/customers.tsx b/apps/web/ee/components/command-palette/power-k/menus/customers.tsx index be3a6c93f5..5e0acc7fb5 100644 --- a/apps/web/ee/components/command-palette/power-k/menus/customers.tsx +++ b/apps/web/ee/components/command-palette/power-k/menus/customers.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -13,15 +11,17 @@ type Props = { onSelect: (customer: TCustomer) => void; }; -export const PowerKCustomersMenu: React.FC = observer(({ customers, onSelect }) => ( - } - getKey={(customer) => customer.id || customer.name} - getLabel={(customer) => customer.name} - getValue={(customer) => customer.name} - onSelect={onSelect} - emptyText="No customers found" - /> -)); +export const PowerKCustomersMenu = observer(function PowerKCustomersMenu({ customers, onSelect }: Props) { + return ( + } + getKey={(customer) => customer.id || customer.name} + getLabel={(customer) => customer.name} + getValue={(customer) => customer.name} + onSelect={onSelect} + emptyText="No customers found" + /> + ); +}); diff --git a/apps/web/ee/components/command-palette/power-k/menus/initiatives.tsx b/apps/web/ee/components/command-palette/power-k/menus/initiatives.tsx index 32b39c8bbe..7c712d29eb 100644 --- a/apps/web/ee/components/command-palette/power-k/menus/initiatives.tsx +++ b/apps/web/ee/components/command-palette/power-k/menus/initiatives.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -15,23 +13,25 @@ type Props = { onSelect: (initiative: TInitiative) => void; }; -export const PowerKInitiativesMenu: React.FC = observer(({ initiatives, onSelect }) => ( - ( - <> - {initiative?.logo_props?.in_use ? ( - - ) : ( - - )} - - )} - getKey={(initiative) => initiative.id} - getLabel={(initiative) => initiative.name} - getValue={(initiative) => initiative.name} - onSelect={onSelect} - emptyText="No initiatives found" - /> -)); +export const PowerKInitiativesMenu = observer(function PowerKInitiativesMenu({ initiatives, onSelect }: Props) { + return ( + ( + <> + {initiative?.logo_props?.in_use ? ( + + ) : ( + + )} + + )} + getKey={(initiative) => initiative.id} + getLabel={(initiative) => initiative.name} + getValue={(initiative) => initiative.name} + onSelect={onSelect} + emptyText="No initiatives found" + /> + ); +}); diff --git a/apps/web/ee/components/command-palette/power-k/menus/teamspaces.tsx b/apps/web/ee/components/command-palette/power-k/menus/teamspaces.tsx index c790eaf802..b077aa4396 100644 --- a/apps/web/ee/components/command-palette/power-k/menus/teamspaces.tsx +++ b/apps/web/ee/components/command-palette/power-k/menus/teamspaces.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -12,15 +10,17 @@ type Props = { onSelect: (teamspace: TTeamspace) => void; }; -export const PowerKTeamspacesMenu: React.FC = observer(({ teamspaces, onSelect }) => ( - } - getKey={(teamspace) => teamspace.id} - getLabel={(teamspace) => teamspace.name} - getValue={(teamspace) => teamspace.name} - onSelect={onSelect} - emptyText="No teamspaces found" - /> -)); +export const PowerKTeamspacesMenu = observer(function PowerKTeamspacesMenu({ teamspaces, onSelect }: Props) { + return ( + } + getKey={(teamspace) => teamspace.id} + getLabel={(teamspace) => teamspace.name} + getValue={(teamspace) => teamspace.name} + onSelect={onSelect} + emptyText="No teamspaces found" + /> + ); +}); diff --git a/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/root.tsx b/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/root.tsx index 3862819706..65e4a15feb 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/root.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // components @@ -17,7 +15,7 @@ type Props = { handleSelection: (data: unknown) => void; }; -export const PowerKInitiativeContextBasedPages: React.FC = observer((props) => { +export const PowerKInitiativeContextBasedPages = observer(function PowerKInitiativeContextBasedPages(props: Props) { const { activePage, handleSelection } = props; // navigation const { workspaceSlug, initiativeId } = useParams(); diff --git a/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/states-menu.tsx b/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/states-menu.tsx index 65af38d88e..d62abf5897 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/states-menu.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/context-based/initiative/states-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Command } from "cmdk"; import { observer } from "mobx-react"; // plane imports @@ -15,7 +13,7 @@ type Props = { value: TInitiativeStates; }; -export const PowerKInitiativeStatesMenu: React.FC = observer((props) => { +export const PowerKInitiativeStatesMenu = observer(function PowerKInitiativeStatesMenu(props: Props) { const { handleSelect, value } = props; // translation const { t } = useTranslation(); diff --git a/apps/web/ee/components/command-palette/power-k/pages/context-based/root.tsx b/apps/web/ee/components/command-palette/power-k/pages/context-based/root.tsx index 9e15ad37e5..2456b88fc0 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/context-based/root.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/context-based/root.tsx @@ -13,7 +13,7 @@ export const CONTEXT_ENTITY_MAP_EXTENDED: Record = (props) => { +export function PowerKContextBasedActionsExtended(props: ContextBasedActionsProps) { const { activeContext, activePage, handleSelection } = props; return ( @@ -23,7 +23,7 @@ export const PowerKContextBasedActionsExtended: React.FC ); -}; +} export const usePowerKContextBasedExtendedActions = (): TPowerKCommandConfig[] => { const initiativeCommands = usePowerKInitiativeContextBasedActions(); diff --git a/apps/web/ee/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx b/apps/web/ee/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx index 3ca34ecf28..83cc235707 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane types import { StateGroupIcon } from "@plane/propel/icons"; @@ -13,7 +11,9 @@ import { useProjectState } from "@/hooks/store/use-project-state"; // plane web imports import { WorkFlowDisabledMessage } from "@/plane-web/components/workflow/workflow-tree/workflow-disabled-message"; -export const PowerKProjectStatesMenuItems: React.FC = observer((props) => { +export const PowerKProjectStatesMenuItems = observer(function PowerKProjectStatesMenuItems( + props: TPowerKProjectStatesMenuItemsProps +) { const { handleSelect, projectId, selectedStateId, states, workspaceSlug } = props; // store hooks const { getIsWorkflowEnabled, getAvailableProjectStateIdMap } = useProjectState(); diff --git a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/customers-menu.tsx b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/customers-menu.tsx index d088038b11..6f58e08a4b 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/customers-menu.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/customers-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import type { TCustomer } from "@plane/types"; @@ -13,7 +11,7 @@ type Props = { handleSelect: (customer: TCustomer) => void; }; -export const PowerKOpenCustomersMenu: React.FC = observer((props) => { +export const PowerKOpenCustomersMenu = observer(function PowerKOpenCustomersMenu(props: Props) { const { handleSelect } = props; // store hooks const { loader, customerIds, getCustomerById } = useCustomers(); diff --git a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/initiatives-menu.tsx b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/initiatives-menu.tsx index 3855cead4f..fb098d84cd 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/initiatives-menu.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/initiatives-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { Spinner } from "@plane/ui"; @@ -12,7 +10,7 @@ type Props = { handleSelect: (initiative: TInitiative) => void; }; -export const PowerKOpenInitiativesMenu: React.FC = observer((props) => { +export const PowerKOpenInitiativesMenu = observer(function PowerKOpenInitiativesMenu(props: Props) { const { handleSelect } = props; // store hooks const { diff --git a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/root.tsx b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/root.tsx index ed7eddabeb..94745e2be5 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/root.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/root.tsx @@ -5,7 +5,7 @@ import { PowerKOpenCustomersMenu } from "./customers-menu"; import { PowerKOpenInitiativesMenu } from "./initiatives-menu"; import { PowerKOpenTeamspacesMenu } from "./teamspaces-menu"; -export const PowerKOpenEntityActionsExtended: React.FC = (props) => { +export function PowerKOpenEntityActionsExtended(props: TPowerKOpenEntityActionsProps) { const { activePage, handleSelection } = props; return ( @@ -15,4 +15,4 @@ export const PowerKOpenEntityActionsExtended: React.FC} ); -}; +} diff --git a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/teamspaces-menu.tsx b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/teamspaces-menu.tsx index 5216b53fce..6de154492b 100644 --- a/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/teamspaces-menu.tsx +++ b/apps/web/ee/components/command-palette/power-k/pages/open-entity-actions/teamspaces-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import type { TTeamspace } from "@plane/types"; @@ -13,7 +11,7 @@ type Props = { handleSelect: (teamspace: TTeamspace) => void; }; -export const PowerKOpenTeamspacesMenu: React.FC = observer((props) => { +export const PowerKOpenTeamspacesMenu = observer(function PowerKOpenTeamspacesMenu(props: Props) { const { handleSelect } = props; // store hooks const { loader, joinedTeamSpaceIds, getTeamspaceById } = useTeamspaces(); diff --git a/apps/web/ee/components/command-palette/power-k/search/no-results-command.tsx b/apps/web/ee/components/command-palette/power-k/search/no-results-command.tsx index cc15c7facb..2a33398840 100644 --- a/apps/web/ee/components/command-palette/power-k/search/no-results-command.tsx +++ b/apps/web/ee/components/command-palette/power-k/search/no-results-command.tsx @@ -14,38 +14,38 @@ import { useAppRouter } from "@/hooks/use-app-router"; // plane web imports import { useFlag } from "@/plane-web/hooks/store"; -export const PowerKModalNoSearchResultsCommand: React.FC = observer( - (props) => { - const { context, searchTerm } = props; - // navigation - const router = useAppRouter(); - const { workspaceSlug } = useParams(); - // store hooks - const isAdvancedSearchEnabled = useFlag(workspaceSlug?.toString() ?? "", "ADVANCED_SEARCH"); - // translation - const { t } = useTranslation(); +export const PowerKModalNoSearchResultsCommand = observer(function PowerKModalNoSearchResultsCommand( + props: TPowerKModalNoSearchResultsCommandProps +) { + const { context, searchTerm } = props; + // navigation + const router = useAppRouter(); + const { workspaceSlug } = useParams(); + // store hooks + const isAdvancedSearchEnabled = useFlag(workspaceSlug?.toString() ?? "", "ADVANCED_SEARCH"); + // translation + const { t } = useTranslation(); - if (!isAdvancedSearchEnabled) return ; + if (!isAdvancedSearchEnabled) return ; - return ( - - - {t("power_k.search_menu.no_results")}{" "} - - {t("power_k.search_menu.go_to_advanced_search")} - -

    - } - onSelect={() => { - context.closePalette(); - router.push(`/${workspaceSlug?.toString()}/search/?q=${searchTerm}`); - }} - /> -     - ); - } -); + return ( + + + {t("power_k.search_menu.no_results")}{" "} + + {t("power_k.search_menu.go_to_advanced_search")} + +

    + } + onSelect={() => { + context.closePalette(); + router.push(`/${workspaceSlug?.toString()}/search/?q=${searchTerm}`); + }} + /> +     + ); +}); diff --git a/apps/web/ee/components/command-palette/shortcuts-modal/commands-list.tsx b/apps/web/ee/components/command-palette/shortcuts-modal/commands-list.tsx index 8f201635a3..d0fc1d326a 100644 --- a/apps/web/ee/components/command-palette/shortcuts-modal/commands-list.tsx +++ b/apps/web/ee/components/command-palette/shortcuts-modal/commands-list.tsx @@ -8,7 +8,7 @@ type Props = { searchQuery: string; }; -export const PagesAppShortcutCommandsList: React.FC = (props) => { +export function PagesAppShortcutCommandsList(props: Props) { const { searchQuery } = props; const { platform } = usePlatformOS(); @@ -92,4 +92,4 @@ export const PagesAppShortcutCommandsList: React.FC = (props) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/command-palette/shortcuts-modal/modal.tsx b/apps/web/ee/components/command-palette/shortcuts-modal/modal.tsx index 7aa61e69e0..036b0a9573 100644 --- a/apps/web/ee/components/command-palette/shortcuts-modal/modal.tsx +++ b/apps/web/ee/components/command-palette/shortcuts-modal/modal.tsx @@ -13,7 +13,7 @@ type Props = { onClose: () => void; }; -export const PagesAppShortcutsModal: FC = (props) => { +export function PagesAppShortcutsModal(props: Props) { const { isOpen, onClose } = props; // states const [query, setQuery] = useState(""); @@ -83,4 +83,4 @@ export const PagesAppShortcutsModal: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/command-palette/wiki/commands-list.tsx b/apps/web/ee/components/command-palette/wiki/commands-list.tsx index fb216d544f..99d6a97b71 100644 --- a/apps/web/ee/components/command-palette/wiki/commands-list.tsx +++ b/apps/web/ee/components/command-palette/wiki/commands-list.tsx @@ -15,7 +15,7 @@ export type TPowerKCommandsListProps = { setSearchTerm: (value: string) => void; }; -export const WikiAppPowerKCommandsList: React.FC = (props) => { +export function WikiAppPowerKCommandsList(props: TPowerKCommandsListProps) { const { activePage, context, @@ -48,4 +48,4 @@ export const WikiAppPowerKCommandsList: React.FC = (pr /> ); -}; +} diff --git a/apps/web/ee/components/command-palette/wiki/pages/context-based/root.tsx b/apps/web/ee/components/command-palette/wiki/pages/context-based/root.tsx index 2cf2fb4c1e..8be64267ff 100644 --- a/apps/web/ee/components/command-palette/wiki/pages/context-based/root.tsx +++ b/apps/web/ee/components/command-palette/wiki/pages/context-based/root.tsx @@ -9,7 +9,9 @@ export type ContextBasedActionsProps = { handleSelection: (data: unknown) => void; }; -export const WikiAppPowerKContextBasedPagesList: React.FC = (_props) => <>; +export function WikiAppPowerKContextBasedPagesList(_props: ContextBasedActionsProps) { + return <>; +} export const useWikiAppPowerKContextBasedActions = (): TPowerKCommandConfig[] => { const pageCommands = useWikiAppPowerKPageContextBasedActions(); diff --git a/apps/web/ee/components/command-palette/wiki/pages/root.tsx b/apps/web/ee/components/command-palette/wiki/pages/root.tsx index a4b486ffaf..73db242f22 100644 --- a/apps/web/ee/components/command-palette/wiki/pages/root.tsx +++ b/apps/web/ee/components/command-palette/wiki/pages/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // components @@ -14,7 +12,7 @@ type Props = { onPageDataSelect: (value: unknown) => void; }; -export const WikiAppPowerKModalPagesList: React.FC = observer((props) => { +export const WikiAppPowerKModalPagesList = observer(function WikiAppPowerKModalPagesList(props: Props) { const { activePage, context, onCommandSelect, onPageDataSelect } = props; // Main page content (no specific page) diff --git a/apps/web/ee/components/command-palette/wiki/provider.tsx b/apps/web/ee/components/command-palette/wiki/provider.tsx index 813ce1163f..78452f775e 100644 --- a/apps/web/ee/components/command-palette/wiki/provider.tsx +++ b/apps/web/ee/components/command-palette/wiki/provider.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -23,7 +21,7 @@ import { useWikiAppPowerKCommands } from "./config/commands"; * MobX-aware wrapper for the Command Palette modal * Connects the modal to the MobX store */ -export const WikiAppPowerKProvider = observer(() => { +export const WikiAppPowerKProvider = observer(function WikiAppPowerKProvider() { // navigation const router = useAppRouter(); const params = useParams(); diff --git a/apps/web/ee/components/command-palette/wiki/search-menu.tsx b/apps/web/ee/components/command-palette/wiki/search-menu.tsx index e5683a15f0..116390c2c3 100644 --- a/apps/web/ee/components/command-palette/wiki/search-menu.tsx +++ b/apps/web/ee/components/command-palette/wiki/search-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState, useEffect } from "react"; import { useParams } from "next/navigation"; // plane imports @@ -26,7 +24,7 @@ type Props = { updateSearchTerm: (value: string) => void; }; -export const WikiAppPowerKModalSearchMenu: React.FC = (props) => { +export function WikiAppPowerKModalSearchMenu(props: Props) { const { activePage, context, isWorkspaceLevel, searchTerm, updateSearchTerm } = props; // states const [resultsCount, setResultsCount] = useState(0); @@ -108,4 +106,4 @@ export const WikiAppPowerKModalSearchMenu: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/command-palette/wiki/search-results-map.tsx b/apps/web/ee/components/command-palette/wiki/search-results-map.tsx index bc9d96f860..8002d55faf 100644 --- a/apps/web/ee/components/command-palette/wiki/search-results-map.tsx +++ b/apps/web/ee/components/command-palette/wiki/search-results-map.tsx @@ -1,5 +1,3 @@ -"use client"; - import { FileText, LayoutGrid } from "lucide-react"; // plane imports import type { IWorkspaceDefaultSearchResult, IWorkspaceSearchResult } from "@plane/types"; diff --git a/apps/web/ee/components/command-palette/wiki/search-results.tsx b/apps/web/ee/components/command-palette/wiki/search-results.tsx index ab1256d333..bb000dcec5 100644 --- a/apps/web/ee/components/command-palette/wiki/search-results.tsx +++ b/apps/web/ee/components/command-palette/wiki/search-results.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Command } from "cmdk"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -17,7 +15,7 @@ type Props = { results: IAppSearchResults; }; -export const WikiAppPowerKModalSearchResults: React.FC = observer((props) => { +export const WikiAppPowerKModalSearchResults = observer(function WikiAppPowerKModalSearchResults(props: Props) { const { closePalette, results } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/comments/comment-block.tsx b/apps/web/ee/components/comments/comment-block.tsx index bf6a95128f..a2d5ed4d8c 100644 --- a/apps/web/ee/components/comments/comment-block.tsx +++ b/apps/web/ee/components/comments/comment-block.tsx @@ -15,7 +15,7 @@ type TCommentBlock = { children: ReactNode; }; -export const CommentBlock: FC = observer((props) => { +export const CommentBlock = observer(function CommentBlock(props: TCommentBlock) { const { comment, ends, children } = props; const commentBlockRef = useRef(null); // store hooks diff --git a/apps/web/ee/components/comments/replies/replies-list.tsx b/apps/web/ee/components/comments/replies/replies-list.tsx index 0711f32627..2c8f800d9e 100644 --- a/apps/web/ee/components/comments/replies/replies-list.tsx +++ b/apps/web/ee/components/comments/replies/replies-list.tsx @@ -19,7 +19,7 @@ type TRepliesList = { setIsExpanded: (isExpanded: boolean) => void; }; -export const RepliesList: FC = observer((props) => { +export const RepliesList = observer(function RepliesList(props: TRepliesList) { const { workspaceSlug, projectId, entityId, commentId, activityOperations, showAccessSpecifier, setIsExpanded } = props; // store hooks diff --git a/apps/web/ee/components/comments/replies/reply-quick-actions.tsx b/apps/web/ee/components/comments/replies/reply-quick-actions.tsx index 32fecd4105..65d9ee6ec2 100644 --- a/apps/web/ee/components/comments/replies/reply-quick-actions.tsx +++ b/apps/web/ee/components/comments/replies/reply-quick-actions.tsx @@ -16,7 +16,7 @@ type TReplyQuickActions = { setEditMode: () => void; }; -export const ReplyQuickActions: FC = observer((props) => { +export const ReplyQuickActions = observer(function ReplyQuickActions(props: TReplyQuickActions) { const { handleDelete, reply, setEditMode } = props; // store hooks const { data: currentUser } = useUser(); diff --git a/apps/web/ee/components/common/beta.tsx b/apps/web/ee/components/common/beta.tsx index ce3b98a86e..de172ad357 100644 --- a/apps/web/ee/components/common/beta.tsx +++ b/apps/web/ee/components/common/beta.tsx @@ -1,7 +1,7 @@ import { EPillVariant, EPillSize, ERadius, Pill } from "@plane/propel/pill"; import { generateIconColors } from "@plane/utils"; -export const BetaBadge = () => { +export function BetaBadge() { const color = generateIconColors("CC7700"); const textColor = color ? color.foreground : "transparent"; const backgroundColor = color ? color.background : "transparent"; @@ -16,4 +16,4 @@ export const BetaBadge = () => { Beta ); -}; +} diff --git a/apps/web/ee/components/common/extended-app-header.tsx b/apps/web/ee/components/common/extended-app-header.tsx index d0fb4e798b..c0f4fa3326 100644 --- a/apps/web/ee/components/common/extended-app-header.tsx +++ b/apps/web/ee/components/common/extended-app-header.tsx @@ -7,7 +7,7 @@ import { AppSidebarToggleButton } from "@/components/sidebar/sidebar-toggle-butt import { useAppTheme } from "@/hooks/store/use-app-theme"; import { useProjectNavigationPreferences } from "@/hooks/use-navigation-preferences"; -export const ExtendedAppHeader = observer((props: { header: ReactNode }) => { +export const ExtendedAppHeader = observer(function ExtendedAppHeader(props: { header: ReactNode }) { const { header } = props; // router const { projectId, workItem } = useParams(); diff --git a/apps/web/ee/components/common/image-toolbar/download.tsx b/apps/web/ee/components/common/image-toolbar/download.tsx index 2f0a665ae5..97a2241b0e 100644 --- a/apps/web/ee/components/common/image-toolbar/download.tsx +++ b/apps/web/ee/components/common/image-toolbar/download.tsx @@ -6,7 +6,7 @@ type Props = { src: string; }; -export const ImageDownloadAction: React.FC = (props) => { +export function ImageDownloadAction(props: Props) { const { src } = props; return ( @@ -21,4 +21,4 @@ export const ImageDownloadAction: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/common/image-toolbar/full-screen/modal.tsx b/apps/web/ee/components/common/image-toolbar/full-screen/modal.tsx index a3a6abd581..3114c6d969 100644 --- a/apps/web/ee/components/common/image-toolbar/full-screen/modal.tsx +++ b/apps/web/ee/components/common/image-toolbar/full-screen/modal.tsx @@ -19,7 +19,7 @@ type Props = { width: string; }; -const ImageFullScreenModalWithoutPortal = (props: Props) => { +function ImageFullScreenModalWithoutPortal(props: Props) { const { aspectRatio, isFullScreenEnabled, downloadSrc, src, toggleFullScreenMode, width } = props; // refs const dragStart = useRef({ x: 0, y: 0 }); @@ -277,9 +277,9 @@ const ImageFullScreenModalWithoutPortal = (props: Props) => {
    ); -}; +} -export const ImageFullScreenModal: React.FC = (props) => { +export function ImageFullScreenModal(props: Props) { let modal = ; const portal = document.querySelector("#editor-portal"); if (portal) { @@ -291,4 +291,4 @@ export const ImageFullScreenModal: React.FC = (props) => { } } return modal; -}; +} diff --git a/apps/web/ee/components/common/image-toolbar/full-screen/root.tsx b/apps/web/ee/components/common/image-toolbar/full-screen/root.tsx index 76b0b5c3b5..ade61466c4 100644 --- a/apps/web/ee/components/common/image-toolbar/full-screen/root.tsx +++ b/apps/web/ee/components/common/image-toolbar/full-screen/root.tsx @@ -16,7 +16,7 @@ type Props = { toggleToolbarViewStatus: (val: boolean) => void; }; -export const ImageFullScreenActionRoot: React.FC = (props) => { +export function ImageFullScreenActionRoot(props: Props) { const { image, toggleToolbarViewStatus } = props; // states const [isFullScreenEnabled, setIsFullScreenEnabled] = useState(false); @@ -53,4 +53,4 @@ export const ImageFullScreenActionRoot: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/common/image-toolbar/root.tsx b/apps/web/ee/components/common/image-toolbar/root.tsx index bfd1636480..622159d588 100644 --- a/apps/web/ee/components/common/image-toolbar/root.tsx +++ b/apps/web/ee/components/common/image-toolbar/root.tsx @@ -26,7 +26,7 @@ type Props = { } ); -export const ImageToolbarRoot: React.FC = (props) => { +export function ImageToolbarRoot(props: Props) { const { downloadSrc, onRemove, isFullScreenable } = props; // states const [shouldShowToolbar, setShouldShowToolbar] = useState(false); @@ -57,4 +57,4 @@ export const ImageToolbarRoot: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/common/input/title-input.tsx b/apps/web/ee/components/common/input/title-input.tsx index 44bf041aa3..a83dce2d6b 100644 --- a/apps/web/ee/components/common/input/title-input.tsx +++ b/apps/web/ee/components/common/input/title-input.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState, useEffect, useCallback, useRef } from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ export type TitleInputProps = { disabled?: boolean; }; -export const TitleInput: FC = observer((props) => { +export const TitleInput = observer(function TitleInput(props: TitleInputProps) { const { value, isSubmitting, setIsSubmitting, onSubmit, className, containerClassName, disabled } = props; // states const [title, setTitle] = useState(""); diff --git a/apps/web/ee/components/common/layout/main/common/empty-state.tsx b/apps/web/ee/components/common/layout/main/common/empty-state.tsx index 8fd31ec909..293c06061c 100644 --- a/apps/web/ee/components/common/layout/main/common/empty-state.tsx +++ b/apps/web/ee/components/common/layout/main/common/empty-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // plane imports @@ -17,7 +15,7 @@ type TSectionEmptyStateProps = { contentClassName?: string; }; -export const SectionEmptyState: FC = (props) => { +export function SectionEmptyState(props: TSectionEmptyStateProps) { const { heading, subHeading, @@ -73,4 +71,4 @@ export const SectionEmptyState: FC = (props) => { {actionElement && <>{actionElement}} ); -}; +} diff --git a/apps/web/ee/components/common/layout/main/common/section-wrapper.tsx b/apps/web/ee/components/common/layout/main/common/section-wrapper.tsx index 26f4f9f6ec..0a44a0bdb8 100644 --- a/apps/web/ee/components/common/layout/main/common/section-wrapper.tsx +++ b/apps/web/ee/components/common/layout/main/common/section-wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // utils @@ -10,7 +8,7 @@ type TSectionWrapperProps = { className?: string; }; -export const SectionWrapper: FC = (props) => { +export function SectionWrapper(props: TSectionWrapperProps) { const { children, className = "" } = props; return (
    = (props) => { {children}
    ); -}; +} diff --git a/apps/web/ee/components/common/layout/main/main-wrapper.tsx b/apps/web/ee/components/common/layout/main/main-wrapper.tsx index 32546a5ffc..7b9a33b120 100644 --- a/apps/web/ee/components/common/layout/main/main-wrapper.tsx +++ b/apps/web/ee/components/common/layout/main/main-wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // utils @@ -11,7 +9,7 @@ type TMainWrapperProps = { className?: string; }; -export const MainWrapper: FC = (props) => { +export function MainWrapper(props: TMainWrapperProps) { const { children, isSidebarOpen, className = "" } = props; return (
    = (props) => { {children}
    ); -}; +} diff --git a/apps/web/ee/components/common/layout/main/sections/collapsible-root.tsx b/apps/web/ee/components/common/layout/main/sections/collapsible-root.tsx index 607ace7096..fa6d7323fd 100644 --- a/apps/web/ee/components/common/layout/main/sections/collapsible-root.tsx +++ b/apps/web/ee/components/common/layout/main/sections/collapsible-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useMemo } from "react"; // ui @@ -16,7 +14,7 @@ type TCollapsibleDetailSectionProps = { collapsibleContent: React.ReactNode; }; -export const CollapsibleDetailSection: FC = (props) => { +export function CollapsibleDetailSection(props: TCollapsibleDetailSectionProps) { const { title, actionItemElement, collapsibleContent, isOpen, count, onToggle } = props; const collapsibleButton = useMemo( @@ -45,4 +43,4 @@ export const CollapsibleDetailSection: FC = (pro ); -}; +} diff --git a/apps/web/ee/components/common/layout/main/sections/info-root.tsx b/apps/web/ee/components/common/layout/main/sections/info-root.tsx index ecca26d52d..b57fd5aad4 100644 --- a/apps/web/ee/components/common/layout/main/sections/info-root.tsx +++ b/apps/web/ee/components/common/layout/main/sections/info-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useEffect, useState } from "react"; // plane imports @@ -32,7 +30,7 @@ type TInfoSectionProps = { issueSequenceId?: number; }; -export const InfoSection: FC = (props) => { +export function InfoSection(props: TInfoSectionProps) { const { editorRef, workspaceSlug, @@ -102,4 +100,4 @@ export const InfoSection: FC = (props) => { {actionElement &&
    {actionElement}
    } ); -}; +} diff --git a/apps/web/ee/components/common/layout/main/sections/overview-root.tsx b/apps/web/ee/components/common/layout/main/sections/overview-root.tsx index ec8dc383b4..69ab7598c6 100644 --- a/apps/web/ee/components/common/layout/main/sections/overview-root.tsx +++ b/apps/web/ee/components/common/layout/main/sections/overview-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // local components @@ -10,7 +8,7 @@ type TOverviewSectionProps = { children: React.ReactNode; }; -export const OverviewSection: FC = (props) => { +export function OverviewSection(props: TOverviewSectionProps) { const { children, title } = props; return ( @@ -20,4 +18,4 @@ export const OverviewSection: FC = (props) => { <>{children} ); -}; +} diff --git a/apps/web/ee/components/common/layout/main/sections/progress-root.tsx b/apps/web/ee/components/common/layout/main/sections/progress-root.tsx index 04721319dd..f9b1ef5e1f 100644 --- a/apps/web/ee/components/common/layout/main/sections/progress-root.tsx +++ b/apps/web/ee/components/common/layout/main/sections/progress-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { omit } from "lodash-es"; @@ -29,7 +27,7 @@ interface IProgressIndicatorData { percentage: number; } -export const ProgressSection: FC = (props) => { +export function ProgressSection(props: TProgressSectionProps) { const { data, indicatorElement } = props; const { t } = useTranslation(); @@ -81,4 +79,4 @@ export const ProgressSection: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/common/layout/root.tsx b/apps/web/ee/components/common/layout/root.tsx index 7cad32042c..00175c75d5 100644 --- a/apps/web/ee/components/common/layout/root.tsx +++ b/apps/web/ee/components/common/layout/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // utils @@ -12,11 +10,11 @@ type TLayoutRootProps = { renderEmptyState?: boolean; }; -export const LayoutRoot: FC = (props) => { +export function LayoutRoot(props: TLayoutRootProps) { const { children, className = "", renderEmptyState, emptyStateComponent } = props; return (
    {renderEmptyState ? emptyStateComponent : children}
    ); -}; +} diff --git a/apps/web/ee/components/common/layout/sidebar/content-wrapper.tsx b/apps/web/ee/components/common/layout/sidebar/content-wrapper.tsx index 6db7ce48de..9b3d53dbf0 100644 --- a/apps/web/ee/components/common/layout/sidebar/content-wrapper.tsx +++ b/apps/web/ee/components/common/layout/sidebar/content-wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, ReactNode } from "react"; type TSidebarContentWrapperProps = { @@ -8,7 +6,7 @@ type TSidebarContentWrapperProps = { actionElement?: ReactNode; }; -export const SidebarContentWrapper: FC = (props) => { +export function SidebarContentWrapper(props: TSidebarContentWrapperProps) { const { title, children, actionElement } = props; return (
    @@ -23,4 +21,4 @@ export const SidebarContentWrapper: FC = (props) =>
    ); -}; +} diff --git a/apps/web/ee/components/common/layout/sidebar/root.tsx b/apps/web/ee/components/common/layout/sidebar/root.tsx index 48ecfa449c..25f5884742 100644 --- a/apps/web/ee/components/common/layout/sidebar/root.tsx +++ b/apps/web/ee/components/common/layout/sidebar/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import type { LucideProps } from "lucide-react"; @@ -24,7 +22,7 @@ type TSidebarRootProps = { defaultTab: string; }; -export const SidebarRoot: FC = (props) => { +export function SidebarRoot(props: TSidebarRootProps) { const { isSidebarOpen, tabs, storageKey, defaultTab } = props; return ( @@ -38,4 +36,4 @@ export const SidebarRoot: FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/common/layout/sidebar/sidebar-wrapper.tsx b/apps/web/ee/components/common/layout/sidebar/sidebar-wrapper.tsx index a887d9cd1a..d23b821133 100644 --- a/apps/web/ee/components/common/layout/sidebar/sidebar-wrapper.tsx +++ b/apps/web/ee/components/common/layout/sidebar/sidebar-wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // utils @@ -10,7 +8,7 @@ type TSidebarWrapperProps = { isSidebarOpen: boolean; }; -export const SidebarWrapper: FC = (props) => { +export function SidebarWrapper(props: TSidebarWrapperProps) { const { children, isSidebarOpen } = props; return (
    = (props) => { {children}
    ); -}; +} diff --git a/apps/web/ee/components/common/modal/upload-app-image.tsx b/apps/web/ee/components/common/modal/upload-app-image.tsx index 0eb14e899b..3485bf33b1 100644 --- a/apps/web/ee/components/common/modal/upload-app-image.tsx +++ b/apps/web/ee/components/common/modal/upload-app-image.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { useDropzone } from "react-dropzone"; @@ -28,7 +26,7 @@ type Props = { entityType: EFileAssetType; }; -export const AppImageUploadModal: React.FC = observer((props) => { +export const AppImageUploadModal = observer(function AppImageUploadModal(props: Props) { const { isOpen, onClose, onSuccess, initialValue, handleRemove, entityType } = props; // states const [image, setImage] = useState(null); diff --git a/apps/web/ee/components/common/pagination-bar.tsx b/apps/web/ee/components/common/pagination-bar.tsx index f24f3af674..0042c66639 100644 --- a/apps/web/ee/components/common/pagination-bar.tsx +++ b/apps/web/ee/components/common/pagination-bar.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Button } from "@plane/propel/button"; // plane web types @@ -12,7 +10,7 @@ type TPaginationBar = { onNextClick: () => void; }; -export const PaginationBar: FC = (props) => { +export function PaginationBar(props: TPaginationBar) { const { perPage, paginationInfo, onPrevClick, onNextClick } = props; // derived values @@ -37,4 +35,4 @@ export const PaginationBar: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/common/quick-actions-factory.tsx b/apps/web/ee/components/common/quick-actions-factory.tsx index 744a525b32..e12359c895 100644 --- a/apps/web/ee/components/common/quick-actions-factory.tsx +++ b/apps/web/ee/components/common/quick-actions-factory.tsx @@ -112,7 +112,7 @@ export const useQuickActionsFactory = () => { const [isOpen, setIsOpen] = useState(false); const { getFilter } = useWorkItemFilters(); const richFilters = getFilter(EIssuesStoreType.CYCLE, props.cycleId)?.getExternalExpression(); - // eslint-disable-next-line @typescript-eslint/no-unused-vars + const { issuesFilter: _issuesFilter } = useIssues(EIssuesStoreType.CYCLE); const isEnabled = useFlag(props.workspaceSlug, E_FEATURE_FLAGS.ADVANCED_EXPORTS); diff --git a/apps/web/ee/components/common/subscription/subscription-button.tsx b/apps/web/ee/components/common/subscription/subscription-button.tsx index 6ce9190591..7c809bfd91 100644 --- a/apps/web/ee/components/common/subscription/subscription-button.tsx +++ b/apps/web/ee/components/common/subscription/subscription-button.tsx @@ -13,7 +13,7 @@ type TProps = { showTooltip?: boolean; }; -export const SubscriptionButton = (props: TProps) => { +export function SubscriptionButton(props: TProps) { const { subscriptionType, handleClick, children, className, tooltipContent, showTooltip = false } = props; // derived values const subscriptionColor = @@ -36,4 +36,4 @@ export const SubscriptionButton = (props: TProps) => { ); -}; +} diff --git a/apps/web/ee/components/common/subscription/subscription-pill.tsx b/apps/web/ee/components/common/subscription/subscription-pill.tsx index 86c5b39753..d3b741b1c5 100644 --- a/apps/web/ee/components/common/subscription/subscription-pill.tsx +++ b/apps/web/ee/components/common/subscription/subscription-pill.tsx @@ -10,7 +10,7 @@ import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; // In case workspace is not passed, we will use the current workspace's subscription detail from the store type TProps = { workspace?: IWorkspace }; -export const SubscriptionPill = observer((props: TProps) => { +export const SubscriptionPill = observer(function SubscriptionPill(props: TProps) { const { workspace } = props; //hooks const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail, getIsInTrialPeriod } = useWorkspaceSubscription(); diff --git a/apps/web/ee/components/customers/actions/delete-modal.tsx b/apps/web/ee/components/customers/actions/delete-modal.tsx index 95572b6255..c5402a65a1 100644 --- a/apps/web/ee/components/customers/actions/delete-modal.tsx +++ b/apps/web/ee/components/customers/actions/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ type Props = { handleClose: () => void; }; -export const DeleteCustomerModal: React.FC = observer((props) => { +export const DeleteCustomerModal = observer(function DeleteCustomerModal(props: Props) { const { isModalOpen, customerId, handleClose } = props; // i18n const { t } = useTranslation(); // router diff --git a/apps/web/ee/components/customers/actions/quick-actions.tsx b/apps/web/ee/components/customers/actions/quick-actions.tsx index 3cf99c03ff..5f54417468 100644 --- a/apps/web/ee/components/customers/actions/quick-actions.tsx +++ b/apps/web/ee/components/customers/actions/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { Link2, Pencil, Trash2 } from "lucide-react"; @@ -25,7 +23,7 @@ type Props = { customClassName?: string; }; -export const CustomerQuickActions: React.FC = observer((props) => { +export const CustomerQuickActions = observer(function CustomerQuickActions(props: Props) { const { customerId, workspaceSlug, parentRef, customClassName } = props; // states const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); diff --git a/apps/web/ee/components/customers/actions/request-delete-modal.tsx b/apps/web/ee/components/customers/actions/request-delete-modal.tsx index f6f9aa9674..ba7acd1736 100644 --- a/apps/web/ee/components/customers/actions/request-delete-modal.tsx +++ b/apps/web/ee/components/customers/actions/request-delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -20,7 +18,7 @@ type Props = { workItemId?: string; }; -export const DeleteCustomerRequestsModal: React.FC = observer((props) => { +export const DeleteCustomerRequestsModal = observer(function DeleteCustomerRequestsModal(props: Props) { const { isModalOpen, customerId, requestId, handleClose, workItemId } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/customers/actions/requests-quick-actions.tsx b/apps/web/ee/components/customers/actions/requests-quick-actions.tsx index a986a14a54..8154ccbc77 100644 --- a/apps/web/ee/components/customers/actions/requests-quick-actions.tsx +++ b/apps/web/ee/components/customers/actions/requests-quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Link2, Pencil, Trash2 } from "lucide-react"; // plane imports @@ -24,7 +22,7 @@ type Props = { workItemId?: string; }; -export const CustomerRequestQuickActions: React.FC = observer((props) => { +export const CustomerRequestQuickActions = observer(function CustomerRequestQuickActions(props: Props) { const { customerId, handleEdit, parentRef, requestId, workspaceSlug, workItemId } = props; // i18n const { t } = useTranslation(); diff --git a/apps/web/ee/components/customers/additiona-properties/create.tsx b/apps/web/ee/components/customers/additiona-properties/create.tsx index b4a61c0186..dc75d7872f 100644 --- a/apps/web/ee/components/customers/additiona-properties/create.tsx +++ b/apps/web/ee/components/customers/additiona-properties/create.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -19,55 +17,55 @@ type TCustomerAdditionalPropertyValuesCreateProps = { const customerPropertyValueService = new CustomerPropertyValueService(); -export const CustomerAdditionalPropertyValuesCreate: React.FC = observer( - (props) => { - const { workspaceSlug, customerId } = props; - // states - const [customerPropertyValues, setCustomerPropertyValues] = React.useState({}); - // store hooks - const { - customerPropertyValues: customerPropertyDefaultValues, - customerPropertyValueErrors, - setCustomerPropertyValues: handleCustomerPropertyValueUpdate, - } = useCustomerModal(); - const { activeProperties } = useCustomerProperties(); - // fetch customer property values - const { data, isLoading } = useSWR( - workspaceSlug && customerId ? `CUSTOMER_PROPERTY_VALUES_${workspaceSlug}` : null, - () => (workspaceSlug && customerId ? customerPropertyValueService.list(workspaceSlug, customerId) : null), - {} - ); +export const CustomerAdditionalPropertyValuesCreate = observer(function CustomerAdditionalPropertyValuesCreate( + props: TCustomerAdditionalPropertyValuesCreateProps +) { + const { workspaceSlug, customerId } = props; + // states + const [customerPropertyValues, setCustomerPropertyValues] = React.useState({}); + // store hooks + const { + customerPropertyValues: customerPropertyDefaultValues, + customerPropertyValueErrors, + setCustomerPropertyValues: handleCustomerPropertyValueUpdate, + } = useCustomerModal(); + const { activeProperties } = useCustomerProperties(); + // fetch customer property values + const { data, isLoading } = useSWR( + workspaceSlug && customerId ? `CUSTOMER_PROPERTY_VALUES_${workspaceSlug}` : null, + () => (workspaceSlug && customerId ? customerPropertyValueService.list(workspaceSlug, customerId) : null), + {} + ); - useEffect(() => { - if (data) setCustomerPropertyValues(data); - }, [data]); + useEffect(() => { + if (data) setCustomerPropertyValues(data); + }, [data]); - useEffect(() => { - if (activeProperties?.length) { - handleCustomerPropertyValueUpdate({ - ...getPropertiesDefaultValues(activeProperties), - ...customerPropertyValues, - }); - } - }, [activeProperties, handleCustomerPropertyValueUpdate, customerPropertyValues]); + useEffect(() => { + if (activeProperties?.length) { + handleCustomerPropertyValueUpdate({ + ...getPropertiesDefaultValues(activeProperties), + ...customerPropertyValues, + }); + } + }, [activeProperties, handleCustomerPropertyValueUpdate, customerPropertyValues]); - const handlePropertyValueChange = (propertyId: string, value: string[]) => { - handleCustomerPropertyValueUpdate((prev) => ({ - ...prev, - [propertyId]: value, - })); - }; + const handlePropertyValueChange = (propertyId: string, value: string[]) => { + handleCustomerPropertyValueUpdate((prev) => ({ + ...prev, + [propertyId]: value, + })); + }; - if (!activeProperties?.length) return null; + if (!activeProperties?.length) return null; - return ( - - ); - } -); + return ( + + ); +}); diff --git a/apps/web/ee/components/customers/additiona-properties/property-value-select.tsx b/apps/web/ee/components/customers/additiona-properties/property-value-select.tsx index 1d59acfed4..1506abd3e8 100644 --- a/apps/web/ee/components/customers/additiona-properties/property-value-select.tsx +++ b/apps/web/ee/components/customers/additiona-properties/property-value-select.tsx @@ -35,7 +35,7 @@ type TPropertyValueSelectProps = { getPropertyInstanceById: (customPropertyId: string) => IIssueProperty | undefined; }; -export const PropertyValueSelect = observer((props: TPropertyValueSelectProps) => { +export const PropertyValueSelect = observer(function PropertyValueSelect(props: TPropertyValueSelectProps) { const { propertyDetail, propertyValue, @@ -47,25 +47,27 @@ export const PropertyValueSelect = observer((props: TPropertyValueSelectProps) = isDisabled, } = props; - const CustomerPropertyDetail = () => ( - <> - - - {propertyDetail?.display_name} - {propertyDetail?.is_required && *} - {propertyDetail.description && ( - - - - )} + function CustomerPropertyDetail() { + return ( + <> + + + {propertyDetail?.display_name} + {propertyDetail?.is_required && *} + {propertyDetail.description && ( + + + + )} + - - - ); + + ); + } const CUSTOMER_PROPERTY_ATTRIBUTE_DETAILS: Partial> = { TEXT: ( diff --git a/apps/web/ee/components/customers/additiona-properties/root.tsx b/apps/web/ee/components/customers/additiona-properties/root.tsx index 8e9a13b68c..cc09468d9e 100644 --- a/apps/web/ee/components/customers/additiona-properties/root.tsx +++ b/apps/web/ee/components/customers/additiona-properties/root.tsx @@ -16,7 +16,9 @@ type TIssueAdditionalPropertyValuesProps = { handlePropertyValueChange: (propertyId: string, value: string[]) => void; }; -export const CustomerAdditionalPropertyValues: React.FC = observer((props) => { +export const CustomerAdditionalPropertyValues = observer(function CustomerAdditionalPropertyValues( + props: TIssueAdditionalPropertyValuesProps +) { const { customerPropertyValues, customerPropertyValueErrors, diff --git a/apps/web/ee/components/customers/additiona-properties/update.tsx b/apps/web/ee/components/customers/additiona-properties/update.tsx index 8202f5cc01..46105173ea 100644 --- a/apps/web/ee/components/customers/additiona-properties/update.tsx +++ b/apps/web/ee/components/customers/additiona-properties/update.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -20,79 +18,75 @@ type TCustomerAdditionalPropertyValuesUpdateProps = { const customerPropertyValuesService = new CustomerPropertyValueService(); -export const CustomerAdditionalPropertyValuesUpdate: React.FC = observer( - (props) => { - const { workspaceSlug, isDisabled, customerId } = props; - // states - const [issuePropertyValues, setIssuePropertyValues] = React.useState({}); - // store hooks - const { - loader: propertiesLoader, - fetchAllCustomerPropertiesAndOptions, - activeProperties, - } = useCustomerProperties(); - // fetch methods - async function fetchCustomerPropertyValues() { - // This is required when accessing the peek overview from workspace level. - await fetchAllCustomerPropertiesAndOptions(workspaceSlug); - return customerPropertyValuesService.list(workspaceSlug, customerId); +export const CustomerAdditionalPropertyValuesUpdate = observer(function CustomerAdditionalPropertyValuesUpdate( + props: TCustomerAdditionalPropertyValuesUpdateProps +) { + const { workspaceSlug, isDisabled, customerId } = props; + // states + const [issuePropertyValues, setIssuePropertyValues] = React.useState({}); + // store hooks + const { loader: propertiesLoader, fetchAllCustomerPropertiesAndOptions, activeProperties } = useCustomerProperties(); + // fetch methods + async function fetchCustomerPropertyValues() { + // This is required when accessing the peek overview from workspace level. + await fetchAllCustomerPropertiesAndOptions(workspaceSlug); + return customerPropertyValuesService.list(workspaceSlug, customerId); + } + // fetch issue property values + const { data, isLoading } = useSWR( + workspaceSlug ? `ISSUE_PROPERTY_VALUES_${workspaceSlug}` : null, + () => (workspaceSlug ? fetchCustomerPropertyValues() : null), + { + revalidateOnFocus: false, } - // fetch issue property values - const { data, isLoading } = useSWR( - workspaceSlug ? `ISSUE_PROPERTY_VALUES_${workspaceSlug}` : null, - () => (workspaceSlug ? fetchCustomerPropertyValues() : null), - { - revalidateOnFocus: false, - } - ); + ); - useEffect(() => { - if (data) setIssuePropertyValues(data); - }, [data]); + useEffect(() => { + if (data) setIssuePropertyValues(data); + }, [data]); - const handlePropertyValueChange = async (propertyId: string, value: string[]) => { - const beforeUpdateValue = issuePropertyValues[propertyId]; + const handlePropertyValueChange = async (propertyId: string, value: string[]) => { + const beforeUpdateValue = issuePropertyValues[propertyId]; + setIssuePropertyValues((prev) => ({ + ...prev, + [propertyId]: value, + })); + // update the property value + await customerPropertyValuesService.update(workspaceSlug, customerId, propertyId, value).catch((error) => { + // revert the value if update fails setIssuePropertyValues((prev) => ({ ...prev, - [propertyId]: value, + [propertyId]: beforeUpdateValue, })); - // update the property value - await customerPropertyValuesService.update(workspaceSlug, customerId, propertyId, value).catch((error) => { - // revert the value if update fails - setIssuePropertyValues((prev) => ({ - ...prev, - [propertyId]: beforeUpdateValue, - })); - setToast({ - type: TOAST_TYPE.ERROR, - title: "Error!", - message: error?.error ?? "Property could not be update. Please try again.", - }); + setToast({ + type: TOAST_TYPE.ERROR, + title: "Error!", + message: error?.error ?? "Property could not be update. Please try again.", }); - }; - - if (propertiesLoader) { - return ( - - - - - - - ); - } - - // if issue type details or active properties are not available, return null - if (!activeProperties?.length) return null; + }); + }; + if (propertiesLoader) { return ( - + + + + + + ); } -); + + // if issue type details or active properties are not available, return null + if (!activeProperties?.length) return null; + + return ( + + ); +}); diff --git a/apps/web/ee/components/customers/customer-modal/additional-properties.tsx b/apps/web/ee/components/customers/customer-modal/additional-properties.tsx index e3d4379852..015fb8c02b 100644 --- a/apps/web/ee/components/customers/customer-modal/additional-properties.tsx +++ b/apps/web/ee/components/customers/customer-modal/additional-properties.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect } from "react"; import { observer } from "mobx-react"; // ui @@ -15,7 +13,9 @@ type TCustomerAdditionalPropertiesProps = { workspaceSlug: string; }; -export const CustomerAdditionalProperties: React.FC = observer((props) => { +export const CustomerAdditionalProperties = observer(function CustomerAdditionalProperties( + props: TCustomerAdditionalPropertiesProps +) { const { workspaceSlug, customerId } = props; // store hooks const { customerPropertyValues, setCustomerPropertyValues } = useCustomerModal(); diff --git a/apps/web/ee/components/customers/customer-modal/customer-create-toast-actions.tsx b/apps/web/ee/components/customers/customer-modal/customer-create-toast-actions.tsx index 4a8d6b090f..787d7dca8e 100644 --- a/apps/web/ee/components/customers/customer-modal/customer-create-toast-actions.tsx +++ b/apps/web/ee/components/customers/customer-modal/customer-create-toast-actions.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useState } from "react"; import { observer } from "mobx-react"; @@ -11,7 +10,9 @@ type TCreateCustomerCreateToastActions = { customerId: string; }; -export const CreateCustomerCreateToastActions: FC = observer((props) => { +export const CreateCustomerCreateToastActions = observer(function CreateCustomerCreateToastActions( + props: TCreateCustomerCreateToastActions +) { const { workspaceSlug, customerId } = props; // state const [copied, setCopied] = useState(false); diff --git a/apps/web/ee/components/customers/customer-modal/default-properties.tsx b/apps/web/ee/components/customers/customer-modal/default-properties.tsx index 5a41c1fe73..832b060cb6 100644 --- a/apps/web/ee/components/customers/customer-modal/default-properties.tsx +++ b/apps/web/ee/components/customers/customer-modal/default-properties.tsx @@ -38,7 +38,7 @@ type Props = { onAssetUpload?: (assetId: string) => void; }; -export const DefaultProperties: FC = (props) => { +export function DefaultProperties(props: Props) { const { workspaceSlug, submitBtnRef, customerId, onAssetUpload } = props; //states const [logo, setLogo] = useState(null); @@ -457,4 +457,4 @@ export const DefaultProperties: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/customers/customer-modal/form.tsx b/apps/web/ee/components/customers/customer-modal/form.tsx index 71ef161122..c1ef9b18cc 100644 --- a/apps/web/ee/components/customers/customer-modal/form.tsx +++ b/apps/web/ee/components/customers/customer-modal/form.tsx @@ -37,7 +37,7 @@ type TCustomerForms = { handleModalClose: () => void; }; -export const CustomerForm: FC = (props) => { +export function CustomerForm(props: TCustomerForms) { const { data, handleModalClose } = props; // params const { workspaceSlug } = useParams(); @@ -241,4 +241,4 @@ export const CustomerForm: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/customers/customer-modal/modal.tsx b/apps/web/ee/components/customers/customer-modal/modal.tsx index 768ed4e0e3..68f1973388 100644 --- a/apps/web/ee/components/customers/customer-modal/modal.tsx +++ b/apps/web/ee/components/customers/customer-modal/modal.tsx @@ -13,7 +13,7 @@ type Props = { customerId?: string; onClose: () => void; }; -export const CreateUpdateCustomerModal: FC = observer((props) => { +export const CreateUpdateCustomerModal = observer(function CreateUpdateCustomerModal(props: Props) { const { isOpen, customerId, onClose } = props; // hooks const { getCustomerById } = useCustomers(); diff --git a/apps/web/ee/components/customers/customer-modal/provider.tsx b/apps/web/ee/components/customers/customer-modal/provider.tsx index 9687bb62b7..1bd8f217cb 100644 --- a/apps/web/ee/components/customers/customer-modal/provider.tsx +++ b/apps/web/ee/components/customers/customer-modal/provider.tsx @@ -17,7 +17,7 @@ type TCustomerModalProviderProps = { const customerPropertiesValueService = new CustomerPropertyValueService(); -export const CustomerModalProvider = observer((props: TCustomerModalProviderProps) => { +export const CustomerModalProvider = observer(function CustomerModalProvider(props: TCustomerModalProviderProps) { const { children } = props; // states const [customerPropertyValues, setCustomerPropertyValues] = useState({}); diff --git a/apps/web/ee/components/customers/detail/default-properties.tsx b/apps/web/ee/components/customers/detail/default-properties.tsx index ae5c542f95..6743fb1500 100644 --- a/apps/web/ee/components/customers/detail/default-properties.tsx +++ b/apps/web/ee/components/customers/detail/default-properties.tsx @@ -22,7 +22,7 @@ type TProps = { isDisabled?: boolean; }; -export const CustomerDefaultSidebarProperties: FC = (props) => { +export function CustomerDefaultSidebarProperties(props: TProps) { const { updateProperty, customer, isDisabled = false } = props; // i18n const { t } = useTranslation(); @@ -179,7 +179,7 @@ export const CustomerDefaultSidebarProperties: FC = (props) => { )} ); -}; +} type TPropertyFiledProps = { value: string | number | undefined; @@ -189,7 +189,8 @@ type TPropertyFiledProps = { placeholder?: string; disabled?: boolean; }; -const PropertyField: FC = (props) => { + +function PropertyField(props: TPropertyFiledProps) { const { value, type = "text", updateProperty, rules, placeholder, disabled = false } = props; const { control, @@ -240,4 +241,4 @@ const PropertyField: FC = (props) => { )} /> ); -}; +} diff --git a/apps/web/ee/components/customers/detail/empty-state.tsx b/apps/web/ee/components/customers/detail/empty-state.tsx index f322b46d51..f3fe30b631 100644 --- a/apps/web/ee/components/customers/detail/empty-state.tsx +++ b/apps/web/ee/components/customers/detail/empty-state.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useTheme } from "next-themes"; // plane imports @@ -17,7 +16,7 @@ type TProps = { workspaceSlug: string; }; -export const CustomerEmptyState: FC = (props) => { +export function CustomerEmptyState(props: TProps) { const { workspaceSlug } = props; // i18n const { t } = useTranslation(); @@ -42,4 +41,4 @@ export const CustomerEmptyState: FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/customers/detail/header.tsx b/apps/web/ee/components/customers/detail/header.tsx index 45eb3c61d0..f07d70f212 100644 --- a/apps/web/ee/components/customers/detail/header.tsx +++ b/apps/web/ee/components/customers/detail/header.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useRef } from "react"; import { observer } from "mobx-react"; @@ -19,7 +18,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; import { CustomerQuickActions } from "@/plane-web/components/customers/actions"; import { useCustomers } from "@/plane-web/hooks/store"; -export const CustomerDetailHeader: FC = observer(() => { +export const CustomerDetailHeader = observer(function CustomerDetailHeader() { const { workspaceSlug, customerId } = useParams(); const router = useAppRouter(); // hooks diff --git a/apps/web/ee/components/customers/detail/logo-input.tsx b/apps/web/ee/components/customers/detail/logo-input.tsx index c0676aa421..151cb62267 100644 --- a/apps/web/ee/components/customers/detail/logo-input.tsx +++ b/apps/web/ee/components/customers/detail/logo-input.tsx @@ -15,7 +15,7 @@ type TProps = { logo: File | null; }; -export const CustomerLogoInput: FC = observer((props) => { +export const CustomerLogoInput = observer(function CustomerLogoInput(props: TProps) { const { handleOpenLogoInput, onLogoUpload, logo_url, logo, logoInputRef } = props; return (
    = observer((props) => { +export const CustomerMainRoot = observer(function CustomerMainRoot(props: TProps) { const { customerId, workspaceSlug, isEditable = false } = props; // states const [isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved"); diff --git a/apps/web/ee/components/customers/detail/root.tsx b/apps/web/ee/components/customers/detail/root.tsx index 7daf3997ac..63a88820b7 100644 --- a/apps/web/ee/components/customers/detail/root.tsx +++ b/apps/web/ee/components/customers/detail/root.tsx @@ -14,7 +14,7 @@ import { LayoutRoot } from "@/plane-web/components/common/layout"; import { CustomerDetailSidebar, CustomerEmptyState, CustomerMainRoot } from "@/plane-web/components/customers"; import { useCustomers } from "@/plane-web/hooks/store"; -export const CustomerDetailRoot: FC = observer(() => { +export const CustomerDetailRoot = observer(function CustomerDetailRoot() { const { workspaceSlug, customerId } = useParams(); // hooks diff --git a/apps/web/ee/components/customers/detail/sidebar.tsx b/apps/web/ee/components/customers/detail/sidebar.tsx index bbf8c31ef0..5a7ac6c8a0 100644 --- a/apps/web/ee/components/customers/detail/sidebar.tsx +++ b/apps/web/ee/components/customers/detail/sidebar.tsx @@ -20,7 +20,7 @@ type TProps = { isDisabled: boolean; }; -export const CustomerDetailSidebar: FC = observer((props) => { +export const CustomerDetailSidebar = observer(function CustomerDetailSidebar(props: TProps) { const { customerId, workspaceSlug, isDisabled } = props; // hooks diff --git a/apps/web/ee/components/customers/dropdowns/contract-status.tsx b/apps/web/ee/components/customers/dropdowns/contract-status.tsx index 3629ceb2ac..89c2649eb5 100644 --- a/apps/web/ee/components/customers/dropdowns/contract-status.tsx +++ b/apps/web/ee/components/customers/dropdowns/contract-status.tsx @@ -16,7 +16,7 @@ type TProps = { disabled: boolean; }; -export const ContractStatusDropDown: FC = (props) => { +export function ContractStatusDropDown(props: TProps) { const { value, onChange, maxHeight, tabIndex, buttonClassName, chevronClassName, className, disabled } = props; const { t } = useTranslation(); @@ -61,4 +61,4 @@ export const ContractStatusDropDown: FC = (props) => { disabled={disabled} /> ); -}; +} diff --git a/apps/web/ee/components/customers/dropdowns/stage.tsx b/apps/web/ee/components/customers/dropdowns/stage.tsx index e6da62520a..8ed08ca45a 100644 --- a/apps/web/ee/components/customers/dropdowns/stage.tsx +++ b/apps/web/ee/components/customers/dropdowns/stage.tsx @@ -16,7 +16,7 @@ type TProps = { disabled: boolean; }; -export const StageDropDown: FC = (props) => { +export function StageDropDown(props: TProps) { const { value, onChange, maxHeight, tabIndex, buttonClassName, chevronClassName, className, disabled } = props; const { t } = useTranslation(); @@ -61,4 +61,4 @@ export const StageDropDown: FC = (props) => { disabled={disabled} /> ); -}; +} diff --git a/apps/web/ee/components/customers/list/header.tsx b/apps/web/ee/components/customers/list/header.tsx index e430977700..2d4c569206 100644 --- a/apps/web/ee/components/customers/list/header.tsx +++ b/apps/web/ee/components/customers/list/header.tsx @@ -1,4 +1,3 @@ -"use client"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // plane imports @@ -17,7 +16,7 @@ import { useUserPermissions } from "@/hooks/store/user"; // plane web components import { CustomerSearch } from "@/plane-web/components/customers/list"; -export const CustomersListHeader = observer(() => { +export const CustomersListHeader = observer(function CustomersListHeader() { const { workspaceSlug } = useParams(); // i18n const { t } = useTranslation(); diff --git a/apps/web/ee/components/customers/list/list-item.tsx b/apps/web/ee/components/customers/list/list-item.tsx index a7d37c212f..efdab6c8b2 100644 --- a/apps/web/ee/components/customers/list/list-item.tsx +++ b/apps/web/ee/components/customers/list/list-item.tsx @@ -18,7 +18,7 @@ type TCustomerListItemProps = { workspaceSlug: string; }; -export const CustomerListItem: FC = observer((props) => { +export const CustomerListItem = observer(function CustomerListItem(props: TCustomerListItemProps) { const { customerId, workspaceSlug } = props; // refs const parentRef = useRef(null); diff --git a/apps/web/ee/components/customers/list/loader.tsx b/apps/web/ee/components/customers/list/loader.tsx index f133f074e3..6828e407b0 100644 --- a/apps/web/ee/components/customers/list/loader.tsx +++ b/apps/web/ee/components/customers/list/loader.tsx @@ -2,35 +2,37 @@ import React from "react"; import { range } from "lodash-es"; import { Loader } from "@plane/ui"; -export const CustomerLoader = () => ( - -
    -
    - {range(5).map((i) => ( -
    -
    -
    -
    - -
    - - +export function CustomerLoader() { + return ( + +
    +
    + {range(5).map((i) => ( +
    +
    +
    +
    + +
    + + +
    +
    - -
    -
    -
    - +
    +
    + +
    -
    - ))} + ))} +
    -
    - -); + + ); +} diff --git a/apps/web/ee/components/customers/list/root.tsx b/apps/web/ee/components/customers/list/root.tsx index 2c75065154..bbabd62af8 100644 --- a/apps/web/ee/components/customers/list/root.tsx +++ b/apps/web/ee/components/customers/list/root.tsx @@ -23,7 +23,7 @@ import { useUserPermissions } from "@/hooks/store/user"; import { CustomerListItem, CustomerLoader } from "@/plane-web/components/customers/list"; import { useCustomers } from "@/plane-web/hooks/store"; -export const CustomersListRoot: FC = observer(() => { +export const CustomersListRoot = observer(function CustomersListRoot() { const { workspaceSlug } = useParams(); const { resolvedTheme } = useTheme(); // i18n diff --git a/apps/web/ee/components/customers/list/search.tsx b/apps/web/ee/components/customers/list/search.tsx index 610cc8de61..944fb95ccf 100644 --- a/apps/web/ee/components/customers/list/search.tsx +++ b/apps/web/ee/components/customers/list/search.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -15,7 +13,7 @@ import { cn } from "@plane/utils"; import useDebounce from "@/hooks/use-debounce"; import { useCustomers } from "@/plane-web/hooks/store"; -export const CustomerSearch: FC = observer(() => { +export const CustomerSearch = observer(function CustomerSearch() { // params const { workspaceSlug } = useParams(); // i18n diff --git a/apps/web/ee/components/customers/requests/attachments/add-attachment-btn.tsx b/apps/web/ee/components/customers/requests/attachments/add-attachment-btn.tsx index 6c27dfafe3..ecbdd59df9 100644 --- a/apps/web/ee/components/customers/requests/attachments/add-attachment-btn.tsx +++ b/apps/web/ee/components/customers/requests/attachments/add-attachment-btn.tsx @@ -17,7 +17,7 @@ type TProps = { children: ReactNode; }; -export const AddAttachmentButton: FC = (props) => { +export function AddAttachmentButton(props: TProps) { const { requestId, workspaceSlug, customerId, disabled, children } = props; // i18n const { t } = useTranslation(); @@ -70,4 +70,4 @@ export const AddAttachmentButton: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/customers/requests/attachments/attachment-collapsible.tsx b/apps/web/ee/components/customers/requests/attachments/attachment-collapsible.tsx index e3d76f51c3..98fedd4586 100644 --- a/apps/web/ee/components/customers/requests/attachments/attachment-collapsible.tsx +++ b/apps/web/ee/components/customers/requests/attachments/attachment-collapsible.tsx @@ -12,7 +12,7 @@ type TProps = { isEditable?: boolean; }; -export const RequestAttachmentsCollapsible: FC = observer((props) => { +export const RequestAttachmentsCollapsible = observer(function RequestAttachmentsCollapsible(props: TProps) { const { workspaceSlug, requestId, customerId, isEditable } = props; // states const [isOpen, setOpen] = useState(false); diff --git a/apps/web/ee/components/customers/requests/attachments/attachment-item.tsx b/apps/web/ee/components/customers/requests/attachments/attachment-item.tsx index 9857a01381..de3edc0536 100644 --- a/apps/web/ee/components/customers/requests/attachments/attachment-item.tsx +++ b/apps/web/ee/components/customers/requests/attachments/attachment-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Trash } from "lucide-react"; @@ -22,7 +20,9 @@ type TRequestAttachmentsListItem = { disabled?: boolean; }; -export const RequestAttachmentsListItem: FC = observer((props) => { +export const RequestAttachmentsListItem = observer(function RequestAttachmentsListItem( + props: TRequestAttachmentsListItem +) { const { t } = useTranslation(); // props const { attachmentId, disabled } = props; diff --git a/apps/web/ee/components/customers/requests/attachments/attachment-list.tsx b/apps/web/ee/components/customers/requests/attachments/attachment-list.tsx index 9922fc20d5..57fc6cd6a5 100644 --- a/apps/web/ee/components/customers/requests/attachments/attachment-list.tsx +++ b/apps/web/ee/components/customers/requests/attachments/attachment-list.tsx @@ -26,7 +26,7 @@ type TIssueAttachmentItemList = { isCollapsible?: boolean; }; -export const RequestAttachmentsList: FC = observer((props) => { +export const RequestAttachmentsList = observer(function RequestAttachmentsList(props: TIssueAttachmentItemList) { const { workspaceSlug, requestId, customerId, disabled, isCollapsible } = props; const { t } = useTranslation(); // states diff --git a/apps/web/ee/components/customers/requests/attachments/collapsible-title.tsx b/apps/web/ee/components/customers/requests/attachments/collapsible-title.tsx index 88779f8a78..46684f395a 100644 --- a/apps/web/ee/components/customers/requests/attachments/collapsible-title.tsx +++ b/apps/web/ee/components/customers/requests/attachments/collapsible-title.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { disabled?: boolean; }; -export const RequestAttachmentCollapsibleTitle: FC = observer((props) => { +export const RequestAttachmentCollapsibleTitle = observer(function RequestAttachmentCollapsibleTitle(props: Props) { const { workspaceSlug, requestId, isOpen, customerId, disabled = true } = props; // store hooks const { getRequestById } = useCustomers(); diff --git a/apps/web/ee/components/customers/requests/attachments/content.tsx b/apps/web/ee/components/customers/requests/attachments/content.tsx index d7e1f342b2..1ba19d786e 100644 --- a/apps/web/ee/components/customers/requests/attachments/content.tsx +++ b/apps/web/ee/components/customers/requests/attachments/content.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -11,7 +10,9 @@ type Props = { disabled: boolean; }; -export const RequestAttachmentsCollapsibleContent: FC = observer((props) => { +export const RequestAttachmentsCollapsibleContent = observer(function RequestAttachmentsCollapsibleContent( + props: Props +) { const { workspaceSlug, requestId, disabled, customerId } = props; return ( = observer((props) => { +export const RequestAttachmentDeleteModal = observer(function RequestAttachmentDeleteModal(props: Props) { const { t } = useTranslation(); const { isOpen, onClose, attachmentId, attachmentOperations } = props; // states diff --git a/apps/web/ee/components/customers/requests/attachments/helper.tsx b/apps/web/ee/components/customers/requests/attachments/helper.tsx index 41703baf8b..3ad517b979 100644 --- a/apps/web/ee/components/customers/requests/attachments/helper.tsx +++ b/apps/web/ee/components/customers/requests/attachments/helper.tsx @@ -1,4 +1,3 @@ -"use client"; import { useMemo } from "react"; // plane ui import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants"; diff --git a/apps/web/ee/components/customers/requests/attachments/upload-item.tsx b/apps/web/ee/components/customers/requests/attachments/upload-item.tsx index 87e0eaac53..c9c1139d1d 100644 --- a/apps/web/ee/components/customers/requests/attachments/upload-item.tsx +++ b/apps/web/ee/components/customers/requests/attachments/upload-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { Tooltip } from "@plane/propel/tooltip"; @@ -17,7 +15,7 @@ type Props = { uploadStatus: TAttachmentUploadStatus; }; -export const RequestAttachmentsUploadItem: React.FC = observer((props) => { +export const RequestAttachmentsUploadItem = observer(function RequestAttachmentsUploadItem(props: Props) { // props const { uploadStatus } = props; // derived values diff --git a/apps/web/ee/components/customers/requests/create-update-source-modal.tsx b/apps/web/ee/components/customers/requests/create-update-source-modal.tsx index 0442656614..a6331e0563 100644 --- a/apps/web/ee/components/customers/requests/create-update-source-modal.tsx +++ b/apps/web/ee/components/customers/requests/create-update-source-modal.tsx @@ -25,7 +25,7 @@ const defaultValues = { url: "", }; -export const SourceCreateUpdateModal: FC = observer((props) => { +export const SourceCreateUpdateModal = observer(function SourceCreateUpdateModal(props: TProps) { // props const { setLinkData, preloadedData, id } = props; // i18n diff --git a/apps/web/ee/components/customers/requests/customer-dropdown.tsx b/apps/web/ee/components/customers/requests/customer-dropdown.tsx index d262438d2d..3a8743ecc3 100644 --- a/apps/web/ee/components/customers/requests/customer-dropdown.tsx +++ b/apps/web/ee/components/customers/requests/customer-dropdown.tsx @@ -20,7 +20,7 @@ type TProps = { multiple?: boolean; }; -export const CustomerDropDown: FC = observer((props) => { +export const CustomerDropDown = observer(function CustomerDropDown(props: TProps) { const { value, onChange, diff --git a/apps/web/ee/components/customers/requests/empty-state-search.tsx b/apps/web/ee/components/customers/requests/empty-state-search.tsx index 95d8ecb9bd..e053d4a87c 100644 --- a/apps/web/ee/components/customers/requests/empty-state-search.tsx +++ b/apps/web/ee/components/customers/requests/empty-state-search.tsx @@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n"; import RequestEmptyDark from "@/app/assets/empty-state/customers/request-search-dark.svg?url"; import RequestEmptyLight from "@/app/assets/empty-state/customers/request-search-light.svg?url"; -export const CustomerRequestSearchEmptyState: FC = observer(() => { +export const CustomerRequestSearchEmptyState = observer(function CustomerRequestSearchEmptyState() { // i18n const { t } = useTranslation(); // hooks diff --git a/apps/web/ee/components/customers/requests/empty-state.tsx b/apps/web/ee/components/customers/requests/empty-state.tsx index a5e7d726c3..5457cb78d7 100644 --- a/apps/web/ee/components/customers/requests/empty-state.tsx +++ b/apps/web/ee/components/customers/requests/empty-state.tsx @@ -11,7 +11,7 @@ type TProps = { addRequest: () => void; }; -export const CustomerRequestEmptyState: FC = (props) => { +export function CustomerRequestEmptyState(props: TProps) { const { addRequest } = props; // i18n const { t } = useTranslation(); @@ -30,4 +30,4 @@ export const CustomerRequestEmptyState: FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/customers/requests/form.tsx b/apps/web/ee/components/customers/requests/form.tsx index df38b6cd77..77e46f9084 100644 --- a/apps/web/ee/components/customers/requests/form.tsx +++ b/apps/web/ee/components/customers/requests/form.tsx @@ -45,7 +45,7 @@ const workspaceService = new WorkspaceService(); const customerService = new CustomerService(); -export const CustomerRequestForm: FC = observer((props) => { +export const CustomerRequestForm = observer(function CustomerRequestForm(props: TProps) { const { isOpen, handleClose, workspaceSlug, customerId, data } = props; // states const [isSubmitting, setSubmitting] = useState(false); diff --git a/apps/web/ee/components/customers/requests/request-list-item.tsx b/apps/web/ee/components/customers/requests/request-list-item.tsx index 105bc5db4b..dad431c419 100644 --- a/apps/web/ee/components/customers/requests/request-list-item.tsx +++ b/apps/web/ee/components/customers/requests/request-list-item.tsx @@ -37,7 +37,7 @@ type TProps = { const customerService = new CustomerService(); -export const CustomerRequestListItem: FC = observer((props) => { +export const CustomerRequestListItem = observer(function CustomerRequestListItem(props: TProps) { const { requestId, workspaceSlug, customerId, isEditable = false } = props; // states const [isEditing, setEditing] = useState(false); diff --git a/apps/web/ee/components/customers/requests/root.tsx b/apps/web/ee/components/customers/requests/root.tsx index 7361564dda..479eb518c8 100644 --- a/apps/web/ee/components/customers/requests/root.tsx +++ b/apps/web/ee/components/customers/requests/root.tsx @@ -21,7 +21,7 @@ type TProps = { customerId: string; }; -export const CustomerRequestsRoot: FC = observer((props) => { +export const CustomerRequestsRoot = observer(function CustomerRequestsRoot(props: TProps) { const { workspaceSlug, customerId } = props; // i18n diff --git a/apps/web/ee/components/customers/requests/search.tsx b/apps/web/ee/components/customers/requests/search.tsx index e1a41ef0c4..b82f96763c 100644 --- a/apps/web/ee/components/customers/requests/search.tsx +++ b/apps/web/ee/components/customers/requests/search.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ type TProps = { isWorkItemLevel?: boolean; }; -export const CustomerRequestSearch: FC = observer((props) => { +export const CustomerRequestSearch = observer(function CustomerRequestSearch(props: TProps) { const { isWorkItemLevel = false } = props; // i18n const { t } = useTranslation(); diff --git a/apps/web/ee/components/customers/requests/source-item.tsx b/apps/web/ee/components/customers/requests/source-item.tsx index c3add7f3e1..137496cd37 100644 --- a/apps/web/ee/components/customers/requests/source-item.tsx +++ b/apps/web/ee/components/customers/requests/source-item.tsx @@ -5,7 +5,7 @@ type TProps = { link: string; }; -export const SourceItem: FC = (props) => { +export function SourceItem(props: TProps) { const { link } = props; // TODO: Add favicon from backend // const faviconUrl = useMemo(() => `https://www.google.com/s2/favicons?domain=${link}&sz=${40}`, [link]); @@ -16,4 +16,4 @@ export const SourceItem: FC = (props) => {

    {link}

    ); -}; +} diff --git a/apps/web/ee/components/customers/settings/disabled.tsx b/apps/web/ee/components/customers/settings/disabled.tsx index 874698f0ab..302707fc26 100644 --- a/apps/web/ee/components/customers/settings/disabled.tsx +++ b/apps/web/ee/components/customers/settings/disabled.tsx @@ -7,7 +7,7 @@ import { EmptyStateCompact } from "@plane/propel/empty-state"; type TCustomerSettingsDisabled = { toggleCustomersFeature: () => void; }; -export const CustomerSettingsDisabled: FC = (props) => { +export function CustomerSettingsDisabled(props: TCustomerSettingsDisabled) { const { toggleCustomersFeature } = props; // hooks const { t } = useTranslation(); @@ -23,4 +23,4 @@ export const CustomerSettingsDisabled: FC = (props) = rootClassName="py-20" /> ); -}; +} diff --git a/apps/web/ee/components/customers/settings/loader.tsx b/apps/web/ee/components/customers/settings/loader.tsx index 2d264c7687..f5f2756f4f 100644 --- a/apps/web/ee/components/customers/settings/loader.tsx +++ b/apps/web/ee/components/customers/settings/loader.tsx @@ -1,8 +1,10 @@ import type { FC } from "react"; import { Loader } from "@plane/ui"; -export const CustomerPropertiesLoader: FC = () => ( - - - - -); +export function CustomerPropertiesLoader() { + return ( + + + + + ); +} diff --git a/apps/web/ee/components/customers/settings/properties/custom-properties.tsx b/apps/web/ee/components/customers/settings/properties/custom-properties.tsx index 3164340f70..00d6b9dded 100644 --- a/apps/web/ee/components/customers/settings/properties/custom-properties.tsx +++ b/apps/web/ee/components/customers/settings/properties/custom-properties.tsx @@ -35,7 +35,7 @@ export const defaultCustomProperty: Partial> is_required: false, }; -export const CustomerCustomPropertiesRoot: FC = observer(() => { +export const CustomerCustomPropertiesRoot = observer(function CustomerCustomPropertiesRoot() { // states const [isOpen, setIsOpen] = useState(false); const [customerPropertyCreateList, setCustomerPropertyCreateList] = useState([]); diff --git a/apps/web/ee/components/customers/settings/properties/default-properties.tsx b/apps/web/ee/components/customers/settings/properties/default-properties.tsx index a1aecf63e6..b88916b5b3 100644 --- a/apps/web/ee/components/customers/settings/properties/default-properties.tsx +++ b/apps/web/ee/components/customers/settings/properties/default-properties.tsx @@ -47,7 +47,7 @@ const DEFAULT_PROPERTIES_LIST = [ }, ]; -export const CustomerDefaultProperties = () => { +export function CustomerDefaultProperties() { // states const [isOpen, setIsOpen] = useState(true); // hooks @@ -87,4 +87,4 @@ export const CustomerDefaultProperties = () => {
    ); -}; +} diff --git a/apps/web/ee/components/customers/settings/properties/empty-state.tsx b/apps/web/ee/components/customers/settings/properties/empty-state.tsx index 4ae9591be7..43944f7b10 100644 --- a/apps/web/ee/components/customers/settings/properties/empty-state.tsx +++ b/apps/web/ee/components/customers/settings/properties/empty-state.tsx @@ -18,7 +18,7 @@ type TCustomerPropertiesEmptyStateProps = { handleCustomerPropertiesCreate: (mode: TCreationListModes, value: TIssuePropertyCreateList) => void; }; -export const CustomerPropertiesEmptyState: FC = (props) => { +export function CustomerPropertiesEmptyState(props: TCustomerPropertiesEmptyStateProps) { const { handleCustomerPropertiesCreate } = props; const { t } = useTranslation(); return ( @@ -45,4 +45,4 @@ export const CustomerPropertiesEmptyState: FC
    ); -}; +} diff --git a/apps/web/ee/components/customers/settings/properties/root.tsx b/apps/web/ee/components/customers/settings/properties/root.tsx index 7818dde8e2..8820fc4c37 100644 --- a/apps/web/ee/components/customers/settings/properties/root.tsx +++ b/apps/web/ee/components/customers/settings/properties/root.tsx @@ -3,9 +3,11 @@ import React from "react"; import { observer } from "mobx-react"; import { CustomerDefaultProperties, CustomerCustomPropertiesRoot } from "@/plane-web/components/customers/settings"; -export const CustomerPropertiesRoot: FC = observer(() => ( - <> - - - -)); +export const CustomerPropertiesRoot = observer(function CustomerPropertiesRoot() { + return ( + <> + + + + ); +}); diff --git a/apps/web/ee/components/customers/settings/root.tsx b/apps/web/ee/components/customers/settings/root.tsx index 766da9c6e4..a95ce95086 100644 --- a/apps/web/ee/components/customers/settings/root.tsx +++ b/apps/web/ee/components/customers/settings/root.tsx @@ -15,7 +15,7 @@ type TCustomerSettingsRoot = { isCustomersFeatureEnabled: boolean; }; -export const CustomerSettingsRoot: FC = observer((props) => { +export const CustomerSettingsRoot = observer(function CustomerSettingsRoot(props: TCustomerSettingsRoot) { const { toggleCustomersFeature, isCustomersFeatureEnabled } = props; const { loader } = useWorkspaceFeatures(); diff --git a/apps/web/ee/components/customers/upgrade.tsx b/apps/web/ee/components/customers/upgrade.tsx index 5e38c8dff6..13bece317a 100644 --- a/apps/web/ee/components/customers/upgrade.tsx +++ b/apps/web/ee/components/customers/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -14,7 +12,7 @@ import CustomerUpgradeLight from "@/app/assets/empty-state/customers/customer-up // local imports import { UpgradeEmptyStateButton } from "../workspace/upgrade-empty-state-button"; -export const CustomerUpgrade: FC = observer(() => { +export const CustomerUpgrade = observer(function CustomerUpgrade() { const { workspaceSlug } = useParams(); const { resolvedTheme } = useTheme(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/customers/work-items/customer-work-item.tsx b/apps/web/ee/components/customers/work-items/customer-work-item.tsx index 3f70b3e327..aa6e7c2e0d 100644 --- a/apps/web/ee/components/customers/work-items/customer-work-item.tsx +++ b/apps/web/ee/components/customers/work-items/customer-work-item.tsx @@ -28,7 +28,7 @@ type TProps = { isEditable?: boolean; }; -export const CustomerWorkItem: FC = observer((props) => { +export const CustomerWorkItem = observer(function CustomerWorkItem(props: TProps) { const { workItemId, workspaceSlug, requestId, customerId, isEditable } = props; // hooks const { t } = useTranslation(); @@ -46,7 +46,7 @@ export const CustomerWorkItem: FC = observer((props) => { (workItem?.project_id && getProjectStates(workItem?.project_id)?.find((state) => workItem?.state_id == state.id)) || undefined; const workItemOperations = useCustomerWorkItemOperations( - !!workItem?.is_epic ? EIssueServiceType.EPICS : EIssueServiceType.ISSUES + workItem?.is_epic ? EIssueServiceType.EPICS : EIssueServiceType.ISSUES ); const { isMobile } = usePlatformOS(); @@ -134,7 +134,7 @@ export const CustomerWorkItem: FC = observer((props) => {
    - {!!workItem.is_epic + {workItem.is_epic ? t("customers.linked_work_items.action.remove_epic") : t("customers.linked_work_items.action.remove")} diff --git a/apps/web/ee/components/customers/work-items/helper.tsx b/apps/web/ee/components/customers/work-items/helper.tsx index a53b753e76..f05d624f92 100644 --- a/apps/web/ee/components/customers/work-items/helper.tsx +++ b/apps/web/ee/components/customers/work-items/helper.tsx @@ -1,4 +1,3 @@ -"use client"; import { useMemo } from "react"; import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants"; import { useTranslation } from "@plane/i18n"; diff --git a/apps/web/ee/components/customers/work-items/work-item-collapsible.tsx b/apps/web/ee/components/customers/work-items/work-item-collapsible.tsx index 80ec50a00b..560bb77619 100644 --- a/apps/web/ee/components/customers/work-items/work-item-collapsible.tsx +++ b/apps/web/ee/components/customers/work-items/work-item-collapsible.tsx @@ -17,7 +17,7 @@ type TProps = { isEditable?: boolean; }; -export const RequestWorkItemsListCollapsible: FC = observer((props) => { +export const RequestWorkItemsListCollapsible = observer(function RequestWorkItemsListCollapsible(props: TProps) { const { workItemIds, workspaceSlug, openWorkItemModal, customerId, requestId, isEditable } = props; // i18n const { t } = useTranslation(); diff --git a/apps/web/ee/components/customers/work-items/work-item-empty-state.tsx b/apps/web/ee/components/customers/work-items/work-item-empty-state.tsx index 340a1eca83..bfa93a541f 100644 --- a/apps/web/ee/components/customers/work-items/work-item-empty-state.tsx +++ b/apps/web/ee/components/customers/work-items/work-item-empty-state.tsx @@ -9,7 +9,7 @@ import { SectionEmptyState } from "@/plane-web/components/common/layout/main/com type TProps = { linkWorkItem: () => void; }; -export const WorkItemEmptyState: FC = (props) => { +export function WorkItemEmptyState(props: TProps) { const { linkWorkItem } = props; // i18n const { t } = useTranslation(); @@ -29,4 +29,4 @@ export const WorkItemEmptyState: FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/customers/work-items/work-items-list.tsx b/apps/web/ee/components/customers/work-items/work-items-list.tsx index 019ce9091a..b416c6b8a3 100644 --- a/apps/web/ee/components/customers/work-items/work-items-list.tsx +++ b/apps/web/ee/components/customers/work-items/work-items-list.tsx @@ -23,7 +23,7 @@ type TProps = { const customerService = new CustomerService(); -export const WorkItemsList: FC = observer((props) => { +export const WorkItemsList = observer(function WorkItemsList(props: TProps) { const { workspaceSlug, customerId } = props; // states const [workItemsModal, setWorkItemsModal] = useState(false); diff --git a/apps/web/ee/components/cycles/active-cycle/base.tsx b/apps/web/ee/components/cycles/active-cycle/base.tsx index 85d231e920..d4bb81d3d8 100644 --- a/apps/web/ee/components/cycles/active-cycle/base.tsx +++ b/apps/web/ee/components/cycles/active-cycle/base.tsx @@ -1,5 +1,3 @@ -"use client"; - import { isEmpty } from "lodash-es"; import { observer } from "mobx-react"; import { useTheme } from "next-themes"; @@ -22,7 +20,7 @@ type IActiveCycleDetails = { showHeader?: boolean; }; -export const ActiveCycleBase: React.FC = observer((props) => { +export const ActiveCycleBase = observer(function ActiveCycleBase(props: IActiveCycleDetails) { const { workspaceSlug, projectId, cycleId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/cycles/active-cycle/cycle-chart/chart.tsx b/apps/web/ee/components/cycles/active-cycle/cycle-chart/chart.tsx index 47cf8484de..8d0c01ef4d 100644 --- a/apps/web/ee/components/cycles/active-cycle/cycle-chart/chart.tsx +++ b/apps/web/ee/components/cycles/active-cycle/cycle-chart/chart.tsx @@ -1,5 +1,3 @@ -"use client"; - import { format, startOfToday } from "date-fns"; import { observer } from "mobx-react"; import { useTheme } from "next-themes"; @@ -36,7 +34,7 @@ type Props = { showAllTicks?: boolean; }; -export const ActiveCycleChart = observer((props: Props) => { +export const ActiveCycleChart = observer(function ActiveCycleChart(props: Props) { const { areaToHighlight, data = [], @@ -83,7 +81,7 @@ export const ActiveCycleChart = observer((props: Props) => { height="8" patternTransform="rotate(-45 2 2)" > - + {/* Beyond Time */} @@ -94,7 +92,7 @@ export const ActiveCycleChart = observer((props: Props) => { height="8" patternTransform="rotate(-45 2 2)" > - + {/* actual */} @@ -219,7 +217,7 @@ export const ActiveCycleChart = observer((props: Props) => { */} {/* Today */} - {today < endDate && } + {today < endDate && } {/* Beyond Time */} {/* Ideal - Actual */} diff --git a/apps/web/ee/components/cycles/active-cycle/cycle-chart/labels.tsx b/apps/web/ee/components/cycles/active-cycle/cycle-chart/labels.tsx index 7ae0969404..937d793571 100644 --- a/apps/web/ee/components/cycles/active-cycle/cycle-chart/labels.tsx +++ b/apps/web/ee/components/cycles/active-cycle/cycle-chart/labels.tsx @@ -21,7 +21,7 @@ const renderScopeLabel = (data: TCycleProgress[], props: any) => { {prevValue < value ? "+" : "-"} {`${Math.abs(value - prevValue)}`} - + ) : ( <> diff --git a/apps/web/ee/components/cycles/active-cycle/cycle-chart/sidebar-chart.tsx b/apps/web/ee/components/cycles/active-cycle/cycle-chart/sidebar-chart.tsx index eabb908c4b..60b01edd45 100644 --- a/apps/web/ee/components/cycles/active-cycle/cycle-chart/sidebar-chart.tsx +++ b/apps/web/ee/components/cycles/active-cycle/cycle-chart/sidebar-chart.tsx @@ -28,7 +28,7 @@ const chartLegends = [ }, ]; -const SidebarChartPro = observer((props: TProps) => { +const SidebarChartPro = observer(function SidebarChartPro(props: TProps) { const { workspaceSlug, projectId } = props; const { cycle, cycleProgress, plotType, estimateType } = useCycleDetails({ workspaceSlug: workspaceSlug.toString(), diff --git a/apps/web/ee/components/cycles/active-cycle/cycle-chart/ticks.tsx b/apps/web/ee/components/cycles/active-cycle/cycle-chart/ticks.tsx index 10ec36c79c..0e970ee650 100644 --- a/apps/web/ee/components/cycles/active-cycle/cycle-chart/ticks.tsx +++ b/apps/web/ee/components/cycles/active-cycle/cycle-chart/ticks.tsx @@ -14,18 +14,19 @@ type TProps = { showAllTicks?: boolean; }; -const Today = (props: any) => { +function Today(props: any) { const { dy } = props; return ( - + Today ); -}; -const CustomizedXAxisTicks = (props: TProps) => { +} + +function CustomizedXAxisTicks(props: TProps) { const { x, y, payload, data, endDate, startDate, stroke, text, showToday, showAllTicks } = props; const [year, month, day] = payload.value.split("-"); const monthName = new Date(payload.value).toLocaleString("default", { month: "short" }); @@ -72,7 +73,7 @@ const CustomizedXAxisTicks = (props: TProps) => { return ( - + { ); -}; -const CustomizedYAxisTicks = (props: TProps) => { +} + +function CustomizedYAxisTicks(props: TProps) { const { x, y, payload, text } = props; if (x === undefined || y === undefined || payload === undefined) return null; return ( @@ -108,6 +110,6 @@ const CustomizedYAxisTicks = (props: TProps) => { {payload.value % 1 === 0 ? payload.value : payload.value.toFixed(1)} ); -}; +} export { CustomizedXAxisTicks, CustomizedYAxisTicks }; diff --git a/apps/web/ee/components/cycles/active-cycle/cycle-chart/tooltip.tsx b/apps/web/ee/components/cycles/active-cycle/cycle-chart/tooltip.tsx index c62553f1cd..fc172d5059 100644 --- a/apps/web/ee/components/cycles/active-cycle/cycle-chart/tooltip.tsx +++ b/apps/web/ee/components/cycles/active-cycle/cycle-chart/tooltip.tsx @@ -12,7 +12,8 @@ type Props = { endDate: string; estimateType: TCycleEstimateSystemAdvanced; }; -const CustomTooltip = ({ active, payload, label, plotType, endDate, estimateType }: Props) => { + +function CustomTooltip({ active, payload, label, plotType, endDate, estimateType }: Props) { if (active && payload && payload.length && label) { payload = payload[0]?.payload; const [year, month, day] = label?.split("-"); @@ -27,7 +28,7 @@ const CustomTooltip = ({ active, payload, label, plotType, endDate, estimateType {isToday && ( - + Today @@ -78,5 +79,6 @@ const CustomTooltip = ({ active, payload, label, plotType, endDate, estimateType } return null; -}; +} + export default CustomTooltip; diff --git a/apps/web/ee/components/cycles/active-cycle/details.tsx b/apps/web/ee/components/cycles/active-cycle/details.tsx index 3b0a46b07a..114d61e988 100644 --- a/apps/web/ee/components/cycles/active-cycle/details.tsx +++ b/apps/web/ee/components/cycles/active-cycle/details.tsx @@ -28,7 +28,7 @@ import type useCycleDetails from "./use-cycle-details"; type ActiveCycleDetailProps = ReturnType; -const ActiveCycleDetail = observer((props: ActiveCycleDetailProps) => { +const ActiveCycleDetail = observer(function ActiveCycleDetail(props: ActiveCycleDetailProps) { // refs const ref = useRef(null); // states diff --git a/apps/web/ee/components/cycles/active-cycle/formatter.ts b/apps/web/ee/components/cycles/active-cycle/formatter.ts index b0d7077d1f..7672a21c46 100644 --- a/apps/web/ee/components/cycles/active-cycle/formatter.ts +++ b/apps/web/ee/components/cycles/active-cycle/formatter.ts @@ -49,14 +49,14 @@ const formatV1Data = (isTypeIssue: boolean, cycle: ICycle, isBurnDown: boolean, return { date: p, - scope: p! <= cycle.end_date! ? total : null, + scope: p <= cycle.end_date! ? total : null, completed, backlog: isTypeIssue ? cycle.backlog_issues : cycle.backlog_estimate_points, started: p === today ? cycle[isTypeIssue ? "started_issues" : "started_estimate_points"] : undefined, unstarted: p === today ? cycle[isTypeIssue ? "unstarted_issues" : "unstarted_estimate_points"] : undefined, cancelled: p === today ? cycle[isTypeIssue ? "cancelled_issues" : "cancelled_estimate_points"] : undefined, pending: Math.abs(pending || 0), - ideal: p! <= cycle.end_date! ? (isBurnDown ? total - idealDone : idealDone) : null, + ideal: p <= cycle.end_date! ? (isBurnDown ? total - idealDone : idealDone) : null, actual: p <= today ? (isBurnDown ? Math.abs(pending) : completed) : undefined, }; }); @@ -78,9 +78,7 @@ const formatV2Data = ( let today: Date | string = startOfToday(); const extendedArray = endDate > today - ? generateDateArray(today as Date, endDate).filter( - (d) => d.date >= cycle.start_date! && d.date <= cycle.end_date! - ) + ? generateDateArray(today, endDate).filter((d) => d.date >= cycle.start_date! && d.date <= cycle.end_date!) : []; if (!cycle?.progress) return null; if (isEmpty(cycle.progress)) return generateDateArray(new Date(cycle.start_date!), endDate); diff --git a/apps/web/ee/components/cycles/active-cycle/progress-donut.tsx b/apps/web/ee/components/cycles/active-cycle/progress-donut.tsx index f5eb04f99e..eb9a7d04f7 100644 --- a/apps/web/ee/components/cycles/active-cycle/progress-donut.tsx +++ b/apps/web/ee/components/cycles/active-cycle/progress-donut.tsx @@ -7,7 +7,7 @@ type Props = { days_left: number; }; -const ProgressDonut = (props: Props) => { +function ProgressDonut(props: Props) { const { progress, days_left } = props; const [isHovering, setIsHovering] = useState(false); const percentage = progress ? ((progress?.completed ?? 0) * 100) / (progress?.scope ?? 1) : 0; @@ -31,5 +31,6 @@ const ProgressDonut = (props: Props) => {
    ); -}; +} + export default ProgressDonut; diff --git a/apps/web/ee/components/cycles/active-cycle/progress-header.tsx b/apps/web/ee/components/cycles/active-cycle/progress-header.tsx index a205ea5edb..03d850909d 100644 --- a/apps/web/ee/components/cycles/active-cycle/progress-header.tsx +++ b/apps/web/ee/components/cycles/active-cycle/progress-header.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useRef } from "react"; import { format, startOfToday } from "date-fns"; @@ -23,7 +21,7 @@ type Props = { cycleDetails: ICycle; }; -export const CycleProgressHeader: FC = (props: Props) => { +export function CycleProgressHeader(props: Props) { const { workspaceSlug, projectId, cycleId, progress, cycleDetails } = props; // router @@ -76,4 +74,4 @@ export const CycleProgressHeader: FC = (props: Props) => {
    ); -}; +} diff --git a/apps/web/ee/components/cycles/active-cycle/root.tsx b/apps/web/ee/components/cycles/active-cycle/root.tsx index 257ab93081..d2e5467286 100644 --- a/apps/web/ee/components/cycles/active-cycle/root.tsx +++ b/apps/web/ee/components/cycles/active-cycle/root.tsx @@ -8,12 +8,12 @@ interface IActiveCycleDetails { showHeader?: boolean; } -export const ActiveCycleRoot = (props: IActiveCycleDetails) => { +export function ActiveCycleRoot(props: IActiveCycleDetails) { const { workspaceSlug, projectId, cycleId, showHeader = true } = props; const isFeatureEnabled = useFlag(workspaceSlug.toString(), "CYCLE_PROGRESS_CHARTS"); const ActiveCycle = useMemo( - () => - lazy(() => + function ActiveCycle() { + return lazy(() => isFeatureEnabled ? import(`ee/components/cycles/active-cycle/base`).then((module) => ({ default: module["ActiveCycleBase"], @@ -21,7 +21,8 @@ export const ActiveCycleRoot = (props: IActiveCycleDetails) => { : import("ce/components/cycles/active-cycle/root").then((module) => ({ default: module["ActiveCycleRoot"], })) - ), + ); + }, [isFeatureEnabled] ); @@ -35,4 +36,4 @@ export const ActiveCycleRoot = (props: IActiveCycleDetails) => { /> ); -}; +} diff --git a/apps/web/ee/components/cycles/active-cycle/scope-delta.tsx b/apps/web/ee/components/cycles/active-cycle/scope-delta.tsx index 7c4339f7ec..f71f911058 100644 --- a/apps/web/ee/components/cycles/active-cycle/scope-delta.tsx +++ b/apps/web/ee/components/cycles/active-cycle/scope-delta.tsx @@ -4,7 +4,8 @@ type Props = { data: Partial[] | null; dataToday: Partial | undefined; }; -const ScopeDelta = (props: Props) => { + +function ScopeDelta(props: Props) { const { data, dataToday } = props; if (!data || !dataToday) return null; const prevIndex = data.findIndex((d) => d.date === dataToday.date) - 1; @@ -13,11 +14,10 @@ const ScopeDelta = (props: Props) => { const prevData = data[prevIndex]; if (prevData.scope === dataToday.scope || !prevData.scope) return null; - const delta = - prevData.scope === 0 ? 100 : Math.abs(((dataToday.scope || 0) - prevData.scope!) / prevData.scope!) * 100; + const delta = prevData.scope === 0 ? 100 : Math.abs(((dataToday.scope || 0) - prevData.scope) / prevData.scope) * 100; return (
    - {prevData.scope! < dataToday.scope! ? ( + {prevData.scope < dataToday.scope! ? ( <> + @@ -29,5 +29,6 @@ const ScopeDelta = (props: Props) => { {Math.round(delta)}%
    ); -}; +} + export default ScopeDelta; diff --git a/apps/web/ee/components/cycles/active-cycle/selection.tsx b/apps/web/ee/components/cycles/active-cycle/selection.tsx index 2d6ee11d1c..cd83f1ef64 100644 --- a/apps/web/ee/components/cycles/active-cycle/selection.tsx +++ b/apps/web/ee/components/cycles/active-cycle/selection.tsx @@ -29,24 +29,28 @@ export type TDropdownProps = { onChange: (value: TCyclePlotType | TCycleEstimateType) => Promise; options: any[]; }; -const Dropdown = ({ value, onChange, options }: TDropdownProps) => ( -
    - {options.find((v) => v.value === value)?.label ?? "None"}} - onChange={onChange} - maxHeight="lg" - buttonClassName="bg-custom-background-90 border-none rounded text-sm font-medium " - > - {options.map((item) => ( - - {item.label} - - ))} - -
    -); -const Selection = observer((props: TSelectionProps) => { + +function Dropdown({ value, onChange, options }: TDropdownProps) { + return ( +
    + {options.find((v) => v.value === value)?.label ?? "None"}} + onChange={onChange} + maxHeight="lg" + buttonClassName="bg-custom-background-90 border-none rounded text-sm font-medium " + > + {options.map((item) => ( + + {item.label} + + ))} + +
    + ); +} + +const Selection = observer(function Selection(props: TSelectionProps) { const { plotType, estimateType, projectId, handlePlotChange, handleEstimateChange, className, cycleId } = props; return ( diff --git a/apps/web/ee/components/cycles/active-cycle/summary.tsx b/apps/web/ee/components/cycles/active-cycle/summary.tsx index 0bba1575bc..b09ea14dcc 100644 --- a/apps/web/ee/components/cycles/active-cycle/summary.tsx +++ b/apps/web/ee/components/cycles/active-cycle/summary.tsx @@ -37,7 +37,7 @@ type Props = { handleFiltersUpdate: (conditions: TWorkItemFilterCondition[]) => void; }; -const Summary = observer((props: Props) => { +const Summary = observer(function Summary(props: Props) { const { setAreaToHighlight, data, plotType, estimateType = "issues", handleFiltersUpdate, parentWidth } = props; // store hooks const { resolvedTheme } = useTheme(); diff --git a/apps/web/ee/components/cycles/active-cycles/header.tsx b/apps/web/ee/components/cycles/active-cycles/header.tsx index 4b62104fcc..cb1a1daac1 100644 --- a/apps/web/ee/components/cycles/active-cycles/header.tsx +++ b/apps/web/ee/components/cycles/active-cycles/header.tsx @@ -19,7 +19,7 @@ export type ActiveCycleHeaderProps = { projectId: string; }; -export const ActiveCycleHeader: FC = (props) => { +export function ActiveCycleHeader(props: ActiveCycleHeaderProps) { const { cycle, workspaceSlug, projectId } = props; // store const { getUserDetails } = useMember(); @@ -77,4 +77,4 @@ export const ActiveCycleHeader: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/cycles/additional-actions.tsx b/apps/web/ee/components/cycles/additional-actions.tsx index fc7b6414ed..bbd568fc3e 100644 --- a/apps/web/ee/components/cycles/additional-actions.tsx +++ b/apps/web/ee/components/cycles/additional-actions.tsx @@ -12,7 +12,7 @@ type Props = { cycleId: string; projectId: string; }; -export const CycleAdditionalActions: FC = observer((props) => { +export const CycleAdditionalActions = observer(function CycleAdditionalActions(props: Props) { //props const { projectId, cycleId } = props; // router diff --git a/apps/web/ee/components/cycles/analytics-sidebar/base.tsx b/apps/web/ee/components/cycles/analytics-sidebar/base.tsx index f6bdca039e..07be795baa 100644 --- a/apps/web/ee/components/cycles/analytics-sidebar/base.tsx +++ b/apps/web/ee/components/cycles/analytics-sidebar/base.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import type { @@ -42,7 +40,7 @@ const chartLegends = [ }, ]; -export const SidebarChart = observer((props: TProps) => { +export const SidebarChart = observer(function SidebarChart(props: TProps) { const { workspaceSlug, projectId, cycleId } = props; const { plotType, estimatedType } = useCycle(); diff --git a/apps/web/ee/components/cycles/analytics-sidebar/root.tsx b/apps/web/ee/components/cycles/analytics-sidebar/root.tsx index 6089e03d38..d8656b647c 100644 --- a/apps/web/ee/components/cycles/analytics-sidebar/root.tsx +++ b/apps/web/ee/components/cycles/analytics-sidebar/root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { lazy, Suspense, useMemo } from "react"; import { observer } from "mobx-react"; @@ -11,14 +10,14 @@ type Props = { cycleId: string; }; -export const SidebarChartRoot: FC = observer((props) => { +export const SidebarChartRoot = observer(function SidebarChartRoot(props: Props) { const { workspaceSlug, projectId, cycleId } = props; const isFeatureEnabled = useFlag(workspaceSlug.toString(), "CYCLE_PROGRESS_CHARTS"); const SidebarChart = useMemo( - () => - lazy(() => + function SidebarChart() { + return lazy(() => isFeatureEnabled ? import(`ee/components/cycles/analytics-sidebar/base`).then((module) => ({ default: module["SidebarChart"], @@ -26,7 +25,8 @@ export const SidebarChartRoot: FC = observer((props) => { : import("@/ce/components/cycles/analytics-sidebar/base").then((module) => ({ default: module["SidebarChart"], })) - ), + ); + }, [isFeatureEnabled] ); diff --git a/apps/web/ee/components/cycles/end-cycle/modal.tsx b/apps/web/ee/components/cycles/end-cycle/modal.tsx index 919286cadb..2421ee8513 100644 --- a/apps/web/ee/components/cycles/end-cycle/modal.tsx +++ b/apps/web/ee/components/cycles/end-cycle/modal.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useMemo, useState } from "react"; import { Button } from "@plane/propel/button"; @@ -25,7 +24,7 @@ type EndCycleModalProps = { type LoadingState = "Transferring..." | "Ending Cycle..." | "Completing Cycle ..."; -export const EndCycleModal: FC = (props) => { +export function EndCycleModal(props: EndCycleModalProps) { const { isOpen, handleClose, transferrableIssuesCount, projectId, workspaceSlug, cycleId } = props; const [transferIssues, setTransferIssues] = useState(false); const [targetCycle, setTargetCycle] = useState(null); @@ -185,4 +184,4 @@ export const EndCycleModal: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/cycles/settings/auto-schedule-cycles.tsx b/apps/web/ee/components/cycles/settings/auto-schedule-cycles.tsx index a9f1f004c6..fe97c69cc3 100644 --- a/apps/web/ee/components/cycles/settings/auto-schedule-cycles.tsx +++ b/apps/web/ee/components/cycles/settings/auto-schedule-cycles.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { isEmpty } from "lodash-es"; import { observer } from "mobx-react"; @@ -36,7 +34,7 @@ const cycleCountOptions = [ { value: 3, label: "3 cycles" }, ]; -export const AutoScheduleCycles = observer(() => { +export const AutoScheduleCycles = observer(function AutoScheduleCycles() { const { workspaceSlug, projectId } = useParams(); const { diff --git a/apps/web/ee/components/cycles/start-cycle/modal.tsx b/apps/web/ee/components/cycles/start-cycle/modal.tsx index c5220420d4..2563e69a6a 100644 --- a/apps/web/ee/components/cycles/start-cycle/modal.tsx +++ b/apps/web/ee/components/cycles/start-cycle/modal.tsx @@ -9,7 +9,7 @@ interface Props { loading: boolean; } -export const StartCycleModal: React.FC = (props) => { +export function StartCycleModal(props: Props) { const { isOpen, handleClose, handleStartCycle, loading } = props; return ( @@ -27,4 +27,4 @@ export const StartCycleModal: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/dashboards/details/empty-state.tsx b/apps/web/ee/components/dashboards/details/empty-state.tsx index 1c9ea80fe7..47be6fdbca 100644 --- a/apps/web/ee/components/dashboards/details/empty-state.tsx +++ b/apps/web/ee/components/dashboards/details/empty-state.tsx @@ -20,7 +20,7 @@ type Props = { dashboardId: string; }; -export const DashboardsWidgetsListEmptyState: React.FC = observer((props) => { +export const DashboardsWidgetsListEmptyState = observer(function DashboardsWidgetsListEmptyState(props: Props) { const { dashboardId } = props; // states const [isAddingWidget, setIsAddingWidget] = useState(false); diff --git a/apps/web/ee/components/dashboards/details/root.tsx b/apps/web/ee/components/dashboards/details/root.tsx index 8a35d59fde..585ca7685f 100644 --- a/apps/web/ee/components/dashboards/details/root.tsx +++ b/apps/web/ee/components/dashboards/details/root.tsx @@ -14,7 +14,7 @@ type Props = { dashboardId: string; }; -export const DashboardsWidgetsListRoot: React.FC = observer((props) => { +export const DashboardsWidgetsListRoot = observer(function DashboardsWidgetsListRoot(props: Props) { const { className, dashboardId } = props; // store hooks const { getDashboardById } = useDashboards(); diff --git a/apps/web/ee/components/dashboards/details/widgets-grid-root.tsx b/apps/web/ee/components/dashboards/details/widgets-grid-root.tsx index 52fba37136..d2af658051 100644 --- a/apps/web/ee/components/dashboards/details/widgets-grid-root.tsx +++ b/apps/web/ee/components/dashboards/details/widgets-grid-root.tsx @@ -20,7 +20,7 @@ type Props = { const ResponsiveGridLayout = WidthProvider(Responsive); -export const DashboardsWidgetsGridRoot: React.FC = observer((props) => { +export const DashboardsWidgetsGridRoot = observer(function DashboardsWidgetsGridRoot(props: Props) { const { dashboardId } = props; // states const [activeBreakpoint, setActiveBreakpoint] = useState(EWidgetGridBreakpoints.MD); diff --git a/apps/web/ee/components/dashboards/feature-flag-fallback.tsx b/apps/web/ee/components/dashboards/feature-flag-fallback.tsx index acfef044a4..5c2a9b6048 100644 --- a/apps/web/ee/components/dashboards/feature-flag-fallback.tsx +++ b/apps/web/ee/components/dashboards/feature-flag-fallback.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; import { useTheme } from "next-themes"; @@ -47,7 +45,7 @@ const CARDS_LIST = [ }, ]; -export const DashboardsFeatureFlagFallback = observer(() => { +export const DashboardsFeatureFlagFallback = observer(function DashboardsFeatureFlagFallback() { // router const { workspaceSlug } = useParams(); // translation @@ -80,6 +78,7 @@ export const DashboardsFeatureFlagFallback = observer(() => { href="https://plane.so/contact" target="_blank" className="bg-transparent underline text-sm text-custom-primary-200 my-auto font-medium" + rel="noreferrer" > {t("common.upgrade_cta.talk_to_sales")} diff --git a/apps/web/ee/components/dashboards/list/list-item-actions.tsx b/apps/web/ee/components/dashboards/list/list-item-actions.tsx index 6c0a0d9a33..d3134d5505 100644 --- a/apps/web/ee/components/dashboards/list/list-item-actions.tsx +++ b/apps/web/ee/components/dashboards/list/list-item-actions.tsx @@ -18,7 +18,7 @@ type Props = { parentRef: React.RefObject; }; -export const DashboardListItemActions: React.FC = observer((props) => { +export const DashboardListItemActions = observer(function DashboardListItemActions(props: Props) { const { dashboard, parentRef } = props; // derived values const { getUserDetails } = useMember(); diff --git a/apps/web/ee/components/dashboards/list/list-item.tsx b/apps/web/ee/components/dashboards/list/list-item.tsx index 4f7320f77b..36d4e01524 100644 --- a/apps/web/ee/components/dashboards/list/list-item.tsx +++ b/apps/web/ee/components/dashboards/list/list-item.tsx @@ -14,7 +14,7 @@ type Props = { id: string; }; -export const DashboardListItem: React.FC = observer((props) => { +export const DashboardListItem = observer(function DashboardListItem(props: Props) { const { getDashboardDetails, id } = props; // refs const parentRef = useRef(null); diff --git a/apps/web/ee/components/dashboards/list/loader.tsx b/apps/web/ee/components/dashboards/list/loader.tsx index a4029604c1..71e0f0a3fd 100644 --- a/apps/web/ee/components/dashboards/list/loader.tsx +++ b/apps/web/ee/components/dashboards/list/loader.tsx @@ -1,20 +1,20 @@ -"use client"; - // plane imports import { Loader } from "@plane/ui"; -export const DashboardsListLayoutLoader = () => ( -
    - {Array.from({ length: 10 }).map((_, index) => ( - - -
    - - - - -
    -     - ))} -
    -); +export function DashboardsListLayoutLoader() { + return ( +
    + {Array.from({ length: 10 }).map((_, index) => ( + + +
    + + + + +
    +     + ))} +
    + ); +} diff --git a/apps/web/ee/components/dashboards/list/root.tsx b/apps/web/ee/components/dashboards/list/root.tsx index c863f9e4b2..ca8ed819f9 100644 --- a/apps/web/ee/components/dashboards/list/root.tsx +++ b/apps/web/ee/components/dashboards/list/root.tsx @@ -15,7 +15,7 @@ import { useDashboards } from "@/plane-web/hooks/store"; import { DashboardListItem } from "./list-item"; import { DashboardsListLayoutLoader } from "./loader"; -export const DashboardsListLayoutRoot = observer(() => { +export const DashboardsListLayoutRoot = observer(function DashboardsListLayoutRoot() { // store hooks const { getDashboardById, diff --git a/apps/web/ee/components/dashboards/list/search.tsx b/apps/web/ee/components/dashboards/list/search.tsx index 678652da77..8dbdcc137c 100644 --- a/apps/web/ee/components/dashboards/list/search.tsx +++ b/apps/web/ee/components/dashboards/list/search.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef, useState } from "react"; import { observer } from "mobx-react"; import { Search } from "lucide-react"; @@ -12,7 +10,7 @@ type Props = { value: string | undefined; }; -export const DashboardsListSearch: React.FC = observer((props) => { +export const DashboardsListSearch = observer(function DashboardsListSearch(props: Props) { const { onChange, value } = props; // states const [isSearchOpen, setIsSearchOpen] = useState(false); diff --git a/apps/web/ee/components/dashboards/modals/create-update-modal.tsx b/apps/web/ee/components/dashboards/modals/create-update-modal.tsx index f9bc44faef..296253c7cd 100644 --- a/apps/web/ee/components/dashboards/modals/create-update-modal.tsx +++ b/apps/web/ee/components/dashboards/modals/create-update-modal.tsx @@ -29,7 +29,7 @@ const defaultValues: Partial = { project_ids: [], }; -export const CreateUpdateWorkspaceDashboardModal: React.FC = observer((props) => { +export const CreateUpdateWorkspaceDashboardModal = observer(function CreateUpdateWorkspaceDashboardModal(props: Props) { const { data, isOpen, onClose } = props; // navigation const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/dashboards/modals/delete-modal.tsx b/apps/web/ee/components/dashboards/modals/delete-modal.tsx index 1074faf9fc..55cc1d1db5 100644 --- a/apps/web/ee/components/dashboards/modals/delete-modal.tsx +++ b/apps/web/ee/components/dashboards/modals/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -16,7 +14,7 @@ type Props = { isOpen: boolean; }; -export const DashboardDeleteModal: React.FC = observer((props) => { +export const DashboardDeleteModal = observer(function DashboardDeleteModal(props: Props) { const { dashboardId, handleClose, handleDelete, isOpen } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/dashboards/quick-actions.tsx b/apps/web/ee/components/dashboards/quick-actions.tsx index 70debfb7e7..0958c71396 100644 --- a/apps/web/ee/components/dashboards/quick-actions.tsx +++ b/apps/web/ee/components/dashboards/quick-actions.tsx @@ -19,7 +19,7 @@ type Props = { customClassName?: string; }; -export const DashboardQuickActions: React.FC = observer((props) => { +export const DashboardQuickActions = observer(function DashboardQuickActions(props: Props) { const { dashboardId, parentRef, showEdit = true, customClassName } = props; // states const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/circular-chart-config.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/circular-chart-config.tsx index fb730b9c17..a186ab6ee2 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/circular-chart-config.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/circular-chart-config.tsx @@ -13,7 +13,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarCircularChartConfig: React.FC = (props) => { +export function WidgetConfigSidebarCircularChartConfig(props: Props) { const { handleSubmit } = props; // translation const { t } = useTranslation(); @@ -83,4 +83,4 @@ export const WidgetConfigSidebarCircularChartConfig: React.FC = (props) = /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/date-group-select.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/date-group-select.tsx index 7d0aca498b..dffa383b2a 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/date-group-select.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/date-group-select.tsx @@ -14,7 +14,7 @@ type Props = { value: TDashboardWidget["x_axis_date_grouping"]; }; -export const WidgetDateGroupSelect: React.FC = (props) => { +export function WidgetDateGroupSelect(props: Props) { const { onChange, placeholder, title, value } = props; // translation const { t } = useTranslation(); @@ -46,4 +46,4 @@ export const WidgetDateGroupSelect: React.FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/grouping-config.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/grouping-config.tsx index 968ea618db..2555aebffa 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/grouping-config.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/grouping-config.tsx @@ -10,7 +10,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarGroupingConfig: React.FC = (props) => { +export function WidgetConfigSidebarGroupingConfig(props: Props) { const { handleSubmit } = props; // translation const { t } = useTranslation(); @@ -52,4 +52,4 @@ export const WidgetConfigSidebarGroupingConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/metric-select.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/metric-select.tsx index b37f4cd997..f551babf48 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/metric-select.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/metric-select.tsx @@ -15,7 +15,7 @@ type Props = { value: TDashboardWidget["y_axis_metric"]; }; -export const WidgetMetricSelect: React.FC = (props) => { +export function WidgetMetricSelect(props: Props) { const { onChange, options, placeholder, title, value } = props; // translation const { t } = useTranslation(); @@ -45,4 +45,4 @@ export const WidgetMetricSelect: React.FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/property-select.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/property-select.tsx index c9f64b4afd..65435c6d07 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/property-select.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/property-select.tsx @@ -14,7 +14,7 @@ type Props = { value: TDashboardWidget["x_axis_property"]; }; -export const WidgetPropertySelect: React.FC = (props) => { +export function WidgetPropertySelect(props: Props) { const { onChange, placeholder, title, value } = props; // translation const { t } = useTranslation(); @@ -44,4 +44,4 @@ export const WidgetPropertySelect: React.FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/root.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/root.tsx index 70fe71607c..014acb2232 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/root.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/root.tsx @@ -19,7 +19,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarAxisConfig: React.FC = (props) => { +export function WidgetConfigSidebarAxisConfig(props: Props) { const { handleSubmit } = props; // states const [isCollapsibleIcon, setIsCollapsibleIcon] = useState(true); @@ -82,4 +82,4 @@ export const WidgetConfigSidebarAxisConfig: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/x-axis-config.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/x-axis-config.tsx index faf60b636e..cbf7e589cf 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/x-axis-config.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/x-axis-config.tsx @@ -11,7 +11,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarXAxisConfig: React.FC = (props) => { +export function WidgetConfigSidebarXAxisConfig(props: Props) { const { handleSubmit } = props; // translation const { t } = useTranslation(); @@ -63,4 +63,4 @@ export const WidgetConfigSidebarXAxisConfig: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/axis-config/y-axis-config.tsx b/apps/web/ee/components/dashboards/sidebar/axis-config/y-axis-config.tsx index 96630d8d3a..5b104eac2b 100644 --- a/apps/web/ee/components/dashboards/sidebar/axis-config/y-axis-config.tsx +++ b/apps/web/ee/components/dashboards/sidebar/axis-config/y-axis-config.tsx @@ -10,7 +10,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarYAxisConfig: React.FC = (props) => { +export function WidgetConfigSidebarYAxisConfig(props: Props) { const { handleSubmit } = props; // translation const { t } = useTranslation(); @@ -37,4 +37,4 @@ export const WidgetConfigSidebarYAxisConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/basic-config/root.tsx b/apps/web/ee/components/dashboards/sidebar/basic-config/root.tsx index b9c9f2bc4c..de4700f934 100644 --- a/apps/web/ee/components/dashboards/sidebar/basic-config/root.tsx +++ b/apps/web/ee/components/dashboards/sidebar/basic-config/root.tsx @@ -20,7 +20,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarBasicConfig: React.FC = (props) => { +export function WidgetConfigSidebarBasicConfig(props: Props) { const { handleSubmit } = props; // translation const { t } = useTranslation(); @@ -158,4 +158,4 @@ export const WidgetConfigSidebarBasicConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/basic-config/title.tsx b/apps/web/ee/components/dashboards/sidebar/basic-config/title.tsx index 0526e8ddd5..f71a613adf 100644 --- a/apps/web/ee/components/dashboards/sidebar/basic-config/title.tsx +++ b/apps/web/ee/components/dashboards/sidebar/basic-config/title.tsx @@ -7,7 +7,7 @@ type Props = { value: string | undefined; }; -export const WidgetConfigSidebarTitle: React.FC = (props) => { +export function WidgetConfigSidebarTitle(props: Props) { const { onChange, value } = props; // translation const { t } = useTranslation(); @@ -29,4 +29,4 @@ export const WidgetConfigSidebarTitle: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/filters/filter-conditions.tsx b/apps/web/ee/components/dashboards/sidebar/filters/filter-conditions.tsx index 1770ec87fb..6c801c6522 100644 --- a/apps/web/ee/components/dashboards/sidebar/filters/filter-conditions.tsx +++ b/apps/web/ee/components/dashboards/sidebar/filters/filter-conditions.tsx @@ -7,22 +7,24 @@ type Props = { filters: IFilterInstance; }; -export const FilterConditions: React.FC = observer(({ filters }) => ( -
    - {filters.allConditionsForDisplay.map((condition, index) => ( -
    - +export const FilterConditions = observer(function FilterConditions({ filters }: Props) { + return ( +
    + {filters.allConditionsForDisplay.map((condition, index) => ( +
    + - {index < filters.allConditionsForDisplay.length - 1 && ( -
    -
    - - And - -
    -
    - )} -
    - ))} -
    -)); + {index < filters.allConditionsForDisplay.length - 1 && ( +
    +
    + + And + +
    +
    + )} +
    + ))} +
    + ); +}); diff --git a/apps/web/ee/components/dashboards/sidebar/filters/root.tsx b/apps/web/ee/components/dashboards/sidebar/filters/root.tsx index 0516cb47d4..c62a4be3ac 100644 --- a/apps/web/ee/components/dashboards/sidebar/filters/root.tsx +++ b/apps/web/ee/components/dashboards/sidebar/filters/root.tsx @@ -68,7 +68,7 @@ type Props = { initialFilters?: TExternalDashboardWidgetFilterExpression; }; -const FilterContent: React.FC = observer(({ projectIds, initialFilters, handleSubmit }) => { +const FilterContent = observer(function FilterContent({ projectIds, initialFilters, handleSubmit }: Props) { const filterInstance = useMemo( () => new FilterInstance({ @@ -352,13 +352,15 @@ const FilterContent: React.FC = observer(({ projectIds, initialFilters, h ); }); -const WidgetConfigSidebarFilters: React.FC = observer((props) => ( -
    -
    -
    Filters
    +const WidgetConfigSidebarFilters = observer(function WidgetConfigSidebarFilters(props: Props) { + return ( +
    +
    +
    Filters
    +
    + {props.initialFilters ? : }
    - {props.initialFilters ? : } -
    -)); + ); +}); export { WidgetConfigSidebarFilters }; diff --git a/apps/web/ee/components/dashboards/sidebar/header.tsx b/apps/web/ee/components/dashboards/sidebar/header.tsx index ebda79fafa..973505409b 100644 --- a/apps/web/ee/components/dashboards/sidebar/header.tsx +++ b/apps/web/ee/components/dashboards/sidebar/header.tsx @@ -8,7 +8,7 @@ type Props = { handleDelete: () => void; }; -export const WidgetConfigSidebarHeader: React.FC = (props) => { +export function WidgetConfigSidebarHeader(props: Props) { const { handleClose, handleDelete } = props; // translation const { t } = useTranslation(); @@ -37,4 +37,4 @@ export const WidgetConfigSidebarHeader: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/property-wrapper.tsx b/apps/web/ee/components/dashboards/sidebar/property-wrapper.tsx index d111f81558..a29c28c772 100644 --- a/apps/web/ee/components/dashboards/sidebar/property-wrapper.tsx +++ b/apps/web/ee/components/dashboards/sidebar/property-wrapper.tsx @@ -8,7 +8,7 @@ type Props = { titleClassName?: string; }; -export const WidgetPropertyWrapper: React.FC = (props) => { +export function WidgetPropertyWrapper(props: Props) { const { className, input, inputClassName, title, titleClassName } = props; return ( @@ -17,4 +17,4 @@ export const WidgetPropertyWrapper: React.FC = (props) => {
    {input}
    ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/root.tsx b/apps/web/ee/components/dashboards/sidebar/root.tsx index 4dd25f350d..c7b04bde6c 100644 --- a/apps/web/ee/components/dashboards/sidebar/root.tsx +++ b/apps/web/ee/components/dashboards/sidebar/root.tsx @@ -24,7 +24,7 @@ type Props = { dashboardId: string; }; -export const DashboardsWidgetConfigSidebarRoot: React.FC = observer((props) => { +export const DashboardsWidgetConfigSidebarRoot = observer(function DashboardsWidgetConfigSidebarRoot(props: Props) { const { className, dashboardId } = props; // store hooks @@ -65,7 +65,7 @@ export const DashboardsWidgetConfigSidebarRoot: React.FC = observer((prop async (data: Partial) => { try { await updateWidget?.(data); - // eslint-disable-next-line @typescript-eslint/no-unused-vars + const { config, ...rest } = data; if (!isConfigurationMissing && Object.keys(rest).length) { fetchWidgetData?.(); diff --git a/apps/web/ee/components/dashboards/sidebar/select-button.tsx b/apps/web/ee/components/dashboards/sidebar/select-button.tsx index 9ca04f9134..b8079e21ac 100644 --- a/apps/web/ee/components/dashboards/sidebar/select-button.tsx +++ b/apps/web/ee/components/dashboards/sidebar/select-button.tsx @@ -7,7 +7,7 @@ type Props = { value: boolean; }; -export const WidgetConfigSelectButton: React.FC = (props) => { +export function WidgetConfigSelectButton(props: Props) { const { placeholder, title, value } = props; return ( @@ -22,4 +22,4 @@ export const WidgetConfigSelectButton: React.FC = (props) => { {value ? title : placeholder}
    ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart-comparison-line.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart-comparison-line.tsx index 1a34d8dc9c..b7bc743c4d 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart-comparison-line.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart-comparison-line.tsx @@ -12,7 +12,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const AreaChartComparisonLineAppearanceConfig: React.FC = (props) => { +export function AreaChartComparisonLineAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -54,4 +54,4 @@ export const AreaChartComparisonLineAppearanceConfig: React.FC = (props) />
    ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart.tsx index b230140c95..141f2f9d2c 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/area-chart.tsx @@ -15,7 +15,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const AreaChartAppearanceConfig: React.FC = (props) => { +export function AreaChartAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -146,4 +146,4 @@ export const AreaChartAppearanceConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/bar-chart.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/bar-chart.tsx index 35cd689ad7..1203ce73f7 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/bar-chart.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/bar-chart.tsx @@ -11,7 +11,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const BarChartAppearanceConfig: React.FC = (props) => { +export function BarChartAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -75,4 +75,4 @@ export const BarChartAppearanceConfig: React.FC = (props) => { /> */} ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-picker.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-picker.tsx index 93768e1cb2..4d6f750ca9 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-picker.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-picker.tsx @@ -11,7 +11,7 @@ type Props = { value: string | undefined; }; -export const WidgetColorPicker: React.FC = (props) => { +export function WidgetColorPicker(props: Props) { const { onChange, title, value } = props; // unique id const id = useId(); @@ -51,4 +51,4 @@ export const WidgetColorPicker: React.FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-scheme-select.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-scheme-select.tsx index caf1decd5f..3072e0b970 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-scheme-select.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/color-scheme-select.tsx @@ -12,7 +12,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const WidgetColorSchemeSelect: React.FC = (props) => { +export function WidgetColorSchemeSelect(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -74,4 +74,4 @@ export const WidgetColorSchemeSelect: React.FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/donut-chart.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/donut-chart.tsx index ec18584e30..402b53ba8a 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/donut-chart.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/donut-chart.tsx @@ -13,7 +13,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const DonutChartAppearanceConfig: React.FC = (props) => { +export function DonutChartAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -65,4 +65,4 @@ export const DonutChartAppearanceConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-chart.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-chart.tsx index 1160e305e2..be6e6cef9b 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-chart.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-chart.tsx @@ -15,7 +15,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const LineChartAppearanceConfig: React.FC = (props) => { +export function LineChartAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -103,4 +103,4 @@ export const LineChartAppearanceConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-type-select.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-type-select.tsx index b3f2841001..2bb8593dd8 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-type-select.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/line-type-select.tsx @@ -12,7 +12,7 @@ type Props = { value: TWidgetLineChartLineType | undefined; }; -export const WidgetLineTypeSelect: React.FC = (props) => { +export function WidgetLineTypeSelect(props: Props) { const { onChange, value } = props; // translation const { t } = useTranslation(); @@ -44,4 +44,4 @@ export const WidgetLineTypeSelect: React.FC = (props) => { } /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/number.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/number.tsx index 23e7fd5afe..f536289566 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/number.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/number.tsx @@ -13,7 +13,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const NumberAppearanceConfig: React.FC = (props) => { +export function NumberAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -73,4 +73,4 @@ export const NumberAppearanceConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart-grouping.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart-grouping.tsx index 141d55b864..9b42a30f0e 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart-grouping.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart-grouping.tsx @@ -12,7 +12,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const PieChartGroupingConfig: React.FC = (props) => { +export function PieChartGroupingConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -115,4 +115,4 @@ export const PieChartGroupingConfig: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart.tsx index 0e54ea789b..b2d556590e 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/pie-chart.tsx @@ -13,7 +13,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const PieChartAppearanceConfig: React.FC = (props) => { +export function PieChartAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -85,4 +85,4 @@ export const PieChartAppearanceConfig: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/root.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/root.tsx index a8d6f72306..5210a071bb 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/root.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/appearance-config/root.tsx @@ -17,7 +17,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const WidgetConfigSidebarAppearanceConfig: React.FC = (props) => { +export function WidgetConfigSidebarAppearanceConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -59,4 +59,4 @@ export const WidgetConfigSidebarAppearanceConfig: React.FC = (props) => { {isComparisonAreaChart && } ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/guides-config.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/guides-config.tsx index ecef79a81a..124ecb8139 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/guides-config.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/guides-config.tsx @@ -10,7 +10,7 @@ type Props = { handleConfigUpdate: (data: Partial) => Promise; }; -export const WidgetConfigSidebarGuidesConfig: React.FC = (props) => { +export function WidgetConfigSidebarGuidesConfig(props: Props) { const { handleConfigUpdate } = props; // translation const { t } = useTranslation(); @@ -62,4 +62,4 @@ export const WidgetConfigSidebarGuidesConfig: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/dashboards/sidebar/style-config/root.tsx b/apps/web/ee/components/dashboards/sidebar/style-config/root.tsx index ca4ff42c2a..adc9cf4059 100644 --- a/apps/web/ee/components/dashboards/sidebar/style-config/root.tsx +++ b/apps/web/ee/components/dashboards/sidebar/style-config/root.tsx @@ -16,7 +16,7 @@ type Props = { handleSubmit: (data: Partial) => Promise; }; -export const WidgetConfigSidebarStyleConfig: React.FC = observer((props) => { +export const WidgetConfigSidebarStyleConfig = observer(function WidgetConfigSidebarStyleConfig(props: Props) { const { handleSubmit } = props; // states const [isCollapsibleIcon, setIsCollapsibleIcon] = useState(true); diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/area-chart.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/area-chart.tsx index 58ec3f1024..ebfe4be1e3 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/area-chart.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/area-chart.tsx @@ -9,13 +9,13 @@ import { EWidgetChartModels } from "@plane/types"; import type { TWidgetComponentProps } from "."; import { generateExtendedColors } from "."; -const AreaChart = lazy(() => - import("@plane/propel/charts/area-chart").then((mod) => ({ +const AreaChart = lazy(function AreaChart() { + return import("@plane/propel/charts/area-chart").then((mod) => ({ default: mod.AreaChart, - })) -); + })); +}); -export const DashboardAreaChartWidget: React.FC = observer((props) => { +export const DashboardAreaChartWidget = observer(function DashboardAreaChartWidget(props: TWidgetComponentProps) { const { parsedData, widget } = props; // derived values const { chart_model } = widget ?? {}; diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/bar-chart.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/bar-chart.tsx index ef58b1f565..42a55de847 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/bar-chart.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/bar-chart.tsx @@ -9,13 +9,13 @@ import { EWidgetChartModels } from "@plane/types"; import type { TWidgetComponentProps } from "."; import { generateExtendedColors } from "."; -const BarChart = lazy(() => - import("@plane/propel/charts/bar-chart").then((mod) => ({ +const BarChart = lazy(function BarChart() { + return import("@plane/propel/charts/bar-chart").then((mod) => ({ default: mod.BarChart, - })) -); + })); +}); -export const DashboardBarChartWidget: React.FC = observer((props) => { +export const DashboardBarChartWidget = observer(function DashboardBarChartWidget(props: TWidgetComponentProps) { const { parsedData, widget } = props; // derived values const { chart_model } = widget ?? {}; diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/content.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/content.tsx index b356c04cce..62ea799196 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/content.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/content.tsx @@ -18,7 +18,7 @@ type Props = { widget: DashboardWidgetInstance; }; -export const DashboardWidgetContent: React.FC = (props) => { +export function DashboardWidgetContent(props: Props) { const { activeBreakpoint, children, className, dashboardId, isDataAvailable, isDataEmpty, widget } = props; // derived values const { isWidgetAvailableInCurrentPlan } = widget; @@ -51,4 +51,4 @@ export const DashboardWidgetContent: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/donut-chart.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/donut-chart.tsx index 7e397d00f4..bf1920d378 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/donut-chart.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/donut-chart.tsx @@ -9,11 +9,11 @@ import { EWidgetChartModels } from "@plane/types"; import type { TWidgetComponentProps } from "."; import { generateExtendedColors } from "."; -const PieChart = lazy(() => - import("@plane/propel/charts/pie-chart").then((mod) => ({ +const PieChart = lazy(function PieChart() { + return import("@plane/propel/charts/pie-chart").then((mod) => ({ default: mod.PieChart, - })) -); + })); +}); export const parseDonutChartData = ( originalData: TDashboardWidgetDatum[] | undefined, @@ -41,7 +41,7 @@ export const parseDonutChartData = ( return updatedData; }; -export const DashboardDonutChartWidget: React.FC = observer((props) => { +export const DashboardDonutChartWidget = observer(function DashboardDonutChartWidget(props: TWidgetComponentProps) { const { parsedData, widget } = props; // derived values const { chart_model, data, height, width } = widget ?? {}; diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/header.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/header.tsx index fcd2b6de0c..6046757b2b 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/header.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/header.tsx @@ -20,7 +20,7 @@ type Props = { widgetRef: React.RefObject; }; -export const DashboardWidgetHeader: React.FC = observer((props) => { +export const DashboardWidgetHeader = observer(function DashboardWidgetHeader(props: Props) { const { className, dashboardId, widget, widgetRef } = props; // store hooks const { getDashboardById } = useDashboards(); diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/line-chart.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/line-chart.tsx index ffc3b79f1f..5a9b2d6b0f 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/line-chart.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/line-chart.tsx @@ -9,13 +9,13 @@ import { EWidgetChartModels } from "@plane/types"; import type { TWidgetComponentProps } from "."; import { generateExtendedColors } from "."; -const LineChart = lazy(() => - import("@plane/propel/charts/line-chart").then((mod) => ({ +const LineChart = lazy(function LineChart() { + return import("@plane/propel/charts/line-chart").then((mod) => ({ default: mod.LineChart, - })) -); + })); +}); -export const DashboardLineChartWidget: React.FC = observer((props) => { +export const DashboardLineChartWidget = observer(function DashboardLineChartWidget(props: TWidgetComponentProps) { const { parsedData, widget } = props; // derived values const { chart_model } = widget ?? {}; diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/number.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/number.tsx index 20f0a1999c..9f97151587 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/number.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/number.tsx @@ -4,7 +4,7 @@ import type { TNumberWidgetConfig } from "@plane/types"; // local imports import type { TWidgetComponentProps } from "."; -export const DashboardNumberWidget: React.FC = observer((props) => { +export const DashboardNumberWidget = observer(function DashboardNumberWidget(props: TWidgetComponentProps) { const { widget } = props; // derived values const { data, height } = widget ?? {}; diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/pie-chart.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/pie-chart.tsx index 43a5d6c8fa..650ce8d0f6 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/pie-chart.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/pie-chart.tsx @@ -10,11 +10,11 @@ import type { TCellItem, TDashboardWidgetDatum, TPieChartWidgetConfig } from "@p import type { TWidgetComponentProps } from "."; import { generateExtendedColors } from "."; -const PieChart = lazy(() => - import("@plane/propel/charts/pie-chart").then((mod) => ({ +const PieChart = lazy(function PieChart() { + return import("@plane/propel/charts/pie-chart").then((mod) => ({ default: mod.PieChart, - })) -); + })); +}); const THIN_PIECES_GROUP_KEY = "pie-chart-group-thin-pieces"; @@ -58,7 +58,7 @@ const parsePieChartData = ( return updatedData; }; -export const DashboardPieChartWidget: React.FC = observer((props) => { +export const DashboardPieChartWidget = observer(function DashboardPieChartWidget(props: TWidgetComponentProps) { const { parsedData, widget } = props; // derived values const { height, width } = widget ?? {}; diff --git a/apps/web/ee/components/dashboards/widgets/chart-types/root.tsx b/apps/web/ee/components/dashboards/widgets/chart-types/root.tsx index 9aa4cb5345..f2bfad12b9 100644 --- a/apps/web/ee/components/dashboards/widgets/chart-types/root.tsx +++ b/apps/web/ee/components/dashboards/widgets/chart-types/root.tsx @@ -26,7 +26,7 @@ type Props = { widgetId: string; }; -export const DashboardWidgetRoot: React.FC = observer((props) => { +export const DashboardWidgetRoot = observer(function DashboardWidgetRoot(props: Props) { const { activeBreakpoint, dashboardId, widgetId } = props; // refs const widgetRef = useRef(null); diff --git a/apps/web/ee/components/dashboards/widgets/delete-modal.tsx b/apps/web/ee/components/dashboards/widgets/delete-modal.tsx index 3798cfbb19..c0aa6ab227 100644 --- a/apps/web/ee/components/dashboards/widgets/delete-modal.tsx +++ b/apps/web/ee/components/dashboards/widgets/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; @@ -15,7 +13,7 @@ type Props = { widgetId: string | null; }; -export const DashboardWidgetDeleteModal: React.FC = observer((props) => { +export const DashboardWidgetDeleteModal = observer(function DashboardWidgetDeleteModal(props: Props) { const { dashboardId, handleClose, isOpen, widgetId } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/dashboards/widgets/dropdown/option.tsx b/apps/web/ee/components/dashboards/widgets/dropdown/option.tsx index bbfb4003f2..e71c930fa1 100644 --- a/apps/web/ee/components/dashboards/widgets/dropdown/option.tsx +++ b/apps/web/ee/components/dashboards/widgets/dropdown/option.tsx @@ -26,7 +26,9 @@ type Props = { widget: EWidgetChartTypes; }; -export const DashboardWidgetChartTypesDropdownOption: React.FC = observer((props) => { +export const DashboardWidgetChartTypesDropdownOption = observer(function DashboardWidgetChartTypesDropdownOption( + props: Props +) { const { isSelected, model, onSelect, widget } = props; // navigation const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/dashboards/widgets/dropdown/root.tsx b/apps/web/ee/components/dashboards/widgets/dropdown/root.tsx index 8217858e41..f2400564d7 100644 --- a/apps/web/ee/components/dashboards/widgets/dropdown/root.tsx +++ b/apps/web/ee/components/dashboards/widgets/dropdown/root.tsx @@ -21,7 +21,7 @@ type Props = { selectedChartType?: EWidgetChartTypes | undefined; }; -export const DashboardWidgetChartTypesDropdown: React.FC = observer((props) => { +export const DashboardWidgetChartTypesDropdown = observer(function DashboardWidgetChartTypesDropdown(props: Props) { const { buttonClassName, buttonContent, diff --git a/apps/web/ee/components/dashboards/widgets/empty-states/empty-state.tsx b/apps/web/ee/components/dashboards/widgets/empty-states/empty-state.tsx index a210d162ff..ad0597e414 100644 --- a/apps/web/ee/components/dashboards/widgets/empty-states/empty-state.tsx +++ b/apps/web/ee/components/dashboards/widgets/empty-states/empty-state.tsx @@ -19,7 +19,7 @@ type Props = { widget: DashboardWidgetInstance; }; -export const DashboardWidgetEmptyState: React.FC = observer((props) => { +export const DashboardWidgetEmptyState = observer(function DashboardWidgetEmptyState(props: Props) { const { activeBreakpoint, dashboardId, widget } = props; // store hooks const { getDashboardById } = useDashboards(); diff --git a/apps/web/ee/components/dashboards/widgets/empty-states/not-configured-state.tsx b/apps/web/ee/components/dashboards/widgets/empty-states/not-configured-state.tsx index 3aa504f2de..eb0618f72d 100644 --- a/apps/web/ee/components/dashboards/widgets/empty-states/not-configured-state.tsx +++ b/apps/web/ee/components/dashboards/widgets/empty-states/not-configured-state.tsx @@ -18,7 +18,7 @@ type Props = { widgetId: string; }; -export const DashboardWidgetNotConfiguredState: React.FC = observer((props) => { +export const DashboardWidgetNotConfiguredState = observer(function DashboardWidgetNotConfiguredState(props: Props) { const { activeBreakpoint, dashboardId, widgetId } = props; // store hooks const { getDashboardById } = useDashboards(); diff --git a/apps/web/ee/components/dashboards/widgets/empty-states/upgrade-required-state.tsx b/apps/web/ee/components/dashboards/widgets/empty-states/upgrade-required-state.tsx index d603adee69..1b0d31567e 100644 --- a/apps/web/ee/components/dashboards/widgets/empty-states/upgrade-required-state.tsx +++ b/apps/web/ee/components/dashboards/widgets/empty-states/upgrade-required-state.tsx @@ -19,7 +19,7 @@ type Props = { widget: DashboardWidgetInstance; }; -export const DashboardWidgetUpgradeRequiredState: React.FC = observer((props) => { +export const DashboardWidgetUpgradeRequiredState = observer(function DashboardWidgetUpgradeRequiredState(props: Props) { const { activeBreakpoint, widget } = props; // store hooks const { togglePaidPlanModal } = useWorkspaceSubscription(); diff --git a/apps/web/ee/components/dashboards/widgets/icon.tsx b/apps/web/ee/components/dashboards/widgets/icon.tsx index b01ff6522c..e699419afc 100644 --- a/apps/web/ee/components/dashboards/widgets/icon.tsx +++ b/apps/web/ee/components/dashboards/widgets/icon.tsx @@ -22,7 +22,7 @@ type Props = { className?: string; }; -export const WidgetChartTypeIcon: React.FC = (props) => { +export function WidgetChartTypeIcon(props: Props) { const { chartModel, chartType, className } = props; let Icon: React.FC | null = null; @@ -62,4 +62,4 @@ export const WidgetChartTypeIcon: React.FC = (props) => { } return Icon ? : null; -}; +} diff --git a/apps/web/ee/components/dashboards/widgets/loader.tsx b/apps/web/ee/components/dashboards/widgets/loader.tsx index 231612a581..b9ffbe9f15 100644 --- a/apps/web/ee/components/dashboards/widgets/loader.tsx +++ b/apps/web/ee/components/dashboards/widgets/loader.tsx @@ -8,7 +8,7 @@ type Props = { widget: DashboardWidgetInstance; }; -export const DashboardWidgetLoader: React.FC = observer((props) => { +export const DashboardWidgetLoader = observer(function DashboardWidgetLoader(props: Props) { const {} = props; return ( diff --git a/apps/web/ee/components/dashboards/workspace-dashboard-details-root.tsx b/apps/web/ee/components/dashboards/workspace-dashboard-details-root.tsx index 9528b6f29b..22ce8e31b2 100644 --- a/apps/web/ee/components/dashboards/workspace-dashboard-details-root.tsx +++ b/apps/web/ee/components/dashboards/workspace-dashboard-details-root.tsx @@ -9,7 +9,7 @@ import { useDashboards } from "@/plane-web/hooks/store"; import { DashboardsWidgetsListRoot } from "./details/root"; import { DashboardsWidgetConfigSidebarRoot } from "./sidebar"; -export const WorkspaceDashboardDetailsRoot = observer(() => { +export const WorkspaceDashboardDetailsRoot = observer(function WorkspaceDashboardDetailsRoot() { // navigation const { dashboardId, workspaceSlug } = useParams(); // store hooks diff --git a/apps/web/ee/components/de-dupe/de-dupe-button.tsx b/apps/web/ee/components/de-dupe/de-dupe-button.tsx index a7a6db30e0..e43e79fac5 100644 --- a/apps/web/ee/components/de-dupe/de-dupe-button.tsx +++ b/apps/web/ee/components/de-dupe/de-dupe-button.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -16,7 +15,7 @@ type TDeDupeButtonRoot = { label: string; }; -export const DeDupeButtonRoot: FC = observer((props) => { +export const DeDupeButtonRoot = observer(function DeDupeButtonRoot(props: TDeDupeButtonRoot) { const { workspaceSlug, isDuplicateModalOpen, label, handleOnClick } = props; const { isWorkspaceFeatureEnabled } = useWorkspaceFeatures(); if (!isWorkspaceFeatureEnabled(EWorkspaceFeatures.IS_PI_ENABLED)) return <>; diff --git a/apps/web/ee/components/de-dupe/duplicate-modal/block-header.tsx b/apps/web/ee/components/de-dupe/duplicate-modal/block-header.tsx index a331ece1dc..71cd86671a 100644 --- a/apps/web/ee/components/de-dupe/duplicate-modal/block-header.tsx +++ b/apps/web/ee/components/de-dupe/duplicate-modal/block-header.tsx @@ -1,4 +1,3 @@ -"use-client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -13,7 +12,9 @@ type DuplicateIssueReadOnlyHeaderRoot = { issue: TDeDupeIssue; }; -export const DuplicateIssueReadOnlyHeaderRoot: FC = observer((props) => { +export const DuplicateIssueReadOnlyHeaderRoot = observer(function DuplicateIssueReadOnlyHeaderRoot( + props: DuplicateIssueReadOnlyHeaderRoot +) { const { issue } = props; // store const { getProjectById } = useProject(); diff --git a/apps/web/ee/components/de-dupe/duplicate-modal/block-root.tsx b/apps/web/ee/components/de-dupe/duplicate-modal/block-root.tsx index 72d543de16..9aa1b3c535 100644 --- a/apps/web/ee/components/de-dupe/duplicate-modal/block-root.tsx +++ b/apps/web/ee/components/de-dupe/duplicate-modal/block-root.tsx @@ -1,4 +1,3 @@ -"use-client"; import type { FC } from "react"; import React from "react"; // plane imports @@ -13,7 +12,7 @@ type TDuplicateIssueReadOnlyBlockRootProps = { issue: TDeDupeIssue; }; -export const DuplicateIssueReadOnlyBlockRoot: FC = (props) => { +export function DuplicateIssueReadOnlyBlockRoot(props: TDuplicateIssueReadOnlyBlockRootProps) { const { workspaceSlug, issue } = props; return ( @@ -21,4 +20,4 @@ export const DuplicateIssueReadOnlyBlockRoot: FC ); -}; +} diff --git a/apps/web/ee/components/de-dupe/duplicate-modal/root.tsx b/apps/web/ee/components/de-dupe/duplicate-modal/root.tsx index bf9b1c4581..54ae90e7d8 100644 --- a/apps/web/ee/components/de-dupe/duplicate-modal/root.tsx +++ b/apps/web/ee/components/de-dupe/duplicate-modal/root.tsx @@ -1,5 +1,3 @@ -"use-client"; - import type { FC } from "react"; // plane imports import { CloseIcon, PlaneAIIcon } from "@plane/propel/icons"; @@ -14,7 +12,7 @@ type TDuplicateModalRootProps = { handleDuplicateIssueModal: (value: boolean) => void; }; -export const DuplicateModalRoot: FC = (props) => { +export function DuplicateModalRoot(props: TDuplicateModalRootProps) { const { workspaceSlug, issues, handleDuplicateIssueModal } = props; return ( <> @@ -44,4 +42,4 @@ export const DuplicateModalRoot: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/de-dupe/duplicate-popover/block-header.tsx b/apps/web/ee/components/de-dupe/duplicate-popover/block-header.tsx index 322a19dd6b..3eb91b5d37 100644 --- a/apps/web/ee/components/de-dupe/duplicate-popover/block-header.tsx +++ b/apps/web/ee/components/de-dupe/duplicate-popover/block-header.tsx @@ -1,4 +1,3 @@ -"use-client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -34,7 +33,7 @@ type TDeDupeIssueBlockHeaderProps = { isIntakeIssue?: boolean; }; -export const DeDupeIssueBlockHeader: FC = observer((props) => { +export const DeDupeIssueBlockHeader = observer(function DeDupeIssueBlockHeader(props: TDeDupeIssueBlockHeaderProps) { const { workspaceSlug, issue, diff --git a/apps/web/ee/components/de-dupe/duplicate-popover/block-root.tsx b/apps/web/ee/components/de-dupe/duplicate-popover/block-root.tsx index 407fec2476..30044bc6f5 100644 --- a/apps/web/ee/components/de-dupe/duplicate-popover/block-root.tsx +++ b/apps/web/ee/components/de-dupe/duplicate-popover/block-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // plane imports import type { TDeDupeIssue } from "@plane/types"; @@ -22,7 +20,7 @@ type TDeDupeIssueBlockRootProps = { isIntakeIssue?: boolean; }; -export const DeDupeIssueBlockRoot: FC = (props) => { +export function DeDupeIssueBlockRoot(props: TDeDupeIssueBlockRootProps) { const { workspaceSlug, issue, @@ -48,4 +46,4 @@ export const DeDupeIssueBlockRoot: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/de-dupe/duplicate-popover/root.tsx b/apps/web/ee/components/de-dupe/duplicate-popover/root.tsx index 151a65f9b3..f3769db247 100644 --- a/apps/web/ee/components/de-dupe/duplicate-popover/root.tsx +++ b/apps/web/ee/components/de-dupe/duplicate-popover/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -37,7 +35,7 @@ type TDeDupeIssuePopoverRootProps = { isIntakeIssue?: boolean; }; -export const DeDupeIssuePopoverRoot: FC = observer((props) => { +export const DeDupeIssuePopoverRoot = observer(function DeDupeIssuePopoverRoot(props: TDeDupeIssuePopoverRootProps) { const { workspaceSlug, projectId, diff --git a/apps/web/ee/components/de-dupe/issue-block/block-content.tsx b/apps/web/ee/components/de-dupe/issue-block/block-content.tsx index bd82596de1..a46963f257 100644 --- a/apps/web/ee/components/de-dupe/issue-block/block-content.tsx +++ b/apps/web/ee/components/de-dupe/issue-block/block-content.tsx @@ -1,5 +1,3 @@ -"use-client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -13,7 +11,7 @@ import { useProjectState } from "@/hooks/store/use-project-state"; type TDeDupeIssueBlockContentProps = { issue: TDeDupeIssue }; -export const DeDupeIssueBlockContent: FC = observer((props) => { +export const DeDupeIssueBlockContent = observer(function DeDupeIssueBlockContent(props: TDeDupeIssueBlockContentProps) { const { issue } = props; // store const { getStateById } = useProjectState(); diff --git a/apps/web/ee/components/de-dupe/issue-block/block-wrapper.tsx b/apps/web/ee/components/de-dupe/issue-block/block-wrapper.tsx index 30777d2ce1..502fb5c87d 100644 --- a/apps/web/ee/components/de-dupe/issue-block/block-wrapper.tsx +++ b/apps/web/ee/components/de-dupe/issue-block/block-wrapper.tsx @@ -1,5 +1,3 @@ -"use-client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ type TDeDupeIssueBlockWrapperProps = { isSelected?: boolean; }; -export const DeDupeIssueBlockWrapper: FC = observer((props) => { +export const DeDupeIssueBlockWrapper = observer(function DeDupeIssueBlockWrapper(props: TDeDupeIssueBlockWrapperProps) { const { workspaceSlug, issue, isSelected = false, children } = props; // store hooks const { getProjectIdentifierById } = useProject(); diff --git a/apps/web/ee/components/de-dupe/issue-block/button-label.tsx b/apps/web/ee/components/de-dupe/issue-block/button-label.tsx index a3eefd8c86..46df003097 100644 --- a/apps/web/ee/components/de-dupe/issue-block/button-label.tsx +++ b/apps/web/ee/components/de-dupe/issue-block/button-label.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // plane imports import { ChevronRightIcon, PlaneAIIcon } from "@plane/propel/icons"; @@ -10,7 +8,7 @@ type TDeDupeIssueButtonLabelProps = { buttonLabel: string; }; -export const DeDupeIssueButtonLabel: FC = (props) => { +export function DeDupeIssueButtonLabel(props: TDeDupeIssueButtonLabelProps) { const { isOpen, buttonLabel } = props; return (
    = (props)
    ); -}; +} diff --git a/apps/web/ee/components/desktop/context/index.tsx b/apps/web/ee/components/desktop/context/index.tsx index 7655603aab..33f9269866 100644 --- a/apps/web/ee/components/desktop/context/index.tsx +++ b/apps/web/ee/components/desktop/context/index.tsx @@ -1,5 +1,3 @@ -"use client"; - import { createContext, useEffect, useState, useMemo, useCallback } from "react"; // todesktop import { nativeWindow } from "@todesktop/client-core"; @@ -17,7 +15,7 @@ export type TDesktopAppProviderProps = { children: React.ReactNode; }; -export const DesktopAppProvider = observer((props: TDesktopAppProviderProps) => { +export const DesktopAppProvider = observer(function DesktopAppProvider(props: TDesktopAppProviderProps) { const { children } = props; // states const [isFullScreen, setIsFullScreen] = useState(false); diff --git a/apps/web/ee/components/desktop/navigation.tsx b/apps/web/ee/components/desktop/navigation.tsx index d4fa7010a3..e5bb6be28b 100644 --- a/apps/web/ee/components/desktop/navigation.tsx +++ b/apps/web/ee/components/desktop/navigation.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState } from "react"; import { webContents } from "@todesktop/client-core"; import { observer } from "mobx-react"; @@ -9,7 +7,7 @@ import { Tooltip } from "@plane/propel/tooltip"; // helpers import { cn } from "@plane/utils"; -export const DesktopAppNavigation = observer(() => { +export const DesktopAppNavigation = observer(function DesktopAppNavigation() { // states const [isForwardNavigationDisabled, setIsForwardNavigationDisabled] = useState(true); const [isBackwardNavigationDisabled, setIsBackwardNavigationDisabled] = useState(true); diff --git a/apps/web/ee/components/desktop/root.tsx b/apps/web/ee/components/desktop/root.tsx index 4ed77ddbec..97b87c87ef 100644 --- a/apps/web/ee/components/desktop/root.tsx +++ b/apps/web/ee/components/desktop/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; import { isDesktopApp as isDesktopAppFn } from "@todesktop/client-core/platform/todesktop"; import { observer } from "mobx-react"; diff --git a/apps/web/ee/components/desktop/sidebar-toggle.tsx b/apps/web/ee/components/desktop/sidebar-toggle.tsx index 1f5e4966a2..03c38c8cc0 100644 --- a/apps/web/ee/components/desktop/sidebar-toggle.tsx +++ b/apps/web/ee/components/desktop/sidebar-toggle.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; import { observer } from "mobx-react"; import { useParams, usePathname } from "next/navigation"; diff --git a/apps/web/ee/components/dropdowns/epics.tsx b/apps/web/ee/components/dropdowns/epics.tsx index 2639090560..bbca21a424 100644 --- a/apps/web/ee/components/dropdowns/epics.tsx +++ b/apps/web/ee/components/dropdowns/epics.tsx @@ -41,7 +41,7 @@ type Props = TDropdownProps & { } ); const workspaceService = new WorkspaceService(); -export const EpicsDropdown: React.FC = observer((props) => { +export const EpicsDropdown = observer(function EpicsDropdown(props: Props) { const { button, buttonClassName, diff --git a/apps/web/ee/components/editor/embeds/mentions/root.tsx b/apps/web/ee/components/editor/embeds/mentions/root.tsx index a2991b48b6..5507e9ddf2 100644 --- a/apps/web/ee/components/editor/embeds/mentions/root.tsx +++ b/apps/web/ee/components/editor/embeds/mentions/root.tsx @@ -8,11 +8,11 @@ export type TEditorMentionComponentProps = TCallbackMentionComponentProps & { getMentionDetails?: (mentionType: TEditorMentionType, entityId: string) => TEditorMentionItem | undefined; }; -export const EditorAdditionalMentionsRoot: React.FC = (props) => { +export function EditorAdditionalMentionsRoot(props: TEditorMentionComponentProps) { const { entity_name } = props; switch (entity_name) { case "issue_mention": return ; } -}; +} diff --git a/apps/web/ee/components/editor/embeds/mentions/work-item/content.tsx b/apps/web/ee/components/editor/embeds/mentions/work-item/content.tsx index 45bed656f6..493aaaf2fa 100644 --- a/apps/web/ee/components/editor/embeds/mentions/work-item/content.tsx +++ b/apps/web/ee/components/editor/embeds/mentions/work-item/content.tsx @@ -12,7 +12,7 @@ type Props = { workItemDetails: TEditorWorkItemMention; }; -export const EditorWorkItemMentionContent: React.FC = observer((props) => { +export const EditorWorkItemMentionContent = observer(function EditorWorkItemMentionContent(props: Props) { const { workItemDetails } = props; // params const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/editor/embeds/mentions/work-item/logo.tsx b/apps/web/ee/components/editor/embeds/mentions/work-item/logo.tsx index b922e29c0b..079dea95b4 100644 --- a/apps/web/ee/components/editor/embeds/mentions/work-item/logo.tsx +++ b/apps/web/ee/components/editor/embeds/mentions/work-item/logo.tsx @@ -16,7 +16,7 @@ type Props = { workItemTypeId?: TIssue["type_id"]; }; -export const EditorWorkItemMentionLogo: React.FC = observer((props) => { +export const EditorWorkItemMentionLogo = observer(function EditorWorkItemMentionLogo(props: Props) { const { className, projectId, showOnlyWorkItemType = false, stateColor, stateGroup, workItemTypeId } = props; // params const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/editor/embeds/mentions/work-item/preview.tsx b/apps/web/ee/components/editor/embeds/mentions/work-item/preview.tsx index 8c7ee94b44..6aa1922e08 100644 --- a/apps/web/ee/components/editor/embeds/mentions/work-item/preview.tsx +++ b/apps/web/ee/components/editor/embeds/mentions/work-item/preview.tsx @@ -8,7 +8,7 @@ type Props = { workItemDetails: TEditorWorkItemMention; }; -export const EditorWorkItemMentionPreview: React.FC = observer((props) => { +export const EditorWorkItemMentionPreview = observer(function EditorWorkItemMentionPreview(props: Props) { const { workItemDetails } = props; return ( diff --git a/apps/web/ee/components/editor/embeds/mentions/work-item/root.tsx b/apps/web/ee/components/editor/embeds/mentions/work-item/root.tsx index 0f947c48de..05d6fda31c 100644 --- a/apps/web/ee/components/editor/embeds/mentions/work-item/root.tsx +++ b/apps/web/ee/components/editor/embeds/mentions/work-item/root.tsx @@ -17,7 +17,7 @@ import { EditorWorkItemMentionPreview } from "./preview"; // services init const workspaceService = new WorkspaceService(); -export const EditorWorkItemMention: React.FC = observer((props) => { +export const EditorWorkItemMention = observer(function EditorWorkItemMention(props: TEditorMentionComponentProps) { const { entity_identifier: workItemId, getMentionDetails } = props; // params const { workspaceSlug } = useParams(); @@ -46,7 +46,11 @@ export const EditorWorkItemMention: React.FC = obs // derived values const savedWorkItemDetails = formattedWorkItemDetails || getMentionDetails?.("issue_mention", workItemId); // fetch work item details - const { data: fetchedWorkItemDetails, isLoading: isFetchingWorkItemDetails, error: errorFetchingWorkItemDetails } = useSWRImmutable( + const { + data: fetchedWorkItemDetails, + isLoading: isFetchingWorkItemDetails, + error: errorFetchingWorkItemDetails, + } = useSWRImmutable( workspaceSlug && !savedWorkItemDetails ? `WORK_ITEM_MENTION_DETAILS_${workItemId}` : null, workspaceSlug && !savedWorkItemDetails ? () => workspaceService.retrieveWorkspaceWorkItem(workspaceSlug, workItemId) diff --git a/apps/web/ee/components/epics/conversions/icon.tsx b/apps/web/ee/components/epics/conversions/icon.tsx index b99231970e..9a1d89120c 100644 --- a/apps/web/ee/components/epics/conversions/icon.tsx +++ b/apps/web/ee/components/epics/conversions/icon.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { ArrowRight } from "lucide-react"; @@ -14,7 +13,7 @@ interface ConvertWorkItemIconProps { disabled?: boolean; } -export const ConvertWorkItemIcon: FC = (props) => { +export function ConvertWorkItemIcon(props: ConvertWorkItemIconProps) { const { handleOnClick, conversionType, disabled = false } = props; // derived values const IconComponent = conversionType === EWorkItemConversionType.WORK_ITEM ? LayersIcon : EpicIcon; @@ -41,4 +40,4 @@ export const ConvertWorkItemIcon: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/epics/conversions/root.tsx b/apps/web/ee/components/epics/conversions/root.tsx index b6c64cc737..e03b744ab7 100644 --- a/apps/web/ee/components/epics/conversions/root.tsx +++ b/apps/web/ee/components/epics/conversions/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -24,7 +22,7 @@ type Props = { disabled?: boolean; }; -export const ConvertWorkItemAction: FC = observer((props) => { +export const ConvertWorkItemAction = observer(function ConvertWorkItemAction(props: Props) { const { workItemId, conversionType, disabled = false } = props; // navigation const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/epics/details/empty-state.tsx b/apps/web/ee/components/epics/details/empty-state.tsx index 1295adea63..039f963239 100644 --- a/apps/web/ee/components/epics/details/empty-state.tsx +++ b/apps/web/ee/components/epics/details/empty-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // assets import emptyIssue from "@/app/assets/empty-state/issue.svg?url"; @@ -13,7 +11,7 @@ type TEpicEmptyStateProps = { projectId: string; }; -export const EpicEmptyState: FC = (props) => { +export function EpicEmptyState(props: TEpicEmptyStateProps) { const { workspaceSlug, projectId } = props; const router = useAppRouter(); return ( @@ -27,4 +25,4 @@ export const EpicEmptyState: FC = (props) => { }} /> ); -}; +} diff --git a/apps/web/ee/components/epics/details/helper.tsx b/apps/web/ee/components/epics/details/helper.tsx index ec58f19593..c1855271a7 100644 --- a/apps/web/ee/components/epics/details/helper.tsx +++ b/apps/web/ee/components/epics/details/helper.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; import type { TIssue } from "@plane/types"; diff --git a/apps/web/ee/components/epics/details/main/info-section-root.tsx b/apps/web/ee/components/epics/details/main/info-section-root.tsx index 24524cb706..c703d73c27 100644 --- a/apps/web/ee/components/epics/details/main/info-section-root.tsx +++ b/apps/web/ee/components/epics/details/main/info-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -24,7 +22,7 @@ type Props = { disabled?: boolean; }; -export const EpicInfoSection: FC = observer((props) => { +export const EpicInfoSection = observer(function EpicInfoSection(props: Props) { const { editorRef, workspaceSlug, projectId, epicId, disabled = false } = props; // store hooks const { diff --git a/apps/web/ee/components/epics/details/main/info-section/action-items.tsx b/apps/web/ee/components/epics/details/main/info-section/action-items.tsx index 4fee273511..7117840b41 100644 --- a/apps/web/ee/components/epics/details/main/info-section/action-items.tsx +++ b/apps/web/ee/components/epics/details/main/info-section/action-items.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -24,7 +22,7 @@ type TEpicInfoActionItemsProps = { disabled: boolean; }; -export const EpicInfoActionItems: FC = observer((props) => { +export const EpicInfoActionItems = observer(function EpicInfoActionItems(props: TEpicInfoActionItemsProps) { const { editorRef, workspaceSlug, projectId, epicId, disabled } = props; // store hooks const { data: currentUser } = useUser(); diff --git a/apps/web/ee/components/epics/details/main/info-section/indicator-item.tsx b/apps/web/ee/components/epics/details/main/info-section/indicator-item.tsx index 1636e808e4..76b2c086bc 100644 --- a/apps/web/ee/components/epics/details/main/info-section/indicator-item.tsx +++ b/apps/web/ee/components/epics/details/main/info-section/indicator-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { omit } from "lodash-es"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ type TEpicInfoIndicatorItemProps = { epicId: string; }; -export const EpicInfoIndicatorItem: FC = observer((props) => { +export const EpicInfoIndicatorItem = observer(function EpicInfoIndicatorItem(props: TEpicInfoIndicatorItemProps) { const { epicId } = props; // hooks const { getEpicAnalyticsById } = useEpicAnalytics(); diff --git a/apps/web/ee/components/epics/details/main/overview-section-root.tsx b/apps/web/ee/components/epics/details/main/overview-section-root.tsx index ff4beed9f1..f5c773754f 100644 --- a/apps/web/ee/components/epics/details/main/overview-section-root.tsx +++ b/apps/web/ee/components/epics/details/main/overview-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -25,7 +23,7 @@ type Props = { disabled?: boolean; }; -export const EpicOverviewRoot: FC = observer((props) => { +export const EpicOverviewRoot = observer(function EpicOverviewRoot(props: Props) { const { workspaceSlug, projectId, epicId, disabled = false } = props; // store hooks const { storedValue } = useLocalStorage(`tab-epic-detail-overview-${epicId}`, "issues"); diff --git a/apps/web/ee/components/epics/details/main/overview-section/customers-root.tsx b/apps/web/ee/components/epics/details/main/overview-section/customers-root.tsx index 19e5369fac..c8f20792bb 100644 --- a/apps/web/ee/components/epics/details/main/overview-section/customers-root.tsx +++ b/apps/web/ee/components/epics/details/main/overview-section/customers-root.tsx @@ -14,7 +14,7 @@ type TProps = { disabled?: boolean; }; -export const EpicCustomersRoot: FC = observer((props) => { +export const EpicCustomersRoot = observer(function EpicCustomersRoot(props: TProps) { const { workspaceSlug, epicId, disabled = false } = props; // store hooks const { diff --git a/apps/web/ee/components/epics/details/main/overview-section/issues-root.tsx b/apps/web/ee/components/epics/details/main/overview-section/issues-root.tsx index 4558f1e9da..94aecf4430 100644 --- a/apps/web/ee/components/epics/details/main/overview-section/issues-root.tsx +++ b/apps/web/ee/components/epics/details/main/overview-section/issues-root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useEffect, useState, useCallback } from "react"; import { observer } from "mobx-react"; @@ -29,7 +28,7 @@ type Props = { type TIssueCrudState = { toggle: boolean; parentIssueId: string | undefined; issue: TIssue | undefined }; -export const EpicIssuesOverviewRoot: FC = observer((props) => { +export const EpicIssuesOverviewRoot = observer(function EpicIssuesOverviewRoot(props: Props) { const { workspaceSlug, projectId, epicId, disabled = false } = props; // state const [issueCrudState, setIssueCrudState] = useState<{ diff --git a/apps/web/ee/components/epics/details/main/overview-section/modals-root.tsx b/apps/web/ee/components/epics/details/main/overview-section/modals-root.tsx index 7ff8f445e9..de16ad7e07 100644 --- a/apps/web/ee/components/epics/details/main/overview-section/modals-root.tsx +++ b/apps/web/ee/components/epics/details/main/overview-section/modals-root.tsx @@ -18,7 +18,7 @@ type Props = { epicId: string; }; -export const EpicOverviewWidgetModals: FC = observer((props) => { +export const EpicOverviewWidgetModals = observer(function EpicOverviewWidgetModals(props: Props) { const { workspaceSlug, projectId, epicId } = props; // store hooks const { diff --git a/apps/web/ee/components/epics/details/main/overview-section/relation-root.tsx b/apps/web/ee/components/epics/details/main/overview-section/relation-root.tsx index 6e8c9fc517..011d02fbc7 100644 --- a/apps/web/ee/components/epics/details/main/overview-section/relation-root.tsx +++ b/apps/web/ee/components/epics/details/main/overview-section/relation-root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { isEmpty } from "lodash-es"; @@ -20,7 +19,7 @@ type Props = { disabled?: boolean; }; -export const EpicRelationsOverviewRoot: FC = observer((props) => { +export const EpicRelationsOverviewRoot = observer(function EpicRelationsOverviewRoot(props: Props) { const { workspaceSlug, epicId, disabled = false } = props; // store hooks const { diff --git a/apps/web/ee/components/epics/details/main/overview-section/work-items-actions.tsx b/apps/web/ee/components/epics/details/main/overview-section/work-items-actions.tsx index 5ae2ec465d..4ab9c57dc2 100644 --- a/apps/web/ee/components/epics/details/main/overview-section/work-items-actions.tsx +++ b/apps/web/ee/components/epics/details/main/overview-section/work-items-actions.tsx @@ -30,7 +30,7 @@ type TSubWorkItemsActionsProps = { workspaceSlug: string; }; -export const SubWorkItemsActions: FC = observer((props) => { +export const SubWorkItemsActions = observer(function SubWorkItemsActions(props: TSubWorkItemsActionsProps) { const { workItemId, workItemServiceType, disabled, projectId, workspaceSlug } = props; // store hooks diff --git a/apps/web/ee/components/epics/details/main/progress-section-root.tsx b/apps/web/ee/components/epics/details/main/progress-section-root.tsx index 6835bbc5f5..00925ed359 100644 --- a/apps/web/ee/components/epics/details/main/progress-section-root.tsx +++ b/apps/web/ee/components/epics/details/main/progress-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ type Props = { epicId: string; }; -export const EpicProgressSection: FC = observer((props) => { +export const EpicProgressSection = observer(function EpicProgressSection(props: Props) { const { epicId } = props; // store hooks const { diff --git a/apps/web/ee/components/epics/details/main/root.tsx b/apps/web/ee/components/epics/details/main/root.tsx index 7f66c35f09..ccc6b78b53 100644 --- a/apps/web/ee/components/epics/details/main/root.tsx +++ b/apps/web/ee/components/epics/details/main/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import type { EditorRefApi } from "@plane/editor"; @@ -23,7 +21,7 @@ type Props = { disabled?: boolean; }; -export const EpicMainContentRoot: React.FC = observer((props) => { +export const EpicMainContentRoot = observer(function EpicMainContentRoot(props: Props) { const { editorRef, workspaceSlug, projectId, epicId, disabled = false } = props; // store hooks const { epicDetailSidebarCollapsed } = useAppTheme(); diff --git a/apps/web/ee/components/epics/details/root.tsx b/apps/web/ee/components/epics/details/root.tsx index 8ca1a2bf36..c67920e4d5 100644 --- a/apps/web/ee/components/epics/details/root.tsx +++ b/apps/web/ee/components/epics/details/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -27,7 +25,7 @@ export type TIssueDetailRoot = { epicId: string; }; -export const EpicDetailRoot: FC = observer((props) => { +export const EpicDetailRoot = observer(function EpicDetailRoot(props: TIssueDetailRoot) { const { editorRef, workspaceSlug, projectId, epicId } = props; // hooks const { fetchEpicAnalytics } = useEpicAnalytics(); diff --git a/apps/web/ee/components/epics/details/sidebar/activity-tab-root.tsx b/apps/web/ee/components/epics/details/sidebar/activity-tab-root.tsx index 2f903fd121..ba43833a77 100644 --- a/apps/web/ee/components/epics/details/sidebar/activity-tab-root.tsx +++ b/apps/web/ee/components/epics/details/sidebar/activity-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -23,7 +21,7 @@ type TEpicDetailActivityRootProps = { epicId: string; }; -export const EpicSidebarActivityRoot: FC = observer((props) => { +export const EpicSidebarActivityRoot = observer(function EpicSidebarActivityRoot(props: TEpicDetailActivityRootProps) { const { epicId } = props; // i18n const { t } = useTranslation(); @@ -63,7 +61,7 @@ export const EpicSidebarActivityRoot: FC = observe
    {filteredActivityComments.length > 0 && filteredActivityComments.map((activityComment, index) => { - const currActivityComment = activityComment as TIssueActivityComment; + const currActivityComment = activityComment; return currActivityComment.activity_type === "ACTIVITY" ? ( { +export const EpicActivityItem = observer(function EpicActivityItem(props: TEpicActivityItemProps) { const { id, ends } = props; const { diff --git a/apps/web/ee/components/epics/details/sidebar/comment-tab-root.tsx b/apps/web/ee/components/epics/details/sidebar/comment-tab-root.tsx index fcf0acb5f7..43893def12 100644 --- a/apps/web/ee/components/epics/details/sidebar/comment-tab-root.tsx +++ b/apps/web/ee/components/epics/details/sidebar/comment-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,7 @@ type TEpicSidebarCommentsRootProps = { disabled?: boolean; }; -export const EpicSidebarCommentsRoot: FC = observer((props) => { +export const EpicSidebarCommentsRoot = observer(function EpicSidebarCommentsRoot(props: TEpicSidebarCommentsRootProps) { const { workspaceSlug, projectId, epicId, disabled = false } = props; // i18n const { t } = useTranslation(); diff --git a/apps/web/ee/components/epics/details/sidebar/properties-tab-root.tsx b/apps/web/ee/components/epics/details/sidebar/properties-tab-root.tsx index a715f22b84..61345797a2 100644 --- a/apps/web/ee/components/epics/details/sidebar/properties-tab-root.tsx +++ b/apps/web/ee/components/epics/details/sidebar/properties-tab-root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { observer } from "mobx-react"; import { useTranslation } from "@plane/i18n"; @@ -50,7 +49,7 @@ type Props = { disabled: boolean; }; -export const EpicSidebarPropertiesRoot: FC = observer((props) => { +export const EpicSidebarPropertiesRoot = observer(function EpicSidebarPropertiesRoot(props: Props) { const { workspaceSlug, projectId, epicId, disabled } = props; // store hooks const { diff --git a/apps/web/ee/components/epics/details/sidebar/root.tsx b/apps/web/ee/components/epics/details/sidebar/root.tsx index 542968b6d9..3da35daa43 100644 --- a/apps/web/ee/components/epics/details/sidebar/root.tsx +++ b/apps/web/ee/components/epics/details/sidebar/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,7 @@ type TEpicDetailsSidebarProps = { disabled?: boolean; }; -export const EpicDetailsSidebar: FC = observer((props) => { +export const EpicDetailsSidebar = observer(function EpicDetailsSidebar(props: TEpicDetailsSidebarProps) { const { workspaceSlug, projectId, epicId, disabled = false } = props; // store hooks const { epicDetailSidebarCollapsed } = useAppTheme(); diff --git a/apps/web/ee/components/epics/epic-modal/base.tsx b/apps/web/ee/components/epics/epic-modal/base.tsx index 2ce287b80a..068eed2a00 100644 --- a/apps/web/ee/components/epics/epic-modal/base.tsx +++ b/apps/web/ee/components/epics/epic-modal/base.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect, useRef, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -25,7 +23,7 @@ const fileService = new FileService(); import type { EpicFormProps } from "./form"; import { EpicFormRoot } from "./form"; -export const CreateUpdateEpicModalBase: React.FC = observer((props) => { +export const CreateUpdateEpicModalBase = observer(function CreateUpdateEpicModalBase(props: IssuesModalProps) { const { data, isOpen, diff --git a/apps/web/ee/components/epics/epic-modal/components/default-properties.tsx b/apps/web/ee/components/epics/epic-modal/components/default-properties.tsx index 45e41af9a4..13d9692fbc 100644 --- a/apps/web/ee/components/epics/epic-modal/components/default-properties.tsx +++ b/apps/web/ee/components/epics/epic-modal/components/default-properties.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -36,7 +34,7 @@ type TIssueDefaultPropertiesProps = { setSelectedParentIssue: (issue: ISearchIssueResponse) => void; }; -export const EpicDefaultProperties: React.FC = observer((props) => { +export const EpicDefaultProperties = observer(function EpicDefaultProperties(props: TIssueDefaultPropertiesProps) { const { id, control, projectId, startDate, targetDate, handleFormChange } = props; const { workspaceSlug } = useParams(); // store hooks diff --git a/apps/web/ee/components/epics/epic-modal/form.tsx b/apps/web/ee/components/epics/epic-modal/form.tsx index a0f98fc0d6..258a153214 100644 --- a/apps/web/ee/components/epics/epic-modal/form.tsx +++ b/apps/web/ee/components/epics/epic-modal/form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useEffect, useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -63,7 +61,7 @@ export interface EpicFormProps { dataResetProperties?: any[]; } -export const EpicFormRoot: FC = observer((props) => { +export const EpicFormRoot = observer(function EpicFormRoot(props: EpicFormProps) { const { data, issueTitleRef, diff --git a/apps/web/ee/components/epics/epic-modal/modal.tsx b/apps/web/ee/components/epics/epic-modal/modal.tsx index 8117dcf4ba..9eb84d0b93 100644 --- a/apps/web/ee/components/epics/epic-modal/modal.tsx +++ b/apps/web/ee/components/epics/epic-modal/modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // types @@ -25,11 +23,12 @@ export interface EpicModalProps { isConversionOperation?: boolean; } -export const CreateUpdateEpicModal: React.FC = observer( - (props) => +export const CreateUpdateEpicModal = observer(function CreateUpdateEpicModal(props: EpicModalProps) { + return ( props.isOpen && ( ) -); + ); +}); diff --git a/apps/web/ee/components/epics/epic-modal/provider.tsx b/apps/web/ee/components/epics/epic-modal/provider.tsx index 31f7d29358..9f518311c7 100644 --- a/apps/web/ee/components/epics/epic-modal/provider.tsx +++ b/apps/web/ee/components/epics/epic-modal/provider.tsx @@ -30,7 +30,7 @@ type TEpicModalProviderProps = { const epicPropertyValuesService = new IssuePropertyValuesService(EIssueServiceType.EPICS); -export const EpicModalProvider = observer((props: TEpicModalProviderProps) => { +export const EpicModalProvider = observer(function EpicModalProvider(props: TEpicModalProviderProps) { const { children } = props; // states const [workItemTemplateId, setWorkItemTemplateId] = useState(null); diff --git a/apps/web/ee/components/epics/peek-overview/error.tsx b/apps/web/ee/components/epics/peek-overview/error.tsx index 94990a1c12..373a34c965 100644 --- a/apps/web/ee/components/epics/peek-overview/error.tsx +++ b/apps/web/ee/components/epics/peek-overview/error.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { MoveRight } from "lucide-react"; // plane imports @@ -15,7 +13,7 @@ type TEpicPeekOverviewError = { removeRoutePeekId: () => void; }; -export const EpicPeekOverviewError: FC = (props) => { +export function EpicPeekOverviewError(props: TEpicPeekOverviewError) { const { removeRoutePeekId } = props; // hooks const { isMobile } = usePlatformOS(); @@ -39,4 +37,4 @@ export const EpicPeekOverviewError: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/epics/peek-overview/header.tsx b/apps/web/ee/components/epics/peek-overview/header.tsx index e31fcb0649..b802f6043d 100644 --- a/apps/web/ee/components/epics/peek-overview/header.tsx +++ b/apps/web/ee/components/epics/peek-overview/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -65,7 +63,7 @@ export type PeekOverviewHeaderProps = { isSubmitting: "submitting" | "submitted" | "saved"; }; -export const EpicPeekOverviewHeader: FC = observer((props) => { +export const EpicPeekOverviewHeader = observer(function EpicPeekOverviewHeader(props: PeekOverviewHeaderProps) { const { peekMode, setPeekMode, diff --git a/apps/web/ee/components/epics/peek-overview/loader.tsx b/apps/web/ee/components/epics/peek-overview/loader.tsx index 8e379907a5..b4ba8aa910 100644 --- a/apps/web/ee/components/epics/peek-overview/loader.tsx +++ b/apps/web/ee/components/epics/peek-overview/loader.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { MoveRight } from "lucide-react"; // plane imports @@ -12,7 +10,7 @@ type TIssuePeekOverviewLoader = { removeRoutePeekId: () => void; }; -export const EpicPeekOverviewLoader: FC = (props) => { +export function EpicPeekOverviewLoader(props: TIssuePeekOverviewLoader) { const { removeRoutePeekId } = props; // hooks const { isMobile } = usePlatformOS(); @@ -105,4 +103,4 @@ export const EpicPeekOverviewLoader: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/epics/peek-overview/root.tsx b/apps/web/ee/components/epics/peek-overview/root.tsx index e07b5d082a..823def12a0 100644 --- a/apps/web/ee/components/epics/peek-overview/root.tsx +++ b/apps/web/ee/components/epics/peek-overview/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState, useMemo, useCallback } from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ import { useUserPermissions } from "@/hooks/store/user"; import { useWorkItemProperties } from "@/plane-web/hooks/use-issue-properties"; import { EpicView } from "./view"; -export const EpicPeekOverview: FC = observer((props) => { +export const EpicPeekOverview = observer(function EpicPeekOverview(props: IWorkItemPeekOverview) { const { embedIssue = false, embedRemoveCurrentNotification } = props; // store hook const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/epics/peek-overview/view.tsx b/apps/web/ee/components/epics/peek-overview/view.tsx index bffc7d5f28..30a91d1b3a 100644 --- a/apps/web/ee/components/epics/peek-overview/view.tsx +++ b/apps/web/ee/components/epics/peek-overview/view.tsx @@ -36,7 +36,7 @@ interface IEpicView { issueOperations: TIssueOperations; } -export const EpicView: FC = observer((props) => { +export const EpicView = observer(function EpicView(props: IEpicView) { const { workspaceSlug, projectId, diff --git a/apps/web/ee/components/epics/quick-actions/epic-quick-action.tsx b/apps/web/ee/components/epics/quick-actions/epic-quick-action.tsx index 8d57ab6593..2ec8c389db 100644 --- a/apps/web/ee/components/epics/quick-actions/epic-quick-action.tsx +++ b/apps/web/ee/components/epics/quick-actions/epic-quick-action.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { pick } from "lodash-es"; import { observer } from "mobx-react"; @@ -33,7 +31,7 @@ type TProjectEpicQuickActionProps = IQuickActionProps & { isPeekMode?: boolean; }; -export const ProjectEpicQuickActions: React.FC = observer((props) => { +export const ProjectEpicQuickActions = observer(function ProjectEpicQuickActions(props: TProjectEpicQuickActionProps) { const { issue, handleDelete, diff --git a/apps/web/ee/components/epics/quick-actions/layout-quick-actions.tsx b/apps/web/ee/components/epics/quick-actions/layout-quick-actions.tsx index b68e88d28c..4017012b39 100644 --- a/apps/web/ee/components/epics/quick-actions/layout-quick-actions.tsx +++ b/apps/web/ee/components/epics/quick-actions/layout-quick-actions.tsx @@ -7,7 +7,7 @@ type Props = { projectId: string; }; -export const EpicLayoutQuickActions = (props: Props) => { +export function EpicLayoutQuickActions(props: Props) { const { workspaceSlug, projectId } = props; const handleCopyLink = () => { @@ -53,4 +53,4 @@ export const EpicLayoutQuickActions = (props: Props) => { {modals} ); -}; +} diff --git a/apps/web/ee/components/epics/settings/empty-state.tsx b/apps/web/ee/components/epics/settings/empty-state.tsx index f335e8dcae..4dbfe4b1b5 100644 --- a/apps/web/ee/components/epics/settings/empty-state.tsx +++ b/apps/web/ee/components/epics/settings/empty-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ type TIssueTypeEmptyState = { redirect?: boolean; }; -export const EpicsEmptyState: FC = observer((props) => { +export const EpicsEmptyState = observer(function EpicsEmptyState(props: TIssueTypeEmptyState) { // props const { workspaceSlug, projectId, redirect = false } = props; // store hooks @@ -79,7 +77,12 @@ export const EpicsEmptyState: FC = observer((props) => { ) ) : isSelfManagedUpgradeDisabled ? ( - + Get Pro ) : ( diff --git a/apps/web/ee/components/epics/settings/epics-properties.tsx b/apps/web/ee/components/epics/settings/epics-properties.tsx index 73e0efbd8e..315eed4c0d 100644 --- a/apps/web/ee/components/epics/settings/epics-properties.tsx +++ b/apps/web/ee/components/epics/settings/epics-properties.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -20,7 +18,7 @@ type EpicPropertiesProps = { getClassName?: (isOpen: boolean) => string; }; -export const EpicPropertiesRoot = observer((props: EpicPropertiesProps) => { +export const EpicPropertiesRoot = observer(function EpicPropertiesRoot(props: EpicPropertiesProps) { // props const { epicId, propertiesLoader, containerClassName, getWorkItemTypeById, getClassName } = props; // hooks diff --git a/apps/web/ee/components/epics/settings/root.tsx b/apps/web/ee/components/epics/settings/root.tsx index 056b1be119..34bff0c58b 100644 --- a/apps/web/ee/components/epics/settings/root.tsx +++ b/apps/web/ee/components/epics/settings/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ import { epicsTrackers } from "../trackers"; import { EpicsEmptyState } from "./empty-state"; import { EpicPropertiesRoot } from "./epics-properties"; -export const EpicsRoot = observer(() => { +export const EpicsRoot = observer(function EpicsRoot() { // router const { workspaceSlug, projectId } = useParams(); // states @@ -89,7 +87,7 @@ export const EpicsRoot = observer(() => {
    diff --git a/apps/web/ee/components/epics/upgrade.tsx b/apps/web/ee/components/epics/upgrade.tsx index 69b8bf5d92..49fb94f855 100644 --- a/apps/web/ee/components/epics/upgrade.tsx +++ b/apps/web/ee/components/epics/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -15,7 +13,7 @@ import EpicsUpgradeLight from "@/app/assets/empty-state/epics/settings-light.web import { SettingsHeading } from "@/components/settings/heading"; import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const EpicsUpgrade: FC = observer(() => { +export const EpicsUpgrade = observer(function EpicsUpgrade() { // store hooks const { t } = useTranslation(); const { resolvedTheme } = useTheme(); @@ -26,7 +24,12 @@ export const EpicsUpgrade: FC = observer(() => { const getUpgradeButton = (): React.ReactNode => { if (isPlaneOneInstance) { return ( - + Upgrade to higher subscription ); diff --git a/apps/web/ee/components/estimates/estimate-list-item-buttons.tsx b/apps/web/ee/components/estimates/estimate-list-item-buttons.tsx index 947507683e..be14779172 100644 --- a/apps/web/ee/components/estimates/estimate-list-item-buttons.tsx +++ b/apps/web/ee/components/estimates/estimate-list-item-buttons.tsx @@ -11,7 +11,7 @@ type TEstimateListItem = { onDeleteClick?: (estimateId: string) => void; }; -export const EstimateListItemButtons: FC = observer((props) => { +export const EstimateListItemButtons = observer(function EstimateListItemButtons(props: TEstimateListItem) { const { estimateId, isAdmin, isEditable, onEditClick } = props; if (!isAdmin || !isEditable) return <>; diff --git a/apps/web/ee/components/estimates/inputs/time-input.tsx b/apps/web/ee/components/estimates/inputs/time-input.tsx index 2cf7fd715e..861da460c1 100644 --- a/apps/web/ee/components/estimates/inputs/time-input.tsx +++ b/apps/web/ee/components/estimates/inputs/time-input.tsx @@ -4,7 +4,7 @@ import { Input } from "@plane/ui"; import { convertMinutesToHoursAndMinutes, convertHoursMinutesToMinutes } from "@plane/utils"; import type { TEstimateTimeInputProps } from "@/ce/components/estimates/inputs"; -export const EstimateTimeInput: FC = (props) => { +export function EstimateTimeInput(props: TEstimateTimeInputProps) { const { value, handleEstimateInputValue } = props; const { hours, minutes } = useMemo(() => convertMinutesToHoursAndMinutes(value || 0), [value]); @@ -47,4 +47,4 @@ export const EstimateTimeInput: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/estimates/points/delete.tsx b/apps/web/ee/components/estimates/points/delete.tsx index c4cc7ed1e5..df779af5ad 100644 --- a/apps/web/ee/components/estimates/points/delete.tsx +++ b/apps/web/ee/components/estimates/points/delete.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -19,7 +17,7 @@ import { EstimatePointDropdown } from "@/plane-web/components/estimates"; // plane web constants import { estimateCount } from "@/plane-web/constants/estimates"; -export const EstimatePointDelete: FC = observer((props) => { +export const EstimatePointDelete = observer(function EstimatePointDelete(props: TEstimatePointDelete) { const { workspaceSlug, projectId, diff --git a/apps/web/ee/components/estimates/points/edit-root.tsx b/apps/web/ee/components/estimates/points/edit-root.tsx index 80b31af0f5..44c1757000 100644 --- a/apps/web/ee/components/estimates/points/edit-root.tsx +++ b/apps/web/ee/components/estimates/points/edit-root.tsx @@ -26,7 +26,7 @@ type TEstimatePointEditRoot = { handleClose: () => void; }; -export const EstimatePointEditRoot: FC = observer((props) => { +export const EstimatePointEditRoot = observer(function EstimatePointEditRoot(props: TEstimatePointEditRoot) { // props const { workspaceSlug, projectId, estimateId, setEstimateEditType, handleClose } = props; // hooks diff --git a/apps/web/ee/components/estimates/points/select-dropdown.tsx b/apps/web/ee/components/estimates/points/select-dropdown.tsx index a4fd0f4768..49d19c252a 100644 --- a/apps/web/ee/components/estimates/points/select-dropdown.tsx +++ b/apps/web/ee/components/estimates/points/select-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Fragment, useRef, useState } from "react"; import { usePopper } from "react-popper"; @@ -21,7 +19,7 @@ type TEstimatePointDropdown = { estimateSystem: TEstimateSystemKeys; }; -export const EstimatePointDropdown: FC = (props) => { +export function EstimatePointDropdown(props: TEstimatePointDropdown) { const { options, error, callback, estimateSystem } = props; // states const [isDropdownOpen, setIsDropdownOpen] = useState(false); @@ -147,4 +145,4 @@ export const EstimatePointDropdown: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/estimates/points/switch/estimate-dropdown.tsx b/apps/web/ee/components/estimates/points/switch/estimate-dropdown.tsx index 23ca329517..380d03e4cd 100644 --- a/apps/web/ee/components/estimates/points/switch/estimate-dropdown.tsx +++ b/apps/web/ee/components/estimates/points/switch/estimate-dropdown.tsx @@ -19,7 +19,7 @@ type TProps = { currentEstimateType?: TEstimateSystemKeys; }; -export const EstimateSwitchDropdown: FC = (props) => { +export function EstimateSwitchDropdown(props: TProps) { const { t } = useTranslation(); const { estimateType, onChange, currentEstimateType } = props; const options = useMemo( @@ -62,4 +62,4 @@ export const EstimateSwitchDropdown: FC = (props) => { keyExtractor={(option) => option.value} /> ); -}; +} diff --git a/apps/web/ee/components/estimates/points/switch/preview.tsx b/apps/web/ee/components/estimates/points/switch/preview.tsx index d80403ee38..f0a857684e 100644 --- a/apps/web/ee/components/estimates/points/switch/preview.tsx +++ b/apps/web/ee/components/estimates/points/switch/preview.tsx @@ -22,7 +22,9 @@ type TEstimatePointItemSwitchPreview = { estimateType?: TEstimateSystemKeys; }; -export const EstimatePointItemSwitchPreview: FC = observer((props) => { +export const EstimatePointItemSwitchPreview = observer(function EstimatePointItemSwitchPreview( + props: TEstimatePointItemSwitchPreview +) { const { estimateId, estimateSystemSwitchType, diff --git a/apps/web/ee/components/estimates/points/switch/root.tsx b/apps/web/ee/components/estimates/points/switch/root.tsx index de368f8ea6..4a53abb9ca 100644 --- a/apps/web/ee/components/estimates/points/switch/root.tsx +++ b/apps/web/ee/components/estimates/points/switch/root.tsx @@ -33,7 +33,7 @@ type TEstimatePointSwitchRoot = { setEstimateSystemSwitchType?: Dispatch>; }; -export const EstimatePointSwitchRoot: FC = observer((props) => { +export const EstimatePointSwitchRoot = observer(function EstimatePointSwitchRoot(props: TEstimatePointSwitchRoot) { // props const { setEstimateEditType, diff --git a/apps/web/ee/components/estimates/update/modal.tsx b/apps/web/ee/components/estimates/update/modal.tsx index 11afbb1d9f..9c3842959a 100644 --- a/apps/web/ee/components/estimates/update/modal.tsx +++ b/apps/web/ee/components/estimates/update/modal.tsx @@ -20,7 +20,7 @@ type TUpdateEstimateModal = { handleClose: () => void; }; -export const UpdateEstimateModal: FC = observer((props) => { +export const UpdateEstimateModal = observer(function UpdateEstimateModal(props: TUpdateEstimateModal) { // props const { workspaceSlug, projectId, estimateId, isOpen, handleClose } = props; // states diff --git a/apps/web/ee/components/estimates/update/stage-one.tsx b/apps/web/ee/components/estimates/update/stage-one.tsx index 65ecfadc28..3954d8574c 100644 --- a/apps/web/ee/components/estimates/update/stage-one.tsx +++ b/apps/web/ee/components/estimates/update/stage-one.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTranslation } from "@plane/i18n"; import { Button } from "@plane/propel/button"; @@ -13,7 +11,7 @@ type TEstimateUpdateStageOne = { handleEstimateEditType?: (stage: TEstimateUpdateStageKeys) => void; }; -export const EstimateUpdateStageOne: FC = (props) => { +export function EstimateUpdateStageOne(props: TEstimateUpdateStageOne) { const { estimateEditType, handleClose, handleEstimateEditType } = props; const { t } = useTranslation(); @@ -53,4 +51,4 @@ export const EstimateUpdateStageOne: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/feature-flags/with-feature-flag-hoc.tsx b/apps/web/ee/components/feature-flags/with-feature-flag-hoc.tsx index 91fb32daec..e4516e4a61 100644 --- a/apps/web/ee/components/feature-flags/with-feature-flag-hoc.tsx +++ b/apps/web/ee/components/feature-flags/with-feature-flag-hoc.tsx @@ -11,7 +11,7 @@ interface IWithFeatureFlagHOC { children: ReactNode; } -export const WithFeatureFlagHOC = observer((props: IWithFeatureFlagHOC) => { +export const WithFeatureFlagHOC = observer(function WithFeatureFlagHOC(props: IWithFeatureFlagHOC) { const { workspaceSlug, flag, fallback, children } = props; // check if the feature flag is enabled const isFeatureEnabled = useFlag(workspaceSlug, flag); diff --git a/apps/web/ee/components/gantt-chart/blocks/block-row-list.tsx b/apps/web/ee/components/gantt-chart/blocks/block-row-list.tsx index 0e0ebcbed2..2c4ec9e5d0 100644 --- a/apps/web/ee/components/gantt-chart/blocks/block-row-list.tsx +++ b/apps/web/ee/components/gantt-chart/blocks/block-row-list.tsx @@ -8,7 +8,7 @@ import { BlockRow } from "@/components/gantt-chart/blocks/block-row"; import { BLOCK_HEIGHT } from "@/components/gantt-chart/constants"; import { useTimeLineChartStore } from "@/hooks/use-timeline-chart"; -export const GanttChartRowList: FC = observer((props) => { +export const GanttChartRowList = observer(function GanttChartRowList(props: GanttChartBlocksProps) { const { blockIds, blockUpdateHandler, diff --git a/apps/web/ee/components/gantt-chart/blocks/blocks-list.tsx b/apps/web/ee/components/gantt-chart/blocks/blocks-list.tsx index 9cc2364e15..7178a1a684 100644 --- a/apps/web/ee/components/gantt-chart/blocks/blocks-list.tsx +++ b/apps/web/ee/components/gantt-chart/blocks/blocks-list.tsx @@ -5,7 +5,7 @@ import { GanttChartBlock } from "@/components/gantt-chart/blocks/block"; import { BLOCK_HEIGHT } from "@/components/gantt-chart/constants"; import { useTimeLineChartStore } from "@/hooks/use-timeline-chart"; -export const GanttChartBlocksList: FC = observer((props) => { +export const GanttChartBlocksList = observer(function GanttChartBlocksList(props: GanttChartBlocksProps) { const { blockIds, blockToRender, diff --git a/apps/web/ee/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx b/apps/web/ee/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx index cebcc838c7..a19b1bf7c1 100644 --- a/apps/web/ee/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx +++ b/apps/web/ee/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx @@ -18,7 +18,7 @@ type LeftDependencyDraggableProps = { ganttContainerRef: RefObject; }; -export const LeftDependencyDraggable = observer((props: LeftDependencyDraggableProps) => { +export const LeftDependencyDraggable = observer(function LeftDependencyDraggable(props: LeftDependencyDraggableProps) { const { block, ganttContainerRef } = props; // life cycle hooks const [isCurrentDependencyDragging, setIsCurrentDependencyDragging] = useState(false); diff --git a/apps/web/ee/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx b/apps/web/ee/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx index f04a6aa1e7..c94976905d 100644 --- a/apps/web/ee/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx +++ b/apps/web/ee/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx @@ -17,7 +17,9 @@ type RightDependencyDraggableProps = { block: IGanttBlock; ganttContainerRef: RefObject; }; -export const RightDependencyDraggable = observer((props: RightDependencyDraggableProps) => { +export const RightDependencyDraggable = observer(function RightDependencyDraggable( + props: RightDependencyDraggableProps +) { const { block, ganttContainerRef } = props; // life cycle hooks const [isCurrentDependencyDragging, setIsCurrentDependencyDragging] = useState(false); diff --git a/apps/web/ee/components/gantt-chart/dependency/dependency-line-svg.tsx b/apps/web/ee/components/gantt-chart/dependency/dependency-line-svg.tsx index ed52380a98..9d2b58bdfb 100644 --- a/apps/web/ee/components/gantt-chart/dependency/dependency-line-svg.tsx +++ b/apps/web/ee/components/gantt-chart/dependency/dependency-line-svg.tsx @@ -1,13 +1,15 @@ -export const DependencyLineSVG = ({ strokeColor }: { strokeColor: string }) => ( - - - - - - - - - - - -); +export function DependencyLineSVG({ strokeColor }: { strokeColor: string }) { + return ( + + + + + + + + + + + + ); +} diff --git a/apps/web/ee/components/gantt-chart/dependency/dependency-modal.tsx b/apps/web/ee/components/gantt-chart/dependency/dependency-modal.tsx index 23b02550e3..b0dcc0a5cc 100644 --- a/apps/web/ee/components/gantt-chart/dependency/dependency-modal.tsx +++ b/apps/web/ee/components/gantt-chart/dependency/dependency-modal.tsx @@ -33,7 +33,7 @@ type IssueBlockProps = { isEpic?: boolean; }; -const IssueBlock = observer((props: IssueBlockProps) => { +const IssueBlock = observer(function IssueBlock(props: IssueBlockProps) { const { blockId, handleClose, className = "", isEpic = false } = props; // hooks const { workspaceSlug } = useParams(); @@ -103,7 +103,7 @@ type DependencyPathProps = { isEpic?: boolean; }; -export const DependencyPathModal = observer((props: DependencyPathProps) => { +export const DependencyPathModal = observer(function DependencyPathModal(props: DependencyPathProps) { const { relation, handleClose, isEpic = false } = props; const { workspaceSlug, projectId } = useParams(); // state diff --git a/apps/web/ee/components/gantt-chart/dependency/dependency-path-item.tsx b/apps/web/ee/components/gantt-chart/dependency/dependency-path-item.tsx index f3992cb234..fc7af57b94 100644 --- a/apps/web/ee/components/gantt-chart/dependency/dependency-path-item.tsx +++ b/apps/web/ee/components/gantt-chart/dependency/dependency-path-item.tsx @@ -9,7 +9,9 @@ type TimelineDependencyPathItemProps = { onPathClick: (relation: Relation) => void; }; -export const TimelineDependencyPathItem = observer((props: TimelineDependencyPathItemProps) => { +export const TimelineDependencyPathItem = observer(function TimelineDependencyPathItem( + props: TimelineDependencyPathItemProps +) { const { relation, onPathClick } = props; const { id, originDependencyPosition, destinationDependencyPosition, isAdhering, startPosition, endPosition } = @@ -42,10 +44,10 @@ export const TimelineDependencyPathItem = observer((props: TimelineDependencyPat className="opacity-0 hover:opacity-5" d={path} stroke={"#3F76FF"} - stroke-width={`${strokeWidth}`} + strokeWidth={`${strokeWidth}`} fill="none" /> - + = observer((props) => { +export const TimelineDependencyPaths = observer(function TimelineDependencyPaths(props: Props) { const { isEpic = false } = props; // state const [selectedRelation, setSelectedRelation] = useState(); diff --git a/apps/web/ee/components/gantt-chart/dependency/draggable-dependency-path.tsx b/apps/web/ee/components/gantt-chart/dependency/draggable-dependency-path.tsx index 551265540e..2010fd9ed2 100644 --- a/apps/web/ee/components/gantt-chart/dependency/draggable-dependency-path.tsx +++ b/apps/web/ee/components/gantt-chart/dependency/draggable-dependency-path.tsx @@ -4,7 +4,7 @@ import { useTimeLineChartStore } from "@/hooks/use-timeline-chart"; // import { getSVGPoints } from "./utils"; -export const TimelineDraggablePath = observer(() => { +export const TimelineDraggablePath = observer(function TimelineDraggablePath() { const { isDependencyEnabled, dependencyDraggingDetails } = useTimeLineChartStore(); if (!dependencyDraggingDetails || !isDependencyEnabled) return <>; @@ -32,7 +32,7 @@ export const TimelineDraggablePath = observer(() => { height={height} > - + diff --git a/apps/web/ee/components/global/product-updates/header.tsx b/apps/web/ee/components/global/product-updates/header.tsx index 915de9d465..ea007abfa4 100644 --- a/apps/web/ee/components/global/product-updates/header.tsx +++ b/apps/web/ee/components/global/product-updates/header.tsx @@ -15,7 +15,7 @@ import { InstanceService } from "@/services/instance.service"; const instanceService = new InstanceService(); -export const ProductUpdatesHeader = observer(() => { +export const ProductUpdatesHeader = observer(function ProductUpdatesHeader() { // states const [isCheckingForUpdates, setIsCheckingForUpdates] = useState(false); // store hooks diff --git a/apps/web/ee/components/global/version-number.tsx b/apps/web/ee/components/global/version-number.tsx index 171b159a42..8858f6c1c7 100644 --- a/apps/web/ee/components/global/version-number.tsx +++ b/apps/web/ee/components/global/version-number.tsx @@ -2,10 +2,10 @@ import { observer } from "mobx-react"; // assets import packageJson from "package.json"; // hooks -// eslint-disable-next-line import/order + import { useInstance } from "@/hooks/store/use-instance"; -export const PlaneVersionNumber = observer(() => { +export const PlaneVersionNumber = observer(function PlaneVersionNumber() { const { instance, config } = useInstance(); if (config?.payment_server_base_url) { diff --git a/apps/web/ee/components/home/header.tsx b/apps/web/ee/components/home/header.tsx index 46fc5d2328..81529febe4 100644 --- a/apps/web/ee/components/home/header.tsx +++ b/apps/web/ee/components/home/header.tsx @@ -13,7 +13,7 @@ import { WithFeatureFlagHOC } from "../feature-flags"; import { InputBox } from "../pi-chat/input"; import { UnauthorizedView } from "../pi-chat/unauthorized"; -export const HomePageHeader = observer(() => { +export const HomePageHeader = observer(function HomePageHeader() { const { workspaceSlug } = useParams(); const { activeChatId, isWorkspaceAuthorized, initPiChat } = usePiChat(); const { isWorkspaceFeatureEnabled } = useWorkspaceFeatures(); diff --git a/apps/web/ee/components/home/peek-overviews.tsx b/apps/web/ee/components/home/peek-overviews.tsx index 3a15436d39..a13dbacdc6 100644 --- a/apps/web/ee/components/home/peek-overviews.tsx +++ b/apps/web/ee/components/home/peek-overviews.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { EIssueServiceType } from "@plane/types"; diff --git a/apps/web/ee/components/iframe/silo-iframe.tsx b/apps/web/ee/components/iframe/silo-iframe.tsx index 183b22b840..f72ffc55ce 100644 --- a/apps/web/ee/components/iframe/silo-iframe.tsx +++ b/apps/web/ee/components/iframe/silo-iframe.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef, useCallback, useEffect, useState } from "react"; import { useParams } from "next/navigation"; import { useTheme } from "next-themes"; @@ -19,7 +17,7 @@ interface CustomIframeProps { const serviceApiTokenService = new ServiceAPITokenService(); -const SiloIframe: React.FC = ({ srcBase }) => { +function SiloIframe({ srcBase }: CustomIframeProps) { const { workspaceSlug } = useParams(); const ref = useRef(null); const { resolvedTheme } = useTheme(); @@ -82,6 +80,6 @@ const SiloIframe: React.FC = ({ srcBase }) => { ); -}; +} export default SiloIframe; diff --git a/apps/web/ee/components/importers/asana/authentication/o-auth.tsx b/apps/web/ee/components/importers/asana/authentication/o-auth.tsx index c0d8826591..b07cbf073b 100644 --- a/apps/web/ee/components/importers/asana/authentication/o-auth.tsx +++ b/apps/web/ee/components/importers/asana/authentication/o-auth.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -9,7 +7,7 @@ import { setToast, TOAST_TYPE } from "@plane/propel/toast"; // plane web hooks import { useAsanaImporter } from "@/plane-web/hooks/store"; -export const OAuth: FC = observer(() => { +export const OAuth = observer(function OAuth() { // states const [isLoading, setIsLoading] = useState(false); // hooks diff --git a/apps/web/ee/components/importers/asana/authentication/personal-access-token.tsx b/apps/web/ee/components/importers/asana/authentication/personal-access-token.tsx index 1976462b0e..d6469a5a7b 100644 --- a/apps/web/ee/components/importers/asana/authentication/personal-access-token.tsx +++ b/apps/web/ee/components/importers/asana/authentication/personal-access-token.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ import type { TAsanaPATFormFields } from "@/plane-web/types/importers/asana"; import ImporterHeader from "../../header"; import ErrorBanner from "../../ui/error-banner"; -export const PersonalAccessTokenAuth: FC = observer(() => { +export const PersonalAccessTokenAuth = observer(function PersonalAccessTokenAuth() { // hooks const { auth: { authWithPAT }, diff --git a/apps/web/ee/components/importers/asana/authentication/root.tsx b/apps/web/ee/components/importers/asana/authentication/root.tsx index 43e9e04879..7e635887d2 100644 --- a/apps/web/ee/components/importers/asana/authentication/root.tsx +++ b/apps/web/ee/components/importers/asana/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -8,7 +6,7 @@ import { OAuth, PersonalAccessTokenAuth } from "@/plane-web/components/importers // plane web hooks import { useAsanaImporter } from "@/plane-web/hooks/store"; -export const AuthenticationRoot: FC = observer(() => { +export const AuthenticationRoot = observer(function AuthenticationRoot() { // hooks const { auth: { currentAuth }, diff --git a/apps/web/ee/components/importers/asana/dashboard/root.tsx b/apps/web/ee/components/importers/asana/dashboard/root.tsx index 6054e7d439..67e31aadb7 100644 --- a/apps/web/ee/components/importers/asana/dashboard/root.tsx +++ b/apps/web/ee/components/importers/asana/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // hooks @@ -11,7 +9,7 @@ import AsanaLogo from "@/app/assets/services/asana.svg"; import { useAsanaImporter } from "@/plane-web/hooks/store"; import { BaseDashboard } from "../../common/dashboard/base-dashboard"; -export const AsanaDashboardRoot: FC = observer(() => { +export const AsanaDashboardRoot = observer(function AsanaDashboardRoot() { const getWorkspaceName = (job: TImportJob) => job.config.workspace?.name || "---"; const getProjectName = (job: TImportJob) => job.config.project?.name || "---"; const getPlaneProject = (job: TImportJob) => job.config.planeProject; diff --git a/apps/web/ee/components/importers/asana/steps/configure-asana/root.tsx b/apps/web/ee/components/importers/asana/steps/configure-asana/root.tsx index d92857ef73..8a38be4f78 100644 --- a/apps/web/ee/components/importers/asana/steps/configure-asana/root.tsx +++ b/apps/web/ee/components/importers/asana/steps/configure-asana/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -20,7 +18,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.CONFIGURE_ASANA]; const currentStepKey = E_IMPORTER_STEPS.CONFIGURE_ASANA; -export const ConfigureAsanaRoot: FC = observer(() => { +export const ConfigureAsanaRoot = observer(function ConfigureAsanaRoot() { // hooks const { importerData, handleImporterData, currentStep, handleStepper } = useAsanaImporter(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/asana/steps/configure-asana/select-project.tsx b/apps/web/ee/components/importers/asana/steps/configure-asana/select-project.tsx index 0e31786b63..861ab37e56 100644 --- a/apps/web/ee/components/importers/asana/steps/configure-asana/select-project.tsx +++ b/apps/web/ee/components/importers/asana/steps/configure-asana/select-project.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -17,7 +15,9 @@ type TConfigureAsanaSelectProject = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureAsanaSelectProject: FC = observer((props) => { +export const ConfigureAsanaSelectProject = observer(function ConfigureAsanaSelectProject( + props: TConfigureAsanaSelectProject +) { // props const { workspaceGid, value, handleFormData } = props; // hooks @@ -33,7 +33,7 @@ export const ConfigureAsanaSelectProject: FC = obs const userId = user?.id || undefined; const asanaProjects = ((workspaceGid && getAsanaProjectsByWorkspaceGid(workspaceGid)) || []).filter( (project: AsanaProject) => project && project.gid - ) as AsanaProject[]; + ); // handlers const handelData = (value: string | undefined) => { handleFormData(value); diff --git a/apps/web/ee/components/importers/asana/steps/configure-asana/select-workspace.tsx b/apps/web/ee/components/importers/asana/steps/configure-asana/select-workspace.tsx index 0d7f82c28e..1b3091d805 100644 --- a/apps/web/ee/components/importers/asana/steps/configure-asana/select-workspace.tsx +++ b/apps/web/ee/components/importers/asana/steps/configure-asana/select-workspace.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -16,7 +14,9 @@ type TConfigureAsanaSelectWorkspace = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureAsanaSelectWorkspace: FC = observer((props) => { +export const ConfigureAsanaSelectWorkspace = observer(function ConfigureAsanaSelectWorkspace( + props: TConfigureAsanaSelectWorkspace +) { // props const { value, handleFormData } = props; // hooks diff --git a/apps/web/ee/components/importers/asana/steps/map-priority/priority-selection.tsx b/apps/web/ee/components/importers/asana/steps/map-priority/priority-selection.tsx index fdc6cffb80..4e2654c307 100644 --- a/apps/web/ee/components/importers/asana/steps/map-priority/priority-selection.tsx +++ b/apps/web/ee/components/importers/asana/steps/map-priority/priority-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import type { AsanaEnumOption } from "@plane/etl/asana"; @@ -17,7 +15,7 @@ type TMapPrioritiesSelection = { planePriorities: TPlanePriorityData[]; }; -export const MapPrioritiesSelection: FC = observer((props) => { +export const MapPrioritiesSelection = observer(function MapPrioritiesSelection(props: TMapPrioritiesSelection) { const { value, handleValue, asanaPriorityOption, planePriorities } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/asana/steps/map-priority/root.tsx b/apps/web/ee/components/importers/asana/steps/map-priority/root.tsx index 31d9063f44..268f37160e 100644 --- a/apps/web/ee/components/importers/asana/steps/map-priority/root.tsx +++ b/apps/web/ee/components/importers/asana/steps/map-priority/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -27,7 +25,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.MAP_PRIORITY]; const currentStepKey = E_IMPORTER_STEPS.MAP_PRIORITY; -export const MapPriorityRoot: FC = observer(() => { +export const MapPriorityRoot = observer(function MapPriorityRoot() { // hooks const { workspace, @@ -53,7 +51,7 @@ export const MapPriorityRoot: FC = observer(() => { const asanaProjectGid = importerData[E_IMPORTER_STEPS.CONFIGURE_ASANA]?.projectGid; const asanaPriorities = ((asanaProjectGid && getAsanaPrioritiesByProjectGid(asanaProjectGid)) || []).filter( (priority: AsanaCustomField) => priority && priority.gid - ) as AsanaCustomField[]; + ); const asanaPriorityOptions = asanaPriorities.find( (priority) => priority.gid === formData.customFieldGid )?.enum_options; @@ -137,7 +135,7 @@ export const MapPriorityRoot: FC = observer(() => { const result = fuse.search(asanaState.name); if (result.length > 0) { - const planeState = result[0].item as TPlanePriorityData; + const planeState = result[0].item; if (asanaState.gid && planeState.key) { newPriorityMap[asanaState.gid] = planeState.key; } diff --git a/apps/web/ee/components/importers/asana/steps/map-priority/select-priority-field.tsx b/apps/web/ee/components/importers/asana/steps/map-priority/select-priority-field.tsx index 24a833a87d..7bb5cc840a 100644 --- a/apps/web/ee/components/importers/asana/steps/map-priority/select-priority-field.tsx +++ b/apps/web/ee/components/importers/asana/steps/map-priority/select-priority-field.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import type { AsanaCustomField } from "@plane/etl/asana"; @@ -15,7 +13,9 @@ type TConfigureAsanaSelectPriority = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureAsanaSelectPriority: FC = observer((props) => { +export const ConfigureAsanaSelectPriority = observer(function ConfigureAsanaSelectPriority( + props: TConfigureAsanaSelectPriority +) { // props const { value, isLoading, asanaPriorities, handleFormData } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/asana/steps/map-states/root.tsx b/apps/web/ee/components/importers/asana/steps/map-states/root.tsx index 15cc376ca9..6e45ac84e9 100644 --- a/apps/web/ee/components/importers/asana/steps/map-states/root.tsx +++ b/apps/web/ee/components/importers/asana/steps/map-states/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -27,7 +25,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.MAP_STATES]; const currentStepKey = E_IMPORTER_STEPS.MAP_STATES; -export const MapStatesRoot: FC = observer(() => { +export const MapStatesRoot = observer(function MapStatesRoot() { // hooks const { workspace, @@ -56,10 +54,10 @@ export const MapStatesRoot: FC = observer(() => { // project states const asanaProjectSections = ((asanaProjectGid && getAsanaSectionByProjectGid(asanaProjectGid)) || []).filter( (asanaSection) => asanaSection && asanaSection.gid - ) as AsanaSection[]; + ); const planeProjectStates = ((planeProjectId && stateIdsByProjectId(planeProjectId)) || []) .map((id) => (planeProjectId && getStateById(planeProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as IState[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); // derived values const isNextButtonDisabled = asanaProjectSections?.length === Object.keys(formData).length ? false : true; // handlers @@ -125,7 +123,7 @@ export const MapStatesRoot: FC = observer(() => { const result = fuse.search(asanaState.name); if (result.length > 0) { - const planeState = result[0].item as IState; + const planeState = result[0].item; if (asanaState.gid && planeState.id) { handleFormData(asanaState.gid, planeState.id); } diff --git a/apps/web/ee/components/importers/asana/steps/map-states/state-selection.tsx b/apps/web/ee/components/importers/asana/steps/map-states/state-selection.tsx index 6097ed99cd..008d4f0e7d 100644 --- a/apps/web/ee/components/importers/asana/steps/map-states/state-selection.tsx +++ b/apps/web/ee/components/importers/asana/steps/map-states/state-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // types import { useTranslation } from "@plane/i18n"; @@ -16,7 +14,7 @@ type TMapStatesSelection = { planeStates: IState[]; }; -export const MapStatesSelection: FC = (props) => { +export function MapStatesSelection(props: TMapStatesSelection) { const { value, handleValue, planeStates } = props; const { t } = useTranslation(); @@ -39,4 +37,4 @@ export const MapStatesSelection: FC = (props) => { queryExtractor={(option) => option.name} /> ); -}; +} diff --git a/apps/web/ee/components/importers/asana/steps/root.tsx b/apps/web/ee/components/importers/asana/steps/root.tsx index 048e51b6be..f291161b48 100644 --- a/apps/web/ee/components/importers/asana/steps/root.tsx +++ b/apps/web/ee/components/importers/asana/steps/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // plane web components import { observer } from "mobx-react"; @@ -10,7 +8,7 @@ import { Stepper } from "@/plane-web/components/importers/ui"; import { IMPORTER_STEPS } from "@/plane-web/constants/importers/asana"; import { useAsanaImporter } from "@/plane-web/hooks/store"; -export const StepsRoot: FC = observer(() => { +export const StepsRoot = observer(function StepsRoot() { // hooks const { currentStepIndex, resetImporterData } = useAsanaImporter(); diff --git a/apps/web/ee/components/importers/asana/steps/select-plane-project/root.tsx b/apps/web/ee/components/importers/asana/steps/select-plane-project/root.tsx index 525036cc6c..341859a1c2 100644 --- a/apps/web/ee/components/importers/asana/steps/select-plane-project/root.tsx +++ b/apps/web/ee/components/importers/asana/steps/select-plane-project/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -28,7 +26,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.SELECT_PLANE_PROJECT]; const currentStepKey = E_IMPORTER_STEPS.SELECT_PLANE_PROJECT; -export const SelectPlaneProjectRoot: FC = observer(() => { +export const SelectPlaneProjectRoot = observer(function SelectPlaneProjectRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/asana/steps/summary/root.tsx b/apps/web/ee/components/importers/asana/steps/summary/root.tsx index 77966d63b5..18a3f38c35 100644 --- a/apps/web/ee/components/importers/asana/steps/summary/root.tsx +++ b/apps/web/ee/components/importers/asana/steps/summary/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ import { useAsanaImporter, useWorkspaceSubscription } from "@/plane-web/hooks/st import { E_IMPORTER_STEPS } from "@/plane-web/types/importers/asana"; import ImporterTable from "../../../ui/table"; -export const SummaryRoot: FC = observer(() => { +export const SummaryRoot = observer(function SummaryRoot() { // hooks const { workspace, @@ -60,7 +58,7 @@ export const SummaryRoot: FC = observer(() => { const asanaWorkspaceGid = importerData[E_IMPORTER_STEPS.CONFIGURE_ASANA]?.workspaceGid; const asanaProjectSections = ((asanaProjectGid && getAsanaSectionByProjectGid(asanaProjectGid)) || []).filter( (asanaSection) => asanaSection && asanaSection.gid - ) as AsanaSection[]; + ); const asanaProjectTaskCount = (asanaProjectGid && getAsanaIssueCountByProjectId(asanaProjectGid)) || 0; const handleUserSkipToggle = (flag: boolean) => { diff --git a/apps/web/ee/components/importers/clickup/authentication/personal-access-token.tsx b/apps/web/ee/components/importers/clickup/authentication/personal-access-token.tsx index 6c18e77313..9f356ea6fd 100644 --- a/apps/web/ee/components/importers/clickup/authentication/personal-access-token.tsx +++ b/apps/web/ee/components/importers/clickup/authentication/personal-access-token.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ import type { TClickUpPATFormFields } from "@/plane-web/types/importers/clickup" import ImporterHeader from "../../header"; import ErrorBanner from "../../ui/error-banner"; -export const PersonalAccessTokenAuth: FC = observer(() => { +export const PersonalAccessTokenAuth = observer(function PersonalAccessTokenAuth() { // hooks const { auth: { authWithPAT }, diff --git a/apps/web/ee/components/importers/clickup/authentication/root.tsx b/apps/web/ee/components/importers/clickup/authentication/root.tsx index ce312d5e0e..4f8d36bc7f 100644 --- a/apps/web/ee/components/importers/clickup/authentication/root.tsx +++ b/apps/web/ee/components/importers/clickup/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Fragment } from "react"; import { observer } from "mobx-react"; @@ -8,7 +6,7 @@ import { PersonalAccessTokenAuth } from "@/plane-web/components/importers/clicku // plane web hooks import { useClickUpImporter } from "@/plane-web/hooks/store"; -export const AuthenticationRoot: FC = observer(() => { +export const AuthenticationRoot = observer(function AuthenticationRoot() { // hooks const { auth: { currentAuth }, diff --git a/apps/web/ee/components/importers/clickup/dashboard/root.tsx b/apps/web/ee/components/importers/clickup/dashboard/root.tsx index 05249bfa17..f9fa697e54 100644 --- a/apps/web/ee/components/importers/clickup/dashboard/root.tsx +++ b/apps/web/ee/components/importers/clickup/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // hooks @@ -12,7 +10,7 @@ import { useClickUpImporter } from "@/plane-web/hooks/store"; // components import { BaseDashboard } from "../../common/dashboard/base-dashboard"; -export const ClickUpDashboardRoot: FC = observer(() => { +export const ClickUpDashboardRoot = observer(function ClickUpDashboardRoot() { const getWorkspaceName = (job: TImportJob) => job?.config?.space?.name || "---"; const getProjectName = (job: TImportJob) => job?.config?.folder?.name || "---"; const getPlaneProject = (job: TImportJob) => job?.config?.planeProject; diff --git a/apps/web/ee/components/importers/clickup/steps/configure-clickup/root.tsx b/apps/web/ee/components/importers/clickup/steps/configure-clickup/root.tsx index bfcab34d22..a4545f3aaa 100644 --- a/apps/web/ee/components/importers/clickup/steps/configure-clickup/root.tsx +++ b/apps/web/ee/components/importers/clickup/steps/configure-clickup/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -24,7 +22,7 @@ type TFormData = TImporterClickUpDataPayload[E_CLICKUP_IMPORTER_STEPS.CONFIGURE_ const currentStepKey = E_CLICKUP_IMPORTER_STEPS.CONFIGURE_CLICKUP; -export const ConfigureClickUpRoot: FC = observer(() => { +export const ConfigureClickUpRoot = observer(function ConfigureClickUpRoot() { // hooks const { currentStep, handleStepper, importerData, handleImporterData } = useClickUpImporter(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-folder.tsx b/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-folder.tsx index 49e9f650fd..1dffa28cf0 100644 --- a/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-folder.tsx +++ b/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-folder.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,9 @@ type TConfigureClickUpSelectFolder = { const COMMON_DROPDOWN_CONTAINER_CLASSNAME = "bg-custom-background-100 border border-custom-border-200 rounded-md px-2 py-1"; -export const ConfigureClickUpSelectFolder: FC = observer((props) => { +export const ConfigureClickUpSelectFolder = observer(function ConfigureClickUpSelectFolder( + props: TConfigureClickUpSelectFolder +) { // props const { value, handleFormData, spaceId } = props; @@ -45,9 +45,9 @@ export const ConfigureClickUpSelectFolder: FC = o const userId = user?.id || undefined; const clickUpFolderIds = spaceId ? getClickUpFolderIdsBySpaceId(spaceId) : []; const clickUpFolders = spaceId - ? (getClickUpFolderIdsBySpaceId(spaceId) + ? getClickUpFolderIdsBySpaceId(spaceId) .map((id) => (id ? getClickUpFolderById(spaceId, id) : undefined)) - .filter((project) => project != undefined && project != null) as TClickUpFolder[]) + .filter((project) => project != undefined && project != null) : []; // Add useEffect to handle prefilling @@ -62,7 +62,10 @@ export const ConfigureClickUpSelectFolder: FC = o // updating the config data if (value && spaceId) { const folderData = value.map((id) => getClickUpFolderById(spaceId, id)); - handleSyncJobConfig("folders", folderData.filter((folder) => folder !== undefined) as TClickUpFolder[]); + handleSyncJobConfig( + "folders", + folderData.filter((folder) => folder !== undefined) + ); } }; @@ -93,7 +96,7 @@ export const ConfigureClickUpSelectFolder: FC = o handleData(value as string[])} + onChange={(value) => handleData(value)} keyExtractor={(option) => option.data} buttonContainerClassName={COMMON_DROPDOWN_CONTAINER_CLASSNAME} buttonContent={(isOpen, val) => ( diff --git a/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-space.tsx b/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-space.tsx index 5941bfb035..ce9149e71d 100644 --- a/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-space.tsx +++ b/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-space.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -18,7 +16,9 @@ type TConfigureClickUpSelectSpace = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureClickUpSelectSpace: FC = observer((props) => { +export const ConfigureClickUpSelectSpace = observer(function ConfigureClickUpSelectSpace( + props: TConfigureClickUpSelectSpace +) { // props const { value, handleFormData, teamId } = props; @@ -37,7 +37,7 @@ export const ConfigureClickUpSelectSpace: FC = obs const userId = user?.id || undefined; const clickUpSpaces = (clickUpSpaceIds || []) .map((id) => (id ? getClickUpSpaceById(id) : undefined)) - .filter((project) => project != undefined && project != null) as TClickUpSpace[]; + .filter((project) => project != undefined && project != null); const handleData = (value: string | undefined) => { handleFormData(value); diff --git a/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-team.tsx b/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-team.tsx index 597071b09e..5ba5c5b0f1 100644 --- a/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-team.tsx +++ b/apps/web/ee/components/importers/clickup/steps/configure-clickup/select-team.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -16,7 +14,9 @@ type TConfigureClickUpSelectTeam = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureClickUpSelectTeam: FC = observer((props) => { +export const ConfigureClickUpSelectTeam = observer(function ConfigureClickUpSelectTeam( + props: TConfigureClickUpSelectTeam +) { // props const { value, handleFormData } = props; @@ -34,7 +34,7 @@ export const ConfigureClickUpSelectTeam: FC = obser const userId = user?.id || undefined; const clickUpTeams = (clickUpTeamIds || []) .map((id) => (id ? getClickUpTeamById(id) : undefined)) - .filter((project) => project != undefined && project != null) as TClickUpTeam[]; + .filter((project) => project != undefined && project != null); const handleData = (value: string | undefined) => { handleFormData(value); diff --git a/apps/web/ee/components/importers/clickup/steps/configure-clickup/skip-additional-data.tsx b/apps/web/ee/components/importers/clickup/steps/configure-clickup/skip-additional-data.tsx index 9378dbbee7..d73ffc8d66 100644 --- a/apps/web/ee/components/importers/clickup/steps/configure-clickup/skip-additional-data.tsx +++ b/apps/web/ee/components/importers/clickup/steps/configure-clickup/skip-additional-data.tsx @@ -9,11 +9,11 @@ interface SkipAdditionalDataToggleProps { className?: string; } -export const SkipAdditionalDataToggle: React.FC = ({ +export function SkipAdditionalDataToggle({ skipAdditionalData, handleSkipAdditionalDataToggle, className = "", -}) => { +}: SkipAdditionalDataToggleProps) { const { handleSyncJobConfig } = useClickUpImporter(); const handleClick = (value: boolean) => { handleSkipAdditionalDataToggle(value); @@ -44,4 +44,4 @@ export const SkipAdditionalDataToggle: React.FC = ); -}; +} diff --git a/apps/web/ee/components/importers/clickup/steps/map-priority/priority-selection.tsx b/apps/web/ee/components/importers/clickup/steps/map-priority/priority-selection.tsx index 6c83463f0b..309f2bc681 100644 --- a/apps/web/ee/components/importers/clickup/steps/map-priority/priority-selection.tsx +++ b/apps/web/ee/components/importers/clickup/steps/map-priority/priority-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import type { TClickUpPriority } from "@plane/etl/clickup"; @@ -18,7 +16,7 @@ type TMapPrioritiesSelection = { planePriorities: TPlanePriorityData[]; }; -export const MapPrioritiesSelection: FC = observer((props) => { +export const MapPrioritiesSelection = observer(function MapPrioritiesSelection(props: TMapPrioritiesSelection) { const { value, handleValue, clickUpPriority, planePriorities } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/clickup/steps/map-priority/root.tsx b/apps/web/ee/components/importers/clickup/steps/map-priority/root.tsx index 5a38a470e8..ee8d49081c 100644 --- a/apps/web/ee/components/importers/clickup/steps/map-priority/root.tsx +++ b/apps/web/ee/components/importers/clickup/steps/map-priority/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback, useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -22,7 +20,7 @@ type TFormData = TImporterClickUpDataPayload[E_CLICKUP_IMPORTER_STEPS.MAP_PRIORI const currentStepKey = E_CLICKUP_IMPORTER_STEPS.MAP_PRIORITIES; -export const MapPriorityRoot: FC = observer(() => { +export const MapPriorityRoot = observer(function MapPriorityRoot() { // hooks const { priorities, @@ -39,7 +37,7 @@ export const MapPriorityRoot: FC = observer(() => { const clickUpSpaceId = importerData[E_CLICKUP_IMPORTER_STEPS.CONFIGURE_CLICKUP]?.spaceId; const clickUpPriorityForSpace = ((clickUpSpaceId && getClickUpPriorityIdsBySpaceId(clickUpSpaceId)) || []) .map((id) => (clickUpSpaceId && getClickUpPriorityById(clickUpSpaceId, id)) || undefined) - .filter((clickUpPriority) => clickUpPriority != undefined && clickUpPriority != null) as TClickUpPriority[]; + .filter((clickUpPriority) => clickUpPriority != undefined && clickUpPriority != null); // states const [formData, setFormData] = useState({}); @@ -111,7 +109,7 @@ export const MapPriorityRoot: FC = observer(() => { const result = fuse.search(clickUpPriority.priority); if (result.length > 0) { - const planeState = result[0].item as TPlanePriorityData; + const planeState = result[0].item; if (clickUpPriority.id && planeState.key) { handleFormData(clickUpPriority.id, planeState.key); } diff --git a/apps/web/ee/components/importers/clickup/steps/map-states/root.tsx b/apps/web/ee/components/importers/clickup/steps/map-states/root.tsx index 9a5b8d57fe..9225855732 100644 --- a/apps/web/ee/components/importers/clickup/steps/map-states/root.tsx +++ b/apps/web/ee/components/importers/clickup/steps/map-states/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback, useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -26,7 +24,7 @@ type TFormData = TImporterClickUpDataPayload[E_CLICKUP_IMPORTER_STEPS.MAP_STATES const currentStepKey = E_CLICKUP_IMPORTER_STEPS.MAP_STATES; -export const MapStatesRoot: FC = observer(() => { +export const MapStatesRoot = observer(function MapStatesRoot() { // hooks const { workspace, @@ -51,11 +49,11 @@ export const MapStatesRoot: FC = observer(() => { const clickUpStatusesForASpace = ((clickupFolderId && getClickUpStatusIdsByFolderId(clickupFolderId)) || []) .map((id) => (clickupFolderId && getClickUpStatusById(clickupFolderId, id)) || undefined) - .filter((clickUpStatus) => clickUpStatus != undefined && clickUpStatus != null) as TClickUpStatus[]; + .filter((clickUpStatus) => clickUpStatus != undefined && clickUpStatus != null); const planeProjectStates = ((planeProjectId && stateIdsByProjectId(planeProjectId)) || []) .map((id) => (planeProjectId && getStateById(planeProjectId, id)) || undefined) - .filter((planeState) => planeState != undefined && planeState != null) as IState[]; + .filter((planeState) => planeState != undefined && planeState != null); const isNextButtonDisabled = clickUpStatusesForASpace?.length === Object.keys(formData).length ? false : true; // handlers @@ -121,7 +119,7 @@ export const MapStatesRoot: FC = observer(() => { const result = fuse.search(clickUpStatus.status); if (result.length > 0) { - const planeState = result[0].item as IState; + const planeState = result[0].item; if (clickUpStatus.id && planeState.id) { handleFormData(clickUpStatus.id, planeState.id); } diff --git a/apps/web/ee/components/importers/clickup/steps/map-states/state-selection.tsx b/apps/web/ee/components/importers/clickup/steps/map-states/state-selection.tsx index f6bf50e8a3..6c9fe59d3c 100644 --- a/apps/web/ee/components/importers/clickup/steps/map-states/state-selection.tsx +++ b/apps/web/ee/components/importers/clickup/steps/map-states/state-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import type { TClickUpStatus } from "@plane/etl/clickup"; @@ -17,7 +15,7 @@ type TMapStatesSelection = { planeStates: IState[]; }; -export const MapStatesSelection: FC = observer((props) => { +export const MapStatesSelection = observer(function MapStatesSelection(props: TMapStatesSelection) { const { value, handleValue, clickUpStatus, planeStates } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/clickup/steps/root.tsx b/apps/web/ee/components/importers/clickup/steps/root.tsx index b44e2cabe3..a2600751d6 100644 --- a/apps/web/ee/components/importers/clickup/steps/root.tsx +++ b/apps/web/ee/components/importers/clickup/steps/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // assets @@ -11,7 +9,7 @@ import { IMPORTER_CLICKUP_STEPS } from "@/plane-web/constants/importers/clickup" // plane web hooks import { useClickUpImporter } from "@/plane-web/hooks/store"; -export const StepsRoot: FC = observer(() => { +export const StepsRoot = observer(function StepsRoot() { // hooks const { currentStepIndex, resetImporterData } = useClickUpImporter(); diff --git a/apps/web/ee/components/importers/clickup/steps/select-plane-project/root.tsx b/apps/web/ee/components/importers/clickup/steps/select-plane-project/root.tsx index 9cda8952ee..63a5499b86 100644 --- a/apps/web/ee/components/importers/clickup/steps/select-plane-project/root.tsx +++ b/apps/web/ee/components/importers/clickup/steps/select-plane-project/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -26,7 +24,7 @@ type TFormData = TImporterClickUpDataPayload[E_CLICKUP_IMPORTER_STEPS.SELECT_PLA const currentStepKey = E_CLICKUP_IMPORTER_STEPS.SELECT_PLANE_PROJECT; -export const SelectPlaneProjectRoot: FC = observer(() => { +export const SelectPlaneProjectRoot = observer(function SelectPlaneProjectRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/clickup/steps/summary/root.tsx b/apps/web/ee/components/importers/clickup/steps/summary/root.tsx index 9b28ce20eb..e21e9a24a7 100644 --- a/apps/web/ee/components/importers/clickup/steps/summary/root.tsx +++ b/apps/web/ee/components/importers/clickup/steps/summary/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ import { useClickUpImporter, useWorkspaceSubscription } from "@/plane-web/hooks/ // plane web types import { E_CLICKUP_IMPORTER_STEPS } from "@/plane-web/types/importers/clickup"; -export const SummaryRoot: FC = observer(() => { +export const SummaryRoot = observer(function SummaryRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/common/dashboard/base-dashboard.tsx b/apps/web/ee/components/importers/common/dashboard/base-dashboard.tsx index 3a298ea97c..fa068a16f5 100644 --- a/apps/web/ee/components/importers/common/dashboard/base-dashboard.tsx +++ b/apps/web/ee/components/importers/common/dashboard/base-dashboard.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -70,7 +68,7 @@ export interface IBaseDashboardProps { useImporterHook: () => TImporterHook; } -export const BaseDashboard = observer((props: IBaseDashboardProps) => { +export const BaseDashboard = observer(function BaseDashboard(props: IBaseDashboardProps) { const { config, useImporterHook } = props; const { serviceName, logo, swrKey, modals, getWorkspaceName, getProjectName, getPlaneProject } = config; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/common/dashboard/empty-state.tsx b/apps/web/ee/components/importers/common/dashboard/empty-state.tsx index e54a46cdaa..dcc9bf82b0 100644 --- a/apps/web/ee/components/importers/common/dashboard/empty-state.tsx +++ b/apps/web/ee/components/importers/common/dashboard/empty-state.tsx @@ -1,9 +1,7 @@ -"use client"; - import type { FC } from "react"; import { useTranslation } from "@plane/i18n"; -export const EmptyState: FC = () => { +export function EmptyState() { const { t } = useTranslation(); return
    {t("common.no_data_available")}
    ; -}; +} diff --git a/apps/web/ee/components/importers/common/dashboard/icon-field-render.tsx b/apps/web/ee/components/importers/common/dashboard/icon-field-render.tsx index 284a8dcb14..5ba5c3a809 100644 --- a/apps/web/ee/components/importers/common/dashboard/icon-field-render.tsx +++ b/apps/web/ee/components/importers/common/dashboard/icon-field-render.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, ReactNode } from "react"; type TIconFieldRender = { @@ -7,7 +5,7 @@ type TIconFieldRender = { title?: string; }; -export const IconFieldRender: FC = (props) => { +export function IconFieldRender(props: TIconFieldRender) { const { icon, title } = props; if (!icon && !title) return "-"; @@ -20,4 +18,4 @@ export const IconFieldRender: FC = (props) => {
    {title}
    ); -}; +} diff --git a/apps/web/ee/components/importers/common/dashboard/loader/header.tsx b/apps/web/ee/components/importers/common/dashboard/loader/header.tsx index d56d3a0b6d..2a00e092eb 100644 --- a/apps/web/ee/components/importers/common/dashboard/loader/header.tsx +++ b/apps/web/ee/components/importers/common/dashboard/loader/header.tsx @@ -1,10 +1,12 @@ import { Loader } from "@plane/ui"; -export const DashboardLoaderHeader = () => ( - -
    - - -
    -     -); +export function DashboardLoaderHeader() { + return ( + +
    + + +
    +     + ); +} diff --git a/apps/web/ee/components/importers/common/dashboard/loader/root.tsx b/apps/web/ee/components/importers/common/dashboard/loader/root.tsx index 6c1f1ac33b..e4d9e844a4 100644 --- a/apps/web/ee/components/importers/common/dashboard/loader/root.tsx +++ b/apps/web/ee/components/importers/common/dashboard/loader/root.tsx @@ -1,9 +1,11 @@ // components import { DashboardLoaderHeader, DashboardLoaderTable } from "."; -export const DashboardLoaderRoot = () => ( -
    - - -
    -); +export function DashboardLoaderRoot() { + return ( +
    + + +
    + ); +} diff --git a/apps/web/ee/components/importers/common/dashboard/loader/table.tsx b/apps/web/ee/components/importers/common/dashboard/loader/table.tsx index 5fc86bc2bd..7efab9214d 100644 --- a/apps/web/ee/components/importers/common/dashboard/loader/table.tsx +++ b/apps/web/ee/components/importers/common/dashboard/loader/table.tsx @@ -1,21 +1,23 @@ import { Loader } from "@plane/ui"; -export const DashboardLoaderTable = () => ( - -
    - - {/* table */} -
    - {Array.from({ length: 10 }).map((_, index) => ( -
    - {Array.from({ length: 7 }).map((_, childIndex) => ( -
    - -
    - ))} -
    - ))} +export function DashboardLoaderTable() { + return ( + +
    + + {/* table */} +
    + {Array.from({ length: 10 }).map((_, index) => ( +
    + {Array.from({ length: 7 }).map((_, childIndex) => ( +
    + +
    + ))} +
    + ))} +
    -
    - -); + + ); +} diff --git a/apps/web/ee/components/importers/common/dashboard/modals/cancel-modal.tsx b/apps/web/ee/components/importers/common/dashboard/modals/cancel-modal.tsx index 44b7f5af3d..17fe7274f9 100644 --- a/apps/web/ee/components/importers/common/dashboard/modals/cancel-modal.tsx +++ b/apps/web/ee/components/importers/common/dashboard/modals/cancel-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTranslation } from "@plane/i18n"; import { Button } from "@plane/propel/button"; @@ -10,7 +8,7 @@ interface ICancelModalProps { isLoading: boolean; } -export const CancelModal: FC = ({ onClose, onSubmit, isLoading }) => { +export function CancelModal({ onClose, onSubmit, isLoading }: ICancelModalProps) { const { t } = useTranslation(); return ( @@ -29,4 +27,4 @@ export const CancelModal: FC = ({ onClose, onSubmit, isLoadin
    ); -}; +} diff --git a/apps/web/ee/components/importers/common/dashboard/modals/rerun-modal.tsx b/apps/web/ee/components/importers/common/dashboard/modals/rerun-modal.tsx index c5cc57c731..57a71cd3f4 100644 --- a/apps/web/ee/components/importers/common/dashboard/modals/rerun-modal.tsx +++ b/apps/web/ee/components/importers/common/dashboard/modals/rerun-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTranslation } from "@plane/i18n"; import { Button } from "@plane/propel/button"; @@ -10,7 +8,7 @@ interface IRerunModalProps { isLoading: boolean; } -export const RerunModal: FC = ({ onClose, onSubmit, isLoading }) => { +export function RerunModal({ onClose, onSubmit, isLoading }: IRerunModalProps) { const { t } = useTranslation(); return (
    @@ -28,4 +26,4 @@ export const RerunModal: FC = ({ onClose, onSubmit, isLoading
    ); -}; +} diff --git a/apps/web/ee/components/importers/common/dashboard/status.tsx b/apps/web/ee/components/importers/common/dashboard/status.tsx index f901dfd7c5..106582243c 100644 --- a/apps/web/ee/components/importers/common/dashboard/status.tsx +++ b/apps/web/ee/components/importers/common/dashboard/status.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import type { TJobStatus } from "@plane/etl/core"; @@ -27,7 +25,7 @@ const STATUS_CLASSNAMES: { [key in TJobStatus]: string } = { [E_JOB_STATUS.CANCELLED]: "text-red-500 border border-red-500 bg-red-500/10", }; -export const SyncJobStatus: FC = observer((props) => { +export const SyncJobStatus = observer(function SyncJobStatus(props: TSyncJobStatusProps) { const { status } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/flatfile/dashboard/root.tsx b/apps/web/ee/components/importers/flatfile/dashboard/root.tsx index 8b38ff965a..9ec64108fe 100644 --- a/apps/web/ee/components/importers/flatfile/dashboard/root.tsx +++ b/apps/web/ee/components/importers/flatfile/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // hooks @@ -12,7 +10,7 @@ import { useFlatfileImporter } from "@/plane-web/hooks/store"; // components import { BaseDashboard } from "../../common/dashboard/base-dashboard"; -export const FlatfileDashboardRoot: FC = observer(() => { +export const FlatfileDashboardRoot = observer(function FlatfileDashboardRoot() { const { getProjectById } = useFlatfileImporter(); const getWorkspaceName = (job: TImportJob) => job.config.workbookId || "---"; diff --git a/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/provider.tsx b/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/provider.tsx index 9d8f331d0a..9a30739d38 100644 --- a/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/provider.tsx +++ b/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/provider.tsx @@ -1,9 +1,7 @@ -"use client"; - import { FlatfileProvider } from "@flatfile/react"; -const FlatfileClientProvider: typeof FlatfileProvider = (props) => ( - {props.children} -); +function FlatfileClientProvider(props: React.ComponentPropsWithoutRef) { + return {props.children}; +} export default FlatfileClientProvider; diff --git a/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/root.tsx b/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/root.tsx index 063c7f4e09..fba52dde61 100644 --- a/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/root.tsx +++ b/apps/web/ee/components/importers/flatfile/steps/configure-flatfile/root.tsx @@ -20,7 +20,7 @@ import { useFlatfileImporter } from "@/plane-web/hooks/store/importers/user-flat import { E_IMPORTER_STEPS } from "@/plane-web/types/importers"; import { getWorkbookConfig } from "./workbook"; -export const ConfigureFlatfile: FC = observer(() => { +export const ConfigureFlatfile = observer(function ConfigureFlatfile() { const PUBLISHABLE_KEY = process.env.VITE_FLATFILE_PUBLISHABLE_KEY; if (!PUBLISHABLE_KEY) return ( @@ -36,7 +36,7 @@ export const ConfigureFlatfile: FC = observer(() => { ); }); -export const ConfigureFlatfileChild: FC = observer(() => { +export const ConfigureFlatfileChild = observer(function ConfigureFlatfileChild() { const { workspace, user, diff --git a/apps/web/ee/components/importers/flatfile/steps/root.tsx b/apps/web/ee/components/importers/flatfile/steps/root.tsx index 612dd0847c..b26877e86a 100644 --- a/apps/web/ee/components/importers/flatfile/steps/root.tsx +++ b/apps/web/ee/components/importers/flatfile/steps/root.tsx @@ -9,7 +9,7 @@ import { IMPORTER_STEPS } from "@/plane-web/constants/importers/flatfile"; // hooks import { useFlatfileImporter } from "@/plane-web/hooks/store"; -export const StepsRoot: FC = observer(() => { +export const StepsRoot = observer(function StepsRoot() { const { currentStepIndex, resetImporterData } = useFlatfileImporter(); return ( diff --git a/apps/web/ee/components/importers/flatfile/steps/select-plane-project/root.tsx b/apps/web/ee/components/importers/flatfile/steps/select-plane-project/root.tsx index 14a53b4e0d..3eee30bcbf 100644 --- a/apps/web/ee/components/importers/flatfile/steps/select-plane-project/root.tsx +++ b/apps/web/ee/components/importers/flatfile/steps/select-plane-project/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -24,7 +22,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.SELECT_PLANE_PROJECT]; const currentStepKey = E_IMPORTER_STEPS.SELECT_PLANE_PROJECT; -export const SelectPlaneProject: FC = observer(() => { +export const SelectPlaneProject = observer(function SelectPlaneProject() { // hooks const { workspace, @@ -43,9 +41,9 @@ export const SelectPlaneProject: FC = observer(() => { const workspaceSlug = workspace?.slug || undefined; const projects = workspaceSlug && - ((projectIdsByWorkspaceSlug(workspaceSlug) || []) + (projectIdsByWorkspaceSlug(workspaceSlug) || []) .map((id) => getProjectById(id)) - .filter((project) => project != undefined) as IProject[]); + .filter((project) => project != undefined); const isNextButtonDisabled = !formData.projectId; // handlers const handleFormData = (value: string | undefined) => { diff --git a/apps/web/ee/components/importers/header.tsx b/apps/web/ee/components/importers/header.tsx index 0845467e83..0b52007715 100644 --- a/apps/web/ee/components/importers/header.tsx +++ b/apps/web/ee/components/importers/header.tsx @@ -5,7 +5,8 @@ export interface IImporterHeaderProps { actions?: React.ReactNode; description?: string; } -const ImporterHeader = (props: IImporterHeaderProps) => { + +function ImporterHeader(props: IImporterHeaderProps) { const { config, actions, description } = props; const { serviceName, logo } = config; const { t } = useTranslation(); @@ -23,6 +24,6 @@ const ImporterHeader = (props: IImporterHeaderProps) => { ); -}; +} export default ImporterHeader; diff --git a/apps/web/ee/components/importers/jira-server/authentication/personal-access-token.tsx b/apps/web/ee/components/importers/jira-server/authentication/personal-access-token.tsx index 22bcf2ca05..bda4d08bb8 100644 --- a/apps/web/ee/components/importers/jira-server/authentication/personal-access-token.tsx +++ b/apps/web/ee/components/importers/jira-server/authentication/personal-access-token.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ import type { TJiraPATFormFields } from "@/plane-web/types/importers/jira-server import ImporterHeader from "../../header"; import ErrorBanner from "../../ui/error-banner"; -export const PersonalAccessTokenAuth: FC = observer(() => { +export const PersonalAccessTokenAuth = observer(function PersonalAccessTokenAuth() { // hooks const { auth: { authWithPAT }, diff --git a/apps/web/ee/components/importers/jira-server/authentication/root.tsx b/apps/web/ee/components/importers/jira-server/authentication/root.tsx index c68ebbd90e..ce3f8f2178 100644 --- a/apps/web/ee/components/importers/jira-server/authentication/root.tsx +++ b/apps/web/ee/components/importers/jira-server/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -7,7 +5,7 @@ import { PersonalAccessTokenAuth } from "@/plane-web/components/importers/jira-s // plane web hooks import { useJiraServerImporter } from "@/plane-web/hooks/store"; -export const AuthenticationRoot: FC = observer(() => { +export const AuthenticationRoot = observer(function AuthenticationRoot() { // hooks const { auth: { currentAuth }, diff --git a/apps/web/ee/components/importers/jira-server/dashboard/root.tsx b/apps/web/ee/components/importers/jira-server/dashboard/root.tsx index c0134ebbb2..a550f609e1 100644 --- a/apps/web/ee/components/importers/jira-server/dashboard/root.tsx +++ b/apps/web/ee/components/importers/jira-server/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // hooks @@ -12,7 +10,7 @@ import { useJiraServerImporter } from "@/plane-web/hooks/store"; // components import { BaseDashboard } from "../../common/dashboard/base-dashboard"; -export const JiraServerDashboardRoot: FC = observer(() => { +export const JiraServerDashboardRoot = observer(function JiraServerDashboardRoot() { const getWorkspaceName = (job: TImportJob) => job.config.resource?.name || "---"; const getProjectName = (job: TImportJob) => job.config.project?.name || "---"; const getPlaneProject = (job: TImportJob) => job.config.planeProject; diff --git a/apps/web/ee/components/importers/jira-server/steps/configure-jira/root.tsx b/apps/web/ee/components/importers/jira-server/steps/configure-jira/root.tsx index b1bf6d1fcb..1a7f422d25 100644 --- a/apps/web/ee/components/importers/jira-server/steps/configure-jira/root.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/configure-jira/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -19,7 +17,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.CONFIGURE_JIRA]; const currentStepKey = E_IMPORTER_STEPS.CONFIGURE_JIRA; -export const ConfigureJiraRoot: FC = observer(() => { +export const ConfigureJiraRoot = observer(function ConfigureJiraRoot() { // hooks const { currentStep, handleStepper, importerData, handleImporterData } = useJiraServerImporter(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-project.tsx b/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-project.tsx index 252d0762bb..e92e26b1f9 100644 --- a/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-project.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-project.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -17,7 +15,9 @@ type TConfigureJiraSelectProject = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureJiraSelectProject: FC = observer((props) => { +export const ConfigureJiraSelectProject = observer(function ConfigureJiraSelectProject( + props: TConfigureJiraSelectProject +) { // props const { resourceId, value, handleFormData } = props; @@ -35,7 +35,7 @@ export const ConfigureJiraSelectProject: FC = obser const userId = user?.id || undefined; const jiraProjects = ((resourceId && jiraProjectIdsByResourceId(resourceId)) || []) .map((id) => (resourceId && id ? getJiraProjectById(resourceId, id) : undefined)) - .filter((project) => project != undefined && project != null) as JiraProject[]; + .filter((project) => project != undefined && project != null); // handlers const handelData = (value: string | undefined) => { diff --git a/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-resource.tsx b/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-resource.tsx index 9bd3cf27e3..6c1e82c657 100644 --- a/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-resource.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/configure-jira/select-resource.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -16,7 +14,9 @@ type TConfigureJiraSelectResource = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureJiraSelectResource: FC = observer((props) => { +export const ConfigureJiraSelectResource = observer(function ConfigureJiraSelectResource( + props: TConfigureJiraSelectResource +) { // props const { value, handleFormData } = props; @@ -34,7 +34,7 @@ export const ConfigureJiraSelectResource: FC = obs const userId = user?.id || undefined; const jiraResources = (jiraResourceIds || []) .map((id) => getJiraResourceById(id)) - .filter((resource) => resource != undefined && resource != null) as JiraResource[]; + .filter((resource) => resource != undefined && resource != null); // handlers const handelData = (value: string | undefined) => { diff --git a/apps/web/ee/components/importers/jira-server/steps/map-priority/priority-selection.tsx b/apps/web/ee/components/importers/jira-server/steps/map-priority/priority-selection.tsx index de0175f385..7d92f567e6 100644 --- a/apps/web/ee/components/importers/jira-server/steps/map-priority/priority-selection.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/map-priority/priority-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useTranslation } from "@plane/i18n"; @@ -15,7 +13,7 @@ type TMapPrioritiesSelection = { planePriorities: TPlanePriorityData[]; }; -export const MapPrioritiesSelection: FC = observer((props) => { +export const MapPrioritiesSelection = observer(function MapPrioritiesSelection(props: TMapPrioritiesSelection) { const { value, handleValue, planePriorities } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/jira-server/steps/map-priority/root.tsx b/apps/web/ee/components/importers/jira-server/steps/map-priority/root.tsx index 20b9127033..9246bafde2 100644 --- a/apps/web/ee/components/importers/jira-server/steps/map-priority/root.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/map-priority/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -24,7 +22,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.MAP_PRIORITY]; const currentStepKey = E_IMPORTER_STEPS.MAP_PRIORITY; -export const MapPriorityRoot: FC = observer(() => { +export const MapPriorityRoot = observer(function MapPriorityRoot() { // hooks const { workspace, @@ -46,7 +44,7 @@ export const MapPriorityRoot: FC = observer(() => { const jiraProjectId = importerData[E_IMPORTER_STEPS.CONFIGURE_JIRA]?.projectId; const jiraProjectPriorities = ((jiraProjectId && jiraPriorityIdsByProjectId(jiraProjectId)) || []) .map((id) => (jiraProjectId && getJiraPriorityById(jiraProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as JiraPriority[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); // states const [formData, setFormData] = useState({}); @@ -118,7 +116,7 @@ export const MapPriorityRoot: FC = observer(() => { const result = fuse.search(jiraState.name); if (result.length > 0) { - const planeState = result[0].item as TPlanePriorityData; + const planeState = result[0].item; if (jiraState.id && planeState.key) { handleFormData(jiraState.id, planeState.key); } diff --git a/apps/web/ee/components/importers/jira-server/steps/map-states/root.tsx b/apps/web/ee/components/importers/jira-server/steps/map-states/root.tsx index 3136ab9cdf..836f14e270 100644 --- a/apps/web/ee/components/importers/jira-server/steps/map-states/root.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/map-states/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -26,7 +24,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.MAP_STATES]; const currentStepKey = E_IMPORTER_STEPS.MAP_STATES; -export const MapStatesRoot: FC = observer(() => { +export const MapStatesRoot = observer(function MapStatesRoot() { // hooks const { workspace, @@ -54,10 +52,10 @@ export const MapStatesRoot: FC = observer(() => { const jiraProjectId = importerData[E_IMPORTER_STEPS.CONFIGURE_JIRA]?.projectId; const jiraProjectStates = ((jiraProjectId && jiraStateIdsByProjectId(jiraProjectId)) || []) .map((id) => (jiraProjectId && getJiraStateById(jiraProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as JiraStatus[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); const planeProjectStates = ((planeProjectId && stateIdsByProjectId(planeProjectId)) || []) .map((id) => (planeProjectId && getStateById(planeProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as IState[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); const isNextButtonDisabled = jiraProjectStates?.length === Object.keys(formData).length ? false : true; // handlers @@ -122,7 +120,7 @@ export const MapStatesRoot: FC = observer(() => { const result = fuse.search(jiraState.name); if (result.length > 0) { - const planeState = result[0].item as IState; + const planeState = result[0].item; if (jiraState.id && planeState.id) { handleFormData(jiraState.id, planeState.id); } diff --git a/apps/web/ee/components/importers/jira-server/steps/map-states/state-selection.tsx b/apps/web/ee/components/importers/jira-server/steps/map-states/state-selection.tsx index e10c1c7ea3..adc61057aa 100644 --- a/apps/web/ee/components/importers/jira-server/steps/map-states/state-selection.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/map-states/state-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useTranslation } from "@plane/i18n"; @@ -14,7 +12,7 @@ type TMapStatesSelection = { planeStates: IState[]; }; -export const MapStatesSelection: FC = observer((props) => { +export const MapStatesSelection = observer(function MapStatesSelection(props: TMapStatesSelection) { const { value, handleValue, planeStates } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/jira-server/steps/root.tsx b/apps/web/ee/components/importers/jira-server/steps/root.tsx index a82022c12f..802362d1ee 100644 --- a/apps/web/ee/components/importers/jira-server/steps/root.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // assets @@ -11,7 +9,7 @@ import { IMPORTER_STEPS } from "@/plane-web/constants/importers/jira-server"; // plane web hooks import { useJiraServerImporter } from "@/plane-web/hooks/store"; -export const StepsRoot: FC = observer(() => { +export const StepsRoot = observer(function StepsRoot() { // hooks const { currentStepIndex, resetImporterData } = useJiraServerImporter(); diff --git a/apps/web/ee/components/importers/jira-server/steps/select-plane-project/root.tsx b/apps/web/ee/components/importers/jira-server/steps/select-plane-project/root.tsx index a5aaf586d9..ea875cc55d 100644 --- a/apps/web/ee/components/importers/jira-server/steps/select-plane-project/root.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/select-plane-project/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -26,7 +24,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.SELECT_PLANE_PROJECT]; const currentStepKey = E_IMPORTER_STEPS.SELECT_PLANE_PROJECT; -export const SelectPlaneProjectRoot: FC = observer(() => { +export const SelectPlaneProjectRoot = observer(function SelectPlaneProjectRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/jira-server/steps/summary/root.tsx b/apps/web/ee/components/importers/jira-server/steps/summary/root.tsx index 095baab717..fddb0a28e5 100644 --- a/apps/web/ee/components/importers/jira-server/steps/summary/root.tsx +++ b/apps/web/ee/components/importers/jira-server/steps/summary/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ import { useJiraServerImporter, useWorkspaceSubscription } from "@/plane-web/hoo import { E_IMPORTER_STEPS } from "@/plane-web/types/importers/jira-server"; import ImporterTable from "../../../ui/table"; -export const SummaryRoot: FC = observer(() => { +export const SummaryRoot = observer(function SummaryRoot() { // hooks const { workspace, @@ -128,7 +126,7 @@ export const SummaryRoot: FC = observer(() => { if (jiraProjectLabels && jiraProjectLabels.length > 0) { handleSyncJobConfig( "label", - jiraLabels.filter((label) => label != undefined && label != null) as JiraConfig["label"] + jiraLabels.filter((label) => label != undefined && label != null) ); } // eslint-disable-next-line react-hooks/exhaustive-deps diff --git a/apps/web/ee/components/importers/jira/authentication/o-auth.tsx b/apps/web/ee/components/importers/jira/authentication/o-auth.tsx index af1c328ed8..86cf3b312d 100644 --- a/apps/web/ee/components/importers/jira/authentication/o-auth.tsx +++ b/apps/web/ee/components/importers/jira/authentication/o-auth.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -9,7 +7,7 @@ import { setToast, TOAST_TYPE } from "@plane/propel/toast"; // plane web hooks import { useJiraImporter } from "@/plane-web/hooks/store"; -export const OAuth: FC = observer(() => { +export const OAuth = observer(function OAuth() { // states const [isLoading, setIsLoading] = useState(false); // hooks diff --git a/apps/web/ee/components/importers/jira/authentication/personal-access-token.tsx b/apps/web/ee/components/importers/jira/authentication/personal-access-token.tsx index 579b120850..86e0d90c62 100644 --- a/apps/web/ee/components/importers/jira/authentication/personal-access-token.tsx +++ b/apps/web/ee/components/importers/jira/authentication/personal-access-token.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -19,7 +17,7 @@ import type { TImporterPATError, TJiraPATFormFields } from "@/plane-web/types"; import ImporterHeader from "../../header"; import ErrorBanner from "../../ui/error-banner"; -export const PersonalAccessTokenAuth: FC = observer(() => { +export const PersonalAccessTokenAuth = observer(function PersonalAccessTokenAuth() { // hooks const { auth: { authWithPAT }, diff --git a/apps/web/ee/components/importers/jira/authentication/root.tsx b/apps/web/ee/components/importers/jira/authentication/root.tsx index 6d47ac158c..8581dcffd1 100644 --- a/apps/web/ee/components/importers/jira/authentication/root.tsx +++ b/apps/web/ee/components/importers/jira/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Fragment } from "react"; import { observer } from "mobx-react"; @@ -8,7 +6,7 @@ import { OAuth, PersonalAccessTokenAuth } from "@/plane-web/components/importers // plane web hooks import { useJiraImporter } from "@/plane-web/hooks/store"; -export const AuthenticationRoot: FC = observer(() => { +export const AuthenticationRoot = observer(function AuthenticationRoot() { // hooks const { auth: { currentAuth }, diff --git a/apps/web/ee/components/importers/jira/dashboard/root.tsx b/apps/web/ee/components/importers/jira/dashboard/root.tsx index 3ab5f51502..3523c89334 100644 --- a/apps/web/ee/components/importers/jira/dashboard/root.tsx +++ b/apps/web/ee/components/importers/jira/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // hooks @@ -12,7 +10,7 @@ import { useJiraImporter } from "@/plane-web/hooks/store"; // components import { BaseDashboard } from "../../common/dashboard/base-dashboard"; -export const JiraDashboardRoot: FC = observer(() => { +export const JiraDashboardRoot = observer(function JiraDashboardRoot() { const getWorkspaceName = (job: TImportJob) => job.config.resource?.name || "---"; const getProjectName = (job: TImportJob) => job.config.project?.name || "---"; const getPlaneProject = (job: TImportJob) => job.config.planeProject; diff --git a/apps/web/ee/components/importers/jira/steps/configure-jira/root.tsx b/apps/web/ee/components/importers/jira/steps/configure-jira/root.tsx index 3edd987e03..1c5a00e69e 100644 --- a/apps/web/ee/components/importers/jira/steps/configure-jira/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/configure-jira/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -19,7 +17,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.CONFIGURE_JIRA]; const currentStepKey = E_IMPORTER_STEPS.CONFIGURE_JIRA; -export const ConfigureJiraRoot: FC = observer(() => { +export const ConfigureJiraRoot = observer(function ConfigureJiraRoot() { // hooks const { t } = useTranslation(); const { currentStep, handleStepper, importerData, handleImporterData } = useJiraImporter(); diff --git a/apps/web/ee/components/importers/jira/steps/configure-jira/select-project.tsx b/apps/web/ee/components/importers/jira/steps/configure-jira/select-project.tsx index 75baf74b56..beafd449c5 100644 --- a/apps/web/ee/components/importers/jira/steps/configure-jira/select-project.tsx +++ b/apps/web/ee/components/importers/jira/steps/configure-jira/select-project.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -17,7 +15,9 @@ type TConfigureJiraSelectProject = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureJiraSelectProject: FC = observer((props) => { +export const ConfigureJiraSelectProject = observer(function ConfigureJiraSelectProject( + props: TConfigureJiraSelectProject +) { // props const { resourceId, value, handleFormData } = props; @@ -35,7 +35,7 @@ export const ConfigureJiraSelectProject: FC = obser const userId = user?.id || undefined; const jiraProjects = ((resourceId && jiraProjectIdsByResourceId(resourceId)) || []) .map((id) => (resourceId && id ? getJiraProjectById(resourceId, id) : undefined)) - .filter((project) => project != undefined && project != null) as JiraProject[]; + .filter((project) => project != undefined && project != null); // handlers const handelData = (value: string | undefined) => { diff --git a/apps/web/ee/components/importers/jira/steps/configure-jira/select-resource.tsx b/apps/web/ee/components/importers/jira/steps/configure-jira/select-resource.tsx index 5e0b76f198..9045521898 100644 --- a/apps/web/ee/components/importers/jira/steps/configure-jira/select-resource.tsx +++ b/apps/web/ee/components/importers/jira/steps/configure-jira/select-resource.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -16,7 +14,9 @@ type TConfigureJiraSelectResource = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureJiraSelectResource: FC = observer((props) => { +export const ConfigureJiraSelectResource = observer(function ConfigureJiraSelectResource( + props: TConfigureJiraSelectResource +) { // props const { value, handleFormData } = props; @@ -34,7 +34,7 @@ export const ConfigureJiraSelectResource: FC = obs const userId = user?.id || undefined; const jiraResources = (jiraResourceIds || []) .map((id) => getJiraResourceById(id)) - .filter((resource) => resource != undefined && resource != null) as JiraResource[]; + .filter((resource) => resource != undefined && resource != null); // handlers const handelData = (value: string | undefined) => { diff --git a/apps/web/ee/components/importers/jira/steps/import-users-from-jira/root.tsx b/apps/web/ee/components/importers/jira/steps/import-users-from-jira/root.tsx index afa1553454..62907468fa 100644 --- a/apps/web/ee/components/importers/jira/steps/import-users-from-jira/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/import-users-from-jira/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -23,7 +21,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.IMPORT_USERS_FROM_JIRA]; const currentStepKey = E_IMPORTER_STEPS.IMPORT_USERS_FROM_JIRA; -export const ImportUsersFromJira: FC = observer(() => { +export const ImportUsersFromJira = observer(function ImportUsersFromJira() { // hooks const { user, @@ -128,6 +126,7 @@ export const ImportUsersFromJira: FC = observer(() => { target="_blank" href="https://support.atlassian.com/organization-administration/docs/export-users-from-a-site/" className="text-custom-primary-100 underline font-medium" + rel="noreferrer" > {t("common.from", { name: "Jira" })} diff --git a/apps/web/ee/components/importers/jira/steps/import-users-from-jira/upload-csv.tsx b/apps/web/ee/components/importers/jira/steps/import-users-from-jira/upload-csv.tsx index 5420acba22..352dfd5716 100644 --- a/apps/web/ee/components/importers/jira/steps/import-users-from-jira/upload-csv.tsx +++ b/apps/web/ee/components/importers/jira/steps/import-users-from-jira/upload-csv.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Fragment, useState } from "react"; import Papa from "papaparse"; @@ -17,7 +15,7 @@ type TImportUsersFromJiraUploader = { const acceptFileTypes: Accept = { "text/csv": [".csv"] }; -export const ImportUsersFromJiraUploader: FC = (props) => { +export function ImportUsersFromJiraUploader(props: TImportUsersFromJiraUploader) { // props const { handleValue } = props; // states @@ -161,4 +159,4 @@ export const ImportUsersFromJiraUploader: FC = (pr )} ); -}; +} diff --git a/apps/web/ee/components/importers/jira/steps/map-priority/priority-selection.tsx b/apps/web/ee/components/importers/jira/steps/map-priority/priority-selection.tsx index 11526b554b..4361c42c74 100644 --- a/apps/web/ee/components/importers/jira/steps/map-priority/priority-selection.tsx +++ b/apps/web/ee/components/importers/jira/steps/map-priority/priority-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useTranslation } from "@plane/i18n"; @@ -15,7 +13,7 @@ type TMapPrioritiesSelection = { planePriorities: TPlanePriorityData[]; }; -export const MapPrioritiesSelection: FC = observer((props) => { +export const MapPrioritiesSelection = observer(function MapPrioritiesSelection(props: TMapPrioritiesSelection) { const { value, handleValue, planePriorities } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/jira/steps/map-priority/root.tsx b/apps/web/ee/components/importers/jira/steps/map-priority/root.tsx index 610fc2949d..b7960f864d 100644 --- a/apps/web/ee/components/importers/jira/steps/map-priority/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/map-priority/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -25,7 +23,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.MAP_PRIORITY]; const currentStepKey = E_IMPORTER_STEPS.MAP_PRIORITY; -export const MapPriorityRoot: FC = observer(() => { +export const MapPriorityRoot = observer(function MapPriorityRoot() { // hooks const { workspace, @@ -47,7 +45,7 @@ export const MapPriorityRoot: FC = observer(() => { const jiraProjectId = importerData[E_IMPORTER_STEPS.CONFIGURE_JIRA]?.projectId; const jiraProjectPriorities = ((jiraProjectId && jiraPriorityIdsByProjectId(jiraProjectId)) || []) .map((id) => (jiraProjectId && getJiraPriorityById(jiraProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as JiraPriority[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); // states const [formData, setFormData] = useState({}); @@ -119,7 +117,7 @@ export const MapPriorityRoot: FC = observer(() => { const result = fuse.search(jiraState.name); if (result.length > 0) { - const planeState = result[0].item as TPlanePriorityData; + const planeState = result[0].item; if (jiraState.id && planeState.key) { handleFormData(jiraState.id, planeState.key); } diff --git a/apps/web/ee/components/importers/jira/steps/map-states/root.tsx b/apps/web/ee/components/importers/jira/steps/map-states/root.tsx index 655c4ca0ae..0165b9167c 100644 --- a/apps/web/ee/components/importers/jira/steps/map-states/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/map-states/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -25,7 +23,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.MAP_STATES]; const currentStepKey = E_IMPORTER_STEPS.MAP_STATES; -export const MapStatesRoot: FC = observer(() => { +export const MapStatesRoot = observer(function MapStatesRoot() { // hooks const { workspace, @@ -55,10 +53,10 @@ export const MapStatesRoot: FC = observer(() => { const jiraProjectId = importerData[E_IMPORTER_STEPS.CONFIGURE_JIRA]?.projectId; const jiraProjectStates = ((jiraProjectId && jiraStateIdsByProjectId(jiraProjectId)) || []) .map((id) => (jiraProjectId && getJiraStateById(jiraProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as JiraStatus[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); const planeProjectStates = ((planeProjectId && stateIdsByProjectId(planeProjectId)) || []) .map((id) => (planeProjectId && getStateById(planeProjectId, id)) || undefined) - .filter((jiraState) => jiraState != undefined && jiraState != null) as IState[]; + .filter((jiraState) => jiraState != undefined && jiraState != null); const isNextButtonDisabled = jiraProjectStates?.length === Object.keys(formData).length ? false : true; // handlers @@ -123,7 +121,7 @@ export const MapStatesRoot: FC = observer(() => { const result = fuse.search(jiraState.name); if (result.length > 0) { - const planeState = result[0].item as IState; + const planeState = result[0].item; if (jiraState.id && planeState.id) { handleFormData(jiraState.id, planeState.id); } diff --git a/apps/web/ee/components/importers/jira/steps/map-states/state-selection.tsx b/apps/web/ee/components/importers/jira/steps/map-states/state-selection.tsx index 9a384bbcdd..099c8baab2 100644 --- a/apps/web/ee/components/importers/jira/steps/map-states/state-selection.tsx +++ b/apps/web/ee/components/importers/jira/steps/map-states/state-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { StateGroupIcon } from "@plane/propel/icons"; @@ -13,7 +11,7 @@ type TMapStatesSelection = { planeStates: IState[]; }; -export const MapStatesSelection: FC = observer((props) => { +export const MapStatesSelection = observer(function MapStatesSelection(props: TMapStatesSelection) { const { value, handleValue, planeStates } = props; return ( diff --git a/apps/web/ee/components/importers/jira/steps/root.tsx b/apps/web/ee/components/importers/jira/steps/root.tsx index ddca3de242..834b898129 100644 --- a/apps/web/ee/components/importers/jira/steps/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // assets @@ -11,7 +9,7 @@ import { IMPORTER_STEPS } from "@/plane-web/constants/importers"; // plane web hooks import { useJiraImporter } from "@/plane-web/hooks/store"; -export const StepsRoot: FC = observer(() => { +export const StepsRoot = observer(function StepsRoot() { // hooks const { currentStepIndex, resetImporterData } = useJiraImporter(); diff --git a/apps/web/ee/components/importers/jira/steps/select-plane-project/root.tsx b/apps/web/ee/components/importers/jira/steps/select-plane-project/root.tsx index da228b7fcf..1d597360ac 100644 --- a/apps/web/ee/components/importers/jira/steps/select-plane-project/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/select-plane-project/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -26,7 +24,7 @@ type TFormData = TImporterDataPayload[E_IMPORTER_STEPS.SELECT_PLANE_PROJECT]; const currentStepKey = E_IMPORTER_STEPS.SELECT_PLANE_PROJECT; -export const SelectPlaneProjectRoot: FC = observer(() => { +export const SelectPlaneProjectRoot = observer(function SelectPlaneProjectRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/jira/steps/summary/root.tsx b/apps/web/ee/components/importers/jira/steps/summary/root.tsx index 06af544063..c7f052520d 100644 --- a/apps/web/ee/components/importers/jira/steps/summary/root.tsx +++ b/apps/web/ee/components/importers/jira/steps/summary/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ import { useJiraImporter } from "@/plane-web/hooks/store"; import { E_IMPORTER_STEPS } from "@/plane-web/types/importers"; import ImporterTable from "../../../ui/table"; -export const SummaryRoot: FC = observer(() => { +export const SummaryRoot = observer(function SummaryRoot() { // hooks const { workspace, @@ -120,7 +118,7 @@ export const SummaryRoot: FC = observer(() => { if (jiraLabels && jiraLabels.length > 0) { handleSyncJobConfig( "label", - jiraLabels.filter((label) => label != undefined && label != null) as JiraConfig["label"] + jiraLabels.filter((label) => label != undefined && label != null) ); } // eslint-disable-next-line react-hooks/exhaustive-deps diff --git a/apps/web/ee/components/importers/linear/authentication/o-auth.tsx b/apps/web/ee/components/importers/linear/authentication/o-auth.tsx index 7c0c63a0ef..ee56ad7758 100644 --- a/apps/web/ee/components/importers/linear/authentication/o-auth.tsx +++ b/apps/web/ee/components/importers/linear/authentication/o-auth.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -9,7 +7,7 @@ import { setToast, TOAST_TYPE } from "@plane/propel/toast"; // plane web hooks import { useLinearImporter } from "@/plane-web/hooks/store"; -export const OAuth: FC = observer(() => { +export const OAuth = observer(function OAuth() { // states const [isLoading, setIsLoading] = useState(false); // hooks diff --git a/apps/web/ee/components/importers/linear/authentication/personal-access-token.tsx b/apps/web/ee/components/importers/linear/authentication/personal-access-token.tsx index c9e386c6b6..815d8df944 100644 --- a/apps/web/ee/components/importers/linear/authentication/personal-access-token.tsx +++ b/apps/web/ee/components/importers/linear/authentication/personal-access-token.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ import type { TLinearPATFormFields } from "@/plane-web/types/importers/linear"; import ImporterHeader from "../../header"; import ErrorBanner from "../../ui/error-banner"; -export const PersonalAccessTokenAuth: FC = observer(() => { +export const PersonalAccessTokenAuth = observer(function PersonalAccessTokenAuth() { // hooks const { auth: { authWithPAT }, diff --git a/apps/web/ee/components/importers/linear/authentication/root.tsx b/apps/web/ee/components/importers/linear/authentication/root.tsx index 3398e3e92c..8e2b85863b 100644 --- a/apps/web/ee/components/importers/linear/authentication/root.tsx +++ b/apps/web/ee/components/importers/linear/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Fragment } from "react"; import { observer } from "mobx-react"; @@ -8,7 +6,7 @@ import { OAuth, PersonalAccessTokenAuth } from "@/plane-web/components/importers // plane web hooks import { useLinearImporter } from "@/plane-web/hooks/store"; -export const AuthenticationRoot: FC = observer(() => { +export const AuthenticationRoot = observer(function AuthenticationRoot() { // hooks const { auth: { currentAuth }, diff --git a/apps/web/ee/components/importers/linear/dashboard/root.tsx b/apps/web/ee/components/importers/linear/dashboard/root.tsx index 1a8fcf2005..c2241c498e 100644 --- a/apps/web/ee/components/importers/linear/dashboard/root.tsx +++ b/apps/web/ee/components/importers/linear/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // hooks @@ -12,7 +10,7 @@ import { useLinearImporter } from "@/plane-web/hooks/store"; // components import { BaseDashboard } from "../../common/dashboard/base-dashboard"; -export const LinearDashboardRoot: FC = observer(() => { +export const LinearDashboardRoot = observer(function LinearDashboardRoot() { const getWorkspaceName = (job: TImportJob) => job?.config?.workspaceDetail?.name || "---"; const getProjectName = (job: TImportJob) => job?.config?.teamDetail?.name || job?.config?.teamName || "---"; diff --git a/apps/web/ee/components/importers/linear/steps/configure-linear/root.tsx b/apps/web/ee/components/importers/linear/steps/configure-linear/root.tsx index 0153cedb2c..c5da3625c5 100644 --- a/apps/web/ee/components/importers/linear/steps/configure-linear/root.tsx +++ b/apps/web/ee/components/importers/linear/steps/configure-linear/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -19,7 +17,7 @@ type TFormData = TImporterLinearDataPayload[E_LINEAR_IMPORTER_STEPS.CONFIGURE_LI const currentStepKey = E_LINEAR_IMPORTER_STEPS.CONFIGURE_LINEAR; -export const ConfigureLinearRoot: FC = observer(() => { +export const ConfigureLinearRoot = observer(function ConfigureLinearRoot() { // hooks const { currentStep, handleStepper, importerData, handleImporterData } = useLinearImporter(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/linear/steps/configure-linear/select-team.tsx b/apps/web/ee/components/importers/linear/steps/configure-linear/select-team.tsx index 137216029b..669318448c 100644 --- a/apps/web/ee/components/importers/linear/steps/configure-linear/select-team.tsx +++ b/apps/web/ee/components/importers/linear/steps/configure-linear/select-team.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -16,7 +14,9 @@ type TConfigureLinearSelectTeam = { handleFormData: (value: string | undefined) => void; }; -export const ConfigureLinearSelectTeam: FC = observer((props) => { +export const ConfigureLinearSelectTeam = observer(function ConfigureLinearSelectTeam( + props: TConfigureLinearSelectTeam +) { // props const { value, handleFormData } = props; @@ -41,7 +41,7 @@ export const ConfigureLinearSelectTeam: FC = observe const userId = user?.id || undefined; const linearTeams = (linearTeamIds || []) .map((id) => (id ? getLinearTeamById(id) : undefined)) - .filter((project) => project != undefined && project != null) as LinearTeam[]; + .filter((project) => project != undefined && project != null); const linearOrganization = linearOrganizationId && getLinearOrganizationById(linearOrganizationId); const handelData = (value: string | undefined) => { diff --git a/apps/web/ee/components/importers/linear/steps/map-states/root.tsx b/apps/web/ee/components/importers/linear/steps/map-states/root.tsx index 28240c8234..8423845e37 100644 --- a/apps/web/ee/components/importers/linear/steps/map-states/root.tsx +++ b/apps/web/ee/components/importers/linear/steps/map-states/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import Fuse from "fuse.js"; @@ -26,7 +24,7 @@ type TFormData = TImporterLinearDataPayload[E_LINEAR_IMPORTER_STEPS.MAP_STATES]; const currentStepKey = E_LINEAR_IMPORTER_STEPS.MAP_STATES; -export const MapStatesRoot: FC = observer(() => { +export const MapStatesRoot = observer(function MapStatesRoot() { // hooks const { workspace, @@ -53,10 +51,10 @@ export const MapStatesRoot: FC = observer(() => { const linearTeamId = importerData[E_LINEAR_IMPORTER_STEPS.CONFIGURE_LINEAR]?.teamId; const linearTeamStates = ((linearTeamId && linearStateIdsByTeamId(linearTeamId)) || []) .map((id) => (linearTeamId && getLinearStateById(linearTeamId, id)) || undefined) - .filter((linearState) => linearState != undefined && linearState != null) as LinearState[]; + .filter((linearState) => linearState != undefined && linearState != null); const planeProjectStates = ((planeProjectId && stateIdsByProjectId(planeProjectId)) || []) .map((id) => (planeProjectId && getStateById(planeProjectId, id)) || undefined) - .filter((linearState) => linearState != undefined && linearState != null) as IState[]; + .filter((linearState) => linearState != undefined && linearState != null); const isNextButtonDisabled = linearTeamStates?.length === Object.keys(formData).length ? false : true; // handlers @@ -122,7 +120,7 @@ export const MapStatesRoot: FC = observer(() => { const result = fuse.search(linearState.name); if (result.length > 0) { - const planeState = result[0].item as IState; + const planeState = result[0].item; if (linearState.id && planeState.id) { handleFormData(linearState.id, planeState.id); } diff --git a/apps/web/ee/components/importers/linear/steps/map-states/state-selection.tsx b/apps/web/ee/components/importers/linear/steps/map-states/state-selection.tsx index 845dda5762..fe7116d4a2 100644 --- a/apps/web/ee/components/importers/linear/steps/map-states/state-selection.tsx +++ b/apps/web/ee/components/importers/linear/steps/map-states/state-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useTranslation } from "@plane/i18n"; @@ -14,7 +12,7 @@ type TMapStatesSelection = { planeStates: IState[]; }; -export const MapStatesSelection: FC = observer((props) => { +export const MapStatesSelection = observer(function MapStatesSelection(props: TMapStatesSelection) { const { value, handleValue, planeStates } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/linear/steps/root.tsx b/apps/web/ee/components/importers/linear/steps/root.tsx index 0dcca86684..fa4cc344f6 100644 --- a/apps/web/ee/components/importers/linear/steps/root.tsx +++ b/apps/web/ee/components/importers/linear/steps/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // assets @@ -11,7 +9,7 @@ import { IMPORTER_LINEAR_STEPS } from "@/plane-web/constants/importers/linear"; // plane web hooks import { useLinearImporter } from "@/plane-web/hooks/store"; -export const StepsRoot: FC = observer(() => { +export const StepsRoot = observer(function StepsRoot() { // hooks const { currentStepIndex, resetImporterData } = useLinearImporter(); diff --git a/apps/web/ee/components/importers/linear/steps/select-plane-project/root.tsx b/apps/web/ee/components/importers/linear/steps/select-plane-project/root.tsx index d641429964..53a0c79f9a 100644 --- a/apps/web/ee/components/importers/linear/steps/select-plane-project/root.tsx +++ b/apps/web/ee/components/importers/linear/steps/select-plane-project/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { isEqual } from "lodash-es"; @@ -26,7 +24,7 @@ type TFormData = TImporterLinearDataPayload[E_LINEAR_IMPORTER_STEPS.SELECT_PLANE const currentStepKey = E_LINEAR_IMPORTER_STEPS.SELECT_PLANE_PROJECT; -export const SelectPlaneProjectRoot: FC = observer(() => { +export const SelectPlaneProjectRoot = observer(function SelectPlaneProjectRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/linear/steps/summary/root.tsx b/apps/web/ee/components/importers/linear/steps/summary/root.tsx index 8fce666b5c..499d47074b 100644 --- a/apps/web/ee/components/importers/linear/steps/summary/root.tsx +++ b/apps/web/ee/components/importers/linear/steps/summary/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ import { useLinearImporter, useWorkspaceSubscription } from "@/plane-web/hooks/s import { E_LINEAR_IMPORTER_STEPS } from "@/plane-web/types/importers/linear"; import ImporterTable from "../../../ui/table"; -export const SummaryRoot: FC = observer(() => { +export const SummaryRoot = observer(function SummaryRoot() { // hooks const { workspace, diff --git a/apps/web/ee/components/importers/list-item.tsx b/apps/web/ee/components/importers/list-item.tsx index 231146be57..050653f825 100644 --- a/apps/web/ee/components/importers/list-item.tsx +++ b/apps/web/ee/components/importers/list-item.tsx @@ -12,7 +12,7 @@ export type ImportersListItemProps = { workspaceSlug: string; }; -export const ImportersListItem: FC = (props) => { +export function ImportersListItem(props: ImportersListItemProps) { const { provider, workspaceSlug } = props; const { t } = useTranslation(); @@ -48,4 +48,4 @@ export const ImportersListItem: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/importers/list.tsx b/apps/web/ee/components/importers/list.tsx index e4a986caa8..74fd494660 100644 --- a/apps/web/ee/components/importers/list.tsx +++ b/apps/web/ee/components/importers/list.tsx @@ -85,7 +85,7 @@ export type ImportersListProps = { workspaceSlug: string; }; -export const ImportersList: FC = observer((props) => { +export const ImportersList = observer(function ImportersList(props: ImportersListProps) { const { workspaceSlug } = props; return ( diff --git a/apps/web/ee/components/importers/ui/add-seats-alert-banner.tsx b/apps/web/ee/components/importers/ui/add-seats-alert-banner.tsx index 77a021cb80..fbf41723a5 100644 --- a/apps/web/ee/components/importers/ui/add-seats-alert-banner.tsx +++ b/apps/web/ee/components/importers/ui/add-seats-alert-banner.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -15,7 +13,7 @@ type Props = { extraSeatRequired?: number; }; -export const AddSeatsAlertBanner: React.FC = observer((props: Props) => { +export const AddSeatsAlertBanner = observer(function AddSeatsAlertBanner(props: Props) { const { additionalUserCount = 15, extraSeatRequired } = props; const [addWorkspaceSeatsModal, setUpdateWorkspaceSeatsModal] = useState(false); const { diff --git a/apps/web/ee/components/importers/ui/auth-form-input.tsx b/apps/web/ee/components/importers/ui/auth-form-input.tsx index 1dabe989cc..083ce20f63 100644 --- a/apps/web/ee/components/importers/ui/auth-form-input.tsx +++ b/apps/web/ee/components/importers/ui/auth-form-input.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; // icons import { Eye, EyeOff } from "lucide-react"; @@ -30,7 +28,7 @@ export type TAuthFormInputFormField = { error: boolean; }; -export const AuthFormInput: React.FC = (props) => { +export function AuthFormInput(props: Props) { const { name, type, label, description, placeholder, error, value, onChange } = props; // states const [showPassword, setShowPassword] = useState(false); @@ -74,4 +72,4 @@ export const AuthFormInput: React.FC = (props) => { {description &&

    {description}

    } ); -}; +} diff --git a/apps/web/ee/components/importers/ui/dropdown.tsx b/apps/web/ee/components/importers/ui/dropdown.tsx index 148b6bae0b..04ff5691de 100644 --- a/apps/web/ee/components/importers/ui/dropdown.tsx +++ b/apps/web/ee/components/importers/ui/dropdown.tsx @@ -1,12 +1,10 @@ -"use client"; - import { useTranslation } from "@plane/i18n"; import { Tooltip } from "@plane/propel/tooltip"; import { CustomSearchSelect } from "@plane/ui"; // silo types import type { TDropdown } from "@/plane-web/types/importers"; -export const Dropdown = (props: TDropdown) => { +export function Dropdown(props: TDropdown) { const { dropdownOptions, onChange, value, placeHolder, disabled = false, iconExtractor, queryExtractor } = props; const { t } = useTranslation(); // derived values @@ -51,4 +49,4 @@ export const Dropdown = (props: TDropdown) => { noChevron /> ); -}; +} diff --git a/apps/web/ee/components/importers/ui/error-banner.tsx b/apps/web/ee/components/importers/ui/error-banner.tsx index a90134212b..77d84d2e0a 100644 --- a/apps/web/ee/components/importers/ui/error-banner.tsx +++ b/apps/web/ee/components/importers/ui/error-banner.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Button } from "@plane/propel/button"; import { CloseIcon } from "@plane/propel/icons"; diff --git a/apps/web/ee/components/importers/ui/skip-user-import-toggle.tsx b/apps/web/ee/components/importers/ui/skip-user-import-toggle.tsx index 010dceddbe..bbbf411fd5 100644 --- a/apps/web/ee/components/importers/ui/skip-user-import-toggle.tsx +++ b/apps/web/ee/components/importers/ui/skip-user-import-toggle.tsx @@ -9,12 +9,12 @@ interface SkipUserImportProps { className?: string; } -export const SkipUserImport: React.FC = ({ +export function SkipUserImport({ importSourceName = "Jira", userSkipToggle, handleUserSkipToggle, className = "", -}) => { +}: SkipUserImportProps) { const handleClick = (value: boolean) => { handleUserSkipToggle(value); }; @@ -46,4 +46,4 @@ export const SkipUserImport: React.FC = ({ )} ); -}; +} diff --git a/apps/web/ee/components/importers/ui/stepper.tsx b/apps/web/ee/components/importers/ui/stepper.tsx index 5b3a4c38ad..9ad65edcce 100644 --- a/apps/web/ee/components/importers/ui/stepper.tsx +++ b/apps/web/ee/components/importers/ui/stepper.tsx @@ -1,5 +1,3 @@ -"use client"; - import { IMPORTER_TRACKER_ELEMENTS } from "@plane/constants"; import { useTranslation } from "@plane/i18n"; import { Button } from "@plane/propel/button"; @@ -9,7 +7,7 @@ import { cn } from "@plane/utils"; import type { TStepper, TStepperNavigation } from "@/plane-web/types/importers"; import ImporterHeader from "../header"; -export const Stepper = (props: TStepper) => { +export function Stepper(props: TStepper) { // props const { logo, steps, currentStepIndex, serviceName } = props; @@ -82,9 +80,9 @@ export const Stepper = (props: TStepper) => { ); -}; +} -export const StepperNavigation = (props: TStepperNavigation) => { +export function StepperNavigation(props: TStepperNavigation) { const { currentStep, handleStep, children } = props; // hooks @@ -116,4 +114,4 @@ export const StepperNavigation = (props: TStepperNavigation) => { )} ); -}; +} diff --git a/apps/web/ee/components/importers/ui/table.tsx b/apps/web/ee/components/importers/ui/table.tsx index a73d7cf350..5dbb1feed0 100644 --- a/apps/web/ee/components/importers/ui/table.tsx +++ b/apps/web/ee/components/importers/ui/table.tsx @@ -7,7 +7,7 @@ type TImporterTable = { iterator: ("" | { id: string; name: string | undefined; value: React.ReactNode } | undefined)[] | undefined; }; -const ImporterTable = (props: TImporterTable) => { +function ImporterTable(props: TImporterTable) { const { isLoading = false, headerLeft, headerRight, iterator } = props; return (
    @@ -41,6 +41,6 @@ const ImporterTable = (props: TImporterTable) => {
    ); -}; +} export default ImporterTable; diff --git a/apps/web/ee/components/importers/zip-importer/dashboard/root.tsx b/apps/web/ee/components/importers/zip-importer/dashboard/root.tsx index b36527a9ff..0c05319c0d 100644 --- a/apps/web/ee/components/importers/zip-importer/dashboard/root.tsx +++ b/apps/web/ee/components/importers/zip-importer/dashboard/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -18,7 +16,11 @@ import type { TZipImporterProps } from "@/plane-web/types/importers/zip-importer import { EDocImporterDestinationType } from "@/plane-web/types/importers/zip-importer"; import { DashboardLoaderTable, SyncJobStatus } from "../../common/dashboard"; -export const ZipImporterDashboard: FC = observer(({ driverType, logo, serviceName }) => { +export const ZipImporterDashboard = observer(function ZipImporterDashboard({ + driverType, + logo, + serviceName, +}: TZipImporterProps) { const { t } = useTranslation(); // hooks diff --git a/apps/web/ee/components/importers/zip-importer/steps/root.tsx b/apps/web/ee/components/importers/zip-importer/steps/root.tsx index 2f40eb4af5..ead202c7f0 100644 --- a/apps/web/ee/components/importers/zip-importer/steps/root.tsx +++ b/apps/web/ee/components/importers/zip-importer/steps/root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { observer } from "mobx-react"; import { Stepper } from "@/plane-web/components/importers/ui"; @@ -8,7 +7,7 @@ import { useZipImporter } from "@/plane-web/hooks/store/importers/use-zip-import import type { TZipImporterProps } from "@/plane-web/types/importers/zip-importer"; import { EZipDriverType } from "@/plane-web/types/importers/zip-importer"; -export const StepsRoot: FC = observer(({ driverType, logo, serviceName }) => { +export const StepsRoot = observer(function StepsRoot({ driverType, logo, serviceName }: TZipImporterProps) { const { currentStepIndex, resetImporterData } = useZipImporter(driverType); return ( diff --git a/apps/web/ee/components/importers/zip-importer/steps/select-destination/root.tsx b/apps/web/ee/components/importers/zip-importer/steps/select-destination/root.tsx index d297af7567..534164542d 100644 --- a/apps/web/ee/components/importers/zip-importer/steps/select-destination/root.tsx +++ b/apps/web/ee/components/importers/zip-importer/steps/select-destination/root.tsx @@ -14,7 +14,7 @@ import type { TZipImporterProps } from "@/plane-web/types/importers/zip-importer import { E_IMPORTER_STEPS, EDocImporterDestinationType } from "@/plane-web/types/importers/zip-importer"; import { StepperNavigation, Dropdown } from "../../../ui"; -export const SelectDestination: FC = observer(({ driverType }) => { +export const SelectDestination = observer(function SelectDestination({ driverType }: TZipImporterProps) { // hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/importers/zip-importer/steps/upload-zip/root.tsx b/apps/web/ee/components/importers/zip-importer/steps/upload-zip/root.tsx index bdee11a49d..040c0385f1 100644 --- a/apps/web/ee/components/importers/zip-importer/steps/upload-zip/root.tsx +++ b/apps/web/ee/components/importers/zip-importer/steps/upload-zip/root.tsx @@ -21,7 +21,7 @@ interface UploadedFile { file: File; } -export const UploadZip: FC = observer(({ driverType, serviceName }) => { +export const UploadZip = observer(function UploadZip({ driverType, serviceName }: TZipImporterProps) { // hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/common/add-scope-button.tsx b/apps/web/ee/components/initiatives/common/add-scope-button.tsx index aff6e40871..9abce0a616 100644 --- a/apps/web/ee/components/initiatives/common/add-scope-button.tsx +++ b/apps/web/ee/components/initiatives/common/add-scope-button.tsx @@ -13,7 +13,7 @@ type Props = { disabled?: boolean; }; -export const AddScopeButton = observer((props: Props) => { +export const AddScopeButton = observer(function AddScopeButton(props: Props) { const { customButton, disabled } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/common/multi-select-modal.tsx b/apps/web/ee/components/initiatives/common/multi-select-modal.tsx index 95712531be..521ee4769d 100644 --- a/apps/web/ee/components/initiatives/common/multi-select-modal.tsx +++ b/apps/web/ee/components/initiatives/common/multi-select-modal.tsx @@ -26,7 +26,7 @@ type Props = { onClose: () => void; }; -export const InitiativeMultiSelectModal: React.FC = observer((props) => { +export const InitiativeMultiSelectModal = observer(function InitiativeMultiSelectModal(props: Props) { const { isOpen, onClose, selectedInitiativeIds: selectedInitiativeIdsProp, onSubmit } = props; // states const [searchTerm, setSearchTerm] = useState(""); diff --git a/apps/web/ee/components/initiatives/common/update-status.tsx b/apps/web/ee/components/initiatives/common/update-status.tsx index 9b73d01951..ddf6ca7ee0 100644 --- a/apps/web/ee/components/initiatives/common/update-status.tsx +++ b/apps/web/ee/components/initiatives/common/update-status.tsx @@ -43,7 +43,7 @@ interface IInitiativeUpdate extends TUpdate { project_id: string; } -export const UpdateStatusPills = (props: TStatusPills) => { +export function UpdateStatusPills(props: TStatusPills) { const { handleUpdateOperations, workspaceSlug, initiativeId, analytics, defaultTab = "project", showTabs } = props; const [referenceElement, setReferenceElement] = useState(null); const [popperElement, setPopperElement] = useState(null); @@ -141,4 +141,4 @@ export const UpdateStatusPills = (props: TStatusPills) => { ))} ); -}; +} diff --git a/apps/web/ee/components/initiatives/components/create-update-initiatives-modal.tsx b/apps/web/ee/components/initiatives/components/create-update-initiatives-modal.tsx index 376c488561..09b6cb54a7 100644 --- a/apps/web/ee/components/initiatives/components/create-update-initiatives-modal.tsx +++ b/apps/web/ee/components/initiatives/components/create-update-initiatives-modal.tsx @@ -32,7 +32,7 @@ const defaultValues: Partial = { state: DEFAULT_INITIATIVE_STATE, }; -export const CreateUpdateInitiativeModal = observer((props: Props) => { +export const CreateUpdateInitiativeModal = observer(function CreateUpdateInitiativeModal(props: Props) { const { initiativeId, isOpen, handleClose } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/initiatives/components/form.tsx b/apps/web/ee/components/initiatives/components/form.tsx index 2ebda48ade..b8ba4060b2 100644 --- a/apps/web/ee/components/initiatives/components/form.tsx +++ b/apps/web/ee/components/initiatives/components/form.tsx @@ -44,7 +44,7 @@ type Props = { handleFormSubmit: () => Promise; }; -export const CreateUpdateInitiativeForm: FC = (props) => { +export function CreateUpdateInitiativeForm(props: Props) { const { initiativeDetail, formData, isSubmitting, handleFormDataChange, handleClose, handleFormSubmit } = props; const [isOpen, setIsOpen] = useState(false); @@ -286,4 +286,4 @@ export const CreateUpdateInitiativeForm: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/initiatives/components/group-header.tsx b/apps/web/ee/components/initiatives/components/group-header.tsx index d858a6553d..a8afe27c3b 100644 --- a/apps/web/ee/components/initiatives/components/group-header.tsx +++ b/apps/web/ee/components/initiatives/components/group-header.tsx @@ -9,7 +9,7 @@ interface IGroupHeader { toggleListGroup: (id: string) => void; } -export const GroupHeader = observer((props: IGroupHeader) => { +export const GroupHeader = observer(function GroupHeader(props: IGroupHeader) { const { groupID, icon, title, count, toggleListGroup } = props; return ( diff --git a/apps/web/ee/components/initiatives/components/initiative-block.tsx b/apps/web/ee/components/initiatives/components/initiative-block.tsx index c6a1e87465..7a95d3a5e8 100644 --- a/apps/web/ee/components/initiatives/components/initiative-block.tsx +++ b/apps/web/ee/components/initiatives/components/initiative-block.tsx @@ -26,7 +26,7 @@ type Props = { initiativeId: string; }; -export const InitiativeBlock = observer((props: Props) => { +export const InitiativeBlock = observer(function InitiativeBlock(props: Props) { const { initiativeId } = props; // ref const parentRef = useRef(null); diff --git a/apps/web/ee/components/initiatives/components/initiative-date-range-dropdown.tsx b/apps/web/ee/components/initiatives/components/initiative-date-range-dropdown.tsx index 291402bab9..87883d062e 100644 --- a/apps/web/ee/components/initiatives/components/initiative-date-range-dropdown.tsx +++ b/apps/web/ee/components/initiatives/components/initiative-date-range-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { differenceInCalendarDays } from "date-fns"; import { observer } from "mobx-react"; @@ -17,7 +15,9 @@ type TInitiativeDateRangeDropdownProps = { workspaceSlug: string; }; -export const InitiativeDateRangeDropdown: FC = observer((props) => { +export const InitiativeDateRangeDropdown = observer(function InitiativeDateRangeDropdown( + props: TInitiativeDateRangeDropdownProps +) { const { initiative, workspaceSlug } = props; const { initiative: { updateInitiative }, diff --git a/apps/web/ee/components/initiatives/components/initiative-delete-modal.tsx b/apps/web/ee/components/initiatives/components/initiative-delete-modal.tsx index 682842f087..6a1bdc6683 100644 --- a/apps/web/ee/components/initiatives/components/initiative-delete-modal.tsx +++ b/apps/web/ee/components/initiatives/components/initiative-delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ interface IInitiativeDelete { workspaceSlug: string; } -export const InitiativeDeleteModal: React.FC = observer((props) => { +export const InitiativeDeleteModal = observer(function InitiativeDeleteModal(props: IInitiativeDelete) { const { isOpen, handleClose, initiative, workspaceSlug } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/initiatives/components/initiative-gantt-block.tsx b/apps/web/ee/components/initiatives/components/initiative-gantt-block.tsx index a437366389..7100f77b98 100644 --- a/apps/web/ee/components/initiatives/components/initiative-gantt-block.tsx +++ b/apps/web/ee/components/initiatives/components/initiative-gantt-block.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { CSSProperties } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -22,7 +20,7 @@ type Props = { initiativeId: string; }; -export const InitiativeGanttBlock: React.FC = observer((props) => { +export const InitiativeGanttBlock = observer(function InitiativeGanttBlock(props: Props) { const { initiativeId } = props; const { isMobile } = usePlatformOS(); const { workspaceSlug } = useParams(); @@ -100,7 +98,7 @@ export const InitiativeGanttBlock: React.FC = observer((props) => { }); // Rendering initiatives on gantt sidebar - just the content -export const InitiativeGanttSidebarBlock: React.FC = observer((props) => { +export const InitiativeGanttSidebarBlock = observer(function InitiativeGanttSidebarBlock(props: Props) { const { initiativeId } = props; const { workspaceSlug } = useParams(); const { isMobile } = usePlatformOS(); diff --git a/apps/web/ee/components/initiatives/components/initiative-kanban-card.tsx b/apps/web/ee/components/initiatives/components/initiative-kanban-card.tsx index bdc3e13ad4..aeb99e116c 100644 --- a/apps/web/ee/components/initiatives/components/initiative-kanban-card.tsx +++ b/apps/web/ee/components/initiatives/components/initiative-kanban-card.tsx @@ -25,7 +25,7 @@ type Props = { initiativeId: string; }; -export const InitiativeKanbanCard = observer((props: Props) => { +export const InitiativeKanbanCard = observer(function InitiativeKanbanCard(props: Props) { const { initiativeId } = props; const parentRef = useRef(null); const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/initiatives/components/initiative-layout-loader.tsx b/apps/web/ee/components/initiatives/components/initiative-layout-loader.tsx index 2849588685..5e679c341c 100644 --- a/apps/web/ee/components/initiatives/components/initiative-layout-loader.tsx +++ b/apps/web/ee/components/initiatives/components/initiative-layout-loader.tsx @@ -3,8 +3,8 @@ import type { TBaseLayoutType } from "@plane/types"; import { GenericLayoutLoader } from "@/components/base-layouts/loaders/layout-loader"; import { DEFAULT_INITIATIVE_LAYOUT } from "@/plane-web/constants/initiative"; -const InitiativeLayoutLoader = ({ layout }: { layout?: TBaseLayoutType }) => ( - -); +function InitiativeLayoutLoader({ layout }: { layout?: TBaseLayoutType }) { + return ; +} export default InitiativeLayoutLoader; diff --git a/apps/web/ee/components/initiatives/components/initiatives-block-properties.tsx b/apps/web/ee/components/initiatives/components/initiatives-block-properties.tsx index 9dbf974114..496ebcc14e 100644 --- a/apps/web/ee/components/initiatives/components/initiatives-block-properties.tsx +++ b/apps/web/ee/components/initiatives/components/initiatives-block-properties.tsx @@ -1,4 +1,3 @@ -"use client"; import { observer } from "mobx-react"; // plane imports import { getRandomLabelColor } from "@plane/constants"; @@ -24,7 +23,7 @@ type Props = { workspaceSlug: string; }; -export const InitiativesBlockProperties = observer((props: Props) => { +export const InitiativesBlockProperties = observer(function InitiativesBlockProperties(props: Props) { const { initiative, isSidebarCollapsed, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/components/initiatives-group.tsx b/apps/web/ee/components/initiatives/components/initiatives-group.tsx index 993b01ba37..9e9bf44261 100644 --- a/apps/web/ee/components/initiatives/components/initiatives-group.tsx +++ b/apps/web/ee/components/initiatives/components/initiatives-group.tsx @@ -17,7 +17,7 @@ type Props = { groupBy: TInitiativeGroupByOptions; }; -export const InitiativeGroup = observer((props: Props) => { +export const InitiativeGroup = observer(function InitiativeGroup(props: Props) { const { group, initiativesIds, groupBy } = props; const [isExpanded, setIsExpanded] = useState(true); diff --git a/apps/web/ee/components/initiatives/components/initiatives-root.tsx b/apps/web/ee/components/initiatives/components/initiatives-root.tsx index 1e315c3f00..566a08f997 100644 --- a/apps/web/ee/components/initiatives/components/initiatives-root.tsx +++ b/apps/web/ee/components/initiatives/components/initiatives-root.tsx @@ -24,7 +24,7 @@ import { InitiativeGanttLayout } from "./layouts/gantt"; import { InitiativeKanbanLayout } from "./layouts/kanban"; import { InitiativesListLayout } from "./layouts/list"; -export const InitiativesRoot = observer(() => { +export const InitiativesRoot = observer(function InitiativesRoot() { // plane hooks const { t } = useTranslation(); const { resolvedTheme } = useTheme(); diff --git a/apps/web/ee/components/initiatives/components/labels/create-update-initiative-label-inline.tsx b/apps/web/ee/components/initiatives/components/labels/create-update-initiative-label-inline.tsx index c1e0860aa1..5091c0fc5a 100644 --- a/apps/web/ee/components/initiatives/components/labels/create-update-initiative-label-inline.tsx +++ b/apps/web/ee/components/initiatives/components/labels/create-update-initiative-label-inline.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { forwardRef, useEffect } from "react"; import { observer } from "mobx-react"; import { TwitterPicker } from "react-color"; diff --git a/apps/web/ee/components/initiatives/components/labels/delete-initiative-label-modal.tsx b/apps/web/ee/components/initiatives/components/labels/delete-initiative-label-modal.tsx index 78f56f58a1..f205734f9c 100644 --- a/apps/web/ee/components/initiatives/components/labels/delete-initiative-label-modal.tsx +++ b/apps/web/ee/components/initiatives/components/labels/delete-initiative-label-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -19,7 +17,7 @@ type Props = { data: TInitiativeLabel | null; }; -export const DeleteInitiativeLabelModal: React.FC = observer((props) => { +export const DeleteInitiativeLabelModal = observer(function DeleteInitiativeLabelModal(props: Props) { const { isOpen, onClose, data } = props; const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-block.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-block.tsx index 824db5c27a..cc7b6708e1 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-block.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-block.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { MutableRefObject } from "react"; import { useRef, useState } from "react"; import type { LucideIcon } from "lucide-react"; @@ -32,7 +30,7 @@ interface IInitiativeLabelBlock { draggable?: boolean; } -export const InitiativeLabelBlock = (props: IInitiativeLabelBlock) => { +export function InitiativeLabelBlock(props: IInitiativeLabelBlock) { const { label, isDragging, @@ -95,4 +93,4 @@ export const InitiativeLabelBlock = (props: IInitiativeLabelBlock) => { )} ); -}; +} diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-drag-n-drop-HOC.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-drag-n-drop-HOC.tsx index ff2a3f59f2..9564bcbd84 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-drag-n-drop-HOC.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-drag-n-drop-HOC.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { MutableRefObject } from "react"; import { useEffect, useRef, useState } from "react"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; @@ -25,7 +23,7 @@ type InitiativeLabelDragPreviewProps = { label: TInitiativeLabel; }; -export const InitiativeLabelDragPreview = (props: InitiativeLabelDragPreviewProps) => { +export function InitiativeLabelDragPreview(props: InitiativeLabelDragPreviewProps) { const { label } = props; return ( @@ -33,7 +31,7 @@ export const InitiativeLabelDragPreview = (props: InitiativeLabelDragPreviewProp ); -}; +} type Props = { label: TInitiativeLabel; @@ -42,7 +40,7 @@ type Props = { onDrop: (draggingLabelId: string, droppedLabelId: string | undefined, dropAtEndOfList: boolean) => void; }; -export const InitiativeLabelDndHOC = observer((props: Props) => { +export const InitiativeLabelDndHOC = observer(function InitiativeLabelDndHOC(props: Props) { const { label, isLastChild, children, onDrop } = props; // states diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-dropdown.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-dropdown.tsx index b4f3c174ae..cdba09b695 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-dropdown.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -33,7 +31,7 @@ export type TInitiativeLabelDropdownProps = { size?: "xs" | "sm" | "md" | "lg"; }; -export const InitiativeLabelDropdown: FC = observer((props) => { +export const InitiativeLabelDropdown = observer(function InitiativeLabelDropdown(props: TInitiativeLabelDropdownProps) { const { value, onChange, @@ -227,10 +225,13 @@ export const InitiativeLabelDropdown: FC = observ ); }); -const SelectedLabelsDisplay: FC<{ +function SelectedLabelsDisplay({ + selectedLabels, + allLabels, +}: { selectedLabels: Array<{ value: string; query: string }>; allLabels: Map; -}> = ({ selectedLabels, allLabels }) => { +}) { const isSingleSelection = selectedLabels.length === 1; if (isSingleSelection) { @@ -249,15 +250,17 @@ const SelectedLabelsDisplay: FC<{ {selectedLabels.length} Labels ); -}; +} -const PlaceholderDisplay: FC<{ placeholder: string }> = ({ placeholder }) => ( -
    - - {placeholder} -
    -); +function PlaceholderDisplay({ placeholder }: { placeholder: string }) { + return ( +
    + + {placeholder} +
    + ); +} -const ColorDot: FC<{ color?: string }> = ({ color }) => ( - -); +function ColorDot({ color }: { color?: string }) { + return ; +} diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-item.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-item.tsx index 273815f323..7c475f02f5 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-item.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-item.tsx @@ -22,7 +22,7 @@ type Props = { labelOperationsCallbacks: TInitiativeLabelOperationsCallbacks; }; -export const InitiativeLabelItem: React.FC = observer((props) => { +export const InitiativeLabelItem = observer(function InitiativeLabelItem(props: Props) { const { label, handleLabelDelete, setIsUpdating, isParentDragging, isLastChild, onDrop, labelOperationsCallbacks } = props; diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-list.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-list.tsx index 57700df652..5e7b58f9db 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-list.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-list.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState, useRef } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -25,7 +23,7 @@ import { CreateUpdateInitiativeLabelInline } from "./create-update-initiative-la import { DeleteInitiativeLabelModal } from "./delete-initiative-label-modal"; import { InitiativeLabelItem } from "./initiative-label-item"; -export const InitiativeLabelList: React.FC = observer(() => { +export const InitiativeLabelList = observer(function InitiativeLabelList() { const { workspaceSlug } = useParams(); const scrollToRef = useRef(null); diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-name.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-name.tsx index 04761bb924..3eae030750 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-name.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-name.tsx @@ -7,7 +7,7 @@ type InitiativeLabelNameProps = { className?: string; }; -export const InitiativeLabelName: React.FC = (props) => { +export function InitiativeLabelName(props: InitiativeLabelNameProps) { const { name, color, className = "" } = props; return ( @@ -21,4 +21,4 @@ export const InitiativeLabelName: React.FC = (props) = {name} ); -}; +} diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-property-dropdown.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-property-dropdown.tsx index 0ee6530759..89dd0abf7e 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-property-dropdown.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-property-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import type { Placement } from "@popperjs/core"; import { useParams } from "next/navigation"; @@ -42,7 +40,7 @@ export interface IInitiativeLabelPropertyDropdownProps { label: React.ReactNode; } -export const InitiativeLabelPropertyDropdown = (props: IInitiativeLabelPropertyDropdownProps) => { +export function InitiativeLabelPropertyDropdown(props: IInitiativeLabelPropertyDropdownProps) { const { workspaceSlug, value, @@ -312,4 +310,4 @@ export const InitiativeLabelPropertyDropdown = (props: IInitiativeLabelPropertyD ); -}; +} diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-label-property.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-label-property.tsx index b7af023125..857f6f1bde 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-label-property.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-label-property.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useMemo, useRef, useState } from "react"; import type { Placement } from "@popperjs/core"; import { observer } from "mobx-react"; @@ -37,7 +35,7 @@ export interface IInitiativeLabelProperty { fullHeight?: boolean; } -export const InitiativeLabelProperty: React.FC = observer((props) => { +export const InitiativeLabelProperty = observer(function InitiativeLabelProperty(props: IInitiativeLabelProperty) { const { workspaceSlug, value, @@ -90,66 +88,76 @@ export const InitiativeLabelProperty: React.FC = obser if (storeLabels && storeLabels.size > 0) initiativeLabels = Array.from(storeLabels.values()); const NoLabel = useMemo( - () => ( - + function NoLabel() { + return ( + +
    + + {placeholderText} +
    +     + ); + }, + [placeholderText, fullWidth, noLabelBorder, isMobile, t] + ); + + const LabelSummary = useMemo( + function LabelSummary() { + return (
    - {placeholderText} + {value.length} labels
    -     - ), - [placeholderText, fullWidth, noLabelBorder, isMobile, t] - ); - - const LabelSummary = useMemo( - () => ( -
    - - {value.length} labels -
    - ), + ); + }, [value.length, fullWidth, noLabelBorder] ); - const LabelItem = useMemo(() => { - const LabelItemComponent = ({ label }: { label: TInitiativeLabel }) => ( -
    - - {label?.name} -
    - ); - LabelItemComponent.displayName = "LabelItem"; - return LabelItemComponent; - }, [fullWidth, noLabelBorder]); + const LabelItem = useMemo( + function LabelItem() { + function LabelItemComponent({ label }: { label: TInitiativeLabel }) { + return ( +
    + + {label?.name} +
    + ); + } + + LabelItemComponent.displayName = "LabelItem"; + return LabelItemComponent; + }, + [fullWidth, noLabelBorder] + ); return ( <> diff --git a/apps/web/ee/components/initiatives/components/labels/initiative-labels.tsx b/apps/web/ee/components/initiatives/components/labels/initiative-labels.tsx index 864b1085a9..132ca3b495 100644 --- a/apps/web/ee/components/initiatives/components/labels/initiative-labels.tsx +++ b/apps/web/ee/components/initiatives/components/labels/initiative-labels.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import type { Placement } from "@popperjs/core"; import { observer } from "mobx-react"; @@ -38,7 +36,7 @@ export interface IInitiativeLabels { fullHeight?: boolean; } -export const InitiativeLabels: React.FC = observer((props) => { +export const InitiativeLabels = observer(function InitiativeLabels(props: IInitiativeLabels) { const { workspaceSlug, value, @@ -87,90 +85,96 @@ export const InitiativeLabels: React.FC = observer((props) => const initiativeLabels = getInitiativeLabelsArray(storeLabels, defaultOptions as TInitiativeLabel[]); const NoLabel = useMemo( - () => ( - -
    - - {placeholderText} -
    -     - ), +
    + + {placeholderText} +
    + + ); + }, [placeholderText, fullWidth, noLabelBorder, isMobile] ); const LabelSummary = useMemo( - () => ( -
    - value.includes(l?.id)) - .map((l) => l?.name) - .join(", ")} - renderByDefault={false} + function LabelSummary() { + return ( +
    -
    - - {`${value.length} Labels`} -
    - -
    - ), + value.includes(l?.id)) + .map((l) => l?.name) + .join(", ")} + renderByDefault={false} + > +
    + + {`${value.length} Labels`} +
    +     +
    + ); + }, [fullWidth, disabled, noLabelBorder, isMobile, initiativeLabels, value] ); const LabelItem = useCallback( - ({ label }: { label: TInitiativeLabel }) => ( - -
    -
    - -
    {label?.name}
    +
    +
    + +
    {label?.name}
    +
    -
    - - ), + + ); + }, [disabled, fullWidth, isMobile, noLabelBorder, renderByDefault] ); diff --git a/apps/web/ee/components/initiatives/components/layouts/gantt.tsx b/apps/web/ee/components/initiatives/components/layouts/gantt.tsx index 6f63b88462..c8252a3f84 100644 --- a/apps/web/ee/components/initiatives/components/layouts/gantt.tsx +++ b/apps/web/ee/components/initiatives/components/layouts/gantt.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useMemo } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ import type { TInitiative } from "@/plane-web/types/initiative"; import { getGroupList } from "../../utils"; import { InitiativeGanttBlock, InitiativeGanttSidebarBlock } from "../initiative-gantt-block"; -export const InitiativeGanttLayout = observer(() => { +export const InitiativeGanttLayout = observer(function InitiativeGanttLayout() { const { t } = useTranslation(); const { allowPermissions } = useUserPermissions(); const { getUserDetails, workspace } = useMember(); diff --git a/apps/web/ee/components/initiatives/components/layouts/kanban.tsx b/apps/web/ee/components/initiatives/components/layouts/kanban.tsx index bf62f35cd0..9a5a6b64c5 100644 --- a/apps/web/ee/components/initiatives/components/layouts/kanban.tsx +++ b/apps/web/ee/components/initiatives/components/layouts/kanban.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useMemo } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -25,7 +23,7 @@ import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives"; import { getGroupList, getInitiativeUpdatePayload } from "../../utils"; import { InitiativeKanbanCard } from "../initiative-kanban-card"; -export const InitiativeKanbanLayout = observer(() => { +export const InitiativeKanbanLayout = observer(function InitiativeKanbanLayout() { const { workspaceSlug } = useParams(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/components/layouts/list.tsx b/apps/web/ee/components/initiatives/components/layouts/list.tsx index 5474aeaaca..c70e4cb3e9 100644 --- a/apps/web/ee/components/initiatives/components/layouts/list.tsx +++ b/apps/web/ee/components/initiatives/components/layouts/list.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useMemo } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -16,7 +14,7 @@ import type { TInitiative } from "@/plane-web/types"; import { getGroupList, getInitiativeUpdatePayload } from "../../utils"; import { InitiativeBlock } from "../initiative-block"; -export const InitiativesListLayout = observer(() => { +export const InitiativesListLayout = observer(function InitiativesListLayout() { const { t } = useTranslation(); const { allowPermissions } = useUserPermissions(); const { getUserDetails } = useMember(); diff --git a/apps/web/ee/components/initiatives/components/property-block-wrapper.tsx b/apps/web/ee/components/initiatives/components/property-block-wrapper.tsx index 0fe7c2c481..b501c9b1b4 100644 --- a/apps/web/ee/components/initiatives/components/property-block-wrapper.tsx +++ b/apps/web/ee/components/initiatives/components/property-block-wrapper.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // plane imports @@ -10,11 +8,11 @@ type Props = { children: React.ReactNode; }; -export const PropertyBlockWrapper: FC = (props) => { +export function PropertyBlockWrapper(props: Props) { const { className = "", children } = props; return (
    {children}
    ); -}; +} diff --git a/apps/web/ee/components/initiatives/components/quick-actions.tsx b/apps/web/ee/components/initiatives/components/quick-actions.tsx index d43a7f5986..f21533b2a0 100644 --- a/apps/web/ee/components/initiatives/components/quick-actions.tsx +++ b/apps/web/ee/components/initiatives/components/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { ExternalLink, LinkIcon, Pencil, Trash2 } from "lucide-react"; @@ -27,7 +25,7 @@ type Props = { customClassName?: string; }; -export const InitiativeQuickActions: React.FC = observer((props) => { +export const InitiativeQuickActions = observer(function InitiativeQuickActions(props: Props) { const { parentRef, initiative, workspaceSlug, disabled = false, customClassName } = props; // states const [updateModal, setUpdateModal] = useState(false); diff --git a/apps/web/ee/components/initiatives/components/rich-filters/context.tsx b/apps/web/ee/components/initiatives/components/rich-filters/context.tsx index 8376ed2945..9fa043a9e9 100644 --- a/apps/web/ee/components/initiatives/components/rich-filters/context.tsx +++ b/apps/web/ee/components/initiatives/components/rich-filters/context.tsx @@ -31,70 +31,72 @@ const createFilterInstance = ( }, }); -const InitiativesFilterInstanceProvider = observer( - ({ - children, - filters, - workspaceSlug, - }: { - children: ReactNode; - filters: TExternalInitiativeFilterExpression; - workspaceSlug: string; - }) => { - const { - initiativeFilters: { updateFilters }, - initiative: { getInitiativesLabels }, - } = useInitiatives(); +const InitiativesFilterInstanceProvider = observer(function InitiativesFilterInstanceProvider({ + children, + filters, + workspaceSlug, +}: { + children: ReactNode; + filters: TExternalInitiativeFilterExpression; + workspaceSlug: string; +}) { + const { + initiativeFilters: { updateFilters }, + initiative: { getInitiativesLabels }, + } = useInitiatives(); - const [filterInstance] = useState(() => - createFilterInstance(filters, (expression) => { - updateFilters(workspaceSlug, expression); - }) - ); + const [filterInstance] = useState(() => + createFilterInstance(filters, (expression) => { + updateFilters(workspaceSlug, expression); + }) + ); - const operatorConfigs = useFiltersOperatorConfigs({ workspaceSlug }); - const { - workspace: { workspaceMemberIds }, - getUserDetails, - } = useMember(); + const operatorConfigs = useFiltersOperatorConfigs({ workspaceSlug }); + const { + workspace: { workspaceMemberIds }, + getUserDetails, + } = useMember(); - const labels = getInitiativesLabels(workspaceSlug); + const labels = getInitiativesLabels(workspaceSlug); - const workspaceMembers = useMemo(() => { - if (!workspaceMemberIds) return []; - return workspaceMemberIds.map((memberId) => getUserDetails(memberId)).filter(Boolean) as IUserLite[]; - }, [getUserDetails, workspaceMemberIds]); + const workspaceMembers = useMemo(() => { + if (!workspaceMemberIds) return []; + return workspaceMemberIds.map((memberId) => getUserDetails(memberId)).filter(Boolean) as IUserLite[]; + }, [getUserDetails, workspaceMemberIds]); - const { leadFilterConfig, startDateFilterConfig, endDateFilterConfig, statesFilterConfig, labelsFilterConfig } = - useInitiativesFilterConfigs({ - workspaceMembers, - operatorConfigs, - labels: Array.from(labels?.values() || []), - }); + const { leadFilterConfig, startDateFilterConfig, endDateFilterConfig, statesFilterConfig, labelsFilterConfig } = + useInitiativesFilterConfigs({ + workspaceMembers, + operatorConfigs, + labels: Array.from(labels?.values() || []), + }); - // Register all filter configs - filterInstance.configManager.registerAll([ - leadFilterConfig, - startDateFilterConfig, - endDateFilterConfig, - statesFilterConfig, - labelsFilterConfig, - ]); + // Register all filter configs + filterInstance.configManager.registerAll([ + leadFilterConfig, + startDateFilterConfig, + endDateFilterConfig, + statesFilterConfig, + labelsFilterConfig, + ]); - const value = useMemo( - () => ({ - filterInstance, - workspaceMembers, - isReady: true, - }), - [filterInstance, workspaceMembers] - ); + const value = useMemo( + () => ({ + filterInstance, + workspaceMembers, + isReady: true, + }), + [filterInstance, workspaceMembers] + ); - return {children}; - } -); + return {children}; +}); -export const InitiativesFilterProvider = observer(({ children }: { children: ReactNode }) => { +export const InitiativesFilterProvider = observer(function InitiativesFilterProvider({ + children, +}: { + children: ReactNode; +}) { const { workspaceSlug } = useParams(); const { initiativeFilters: { getInitiativeFilters }, diff --git a/apps/web/ee/components/initiatives/components/rich-filters/row.tsx b/apps/web/ee/components/initiatives/components/rich-filters/row.tsx index 7e60203fa2..0650335663 100644 --- a/apps/web/ee/components/initiatives/components/rich-filters/row.tsx +++ b/apps/web/ee/components/initiatives/components/rich-filters/row.tsx @@ -3,7 +3,7 @@ import { Loader } from "@plane/ui"; import { FiltersRow } from "@/components/rich-filters/filters-row"; import { useInitiativesFilterContext } from "./context"; -const InitiativesFiltersRow = observer(() => { +const InitiativesFiltersRow = observer(function InitiativesFiltersRow() { const { filterInstance, isReady } = useInitiativesFilterContext(); if (!isReady || !filterInstance) { diff --git a/apps/web/ee/components/initiatives/components/rich-filters/toggle.tsx b/apps/web/ee/components/initiatives/components/rich-filters/toggle.tsx index 6385518b91..c90a55841b 100644 --- a/apps/web/ee/components/initiatives/components/rich-filters/toggle.tsx +++ b/apps/web/ee/components/initiatives/components/rich-filters/toggle.tsx @@ -2,7 +2,7 @@ import { observer } from "mobx-react"; import { FiltersToggle } from "@/components/rich-filters/filters-toggle"; import { useInitiativesFilterContext } from "./context"; -export const InitiativesFiltersToggle = observer(() => { +export const InitiativesFiltersToggle = observer(function InitiativesFiltersToggle() { const { filterInstance } = useInitiativesFilterContext(); return ; diff --git a/apps/web/ee/components/initiatives/components/states/initiative-state-dropdown.tsx b/apps/web/ee/components/initiatives/components/states/initiative-state-dropdown.tsx index 30d8acff80..81fa1cc451 100644 --- a/apps/web/ee/components/initiatives/components/states/initiative-state-dropdown.tsx +++ b/apps/web/ee/components/initiatives/components/states/initiative-state-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Check } from "lucide-react"; @@ -25,7 +23,7 @@ export type TInitiativeStateDropdownProps = { size?: "xs" | "sm" | "md" | "lg"; }; -export const InitiativeStateDropdown: FC = observer((props) => { +export const InitiativeStateDropdown = observer(function InitiativeStateDropdown(props: TInitiativeStateDropdownProps) { const { value, onChange, diff --git a/apps/web/ee/components/initiatives/details/empty-state.tsx b/apps/web/ee/components/initiatives/details/empty-state.tsx index 0b34c3f7a1..04f4f43fb3 100644 --- a/apps/web/ee/components/initiatives/details/empty-state.tsx +++ b/apps/web/ee/components/initiatives/details/empty-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // plane imports import { useTranslation } from "@plane/i18n"; @@ -14,7 +12,7 @@ type TInitiativeEmptyStateProps = { workspaceSlug: string; }; -export const InitiativeEmptyState: FC = (props) => { +export function InitiativeEmptyState(props: TInitiativeEmptyStateProps) { const { workspaceSlug } = props; // router const router = useAppRouter(); @@ -32,4 +30,4 @@ export const InitiativeEmptyState: FC = (props) => { }} /> ); -}; +} diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section-root.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section-root.tsx index fdffbedeba..774792c760 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section-root.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ type Props = { disabled: boolean; }; -export const InitiativeCollapsibleSection: FC = observer((props) => { +export const InitiativeCollapsibleSection = observer(function InitiativeCollapsibleSection(props: Props) { const { workspaceSlug, initiativeId, disabled } = props; // store hooks diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-item.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-item.tsx index 84e5e9a6d3..74c1734cda 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-item.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Trash } from "lucide-react"; @@ -21,7 +19,7 @@ type Props = { toggleDeleteAttachmentModal: (attachmentId: string | null) => void; }; -export const InitiativeAttachmentsListItem: FC = observer((props) => { +export const InitiativeAttachmentsListItem = observer(function InitiativeAttachmentsListItem(props: Props) { // props const { attachmentId, disabled, toggleDeleteAttachmentModal } = props; // store hooks diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-upload-item.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-upload-item.tsx index 2cc18a80aa..a65aa048b6 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-upload-item.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachment-list-upload-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { Tooltip } from "@plane/propel/tooltip"; @@ -17,7 +15,7 @@ type Props = { uploadStatus: TAttachmentUploadStatus; }; -export const AttachmentsUploadItem: React.FC = observer((props) => { +export const AttachmentsUploadItem = observer(function AttachmentsUploadItem(props: Props) { // props const { uploadStatus } = props; // derived values diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachments-section.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachments-section.tsx index a91a8613d2..af841b4470 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachments-section.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/attachments-section.tsx @@ -1,4 +1,3 @@ -"use client"; import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -18,7 +17,7 @@ type Props = { count: number; }; -export const AttachmentsSection: React.FC = observer((props) => { +export const AttachmentsSection = observer(function AttachmentsSection(props: Props) { const { workspaceSlug, initiativeId, disabled, isOpen, onToggle, count } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/delete-attachment-modal.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/delete-attachment-modal.tsx index 5ec7ddc583..b1b7071bb4 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/delete-attachment-modal.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/delete-attachment-modal.tsx @@ -20,7 +20,7 @@ type Props = { attachmentOperations: TAttachmentOperationsRemoveModal; }; -export const InitiativeAttachmentDeleteModal: FC = observer((props) => { +export const InitiativeAttachmentDeleteModal = observer(function InitiativeAttachmentDeleteModal(props: Props) { const { isOpen, onClose, attachmentId, attachmentOperations } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/root.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/root.tsx index 2a0dd632b0..9a56cedb0c 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/root.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useCallback, useState } from "react"; import { observer } from "mobx-react"; @@ -22,7 +21,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeAttachmentRoot: FC = observer((props) => { +export const InitiativeAttachmentRoot = observer(function InitiativeAttachmentRoot(props: Props) { const { workspaceSlug, initiativeId, disabled } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/use-attachments.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/use-attachments.tsx index 01162336bb..ea4694d888 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/use-attachments.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/attachment/use-attachments.tsx @@ -1,4 +1,3 @@ -"use client"; import { useMemo } from "react"; import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/propel/toast"; // hooks diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/content.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/content.tsx index e474ab8b85..d79eef963a 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/content.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/content.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -25,7 +23,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeEpicsCollapsibleContent: FC = observer((props) => { +export const InitiativeEpicsCollapsibleContent = observer(function InitiativeEpicsCollapsibleContent(props: Props) { const { workspaceSlug, initiativeId, toggleEpicModal, disabled = false } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/epics-list-group.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/epics-list-group.tsx index 856a84a108..263505bdef 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/epics-list-group.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/epics-list-group.tsx @@ -17,7 +17,7 @@ interface TEpicsGroupProps { initiativeId: string; } -export const EpicsGroup: FC = observer((props) => { +export const EpicsGroup = observer(function EpicsGroup(props: TEpicsGroupProps) { const { group, disabled, initiativeId, workspaceSlug, epicIds } = props; const isAllIssues = group.id === ALL_ISSUES; diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/properties.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/properties.tsx index 72dad7bb4e..c40ed39558 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/properties.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/properties.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, SyntheticEvent } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -33,7 +31,7 @@ type Props = { displayProperties?: IIssueDisplayProperties; }; -export const EpicProperties: FC = observer((props) => { +export const EpicProperties = observer(function EpicProperties(props: Props) { const { workspaceSlug, initiativeId, epicId, disabled = false, displayProperties = {} } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/quick-action.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/quick-action.tsx index 20054e9879..f388a04b2f 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/quick-action.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/quick-action.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { LinkIcon, MoreHorizontal, Trash2 } from "lucide-react"; // Plane @@ -22,7 +20,7 @@ type Props = { disabled?: boolean; }; -export const EpicQuickActions: React.FC = observer((props: Props) => { +export const EpicQuickActions = observer(function EpicQuickActions(props: Props) { const { workspaceSlug, initiativeId, epicId, disabled } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/root.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/root.tsx index bf21d48781..0d7e4eccd5 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/root.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epic-list-item/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useRef } from "react"; import { observer } from "mobx-react"; // Plane @@ -31,7 +29,7 @@ type Props = { disabled?: boolean; }; -export const EpicListItem: React.FC = observer((props) => { +export const EpicListItem = observer(function EpicListItem(props: Props) { const { workspaceSlug, epicId, initiativeId, disabled = false } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epics-section.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epics-section.tsx index 6c5dc75949..e6370529f4 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epics-section.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/epics-section.tsx @@ -1,4 +1,3 @@ -"use client"; import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -19,7 +18,7 @@ type Props = { count: number; }; -export const EpicsSection: React.FC = observer((props) => { +export const EpicsSection = observer(function EpicsSection(props: Props) { const { workspaceSlug, initiativeId, disabled, toggleEpicModal, isOpen, onToggle, count } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/issue-search-modal-empty-state.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/issue-search-modal-empty-state.tsx index 72e9719e89..2472a883ca 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/issue-search-modal-empty-state.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/issue-search-modal-empty-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTheme } from "next-themes"; // plane imports @@ -20,7 +18,7 @@ type Props = { isSearching: boolean; }; -export const EpicSearchModalEmptyState: FC = ({ issues, searchTerm, debouncedSearchTerm, isSearching }) => { +export function EpicSearchModalEmptyState({ issues, searchTerm, debouncedSearchTerm, isSearching }: Props) { // plane hooks const { t } = useTranslation(); const { resolvedTheme } = useTheme(); @@ -28,9 +26,9 @@ export const EpicSearchModalEmptyState: FC = ({ issues, searchTerm, debou const searchResolvedPath = resolvedTheme === "light" ? searchLight : searchDark; const epicsResolvedPath = resolvedTheme === "light" ? issuesLight : issuesDark; - const EmptyStateContainer = ({ children }: { children: React.ReactNode }) => ( -
    {children}
    - ); + function EmptyStateContainer({ children }: { children: React.ReactNode }) { + return
    {children}
    ; + } if (issues.length === 0 && searchTerm !== "" && debouncedSearchTerm !== "" && !isSearching) { return ( @@ -45,4 +43,4 @@ export const EpicSearchModalEmptyState: FC = ({ issues, searchTerm, debou ); } -}; +} diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/title-actions.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/title-actions.tsx index 9e273bee83..36c8f4d341 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/title-actions.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/title-actions.tsx @@ -24,7 +24,7 @@ type TEpicsTitleActionsProps = { workspaceSlug: string; }; -export const EpicsTitleActions: FC = observer((props) => { +export const EpicsTitleActions = observer(function EpicsTitleActions(props: TEpicsTitleActionsProps) { const { disabled, toggleEpicModal, initiativeId, workspaceSlug } = props; // store hooks diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/workspace-epic-modal.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/workspace-epic-modal.tsx index d19e0f609e..f6cb3a947a 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/workspace-epic-modal.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/epics/workspace-epic-modal.tsx @@ -1,4 +1,3 @@ -"use client"; import React, { useEffect, useMemo, useState } from "react"; import { isEqual } from "lodash-es"; import { observer } from "mobx-react"; @@ -34,7 +33,7 @@ type Props = { // move this to workspace service const workspaceService = new WorkspaceService(); -export const WorkspaceEpicsListModal: React.FC = observer((props) => { +export const WorkspaceEpicsListModal = observer(function WorkspaceEpicsListModal(props: Props) { const { workspaceSlug, isOpen, handleClose: onClose, handleOnSubmit, searchParams, selectedEpicIds } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-components/content.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-components/content.tsx index e1bebbeca4..7af62c9ad2 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-components/content.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-components/content.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; // components @@ -12,9 +11,9 @@ type Props = { disabled: boolean; }; -export const InitiativeLinksCollapsibleContent: FC = (props) => { +export function InitiativeLinksCollapsibleContent(props: Props) { const { workspaceSlug, initiativeId, disabled } = props; // helper const handleLinkOperations = useLinkOperations(workspaceSlug, initiativeId); return ; -}; +} diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/create-update-link-modal.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/create-update-link-modal.tsx index c258414e36..093e4c0211 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/create-update-link-modal.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/create-update-link-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect } from "react"; import { observer } from "mobx-react"; @@ -30,7 +28,9 @@ const defaultValues: TIssueLinkCreateFormFieldOptions = { url: "", }; -export const IssueLinkCreateUpdateModal: FC = observer((props) => { +export const IssueLinkCreateUpdateModal = observer(function IssueLinkCreateUpdateModal( + props: TIssueLinkCreateEditModal +) { // props const { isModalOpen, linkOperations, handleOnClose } = props; // react hook form diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-item.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-item.tsx index a289dd3175..6c4e762a3d 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-item.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Copy, LinkIcon, Pencil, Trash2 } from "lucide-react"; @@ -24,7 +22,7 @@ type TInitiativeLinkItem = { isNotAllowed: boolean; }; -export const InitiativeLinkItem: FC = observer((props) => { +export const InitiativeLinkItem = observer(function InitiativeLinkItem(props: TInitiativeLinkItem) { // props const { link, linkOperations, isNotAllowed } = props; // hooks diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-list.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-list.tsx index 0150d8eea8..e0a500bed5 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-list.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/link-items/link-list.tsx @@ -14,7 +14,7 @@ type TLinkList = { disabled?: boolean; }; -export const LinkList: FC = observer((props) => { +export const LinkList = observer(function LinkList(props: TLinkList) { // props const { initiativeId, linkOperations, disabled = false } = props; // hooks diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/links-section.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/links-section.tsx index 8e23e89c96..3bcbda7f46 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/links/links-section.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/links/links-section.tsx @@ -1,4 +1,3 @@ -"use client"; import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -18,7 +17,7 @@ type Props = { count: number; }; -export const LinksSection: React.FC = observer((props) => { +export const LinksSection = observer(function LinksSection(props: Props) { const { workspaceSlug, initiativeId, disabled, isOpen, onToggle, count } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/content.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/content.tsx index 9de867fc2f..50a83e49e8 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/content.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/content.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; // @@ -17,7 +15,7 @@ type Props = { toggleProjectModal: (value?: boolean) => void; }; -export const InitiativeProjectsCollapsibleContent: FC = (props) => { +export function InitiativeProjectsCollapsibleContent(props: Props) { const { workspaceSlug, initiativeId, projectIds, disabled, toggleProjectModal } = props; return (
    @@ -54,4 +52,4 @@ export const InitiativeProjectsCollapsibleContent: FC = (props) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/index.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/index.tsx index 1a4b1bd3c3..8d44d0b9b9 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/index.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/index.tsx @@ -24,7 +24,7 @@ type Props = { initiativeId: string; }; -export const ProjectItem = observer((props: Props) => { +export const ProjectItem = observer(function ProjectItem(props: Props) { const { workspaceSlug, initiativeId, projectId } = props; // store hooks const { getProjectById, getProjectAnalyticsCountById, updateProject } = useProject(); diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/quick-actions.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/quick-actions.tsx index 932c73074e..86698423a6 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/quick-actions.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list-item/quick-actions.tsx @@ -16,7 +16,7 @@ type Props = { initiativeId: string; }; -export const QuickActions: React.FC = observer((props: Props) => { +export const QuickActions = observer(function QuickActions(props: Props) { const { workspaceSlug, initiativeId, project } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list.tsx index c4809d7ed1..e000731134 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/project-list.tsx @@ -9,7 +9,7 @@ type ProjectListProps = { disabled: boolean; }; -export const ProjectList = observer((props: ProjectListProps) => { +export const ProjectList = observer(function ProjectList(props: ProjectListProps) { const { workspaceSlug, projectIds, initiativeId } = props; return ( diff --git a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/projects-section.tsx b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/projects-section.tsx index 8c98b72b5f..d07e3df7b6 100644 --- a/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/projects-section.tsx +++ b/apps/web/ee/components/initiatives/details/main/collapsible-section/projects/projects-section.tsx @@ -1,4 +1,3 @@ -"use client"; import React from "react"; import { observer } from "mobx-react"; import { Plus } from "lucide-react"; @@ -20,7 +19,7 @@ type Props = { count: number; }; -export const ProjectsSection: React.FC = observer((props) => { +export const ProjectsSection = observer(function ProjectsSection(props: Props) { const { workspaceSlug, initiativeId, projectIds, disabled, toggleProjectModal, isOpen, onToggle, count } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/details/main/info-section-root.tsx b/apps/web/ee/components/initiatives/details/main/info-section-root.tsx index 7c29895af5..0266b01311 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section-root.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -24,7 +22,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeInfoSection: FC = observer((props) => { +export const InitiativeInfoSection = observer(function InitiativeInfoSection(props: Props) { const { editorRef, workspaceSlug, initiativeId, disabled = false } = props; const [isOpen, setIsOpen] = useState(false); // store hooks diff --git a/apps/web/ee/components/initiatives/details/main/info-section/action-button.tsx b/apps/web/ee/components/initiatives/details/main/info-section/action-button.tsx index a73c0077f0..c15ffa1e52 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section/action-button.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section/action-button.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -10,7 +9,7 @@ type Props = { onClick: () => void; }; -export const InitiativeActionButton: FC = observer((props) => { +export const InitiativeActionButton = observer(function InitiativeActionButton(props: Props) { const { customButton, onClick, disabled = false } = props; // handlers diff --git a/apps/web/ee/components/initiatives/details/main/info-section/action-items.tsx b/apps/web/ee/components/initiatives/details/main/info-section/action-items.tsx index 2015b07324..58b68543e5 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section/action-items.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section/action-items.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Link, Paperclip } from "lucide-react"; @@ -18,7 +16,7 @@ type Props = { disabled: boolean; }; -export const InitiativeInfoActionItems: FC = observer((props) => { +export const InitiativeInfoActionItems = observer(function InitiativeInfoActionItems(props: Props) { const { workspaceSlug, initiativeId, disabled } = props; const { t } = useTranslation(); // store hooks diff --git a/apps/web/ee/components/initiatives/details/main/info-section/attachment-button.tsx b/apps/web/ee/components/initiatives/details/main/info-section/attachment-button.tsx index be6ded1a85..ab05ab224e 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section/attachment-button.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section/attachment-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useCallback, useState } from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeAttachmentActionButton: FC = observer((props) => { +export const InitiativeAttachmentActionButton = observer(function InitiativeAttachmentActionButton(props: Props) { const { workspaceSlug, initiativeId, customButton, disabled = false } = props; // state const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/initiatives/details/main/info-section/indicator-item.tsx b/apps/web/ee/components/initiatives/details/main/info-section/indicator-item.tsx index dc84374631..9efbee7544 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section/indicator-item.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section/indicator-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { omit } from "lodash-es"; import { observer } from "mobx-react"; @@ -14,7 +12,7 @@ type Props = { initiativeId: string; }; -export const InitiativeInfoIndicatorItem: FC = observer((props) => { +export const InitiativeInfoIndicatorItem = observer(function InitiativeInfoIndicatorItem(props: Props) { const { initiativeId } = props; // hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/info-section/link-button.tsx b/apps/web/ee/components/initiatives/details/main/info-section/link-button.tsx index 19243579c3..4139195d1c 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section/link-button.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section/link-button.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -11,7 +10,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeLinksActionButton: FC = observer((props) => { +export const InitiativeLinksActionButton = observer(function InitiativeLinksActionButton(props: Props) { const { customButton, disabled = false } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/info-section/reactions.tsx b/apps/web/ee/components/initiatives/details/main/info-section/reactions.tsx index ac4e88f040..c094d65117 100644 --- a/apps/web/ee/components/initiatives/details/main/info-section/reactions.tsx +++ b/apps/web/ee/components/initiatives/details/main/info-section/reactions.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useMemo, useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ export type TIssueReaction = { disabled?: boolean; }; -export const InitiativeReactions: FC = observer((props) => { +export const InitiativeReactions = observer(function InitiativeReactions(props: TIssueReaction) { const { workspaceSlug, initiativeId, disabled = false } = props; // state const [isPickerOpen, setIsPickerOpen] = useState(false); diff --git a/apps/web/ee/components/initiatives/details/main/modals.tsx b/apps/web/ee/components/initiatives/details/main/modals.tsx index f6c631927e..4583402934 100644 --- a/apps/web/ee/components/initiatives/details/main/modals.tsx +++ b/apps/web/ee/components/initiatives/details/main/modals.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives"; @@ -12,7 +10,7 @@ type Props = { initiativeId: string; }; -export const InitiativeModalsRoot: FC = observer((props) => { +export const InitiativeModalsRoot = observer(function InitiativeModalsRoot(props: Props) { const { workspaceSlug, initiativeId } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/progress-section-root.tsx b/apps/web/ee/components/initiatives/details/main/progress-section-root.tsx index 62bbc132fc..08a97556e2 100644 --- a/apps/web/ee/components/initiatives/details/main/progress-section-root.tsx +++ b/apps/web/ee/components/initiatives/details/main/progress-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -15,7 +13,7 @@ type Props = { initiativeId: string; }; -export const InitiativeProgressSection: FC = observer((props) => { +export const InitiativeProgressSection = observer(function InitiativeProgressSection(props: Props) { const { initiativeId } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/main/root.tsx b/apps/web/ee/components/initiatives/details/main/root.tsx index 5242081cfe..e6de982a41 100644 --- a/apps/web/ee/components/initiatives/details/main/root.tsx +++ b/apps/web/ee/components/initiatives/details/main/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -22,7 +20,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeMainContentRoot: FC = observer((props) => { +export const InitiativeMainContentRoot = observer(function InitiativeMainContentRoot(props: Props) { const { editorRef, workspaceSlug, initiativeId, disabled = false } = props; // store hooks const { initiativesSidebarCollapsed } = useAppTheme(); diff --git a/apps/web/ee/components/initiatives/details/main/scope-breakdown.tsx b/apps/web/ee/components/initiatives/details/main/scope-breakdown.tsx index 07faae19d3..f546f51850 100644 --- a/apps/web/ee/components/initiatives/details/main/scope-breakdown.tsx +++ b/apps/web/ee/components/initiatives/details/main/scope-breakdown.tsx @@ -24,7 +24,7 @@ type TDataCardProps = { count: number; }; -const DataCard = (props: TDataCardProps) => { +function DataCard(props: TDataCardProps) { const { type, data, workspaceSlug, initiativeId, count } = props; const router = useRouter(); const { handleUpdateOperations } = useInitiativeUpdates(workspaceSlug, initiativeId); @@ -104,14 +104,14 @@ const DataCard = (props: TDataCardProps) => { )} ); -}; +} type Props = { workspaceSlug: string; initiativeId: string; disabled?: boolean; }; -export const ScopeBreakdown = observer((props: Props) => { +export const ScopeBreakdown = observer(function ScopeBreakdown(props: Props) { const { workspaceSlug, initiativeId, disabled } = props; const { initiative: { diff --git a/apps/web/ee/components/initiatives/details/root.tsx b/apps/web/ee/components/initiatives/details/root.tsx index b8c1590a99..e25783360a 100644 --- a/apps/web/ee/components/initiatives/details/root.tsx +++ b/apps/web/ee/components/initiatives/details/root.tsx @@ -21,7 +21,7 @@ type Props = { initiativeId: string; }; -export const InitiativeDetailRoot = observer((props: Props) => { +export const InitiativeDetailRoot = observer(function InitiativeDetailRoot(props: Props) { const { workspaceSlug, initiativeId } = props; // store hooks const { diff --git a/apps/web/ee/components/initiatives/details/sidebar/activity-tab-root.tsx b/apps/web/ee/components/initiatives/details/sidebar/activity-tab-root.tsx index 39463df1e0..ad296c9531 100644 --- a/apps/web/ee/components/initiatives/details/sidebar/activity-tab-root.tsx +++ b/apps/web/ee/components/initiatives/details/sidebar/activity-tab-root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -19,7 +18,7 @@ type Props = { initiativeId: string; }; -export const InitiativeSidebarActivityRoot: FC = observer((props) => { +export const InitiativeSidebarActivityRoot = observer(function InitiativeSidebarActivityRoot(props: Props) { const { initiativeId } = props; // states const { storedValue: sortOrder, setValue: setSortOrder } = useLocalStorage( @@ -74,7 +73,7 @@ export const InitiativeSidebarActivityRoot: FC = observer((props) => { return currActivityComment.activity_type === "ACTIVITY" ? ( ) : ( diff --git a/apps/web/ee/components/initiatives/details/sidebar/activity/activity-block.tsx b/apps/web/ee/components/initiatives/details/sidebar/activity/activity-block.tsx index a7e418a2ae..ecd8376a24 100644 --- a/apps/web/ee/components/initiatives/details/sidebar/activity/activity-block.tsx +++ b/apps/web/ee/components/initiatives/details/sidebar/activity/activity-block.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import type { TBaseActivityVerbs } from "@plane/types"; // components @@ -14,7 +12,7 @@ type Props = { ends: "top" | "bottom" | undefined; }; -export const InitiativeActivityItem = observer((props: Props) => { +export const InitiativeActivityItem = observer(function InitiativeActivityItem(props: Props) { const { activity, ends } = props; // return if activity details are not available if (!activity) return <>; diff --git a/apps/web/ee/components/initiatives/details/sidebar/comment-tab-root.tsx b/apps/web/ee/components/initiatives/details/sidebar/comment-tab-root.tsx index 99a0c61ab1..f613b0c6f8 100644 --- a/apps/web/ee/components/initiatives/details/sidebar/comment-tab-root.tsx +++ b/apps/web/ee/components/initiatives/details/sidebar/comment-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -23,7 +21,7 @@ type Props = { disabled?: boolean; }; -export const InitiativeSidebarCommentsRoot: FC = observer((props) => { +export const InitiativeSidebarCommentsRoot = observer(function InitiativeSidebarCommentsRoot(props: Props) { const { workspaceSlug, initiativeId, disabled = false } = props; // states const { storedValue: sortOrder, setValue: setSortOrder } = useLocalStorage( diff --git a/apps/web/ee/components/initiatives/details/sidebar/helper.tsx b/apps/web/ee/components/initiatives/details/sidebar/helper.tsx index 13690f28a3..717910307b 100644 --- a/apps/web/ee/components/initiatives/details/sidebar/helper.tsx +++ b/apps/web/ee/components/initiatives/details/sidebar/helper.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; // plane imports import { useTranslation } from "@plane/i18n"; diff --git a/apps/web/ee/components/initiatives/details/sidebar/properties-tab-root.tsx b/apps/web/ee/components/initiatives/details/sidebar/properties-tab-root.tsx index 05bf762ab7..a4984c28fc 100644 --- a/apps/web/ee/components/initiatives/details/sidebar/properties-tab-root.tsx +++ b/apps/web/ee/components/initiatives/details/sidebar/properties-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Tags } from "lucide-react"; @@ -38,7 +36,7 @@ type Props = { handleInitiativeLabelUpdate: (labelIds: string[]) => void; }; -export const InitiativeSidebarPropertiesRoot: FC = observer((props) => { +export const InitiativeSidebarPropertiesRoot = observer(function InitiativeSidebarPropertiesRoot(props: Props) { const { workspaceSlug, initiativeId, disabled, handleInitiativeStateUpdate, handleInitiativeLabelUpdate } = props; const { diff --git a/apps/web/ee/components/initiatives/details/sidebar/root.tsx b/apps/web/ee/components/initiatives/details/sidebar/root.tsx index ca822a9788..f2ce40e3e5 100644 --- a/apps/web/ee/components/initiatives/details/sidebar/root.tsx +++ b/apps/web/ee/components/initiatives/details/sidebar/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // icons @@ -23,7 +21,7 @@ type Props = { handleInitiativeLabelUpdate: (labelIds: string[]) => void; }; -export const InitiativeSidebarRoot: FC = observer((props) => { +export const InitiativeSidebarRoot = observer(function InitiativeSidebarRoot(props: Props) { const { workspaceSlug, initiativeId, diff --git a/apps/web/ee/components/initiatives/header/actions/overview-header-actions.tsx b/apps/web/ee/components/initiatives/header/actions/overview-header-actions.tsx index 820809b3a1..c42086556c 100644 --- a/apps/web/ee/components/initiatives/header/actions/overview-header-actions.tsx +++ b/apps/web/ee/components/initiatives/header/actions/overview-header-actions.tsx @@ -4,7 +4,7 @@ import { cn } from "@plane/utils"; // hooks import { useAppTheme } from "@/hooks/store/use-app-theme"; -export const InitiativeOverviewHeaderActions = observer(() => { +export const InitiativeOverviewHeaderActions = observer(function InitiativeOverviewHeaderActions() { const { initiativesSidebarCollapsed, toggleInitiativesSidebar } = useAppTheme(); return ( -
    -); +export function FilterHeader({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) { + return ( +
    +
    {title}
    + +
    + ); +} diff --git a/apps/web/ee/components/initiatives/header/filters/header/helpers/filter-option.tsx b/apps/web/ee/components/initiatives/header/filters/header/helpers/filter-option.tsx index 26c7bfaf55..f05e80faa7 100644 --- a/apps/web/ee/components/initiatives/header/filters/header/helpers/filter-option.tsx +++ b/apps/web/ee/components/initiatives/header/filters/header/helpers/filter-option.tsx @@ -11,7 +11,7 @@ type Props = { activePulse?: boolean; }; -export const FilterOption: React.FC = (props) => { +export function FilterOption(props: Props) { const { icon, isChecked, multiple = true, onClick, title, activePulse = false } = props; return ( @@ -36,4 +36,4 @@ export const FilterOption: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/initiatives/header/filters/index.tsx b/apps/web/ee/components/initiatives/header/filters/index.tsx index 0cb74688b8..e112c06728 100644 --- a/apps/web/ee/components/initiatives/header/filters/index.tsx +++ b/apps/web/ee/components/initiatives/header/filters/index.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback } from "react"; import { observer } from "mobx-react"; import type { TInitiativeDisplayFilters } from "@plane/types"; @@ -16,7 +14,7 @@ type Props = { workspaceSlug: string; }; -export const HeaderFilters = observer(({ workspaceSlug }: Props) => { +export const HeaderFilters = observer(function HeaderFilters({ workspaceSlug }: Props) { const { initiativeFilters: { currentInitiativeDisplayFilters, updateDisplayFilters }, } = useInitiatives(); diff --git a/apps/web/ee/components/initiatives/header/root.tsx b/apps/web/ee/components/initiatives/header/root.tsx index 785b6aa372..f2fd2d140e 100644 --- a/apps/web/ee/components/initiatives/header/root.tsx +++ b/apps/web/ee/components/initiatives/header/root.tsx @@ -1,4 +1,3 @@ -"use client"; import { useMemo, useRef } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -27,7 +26,9 @@ type TInitiativesDetailsHeaderProps = { selectedNavigationKey: EInitiativeNavigationItem; }; -export const InitiativesDetailsHeader = observer((props: TInitiativesDetailsHeaderProps) => { +export const InitiativesDetailsHeader = observer(function InitiativesDetailsHeader( + props: TInitiativesDetailsHeaderProps +) { // params const { selectedNavigationKey } = props; // router diff --git a/apps/web/ee/components/initiatives/layout/page.tsx b/apps/web/ee/components/initiatives/layout/page.tsx index 86cd37f7b2..cf4e129e3e 100644 --- a/apps/web/ee/components/initiatives/layout/page.tsx +++ b/apps/web/ee/components/initiatives/layout/page.tsx @@ -1,15 +1,15 @@ -"use client"; - import { observer } from "mobx-react"; // local components import { InitiativesRoot } from "../components/initiatives-root"; import InitiativesFiltersRow from "../components/rich-filters/row"; import { InitiativePeekOverview } from "../peek-overview"; -export const InitiativesPageRoot = observer(() => ( -
    - - - -
    -)); +export const InitiativesPageRoot = observer(function InitiativesPageRoot() { + return ( +
    + + + +
    + ); +}); diff --git a/apps/web/ee/components/initiatives/peek-overview/error.tsx b/apps/web/ee/components/initiatives/peek-overview/error.tsx index 6d3ffb24ab..2c20381d3a 100644 --- a/apps/web/ee/components/initiatives/peek-overview/error.tsx +++ b/apps/web/ee/components/initiatives/peek-overview/error.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { MoveRight } from "lucide-react"; import { useTranslation } from "@plane/i18n"; @@ -15,7 +13,7 @@ type TInitiativePeekOverviewError = { removeRoutePeekId: () => void; }; -export const InitiativePeekOverviewError: FC = (props) => { +export function InitiativePeekOverviewError(props: TInitiativePeekOverviewError) { const { removeRoutePeekId } = props; // hooks const { isMobile } = usePlatformOS(); @@ -40,4 +38,4 @@ export const InitiativePeekOverviewError: FC = (pr ); -}; +} diff --git a/apps/web/ee/components/initiatives/peek-overview/header.tsx b/apps/web/ee/components/initiatives/peek-overview/header.tsx index 6717111456..f8c769e510 100644 --- a/apps/web/ee/components/initiatives/peek-overview/header.tsx +++ b/apps/web/ee/components/initiatives/peek-overview/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -47,7 +45,9 @@ export type InitiativePeekOverviewHeaderProps = { disabled: boolean; }; -export const InitiativePeekOverviewHeader: FC = observer((props) => { +export const InitiativePeekOverviewHeader = observer(function InitiativePeekOverviewHeader( + props: InitiativePeekOverviewHeaderProps +) { const { peekMode, setPeekMode, workspaceSlug, initiativeId, removeRoutePeekId } = props; // ref const parentRef = useRef(null); diff --git a/apps/web/ee/components/initiatives/peek-overview/loader.tsx b/apps/web/ee/components/initiatives/peek-overview/loader.tsx index dd30ab7f45..acbc9b1de2 100644 --- a/apps/web/ee/components/initiatives/peek-overview/loader.tsx +++ b/apps/web/ee/components/initiatives/peek-overview/loader.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { MoveRight } from "lucide-react"; import { Tooltip } from "@plane/propel/tooltip"; @@ -11,7 +9,7 @@ type TInitiativePeekOverviewLoader = { removeRoutePeekId: () => void; }; -export const InitiativePeekOverviewLoader: FC = (props) => { +export function InitiativePeekOverviewLoader(props: TInitiativePeekOverviewLoader) { const { removeRoutePeekId } = props; // hooks const { isMobile } = usePlatformOS(); @@ -91,4 +89,4 @@ export const InitiativePeekOverviewLoader: FC = (     ); -}; +} diff --git a/apps/web/ee/components/initiatives/peek-overview/root.tsx b/apps/web/ee/components/initiatives/peek-overview/root.tsx index 17cae23b81..518c6dc962 100644 --- a/apps/web/ee/components/initiatives/peek-overview/root.tsx +++ b/apps/web/ee/components/initiatives/peek-overview/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; @@ -13,7 +11,7 @@ import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives"; import { InitiativeScopeModals } from "../common/scope-modals"; import { InitiativeView } from "./view"; -export const InitiativePeekOverview: FC = observer(() => { +export const InitiativePeekOverview = observer(function InitiativePeekOverview() { // store hook const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/initiatives/peek-overview/view.tsx b/apps/web/ee/components/initiatives/peek-overview/view.tsx index 84da0557b9..22084eaf3f 100644 --- a/apps/web/ee/components/initiatives/peek-overview/view.tsx +++ b/apps/web/ee/components/initiatives/peek-overview/view.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -31,7 +29,7 @@ interface IInitiativeView { handleInitiativeLabelUpdate: (labelIds: string[]) => void; } -export const InitiativeView: FC = observer((props) => { +export const InitiativeView = observer(function InitiativeView(props: IInitiativeView) { const { workspaceSlug, initiativeId, diff --git a/apps/web/ee/components/initiatives/scope/gantt/chart/chart-root.tsx b/apps/web/ee/components/initiatives/scope/gantt/chart/chart-root.tsx index 32c97e3a7e..5879321856 100644 --- a/apps/web/ee/components/initiatives/scope/gantt/chart/chart-root.tsx +++ b/apps/web/ee/components/initiatives/scope/gantt/chart/chart-root.tsx @@ -17,7 +17,7 @@ type Props = { handleAddEpic: () => void; handleAddProject: () => void; }; -export const ScopeGanttChartRoot: React.FC = observer((props) => { +export const ScopeGanttChartRoot = observer(function ScopeGanttChartRoot(props: Props) { const { epicIds, projectIds, workspaceSlug, handleAddEpic, handleAddProject } = props; const { blockStructureUpdateHandler, blockDatesUpdateHandler } = useGanttOperations(workspaceSlug); diff --git a/apps/web/ee/components/initiatives/scope/gantt/chart/group-chart.tsx b/apps/web/ee/components/initiatives/scope/gantt/chart/group-chart.tsx index 1c32336ee9..5c4956e895 100644 --- a/apps/web/ee/components/initiatives/scope/gantt/chart/group-chart.tsx +++ b/apps/web/ee/components/initiatives/scope/gantt/chart/group-chart.tsx @@ -32,7 +32,7 @@ type GanttChartRootProps = { isEpic?: boolean; }; -export const GroupedGanttChart: FC = observer((props) => { +export const GroupedGanttChart = observer(function GroupedGanttChart(props: GanttChartRootProps) { const { border = true, title, diff --git a/apps/web/ee/components/initiatives/scope/gantt/root.tsx b/apps/web/ee/components/initiatives/scope/gantt/root.tsx index a38a1e1415..0ceb8b23ed 100644 --- a/apps/web/ee/components/initiatives/scope/gantt/root.tsx +++ b/apps/web/ee/components/initiatives/scope/gantt/root.tsx @@ -19,7 +19,7 @@ type Props = { handleAddEpic: () => void; handleAddProject: () => void; }; -export const InitiativeScopeGanttView: React.FC = (props) => { +export function InitiativeScopeGanttView(props: Props) { const { epicIds, projectIds, workspaceSlug, handleAddEpic, handleAddProject, initiativeId, disabled } = props; const { t } = useTranslation(); @@ -57,4 +57,4 @@ export const InitiativeScopeGanttView: React.FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/initiatives/scope/gantt/sidebar/epic-block.tsx b/apps/web/ee/components/initiatives/scope/gantt/sidebar/epic-block.tsx index 8c15827212..2c6f680c70 100644 --- a/apps/web/ee/components/initiatives/scope/gantt/sidebar/epic-block.tsx +++ b/apps/web/ee/components/initiatives/scope/gantt/sidebar/epic-block.tsx @@ -14,7 +14,7 @@ type Props = { block: IGanttBlock; }; -export const EpicSidebarBlock = observer((props: Props) => { +export const EpicSidebarBlock = observer(function EpicSidebarBlock(props: Props) { const { block } = props; // store hooks const { updateActiveBlockId, isBlockActive, getNumberOfDaysFromPosition } = useTimeLineChartStore(); diff --git a/apps/web/ee/components/initiatives/scope/gantt/sidebar/root.tsx b/apps/web/ee/components/initiatives/scope/gantt/sidebar/root.tsx index 1deb051366..4e1f9973f6 100644 --- a/apps/web/ee/components/initiatives/scope/gantt/sidebar/root.tsx +++ b/apps/web/ee/components/initiatives/scope/gantt/sidebar/root.tsx @@ -20,7 +20,7 @@ type Props = { handleAddBlock: (type: EGanttBlockType) => Promise; }; -export const GroupedGanttSidebar: React.FC = observer((props) => { +export const GroupedGanttSidebar = observer(function GroupedGanttSidebar(props: Props) { const { showAllBlocks = false, handleAddBlock, ganttContainerRef } = props; const { getBlockById, getGroupedBlockIds, toggleGroup } = useTimeLineChartStore(); diff --git a/apps/web/ee/components/initiatives/scope/list/header.tsx b/apps/web/ee/components/initiatives/scope/list/header.tsx index 8d144de6be..bd12e5d222 100644 --- a/apps/web/ee/components/initiatives/scope/list/header.tsx +++ b/apps/web/ee/components/initiatives/scope/list/header.tsx @@ -11,7 +11,7 @@ type Props = { customClassName?: string; icon?: React.ReactNode; }; -export const ListHeader = (props: Props) => { +export function ListHeader(props: Props) { const { count, label, handleAdd, style, onClick, customClassName, icon } = props; return ( @@ -44,4 +44,4 @@ export const ListHeader = (props: Props) => { ); -}; +} diff --git a/apps/web/ee/components/initiatives/scope/list/root.tsx b/apps/web/ee/components/initiatives/scope/list/root.tsx index 3e8e2e4476..4f1f0bf322 100644 --- a/apps/web/ee/components/initiatives/scope/list/root.tsx +++ b/apps/web/ee/components/initiatives/scope/list/root.tsx @@ -23,7 +23,7 @@ type Props = { handleAddProject: () => void; }; -export const InitiativeScopeListView = observer((props: Props) => { +export const InitiativeScopeListView = observer(function InitiativeScopeListView(props: Props) { const { epicIds, projectIds, workspaceSlug, initiativeId, disabled, handleAddEpic, handleAddProject } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/initiatives/scope/root.tsx b/apps/web/ee/components/initiatives/scope/root.tsx index 07a2972953..ef55b627a4 100644 --- a/apps/web/ee/components/initiatives/scope/root.tsx +++ b/apps/web/ee/components/initiatives/scope/root.tsx @@ -13,7 +13,7 @@ import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives"; import { InitiativeScopeGanttView } from "./gantt/root"; import { InitiativeScopeListView } from "./list/root"; -export const InitiativeScopeRoot = observer(() => { +export const InitiativeScopeRoot = observer(function InitiativeScopeRoot() { const { initiativeId, workspaceSlug } = useParams(); // store hooks const { diff --git a/apps/web/ee/components/initiatives/upgrade.tsx b/apps/web/ee/components/initiatives/upgrade.tsx index 46ad2ce1ae..31afbcc781 100644 --- a/apps/web/ee/components/initiatives/upgrade.tsx +++ b/apps/web/ee/components/initiatives/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -24,7 +22,7 @@ type Props = { redirect?: boolean; }; -export const InitiativesUpgrade: FC = observer((props) => { +export const InitiativesUpgrade = observer(function InitiativesUpgrade(props: Props) { const { workspaceSlug, redirect = false } = props; // states const [isLoading, setIsLoading] = useState(false); @@ -81,7 +79,12 @@ export const InitiativesUpgrade: FC = observer((props) => { if (isPlaneOneInstance) { return ( - + Upgrade to higher subscription ); diff --git a/apps/web/ee/components/intake/additional-information.tsx b/apps/web/ee/components/intake/additional-information.tsx index eaa866a55b..6925ef3c9b 100644 --- a/apps/web/ee/components/intake/additional-information.tsx +++ b/apps/web/ee/components/intake/additional-information.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { WorkItemsIcon } from "@plane/propel/icons"; @@ -12,7 +10,9 @@ type TIntakeAdditionalInformationProps = { workItemDetails: TIssue & TIntakeIssueExtended; }; -export const IntakeAdditionalInformation: React.FC = observer((props) => { +export const IntakeAdditionalInformation = observer(function IntakeAdditionalInformation( + props: TIntakeAdditionalInformationProps +) { const { workItemDetails } = props; // derived values diff --git a/apps/web/ee/components/intake/property-values.tsx b/apps/web/ee/components/intake/property-values.tsx index c7e8187fd2..e212d6688a 100644 --- a/apps/web/ee/components/intake/property-values.tsx +++ b/apps/web/ee/components/intake/property-values.tsx @@ -8,9 +8,7 @@ import { cn, getFormattedWorkItemProperties } from "@plane/utils"; // local imports import { IssuePropertyLogo } from "../issue-types/properties/common/issue-property-logo"; -const PropertyDetail: React.FC<{ property: Partial> | undefined }> = ({ - property, -}) => { +function PropertyDetail({ property }: { property: Partial> | undefined }) { if (!property) return null; return ( <> @@ -32,9 +30,9 @@ const PropertyDetail: React.FC<{ property: Partial ); -}; +} -export const IntakePropertyValues: React.FC = observer((props) => { +export const IntakePropertyValues = observer(function IntakePropertyValues(props: TIssuePropertyDisplayContext) { const { entries, workItemType } = props; const propertiesWithValues = getFormattedWorkItemProperties(workItemType, entries); diff --git a/apps/web/ee/components/intake/source-pill.tsx b/apps/web/ee/components/intake/source-pill.tsx index c8dc756d88..185f0da1d1 100644 --- a/apps/web/ee/components/intake/source-pill.tsx +++ b/apps/web/ee/components/intake/source-pill.tsx @@ -24,7 +24,7 @@ const sourcePillMap = { }, }; -export const InboxSourcePill = observer((props: TInboxSourcePill) => { +export const InboxSourcePill = observer(function InboxSourcePill(props: TInboxSourcePill) { const { source } = props; const { workspaceSlug } = useParams(); const isEmailEnabled = useFlag(workspaceSlug?.toString(), E_FEATURE_FLAGS.INTAKE_EMAIL); diff --git a/apps/web/ee/components/integrations/empty-state.tsx b/apps/web/ee/components/integrations/empty-state.tsx index fb29206148..fee42a7bf3 100644 --- a/apps/web/ee/components/integrations/empty-state.tsx +++ b/apps/web/ee/components/integrations/empty-state.tsx @@ -17,7 +17,7 @@ export type IntegrationsEmptyStateProps = { theme: string; }; -export const IntegrationsEmptyState: FC = observer((props) => { +export const IntegrationsEmptyState = observer(function IntegrationsEmptyState(props: IntegrationsEmptyStateProps) { const { theme } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/integrations/github/authentication/connect-organization.tsx b/apps/web/ee/components/integrations/github/authentication/connect-organization.tsx index 4e695fd85e..8d3e6073e3 100644 --- a/apps/web/ee/components/integrations/github/authentication/connect-organization.tsx +++ b/apps/web/ee/components/integrations/github/authentication/connect-organization.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ interface IConnectOrganizationProps { isEnterprise: boolean; } -export const ConnectOrganization: FC = observer(({ isEnterprise }) => { +export const ConnectOrganization = observer(function ConnectOrganization({ isEnterprise }: IConnectOrganizationProps) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/github/authentication/connect-personal-account.tsx b/apps/web/ee/components/integrations/github/authentication/connect-personal-account.tsx index 3e6fe7d5aa..306ad6c7b9 100644 --- a/apps/web/ee/components/integrations/github/authentication/connect-personal-account.tsx +++ b/apps/web/ee/components/integrations/github/authentication/connect-personal-account.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -15,7 +13,9 @@ interface IConnectPersonalAccountProps { isEnterprise: boolean; } -export const ConnectPersonalAccount: FC = observer(({ isEnterprise }) => { +export const ConnectPersonalAccount = observer(function ConnectPersonalAccount({ + isEnterprise, +}: IConnectPersonalAccountProps) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/github/authentication/root.tsx b/apps/web/ee/components/integrations/github/authentication/root.tsx index cc79445788..5093ca1f3a 100644 --- a/apps/web/ee/components/integrations/github/authentication/root.tsx +++ b/apps/web/ee/components/integrations/github/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -11,7 +9,7 @@ interface IUserAuthenticationProps { isEnterprise: boolean; } -export const UserAuthentication: FC = observer(({ isEnterprise }) => { +export const UserAuthentication = observer(function UserAuthentication({ isEnterprise }: IUserAuthenticationProps) { // hooks const { auth: { workspaceConnectionIds, workspaceConnectionById }, diff --git a/apps/web/ee/components/integrations/github/authentication/server-app-form.tsx b/apps/web/ee/components/integrations/github/authentication/server-app-form.tsx index eaad3f0f01..e632ae23d3 100644 --- a/apps/web/ee/components/integrations/github/authentication/server-app-form.tsx +++ b/apps/web/ee/components/integrations/github/authentication/server-app-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -29,190 +27,189 @@ const defaultFormData: TGithubAppConfig = { webhookSecret: "", }; -export const GithubEnterpriseServerAppForm: FC = observer( - ({ handleFormSubmitSuccess, handleClose }) => { - // hooks - const { t } = useTranslation(); - const { - auth: { fetchAppConfigKey }, - } = useGithubIntegration(true); - // states - const [isSubmitting, setIsSubmitting] = useState(false); +export const GithubEnterpriseServerAppForm = observer(function GithubEnterpriseServerAppForm({ + handleFormSubmitSuccess, + handleClose, +}: IGEAppFormProps) { + // hooks + const { t } = useTranslation(); + const { + auth: { fetchAppConfigKey }, + } = useGithubIntegration(true); + // states + const [isSubmitting, setIsSubmitting] = useState(false); - // form - const { - register, - handleSubmit, - formState: { errors }, - } = useForm({ - defaultValues: defaultFormData, - }); + // form + const { + register, + handleSubmit, + formState: { errors }, + } = useForm({ + defaultValues: defaultFormData, + }); - const handleAppFormSubmit = async (e: React.FormEvent) => { - e.preventDefault(); - setIsSubmitting(true); - handleSubmit(async (data) => { - try { - await fetchAppConfigKey(data); - await handleFormSubmitSuccess(); - } catch (error) { - console.log("Error in submitting application form:", error); - setToast({ - type: TOAST_TYPE.ERROR, - title: t("common.error"), - message: t("github_enterprise_integration.failed_to_create_app"), - }); - } finally { - setIsSubmitting(false); - } - })(); - setIsSubmitting(false); - }; + const handleAppFormSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setIsSubmitting(true); + handleSubmit(async (data) => { + try { + await fetchAppConfigKey(data); + await handleFormSubmitSuccess(); + } catch (error) { + console.log("Error in submitting application form:", error); + setToast({ + type: TOAST_TYPE.ERROR, + title: t("common.error"), + message: t("github_enterprise_integration.failed_to_create_app"), + }); + } finally { + setIsSubmitting(false); + } + })(); + setIsSubmitting(false); + }; - return ( -
    -
    -
    -
    - {t("github_enterprise_integration.app_form_title")} -
    -
    - {t("github_enterprise_integration.app_form_description")} -
    + return ( + +
    +
    +
    + {t("github_enterprise_integration.app_form_title")}
    -
    -
    {t("github_enterprise_integration.app_id_title")}
    - -
    - {t("github_enterprise_integration.app_id_description")} -
    - {errors.appId &&

    {errors.appId.message}

    } -
    -
    -
    {t("github_enterprise_integration.app_name_title")}
    - -
    - {t("github_enterprise_integration.app_name_description")} -
    - {errors.appName &&

    {errors.appName.message}

    } -
    -
    -
    {t("github_enterprise_integration.base_url_title")}
    - -
    - {t("github_enterprise_integration.base_url_description")} -
    - {errors.baseUrl &&

    {errors.baseUrl.message}

    } -
    -
    -
    {t("github_enterprise_integration.client_id_title")}
    - -
    - {t("github_enterprise_integration.client_id_description")} -
    - {errors.clientId &&

    {errors.clientId.message}

    } -
    -
    -
    {t("github_enterprise_integration.client_secret_title")}
    - -
    - {t("github_enterprise_integration.client_secret_description")} -
    - {errors.clientSecret &&

    {errors.clientSecret.message}

    } -
    - -
    -
    - {t("github_enterprise_integration.webhook_secret_title")} -
    - -
    - {t("github_enterprise_integration.webhook_secret_description")} -
    - {errors.webhookSecret &&

    {errors.webhookSecret.message}

    } -
    -
    -
    {t("github_enterprise_integration.private_key_title")}
    - -
    - {t("github_enterprise_integration.private_key_description")} -
    - {errors.privateKey &&

    {errors.privateKey.message}

    } -
    -
    - - +
    + {t("github_enterprise_integration.app_form_description")}
    - - ); - } -); +
    +
    {t("github_enterprise_integration.app_id_title")}
    + +
    + {t("github_enterprise_integration.app_id_description")} +
    + {errors.appId &&

    {errors.appId.message}

    } +
    +
    +
    {t("github_enterprise_integration.app_name_title")}
    + +
    + {t("github_enterprise_integration.app_name_description")} +
    + {errors.appName &&

    {errors.appName.message}

    } +
    +
    +
    {t("github_enterprise_integration.base_url_title")}
    + +
    + {t("github_enterprise_integration.base_url_description")} +
    + {errors.baseUrl &&

    {errors.baseUrl.message}

    } +
    +
    +
    {t("github_enterprise_integration.client_id_title")}
    + +
    + {t("github_enterprise_integration.client_id_description")} +
    + {errors.clientId &&

    {errors.clientId.message}

    } +
    +
    +
    {t("github_enterprise_integration.client_secret_title")}
    + +
    + {t("github_enterprise_integration.client_secret_description")} +
    + {errors.clientSecret &&

    {errors.clientSecret.message}

    } +
    + +
    +
    {t("github_enterprise_integration.webhook_secret_title")}
    + +
    + {t("github_enterprise_integration.webhook_secret_description")} +
    + {errors.webhookSecret &&

    {errors.webhookSecret.message}

    } +
    +
    +
    {t("github_enterprise_integration.private_key_title")}
    + +
    + {t("github_enterprise_integration.private_key_description")} +
    + {errors.privateKey &&

    {errors.privateKey.message}

    } +
    +
    + + +
    +
    + + ); +}); diff --git a/apps/web/ee/components/integrations/github/common/select-github-repository.tsx b/apps/web/ee/components/integrations/github/common/select-github-repository.tsx index c5f6ba5a34..1a6466e48b 100644 --- a/apps/web/ee/components/integrations/github/common/select-github-repository.tsx +++ b/apps/web/ee/components/integrations/github/common/select-github-repository.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useTheme } from "next-themes"; @@ -22,7 +20,7 @@ type TSelectGithubRepository = { excludeGithubRepositoryIds?: string[]; }; -export const SelectGithubRepository: FC = observer((props) => { +export const SelectGithubRepository = observer(function SelectGithubRepository(props: TSelectGithubRepository) { // props const { value, handleChange, isEnterprise, excludeGithubRepositoryIds } = props; diff --git a/apps/web/ee/components/integrations/github/common/select-project-state.tsx b/apps/web/ee/components/integrations/github/common/select-project-state.tsx index a879963dfc..1da475409a 100644 --- a/apps/web/ee/components/integrations/github/common/select-project-state.tsx +++ b/apps/web/ee/components/integrations/github/common/select-project-state.tsx @@ -14,7 +14,7 @@ type TSelectProjectState = { planeStates: IState[]; }; -export const SelectProjectState: FC = observer((props) => { +export const SelectProjectState = observer(function SelectProjectState(props: TSelectProjectState) { const { title, value, handleValue, planeStates } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/integrations/github/common/select-project.tsx b/apps/web/ee/components/integrations/github/common/select-project.tsx index 38d3a1ba12..e5aec64dd3 100644 --- a/apps/web/ee/components/integrations/github/common/select-project.tsx +++ b/apps/web/ee/components/integrations/github/common/select-project.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // components @@ -21,7 +19,7 @@ type TSelectProject = { excludeProjectIds?: string[]; }; -export const SelectProject: FC = observer((props) => { +export const SelectProject = observer(function SelectProject(props: TSelectProject) { // props const { value, handleChange, isEnterprise, excludeProjectIds } = props; diff --git a/apps/web/ee/components/integrations/github/sections/header.tsx b/apps/web/ee/components/integrations/github/sections/header.tsx index f6a0e94e68..9e4e32642c 100644 --- a/apps/web/ee/components/integrations/github/sections/header.tsx +++ b/apps/web/ee/components/integrations/github/sections/header.tsx @@ -4,7 +4,7 @@ import { useTranslation } from "@plane/i18n"; import GithubDarkLogo from "@/app/assets/services/github-dark.svg?url"; import GithubLightLogo from "@/app/assets/services/github-light.svg?url"; -export const GithubHeader = () => { +export function GithubHeader() { // hooks const { t } = useTranslation(); const { resolvedTheme } = useTheme(); @@ -20,4 +20,4 @@ export const GithubHeader = () => {
    ); -}; +} diff --git a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/entity-item.tsx b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/entity-item.tsx index b4ecf5d57d..eb077335b2 100644 --- a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/entity-item.tsx +++ b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/entity-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -23,7 +21,7 @@ type TPRStateMappingEntityItem = { isEnterprise: boolean; }; -export const PRStateMappingEntityItem: FC = observer((props) => { +export const PRStateMappingEntityItem = observer(function PRStateMappingEntityItem(props: TPRStateMappingEntityItem) { // props const { project, entityConnection, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/common/map-project-pr-state.tsx b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/common/map-project-pr-state.tsx index 20b3bcdc3e..affd4adcc4 100644 --- a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/common/map-project-pr-state.tsx +++ b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/common/map-project-pr-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { EMPTY_PLANE_STATE } from "@plane/etl/core"; @@ -46,7 +44,7 @@ const GIT_PR_DATA: { key: TStateMapKeys; title: string }[] = [ }, ]; -export const MapProjectPRState: FC = observer((props) => { +export const MapProjectPRState = observer(function MapProjectPRState(props: TMapProjectPRState) { // props const { projectId, value, handleChange, isEnterprise } = props; @@ -58,7 +56,7 @@ export const MapProjectPRState: FC = observer((props) => { // derived values const planeProjectStates = ((projectId && stateIdsByProjectId(projectId)) || []) .map((id) => (projectId && getStateById(projectId, id)) || undefined) - .filter((state) => state != undefined && state != null) as IState[]; + .filter((state) => state != undefined && state != null); return (
    diff --git a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/create.tsx b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/create.tsx index 6cb725d087..9a09793538 100644 --- a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/create.tsx +++ b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/create.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -27,7 +25,7 @@ type TCreatePRStateMappingForm = { isEnterprise: boolean; }; -export const CreatePRStateMappingForm: FC = observer((props) => { +export const CreatePRStateMappingForm = observer(function CreatePRStateMappingForm(props: TCreatePRStateMappingForm) { // props const { modal, handleModal, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/edit.tsx b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/edit.tsx index 716b305bd2..7a279d0b52 100644 --- a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/edit.tsx +++ b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/form/edit.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; @@ -28,7 +26,7 @@ type TEditPRStateMappingForm = { isEnterprise: boolean; }; -export const EditPRStateMappingForm: FC = observer((props) => { +export const EditPRStateMappingForm = observer(function EditPRStateMappingForm(props: TEditPRStateMappingForm) { // props const { modal, handleModal, data, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/root.tsx b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/root.tsx index 4799d09cf2..b6fd838f80 100644 --- a/apps/web/ee/components/integrations/github/sections/pr-state-mapping/root.tsx +++ b/apps/web/ee/components/integrations/github/sections/pr-state-mapping/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -40,7 +38,9 @@ interface IProjectPRStateMappingRootProps { isEnterprise: boolean; } -export const ProjectPRStateMappingRoot: FC = observer(({ isEnterprise }) => { +export const ProjectPRStateMappingRoot = observer(function ProjectPRStateMappingRoot({ + isEnterprise, +}: IProjectPRStateMappingRootProps) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/github/sections/project-issue-sync/entity-item.tsx b/apps/web/ee/components/integrations/github/sections/project-issue-sync/entity-item.tsx index 7421c6dba9..ea022b8876 100644 --- a/apps/web/ee/components/integrations/github/sections/project-issue-sync/entity-item.tsx +++ b/apps/web/ee/components/integrations/github/sections/project-issue-sync/entity-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,9 @@ type TProjectIssueSyncEntityItem = { isEnterprise: boolean; }; -export const ProjectIssueSyncEntityItem: FC = observer((props) => { +export const ProjectIssueSyncEntityItem = observer(function ProjectIssueSyncEntityItem( + props: TProjectIssueSyncEntityItem +) { // props const { project, entityConnection, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/map-project-issue-state.tsx b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/map-project-issue-state.tsx index 753a9464c6..7ed8f4a36b 100644 --- a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/map-project-issue-state.tsx +++ b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/map-project-issue-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { EMPTY_PLANE_STATE } from "@plane/etl/core"; @@ -30,7 +28,7 @@ const GIT_ISSUE_DATA: { key: TIssueStateMapKeys; title: string }[] = [ }, ]; -export const MapProjectIssueState: FC = observer((props) => { +export const MapProjectIssueState = observer(function MapProjectIssueState(props: TMapProjectIssueState) { // props const { projectId, value, handleChange, isEnterprise } = props; @@ -42,7 +40,7 @@ export const MapProjectIssueState: FC = observer((props) // derived values const planeProjectStates = ((projectId && stateIdsByProjectId(projectId)) || []) .map((id) => (projectId && getStateById(projectId, id)) || undefined) - .filter((state) => state != undefined && state != null) as IState[]; + .filter((state) => state != undefined && state != null); return (
    diff --git a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/select-issue-sync-direction.tsx b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/select-issue-sync-direction.tsx index 5fbd829a88..f0b41da1ea 100644 --- a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/select-issue-sync-direction.tsx +++ b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/common/select-issue-sync-direction.tsx @@ -1,5 +1,3 @@ -"use client"; - import { TriangleAlert } from "lucide-react"; import { useTranslation } from "@plane/i18n"; import { RadioInput } from "@/components/estimates/radio-select"; @@ -9,7 +7,7 @@ type TBidirectionalIssueSync = { onChange: (value: boolean) => void; }; -export const SelectIssueSyncDirection = ({ value, onChange }: TBidirectionalIssueSync) => { +export function SelectIssueSyncDirection({ value, onChange }: TBidirectionalIssueSync) { const { t } = useTranslation(); const options = [ { @@ -52,4 +50,4 @@ export const SelectIssueSyncDirection = ({ value, onChange }: TBidirectionalIssu )}
    ); -}; +} diff --git a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/create.tsx b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/create.tsx index 71702b93c7..9787387ec4 100644 --- a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/create.tsx +++ b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/create.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,9 @@ type TCreateProjectIssueSyncForm = { isEnterprise: boolean; }; -export const CreateProjectIssueSyncForm: FC = observer((props) => { +export const CreateProjectIssueSyncForm = observer(function CreateProjectIssueSyncForm( + props: TCreateProjectIssueSyncForm +) { // props const { modal, handleModal, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/edit.tsx b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/edit.tsx index 7f995f97c4..4b4effa02d 100644 --- a/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/edit.tsx +++ b/apps/web/ee/components/integrations/github/sections/project-issue-sync/form/edit.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; @@ -28,7 +26,7 @@ type TEditProjectIssueSyncForm = { isEnterprise: boolean; }; -export const EditProjectIssueSyncForm: FC = observer((props) => { +export const EditProjectIssueSyncForm = observer(function EditProjectIssueSyncForm(props: TEditProjectIssueSyncForm) { // props const { modal, handleModal, data, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/github/sections/project-issue-sync/root.tsx b/apps/web/ee/components/integrations/github/sections/project-issue-sync/root.tsx index dd766a2112..8c434130f7 100644 --- a/apps/web/ee/components/integrations/github/sections/project-issue-sync/root.tsx +++ b/apps/web/ee/components/integrations/github/sections/project-issue-sync/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -37,7 +35,9 @@ interface IProjectIssueSyncRootProps { isEnterprise: boolean; } -export const ProjectIssueSyncRoot: FC = observer(({ isEnterprise }) => { +export const ProjectIssueSyncRoot = observer(function ProjectIssueSyncRoot({ + isEnterprise, +}: IProjectIssueSyncRootProps) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/github/sections/root.tsx b/apps/web/ee/components/integrations/github/sections/root.tsx index 431920329e..b14e192ba8 100644 --- a/apps/web/ee/components/integrations/github/sections/root.tsx +++ b/apps/web/ee/components/integrations/github/sections/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -10,9 +8,11 @@ interface IIntegrationRootProps { isEnterprise: boolean; } -export const IntegrationRoot: FC = observer(({ isEnterprise }) => ( -
    - - -
    -)); +export const IntegrationRoot = observer(function IntegrationRoot({ isEnterprise }: IIntegrationRootProps) { + return ( +
    + + +
    + ); +}); diff --git a/apps/web/ee/components/integrations/github/sections/user-mapping/root.tsx b/apps/web/ee/components/integrations/github/sections/user-mapping/root.tsx index 335af45029..91b93d4a4f 100644 --- a/apps/web/ee/components/integrations/github/sections/user-mapping/root.tsx +++ b/apps/web/ee/components/integrations/github/sections/user-mapping/root.tsx @@ -1,10 +1,4 @@ -"use client"; - -import type { FC } from "react"; - -export const UserMappingRoot: FC = (props) => { - const {} = props; - +export function UserMappingRoot() { return (
    {/* heading */} @@ -25,4 +19,4 @@ export const UserMappingRoot: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/integrations/gitlab/authentication/connect-organization.tsx b/apps/web/ee/components/integrations/gitlab/authentication/connect-organization.tsx index 210074080d..24623906bb 100644 --- a/apps/web/ee/components/integrations/gitlab/authentication/connect-organization.tsx +++ b/apps/web/ee/components/integrations/gitlab/authentication/connect-organization.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ interface IConnectOrganizationProps { isEnterprise: boolean; } -export const ConnectOrganization: FC = observer(({ isEnterprise }) => { +export const ConnectOrganization = observer(function ConnectOrganization({ isEnterprise }: IConnectOrganizationProps) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/gitlab/authentication/root.tsx b/apps/web/ee/components/integrations/gitlab/authentication/root.tsx index dbc5cf6ee3..a27811db8b 100644 --- a/apps/web/ee/components/integrations/gitlab/authentication/root.tsx +++ b/apps/web/ee/components/integrations/gitlab/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // plane web components import { ConnectOrganization } from "@/plane-web/components/integrations/gitlab"; @@ -9,8 +7,10 @@ interface IUserAuthenticationProps { isEnterprise: boolean; } -export const UserAuthentication: FC = ({ isEnterprise }) => ( -
    - -
    -); +export function UserAuthentication({ isEnterprise }: IUserAuthenticationProps) { + return ( +
    + +
    + ); +} diff --git a/apps/web/ee/components/integrations/gitlab/authentication/server-app-form.tsx b/apps/web/ee/components/integrations/gitlab/authentication/server-app-form.tsx index 41b9e09ca2..748e74fdbe 100644 --- a/apps/web/ee/components/integrations/gitlab/authentication/server-app-form.tsx +++ b/apps/web/ee/components/integrations/gitlab/authentication/server-app-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -26,140 +24,139 @@ const defaultFormData: TGitlabAppConfig = { webhookSecret: "", }; -export const GitlabEnterpriseServerAppForm: FC = observer( - ({ handleFormSubmitSuccess, handleClose }) => { - // hooks - const { t } = useTranslation(); - const { - auth: { fetchAppConfigKey }, - } = useGitlabIntegration(true); - // states - const [isSubmitting, setIsSubmitting] = useState(false); +export const GitlabEnterpriseServerAppForm = observer(function GitlabEnterpriseServerAppForm({ + handleFormSubmitSuccess, + handleClose, +}: IGEAppFormProps) { + // hooks + const { t } = useTranslation(); + const { + auth: { fetchAppConfigKey }, + } = useGitlabIntegration(true); + // states + const [isSubmitting, setIsSubmitting] = useState(false); - // form - const { - register, - handleSubmit, - formState: { errors }, - } = useForm({ - defaultValues: defaultFormData, - }); + // form + const { + register, + handleSubmit, + formState: { errors }, + } = useForm({ + defaultValues: defaultFormData, + }); - const handleAppFormSubmit = async (e: React.FormEvent) => { - e.preventDefault(); - setIsSubmitting(true); - handleSubmit(async (data) => { - try { - await fetchAppConfigKey(data); - await handleFormSubmitSuccess(); - } catch (error) { - console.log("Error in submitting application form:", error); - setToast({ - type: TOAST_TYPE.ERROR, - title: t("common.error"), - message: t("gitlab_enterprise_integration.failed_to_create_app"), - }); - } finally { - setIsSubmitting(false); - } - })(); - setIsSubmitting(false); - }; + const handleAppFormSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setIsSubmitting(true); + handleSubmit(async (data) => { + try { + await fetchAppConfigKey(data); + await handleFormSubmitSuccess(); + } catch (error) { + console.log("Error in submitting application form:", error); + setToast({ + type: TOAST_TYPE.ERROR, + title: t("common.error"), + message: t("gitlab_enterprise_integration.failed_to_create_app"), + }); + } finally { + setIsSubmitting(false); + } + })(); + setIsSubmitting(false); + }; - return ( -
    -
    -
    -
    - {t("gitlab_enterprise_integration.app_form_title")} -
    -
    - {t("gitlab_enterprise_integration.app_form_description")} -
    + return ( + +
    +
    +
    + {t("gitlab_enterprise_integration.app_form_title")}
    -
    -
    {t("gitlab_enterprise_integration.base_url_title")}
    - -
    - {t("gitlab_enterprise_integration.base_url_description")} -
    - {errors.baseUrl &&

    {errors.baseUrl.message}

    } -
    -
    -
    {t("gitlab_enterprise_integration.client_id_title")}
    - -
    - {t("gitlab_enterprise_integration.client_id_description")} -
    - {errors.clientId &&

    {errors.clientId.message}

    } -
    -
    -
    {t("gitlab_enterprise_integration.client_secret_title")}
    - -
    - {t("gitlab_enterprise_integration.client_secret_description")} -
    - {errors.clientSecret &&

    {errors.clientSecret.message}

    } -
    - -
    -
    - {t("gitlab_enterprise_integration.webhook_secret_title")} -
    - -
    - {t("gitlab_enterprise_integration.webhook_secret_description")} -
    - {errors.webhookSecret &&

    {errors.webhookSecret.message}

    } -
    -
    - - +
    + {t("gitlab_enterprise_integration.app_form_description")}
    - - ); - } -); +
    +
    {t("gitlab_enterprise_integration.base_url_title")}
    + +
    + {t("gitlab_enterprise_integration.base_url_description")} +
    + {errors.baseUrl &&

    {errors.baseUrl.message}

    } +
    +
    +
    {t("gitlab_enterprise_integration.client_id_title")}
    + +
    + {t("gitlab_enterprise_integration.client_id_description")} +
    + {errors.clientId &&

    {errors.clientId.message}

    } +
    +
    +
    {t("gitlab_enterprise_integration.client_secret_title")}
    + +
    + {t("gitlab_enterprise_integration.client_secret_description")} +
    + {errors.clientSecret &&

    {errors.clientSecret.message}

    } +
    + +
    +
    {t("gitlab_enterprise_integration.webhook_secret_title")}
    + +
    + {t("gitlab_enterprise_integration.webhook_secret_description")} +
    + {errors.webhookSecret &&

    {errors.webhookSecret.message}

    } +
    +
    + + +
    +
    + + ); +}); diff --git a/apps/web/ee/components/integrations/gitlab/sections/header.tsx b/apps/web/ee/components/integrations/gitlab/sections/header.tsx index a65d370cee..88e0001bcc 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/header.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/header.tsx @@ -7,7 +7,7 @@ interface IGitlabHeaderProps { isEnterprise: boolean; } -export const GitlabHeader: FC = ({ isEnterprise }) => { +export function GitlabHeader({ isEnterprise }: IGitlabHeaderProps) { // hooks const { t } = useTranslation(); @@ -26,4 +26,4 @@ export const GitlabHeader: FC = ({ isEnterprise }) => {
    ); -}; +} diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/entity-item.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/entity-item.tsx index f5f91da4d5..7b5f0513af 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/entity-item.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/entity-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, ReactElement } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -24,7 +22,7 @@ type TEntityConnectionItem = { isEnterprise: boolean; }; -export const EntityConnectionItem: FC = observer((props) => { +export const EntityConnectionItem = observer(function EntityConnectionItem(props: TEntityConnectionItem) { // props const { entityConnection, isEnterprise } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-entity.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-entity.tsx index 239fc38fcb..b8b52d1697 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-entity.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-entity.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -24,7 +22,7 @@ type TEntityFormCreate = { isEnterprise: boolean; }; -export const EntityFormCreate: FC = observer((props) => { +export const EntityFormCreate = observer(function EntityFormCreate(props: TEntityFormCreate) { // props const { modal, handleModal, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-project-entity.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-project-entity.tsx index c339942e49..1062ce3fbe 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-project-entity.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create-project-entity.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ type TProjectEntityFormCreate = { isEnterprise: boolean; }; -export const ProjectEntityFormCreate: FC = observer((props) => { +export const ProjectEntityFormCreate = observer(function ProjectEntityFormCreate(props: TProjectEntityFormCreate) { // props const { modal, handleModal, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create.tsx index add1b99b0c..a616bc108c 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/create.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -23,7 +21,7 @@ type TFormCreate = { isEnterprise: boolean; }; -export const FormCreate: FC = observer((props) => { +export const FormCreate = observer(function FormCreate(props: TFormCreate) { // props const { modal, handleModal, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/edit.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/edit.tsx index 7d3fdef808..3a50d1a8af 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/edit.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/edit.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { Dispatch, FC, SetStateAction } from "react"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; @@ -27,7 +25,7 @@ type TFormEdit = { isEnterprise: boolean; }; -export const FormEdit: FC = observer((props) => { +export const FormEdit = observer(function FormEdit(props: TFormEdit) { // props const { modal, handleModal, data, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/entity-form.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/entity-form.tsx index 56b0bc8ec5..ed26fc086e 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/entity-form.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/entity-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // components @@ -20,7 +18,7 @@ type TEntityForm = { isEnterprise: boolean; }; -export const EntityForm: FC = observer((props) => { +export const EntityForm = observer(function EntityForm(props: TEntityForm) { // props const { value, handleChange, isEnterprise } = props; // hooks diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/project-form.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/project-form.tsx index 99048289a0..cdbaf49229 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/project-form.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/project-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // components @@ -21,7 +19,7 @@ type TProjectForm = { isEnterprise: boolean; }; -export const ProjectForm: FC = observer((props) => { +export const ProjectForm = observer(function ProjectForm(props: TProjectForm) { // props const { value, handleChange, isEnterprise } = props; diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/root.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/root.tsx index 3441e53a58..cc658a5f43 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/root.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { EMPTY_PLANE_STATE } from "@plane/etl/core"; @@ -46,7 +44,7 @@ const GIT_PR_DATA: { key: TStateMapKeys; title: string }[] = [ }, ]; -export const StateForm: FC = observer((props) => { +export const StateForm = observer(function StateForm(props: TStateForm) { // props const { projectId, value, handleChange, isEnterprise } = props; @@ -57,7 +55,7 @@ export const StateForm: FC = observer((props) => { // derived values const planeProjectStates = ((projectId && stateIdsByProjectId(projectId)) || []) .map((id) => (projectId && getStateById(projectId, id)) || undefined) - .filter((state) => state != undefined && state != null) as IState[]; + .filter((state) => state != undefined && state != null); return (
    diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/selection.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/selection.tsx index a64108f684..500285f9fa 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/selection.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/form/state-form/selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Ban } from "lucide-react"; @@ -16,7 +14,7 @@ type TStateFormSelection = { planeStates: IState[]; }; -export const StateFormSelection: FC = observer((props) => { +export const StateFormSelection = observer(function StateFormSelection(props: TStateFormSelection) { const { title, value, handleValue, planeStates } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/root.tsx b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/root.tsx index 3ce82308ef..e0e2c23555 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/root.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/repository-mapping/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -40,7 +38,9 @@ interface IRepositoryMappingRootProps { isEnterprise: boolean; } -export const RepositoryMappingRoot: FC = observer(({ isEnterprise }) => { +export const RepositoryMappingRoot = observer(function RepositoryMappingRoot({ + isEnterprise, +}: IRepositoryMappingRootProps) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/gitlab/sections/root.tsx b/apps/web/ee/components/integrations/gitlab/sections/root.tsx index 95ba1a778e..854f928d51 100644 --- a/apps/web/ee/components/integrations/gitlab/sections/root.tsx +++ b/apps/web/ee/components/integrations/gitlab/sections/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -9,8 +7,10 @@ interface IIntegrationRootProps { isEnterprise: boolean; } -export const IntegrationRoot: FC = observer(({ isEnterprise }) => ( -
    - -
    -)); +export const IntegrationRoot = observer(function IntegrationRoot({ isEnterprise }: IIntegrationRootProps) { + return ( +
    + +
    + ); +}); diff --git a/apps/web/ee/components/integrations/list-item.tsx b/apps/web/ee/components/integrations/list-item.tsx index d2b6d0356f..5b8d237977 100644 --- a/apps/web/ee/components/integrations/list-item.tsx +++ b/apps/web/ee/components/integrations/list-item.tsx @@ -17,7 +17,7 @@ export type IntegrationListItemProps = { isSupported: boolean; }; -export const IntegrationListItem: FC = (props) => { +export function IntegrationListItem(props: IntegrationListItemProps) { const { provider, workspaceSlug, isSupported } = props; const isEnabled = useFlag(workspaceSlug, provider.flag); const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail } = useWorkspaceSubscription(); @@ -72,4 +72,4 @@ export const IntegrationListItem: FC = (props) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/integrations/list.tsx b/apps/web/ee/components/integrations/list.tsx index 8c001567b7..693aff44a8 100644 --- a/apps/web/ee/components/integrations/list.tsx +++ b/apps/web/ee/components/integrations/list.tsx @@ -77,7 +77,7 @@ export type IntegrationsListProps = { supportedIntegrations: E_INTEGRATION_KEYS[]; }; -export const IntegrationsList: FC = observer((props) => { +export const IntegrationsList = observer(function IntegrationsList(props: IntegrationsListProps) { const { workspaceSlug, supportedIntegrations } = props; return ( diff --git a/apps/web/ee/components/integrations/sentry/connected-app-card.tsx b/apps/web/ee/components/integrations/sentry/connected-app-card.tsx index 248cb60027..0b7e6f56b8 100644 --- a/apps/web/ee/components/integrations/sentry/connected-app-card.tsx +++ b/apps/web/ee/components/integrations/sentry/connected-app-card.tsx @@ -15,7 +15,7 @@ type TConnectedAppCardProps = { handleDisconnect: (connectionId: string) => Promise; }; -export const ConnectedAppCard = observer((props: TConnectedAppCardProps) => { +export const ConnectedAppCard = observer(function ConnectedAppCard(props: TConnectedAppCardProps) { const { data, handleDisconnect } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/integrations/sentry/root.tsx b/apps/web/ee/components/integrations/sentry/root.tsx index 2373fb4f14..64901e4ba4 100644 --- a/apps/web/ee/components/integrations/sentry/root.tsx +++ b/apps/web/ee/components/integrations/sentry/root.tsx @@ -15,7 +15,7 @@ import { useSentryIntegration } from "@/plane-web/hooks/store/integrations/use-s import { SentryStateMappingRoot } from "./sections/state-mapping/root"; // assets -export const SentryIntegrationRoot = observer(() => { +export const SentryIntegrationRoot = observer(function SentryIntegrationRoot() { // router const { workspaceSlug } = useParams(); // store hooks diff --git a/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/form.tsx b/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/form.tsx index 34e4c3d56e..5a0dfaf62b 100644 --- a/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/form.tsx +++ b/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/form.tsx @@ -9,19 +9,20 @@ import { ModalCore } from "@plane/ui"; // Assets import type { StateMappingFormProps, SentryStateMappingFormData } from "./types"; import { StateMappingFormContent } from "."; + // Types /** * Main Form Component for Sentry State Mapping Configuration * Handles the modal, data loading, and form state */ -const StateMappingForm: FC = ({ +function StateMappingForm({ modal, handleModal, stateMapping, handleSubmit: handleSubmitProp, availableProjects, -}) => { +}: StateMappingFormProps) { const { t } = useTranslation(); // Initialize form state with the state mapping data if it exists @@ -151,6 +152,6 @@ const StateMappingForm: FC = ({
    ); -}; +} export default StateMappingForm; diff --git a/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/state-mapping-form.tsx b/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/state-mapping-form.tsx index 36b34e7940..f782aaecce 100644 --- a/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/state-mapping-form.tsx +++ b/apps/web/ee/components/integrations/sentry/sections/state-mapping/form/state-mapping-form.tsx @@ -27,12 +27,12 @@ const convertToExState = (state: IState): ExState => ({ status: "to_be_created" as const, }); -export const StateMappingFormContent: FC = ({ +export function StateMappingFormContent({ value, availableProjects, handleChange, isEditMode, -}) => { +}: StateMappingFormContentProps) { const { getProjectById } = useProject(); const { workspace, fetchStates } = useSentryIntegration(); @@ -298,4 +298,4 @@ export const StateMappingFormContent: FC = ({ )}
    ); -}; +} diff --git a/apps/web/ee/components/integrations/sentry/sections/state-mapping/root.tsx b/apps/web/ee/components/integrations/sentry/sections/state-mapping/root.tsx index 31c195e99c..4f94c6fd37 100644 --- a/apps/web/ee/components/integrations/sentry/sections/state-mapping/root.tsx +++ b/apps/web/ee/components/integrations/sentry/sections/state-mapping/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState, useCallback, useMemo } from "react"; import { observer } from "mobx-react"; @@ -16,7 +14,11 @@ import { useSentryIntegration } from "@/plane-web/hooks/store/integrations/use-s import { StateMappingForm } from "./form/index"; import { StateMappingItem } from "./state-mapping-item"; -export const SentryStateMappingRoot: FC<{ connectionId: string }> = observer(({ connectionId }) => { +export const SentryStateMappingRoot = observer(function SentryStateMappingRoot({ + connectionId, +}: { + connectionId: string; +}) { // hooks const { workspace, getAppByConnectionId, fetchAppConnections, updateAppConnection } = useSentryIntegration(); const { joinedProjectIds } = useProject(); @@ -132,7 +134,7 @@ export const SentryStateMappingRoot: FC<{ connectionId: string }> = observer(({ if (!appConnection) return; try { - const config = appConnection.config as TSentryConfig; + const config = appConnection.config; const currentMappings = config.stateMappings || []; const updatedMappings = currentMappings.filter((m: TSentryStateMapping) => m.projectId !== mapping.projectId); diff --git a/apps/web/ee/components/integrations/sentry/sections/state-mapping/state-mapping-item.tsx b/apps/web/ee/components/integrations/sentry/sections/state-mapping/state-mapping-item.tsx index 9b5a509742..8d54473b88 100644 --- a/apps/web/ee/components/integrations/sentry/sections/state-mapping/state-mapping-item.tsx +++ b/apps/web/ee/components/integrations/sentry/sections/state-mapping/state-mapping-item.tsx @@ -12,7 +12,7 @@ interface StateMappingItemProps { onDelete: () => void; } -const StateMappingItemComponent: React.FC = ({ mapping, onEdit, onDelete }) => { +function StateMappingItemComponent({ mapping, onEdit, onDelete }: StateMappingItemProps) { const { getProjectById } = useProject(); const project = getProjectById(mapping.projectId); @@ -119,7 +119,7 @@ const StateMappingItemComponent: React.FC = ({ mapping, o ); -}; +} // Memoize the component to prevent unnecessary re-renders export const StateMappingItem = memo(StateMappingItemComponent); diff --git a/apps/web/ee/components/integrations/slack/connected-app-card.tsx b/apps/web/ee/components/integrations/slack/connected-app-card.tsx index a0b5fe0ba0..98d4336fbd 100644 --- a/apps/web/ee/components/integrations/slack/connected-app-card.tsx +++ b/apps/web/ee/components/integrations/slack/connected-app-card.tsx @@ -16,7 +16,7 @@ type TConnectedAppCardProps = { handleDisconnect: (connectionId: string) => Promise; }; -export const ConnectedAppCard = observer((props: TConnectedAppCardProps) => { +export const ConnectedAppCard = observer(function ConnectedAppCard(props: TConnectedAppCardProps) { const { data, handleDisconnect } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/integrations/slack/root.tsx b/apps/web/ee/components/integrations/slack/root.tsx index 82077b37bb..1a7ea21fcb 100644 --- a/apps/web/ee/components/integrations/slack/root.tsx +++ b/apps/web/ee/components/integrations/slack/root.tsx @@ -15,7 +15,7 @@ import { InstallationCard, PersonalAccountInstallationCard } from "@/plane-web/c import { useSlackIntegration } from "@/plane-web/hooks/store/integrations/use-slack"; import { ProjectUpdatesRoot } from "./sections"; -export const SlackIntegrationRoot = observer(() => { +export const SlackIntegrationRoot = observer(function SlackIntegrationRoot() { // router const { workspaceSlug } = useParams(); // store hooks diff --git a/apps/web/ee/components/integrations/slack/sections/project-updates/entity-item.tsx b/apps/web/ee/components/integrations/slack/sections/project-updates/entity-item.tsx index 9a087ae6cd..94a2b0aeef 100644 --- a/apps/web/ee/components/integrations/slack/sections/project-updates/entity-item.tsx +++ b/apps/web/ee/components/integrations/slack/sections/project-updates/entity-item.tsx @@ -13,7 +13,7 @@ interface ConnectionItemProps { onDelete: (connection: TWorkspaceEntityConnection) => void; } -export const ConnectionItem: React.FC = ({ connection, onEdit, onDelete }) => { +export function ConnectionItem({ connection, onEdit, onDelete }: ConnectionItemProps) { const { getProjectById } = useSlackIntegration(); if (!connection.project_id || !connection.entity_slug) return null; @@ -168,4 +168,4 @@ export const ConnectionItem: React.FC = ({ connection, onEd ); -}; +} diff --git a/apps/web/ee/components/integrations/slack/sections/project-updates/form/channel-map.tsx b/apps/web/ee/components/integrations/slack/sections/project-updates/form/channel-map.tsx index f8395a8db7..8b8d0c7a73 100644 --- a/apps/web/ee/components/integrations/slack/sections/project-updates/form/channel-map.tsx +++ b/apps/web/ee/components/integrations/slack/sections/project-updates/form/channel-map.tsx @@ -30,7 +30,7 @@ type TSlackProjectChannelForm = { * Project-to-Channel Mapping Form Component * Handles the selection of project and channel with visual mapping interface */ -export const SlackProjectChannelForm: FC = observer((props) => { +export const SlackProjectChannelForm = observer(function SlackProjectChannelForm(props: TSlackProjectChannelForm) { // Props const { value, channels, handleChange } = props; diff --git a/apps/web/ee/components/integrations/slack/sections/project-updates/form/form.tsx b/apps/web/ee/components/integrations/slack/sections/project-updates/form/form.tsx index 7ecf14dab9..9a3648fbc4 100644 --- a/apps/web/ee/components/integrations/slack/sections/project-updates/form/form.tsx +++ b/apps/web/ee/components/integrations/slack/sections/project-updates/form/form.tsx @@ -31,12 +31,12 @@ export interface SlackProjectNotificationMap { * Main Form Component for Project Updates Configuration * Handles the modal, data loading, and form state */ -const ProjectUpdatesForm: FC = ({ +function ProjectUpdatesForm({ modal, handleModal, projectConnection, handleSubmit: handleSubmitProp, -}) => { +}: ProjectUpdatesFormProps) { const { t } = useTranslation(); const { appConnectionIds, getAppByConnectionId, fetchSlackChannels } = useSlackIntegration(); @@ -244,6 +244,6 @@ const ProjectUpdatesForm: FC = ({ ); -}; +} export default ProjectUpdatesForm; diff --git a/apps/web/ee/components/integrations/slack/sections/project-updates/root.tsx b/apps/web/ee/components/integrations/slack/sections/project-updates/root.tsx index d74a293e23..a929cfff18 100644 --- a/apps/web/ee/components/integrations/slack/sections/project-updates/root.tsx +++ b/apps/web/ee/components/integrations/slack/sections/project-updates/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ import { MappingLoader } from "../../../ui"; import { IntegrationsMapping } from "../../../ui/integrations-mapping"; import ProjectUpdatesForm from "./form/form"; -export const ProjectUpdatesRoot: FC<{ connectionId: string }> = observer(({ connectionId }) => { +export const ProjectUpdatesRoot = observer(function ProjectUpdatesRoot({ connectionId }: { connectionId: string }) { // hooks const { workspace, diff --git a/apps/web/ee/components/integrations/ui/installation-card.tsx b/apps/web/ee/components/integrations/ui/installation-card.tsx index a38ef3da75..1bebd7b88a 100644 --- a/apps/web/ee/components/integrations/ui/installation-card.tsx +++ b/apps/web/ee/components/integrations/ui/installation-card.tsx @@ -15,7 +15,7 @@ type TInstallationCardProps = { handleInstallation: () => Promise; }; -export const InstallationCard = observer((props: TInstallationCardProps) => { +export const InstallationCard = observer(function InstallationCard(props: TInstallationCardProps) { const { providerName, providerDescription, providerLogo, isConnectionLoading, isAppConnected, handleInstallation } = props; // states diff --git a/apps/web/ee/components/integrations/ui/integrations-mapping.tsx b/apps/web/ee/components/integrations/ui/integrations-mapping.tsx index af96c6633e..a3a1ddff6c 100644 --- a/apps/web/ee/components/integrations/ui/integrations-mapping.tsx +++ b/apps/web/ee/components/integrations/ui/integrations-mapping.tsx @@ -15,7 +15,7 @@ type TIntegrationsMappingProps = { bidirectionalSync?: boolean; }; -export const IntegrationsMapping = (props: TIntegrationsMappingProps) => { +export function IntegrationsMapping(props: TIntegrationsMappingProps) { const { entityName, project, connectorLogo, handleEditOpen, handleDeleteOpen, bidirectionalSync } = props; return (
    @@ -81,4 +81,4 @@ export const IntegrationsMapping = (props: TIntegrationsMappingProps) => {
    ); -}; +} diff --git a/apps/web/ee/components/integrations/ui/mapping-loader.tsx b/apps/web/ee/components/integrations/ui/mapping-loader.tsx index a4821ddf60..9f62042148 100644 --- a/apps/web/ee/components/integrations/ui/mapping-loader.tsx +++ b/apps/web/ee/components/integrations/ui/mapping-loader.tsx @@ -1,31 +1,33 @@ import { Loader } from "@plane/ui"; -export const MappingLoader = () => ( -
    -
    - - {/* Header skeleton */} -
    -
    - - +export function MappingLoader() { + return ( +
    +
    + + {/* Header skeleton */} +
    +
    + + +
    +
    - -
    - {/* Content skeleton */} -
    -
    - {Array.from({ length: 3 }).map((_, index) => ( -
    - - - -
    - ))} + {/* Content skeleton */} +
    +
    + {Array.from({ length: 3 }).map((_, index) => ( +
    + + + +
    + ))} +
    -
    - + +
    -
    -); + ); +} diff --git a/apps/web/ee/components/integrations/ui/personal-account-installation-card.tsx b/apps/web/ee/components/integrations/ui/personal-account-installation-card.tsx index 1323478e55..4794ad22c1 100644 --- a/apps/web/ee/components/integrations/ui/personal-account-installation-card.tsx +++ b/apps/web/ee/components/integrations/ui/personal-account-installation-card.tsx @@ -17,7 +17,9 @@ type TPersonalAccountInstallationCardProps = { handleConnection: () => Promise; }; -export const PersonalAccountInstallationCard = observer((props: TPersonalAccountInstallationCardProps) => { +export const PersonalAccountInstallationCard = observer(function PersonalAccountInstallationCard( + props: TPersonalAccountInstallationCardProps +) { const { providerName, isConnectionLoading, isUserConnected, handleConnection } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/integrations/ui/project-entity-item.tsx b/apps/web/ee/components/integrations/ui/project-entity-item.tsx index bfab88c6a5..6d5ceb0d5b 100644 --- a/apps/web/ee/components/integrations/ui/project-entity-item.tsx +++ b/apps/web/ee/components/integrations/ui/project-entity-item.tsx @@ -11,7 +11,7 @@ type TProjectEntityItem = { handleDeleteOpen: () => void; }; -export const ProjectEntityItem = (props: TProjectEntityItem) => { +export function ProjectEntityItem(props: TProjectEntityItem) { const { project, handleEditOpen, handleDeleteOpen } = props; return (
    @@ -62,4 +62,4 @@ export const ProjectEntityItem = (props: TProjectEntityItem) => {
    ); -}; +} diff --git a/apps/web/ee/components/issue-types/common/icon-picker.tsx b/apps/web/ee/components/issue-types/common/icon-picker.tsx index a486a5cbc0..5c921ddbf3 100644 --- a/apps/web/ee/components/issue-types/common/icon-picker.tsx +++ b/apps/web/ee/components/issue-types/common/icon-picker.tsx @@ -28,7 +28,7 @@ export type TIssueTypeIconPicker = { size?: TIssueTypeLogoSize; }; -export const IssueTypeIconPicker: React.FC = observer((props) => { +export const IssueTypeIconPicker = observer(function IssueTypeIconPicker(props: TIssueTypeIconPicker) { const { isOpen, handleToggle, diff --git a/apps/web/ee/components/issue-types/common/issue-type-logo.tsx b/apps/web/ee/components/issue-types/common/issue-type-logo.tsx index 336168b7ca..22654a8b7c 100644 --- a/apps/web/ee/components/issue-types/common/issue-type-logo.tsx +++ b/apps/web/ee/components/issue-types/common/issue-type-logo.tsx @@ -31,11 +31,13 @@ const containerSizeMap = { xl: 35.5, }; -export const IssueTypeLogo: FC = (props) => { +export function IssueTypeLogo(props: Props) { const { icon_props, size = "sm", containerClassName, isDefault = false, isEpic = false } = props; // derived values - const LucideIcon = LUCIDE_ICONS_LIST.find((item) => item.name === icon_props?.name); + const LucideIcon = LUCIDE_ICONS_LIST.find(function LucideIcon(item) { + return item.name === icon_props?.name; + }); const renderDefaultIcon = isDefault && (!icon_props?.name || !icon_props?.background_color); // if no value, return empty fragment @@ -88,4 +90,4 @@ export const IssueTypeLogo: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/issue-types/common/lucide-icons-list.tsx b/apps/web/ee/components/issue-types/common/lucide-icons-list.tsx index efffa36420..57c82a12a5 100644 --- a/apps/web/ee/components/issue-types/common/lucide-icons-list.tsx +++ b/apps/web/ee/components/issue-types/common/lucide-icons-list.tsx @@ -12,7 +12,7 @@ export type TIconsListProps = { onChange: (val: TLogoProps["icon"], shouldClose: boolean) => void; }; -export const LucideIconsList: React.FC = (props) => { +export function LucideIconsList(props: TIconsListProps) { const { defaultBackgroundColor, onChange } = props; // states const [isInputFocused, setIsInputFocused] = useState(false); @@ -127,4 +127,4 @@ export const LucideIconsList: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/issue-types/create-update/form.tsx b/apps/web/ee/components/issue-types/create-update/form.tsx index 78daaba62f..a47f6a81fb 100644 --- a/apps/web/ee/components/issue-types/create-update/form.tsx +++ b/apps/web/ee/components/issue-types/create-update/form.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { Info } from "lucide-react"; @@ -21,7 +19,7 @@ type Props = { handleFormSubmit: () => Promise; }; -export const CreateOrUpdateIssueTypeForm: React.FC = observer((props) => { +export const CreateOrUpdateIssueTypeForm = observer(function CreateOrUpdateIssueTypeForm(props: Props) { const { formData, isSubmitting, handleFormDataChange, handleModalClose, handleFormSubmit } = props; // state const [isEmojiPickerOpen, setIsEmojiPickerOpen] = useState(false); diff --git a/apps/web/ee/components/issue-types/create-update/modal.tsx b/apps/web/ee/components/issue-types/create-update/modal.tsx index e5f8f015d0..fc28e2e7df 100644 --- a/apps/web/ee/components/issue-types/create-update/modal.tsx +++ b/apps/web/ee/components/issue-types/create-update/modal.tsx @@ -26,7 +26,7 @@ const defaultIssueTypeData: Partial = { description: "", }; -export const CreateOrUpdateIssueTypeModal: FC = observer((props) => { +export const CreateOrUpdateIssueTypeModal = observer(function CreateOrUpdateIssueTypeModal(props: Props) { const { issueTypeId, isModalOpen, handleModalClose } = props; // states const [isSubmitting, setIsSubmitting] = useState(false); diff --git a/apps/web/ee/components/issue-types/dropdowns/issue-type.tsx b/apps/web/ee/components/issue-types/dropdowns/issue-type.tsx index 7a17bb23f4..12e90faa54 100644 --- a/apps/web/ee/components/issue-types/dropdowns/issue-type.tsx +++ b/apps/web/ee/components/issue-types/dropdowns/issue-type.tsx @@ -26,7 +26,7 @@ type TIssueTypeDropdownProps = { variant?: TIssueTypeDropdownVariant; }; -export const IssueTypeDropdown = observer((props: TIssueTypeDropdownProps) => { +export const IssueTypeDropdown = observer(function IssueTypeDropdown(props: TIssueTypeDropdownProps) { const { issueTypeId, projectId, diff --git a/apps/web/ee/components/issue-types/empty-state.tsx b/apps/web/ee/components/issue-types/empty-state.tsx index cd703fde52..0b45a37d89 100644 --- a/apps/web/ee/components/issue-types/empty-state.tsx +++ b/apps/web/ee/components/issue-types/empty-state.tsx @@ -24,7 +24,7 @@ type TIssueTypeEmptyState = { projectId: string; }; -export const IssueTypeEmptyState: FC = observer((props) => { +export const IssueTypeEmptyState = observer(function IssueTypeEmptyState(props: TIssueTypeEmptyState) { // props const { workspaceSlug, projectId } = props; // theme hook @@ -151,6 +151,7 @@ export const IssueTypeEmptyState: FC = observer((props) => href="https://docs.plane.so/core-concepts/issues/issue-types" target="_blank" className="font-medium hover:underline" + rel="noreferrer" > {` ${t("common.read_the_docs")}`} diff --git a/apps/web/ee/components/issue-types/issue-type-delete-confirmation-modal.tsx b/apps/web/ee/components/issue-types/issue-type-delete-confirmation-modal.tsx index 1cbc2f3757..8171f03a54 100644 --- a/apps/web/ee/components/issue-types/issue-type-delete-confirmation-modal.tsx +++ b/apps/web/ee/components/issue-types/issue-type-delete-confirmation-modal.tsx @@ -18,7 +18,7 @@ type TProps = { handleEnableDisable: (issueTypeId: string) => Promise; }; -export const IssueTypeDeleteConfirmationModal: FC = observer((props) => { +export const IssueTypeDeleteConfirmationModal = observer(function IssueTypeDeleteConfirmationModal(props: TProps) { const { issueTypeId, isModalOpen, handleModalClose, handleEnableDisable } = props; const [isDeleting, setIsDeleting] = useState(false); // plane hooks diff --git a/apps/web/ee/components/issue-types/issue-type-list-item.tsx b/apps/web/ee/components/issue-types/issue-type-list-item.tsx index 117bbd32fe..f4ec8dfd15 100644 --- a/apps/web/ee/components/issue-types/issue-type-list-item.tsx +++ b/apps/web/ee/components/issue-types/issue-type-list-item.tsx @@ -24,7 +24,7 @@ type TIssueTypeListItem = { getClassName?: (isOpen: boolean) => string; }; -export const IssueTypeListItem = observer((props: TIssueTypeListItem) => { +export const IssueTypeListItem = observer(function IssueTypeListItem(props: TIssueTypeListItem) { const { issueTypeId, isOpen, diff --git a/apps/web/ee/components/issue-types/issue-types-list.tsx b/apps/web/ee/components/issue-types/issue-types-list.tsx index 17b4afdf9c..dff188d4c8 100644 --- a/apps/web/ee/components/issue-types/issue-types-list.tsx +++ b/apps/web/ee/components/issue-types/issue-types-list.tsx @@ -15,7 +15,7 @@ type TIssueTypesList = { onEnableDisableIssueType: (issueTypeId: string) => Promise; }; -export const IssueTypesList = observer((props: TIssueTypesList) => { +export const IssueTypesList = observer(function IssueTypesList(props: TIssueTypesList) { const { onEditIssueTypeIdChange, onDeleteIssueTypeIdChange, onEnableDisableIssueType } = props; // router const { projectId } = useParams(); diff --git a/apps/web/ee/components/issue-types/properties/active-checkbox.tsx b/apps/web/ee/components/issue-types/properties/active-checkbox.tsx index 03e016a9d4..4b3f137c0b 100644 --- a/apps/web/ee/components/issue-types/properties/active-checkbox.tsx +++ b/apps/web/ee/components/issue-types/properties/active-checkbox.tsx @@ -11,7 +11,7 @@ type TPropertyActiveCheckboxProps = { onEnableDisable: (value: boolean) => void; }; -export const PropertyActiveCheckbox = observer((props: TPropertyActiveCheckboxProps) => { +export const PropertyActiveCheckbox = observer(function PropertyActiveCheckbox(props: TPropertyActiveCheckboxProps) { const { value, onEnableDisable } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/attribute-pill.tsx b/apps/web/ee/components/issue-types/properties/attributes/attribute-pill.tsx index 125ecb5ad4..930f7a4c5e 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/attribute-pill.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/attribute-pill.tsx @@ -5,13 +5,15 @@ type TAttributePillProps = { className?: string; }; -export const AttributePill = ({ data, className }: TAttributePillProps) => ( - - {data} - -); +export function AttributePill({ data, className }: TAttributePillProps) { + return ( + + {data} + + ); +} diff --git a/apps/web/ee/components/issue-types/properties/attributes/boolean.tsx b/apps/web/ee/components/issue-types/properties/attributes/boolean.tsx index 8c43471b32..f5ba28db6c 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/boolean.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/boolean.tsx @@ -18,7 +18,7 @@ type TBooleanAttributesProps = { isUpdateAllowed: boolean; }; -export const BooleanAttributes = observer((props: TBooleanAttributesProps) => { +export const BooleanAttributes = observer(function BooleanAttributes(props: TBooleanAttributesProps) { const { booleanPropertyDetail, currentOperationMode, onBooleanDetailChange, isUpdateAllowed } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/common/property-multi-select.tsx b/apps/web/ee/components/issue-types/properties/attributes/common/property-multi-select.tsx index c2d2f97e21..74ff5ed2ea 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/common/property-multi-select.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/common/property-multi-select.tsx @@ -13,7 +13,7 @@ type TPropertyMultiSelectProps = { onChange: (value: boolean) => void; }; -export const PropertyMultiSelect = observer((props: TPropertyMultiSelectProps) => { +export const PropertyMultiSelect = observer(function PropertyMultiSelect(props: TPropertyMultiSelectProps) { const { value, variant = "RELATION_ISSUE", isDisabled = false, onChange } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/common/property-settings-configuration.tsx b/apps/web/ee/components/issue-types/properties/attributes/common/property-settings-configuration.tsx index 8a9ff941b1..82389cb347 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/common/property-settings-configuration.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/common/property-settings-configuration.tsx @@ -14,61 +14,61 @@ type TPropertySettingsConfigurationProps = { getLabelDetails?: (labelKey: string) => string; }; -export const PropertyRadioInputSelect = observer( - (props: TPropertySettingsConfigurationProps) => { - const { settings, settingsConfigurations, isDisabled, onChange, getLabelDetails } = props; +export const PropertyRadioInputSelect = observer(function PropertyRadioInputSelect( + props: TPropertySettingsConfigurationProps +) { + const { settings, settingsConfigurations, isDisabled, onChange, getLabelDetails } = props; - const radioInputOptions = settingsConfigurations.configurations.options.map((option) => ({ - label: getLabelDetails ? getLabelDetails(option.labelKey) : option.labelKey, - value: option.value, - disabled: isDisabled, - })); + const radioInputOptions = settingsConfigurations.configurations.options.map((option) => ({ + label: getLabelDetails ? getLabelDetails(option.labelKey) : option.labelKey, + value: option.value, + disabled: isDisabled, + })); - const handleDataChange = (value: string) => { - const updatedSettings = { - ...settings, - }; - set(updatedSettings, settingsConfigurations.keyToUpdate, value); - onChange(updatedSettings as TIssuePropertySettingsMap[T]); + const handleDataChange = (value: string) => { + const updatedSettings = { + ...settings, }; + set(updatedSettings, settingsConfigurations.keyToUpdate, value); + onChange(updatedSettings as TIssuePropertySettingsMap[T]); + }; - const selectedValue = get(settings, settingsConfigurations.keyToUpdate); - const isVerticalLayout = settingsConfigurations.configurations.verticalLayout; + const selectedValue = get(settings, settingsConfigurations.keyToUpdate); + const isVerticalLayout = settingsConfigurations.configurations.verticalLayout; - return ( - - ); + return ( + + ); +}); + +export const PropertySettingsConfiguration = observer(function PropertySettingsConfiguration< + T extends EIssuePropertyType, +>(props: TPropertySettingsConfigurationProps) { + const { settings, settingsConfigurations, isDisabled, onChange, getLabelDetails } = props; + + switch (settingsConfigurations.configurations.componentToRender) { + case "radio-input": + return ( + + ); + default: + return null; } -); - -export const PropertySettingsConfiguration = observer( - (props: TPropertySettingsConfigurationProps) => { - const { settings, settingsConfigurations, isDisabled, onChange, getLabelDetails } = props; - - switch (settingsConfigurations.configurations.componentToRender) { - case "radio-input": - return ( - - ); - default: - return null; - } - } -); +}); diff --git a/apps/web/ee/components/issue-types/properties/attributes/date-picker.tsx b/apps/web/ee/components/issue-types/properties/attributes/date-picker.tsx index 5a9c880d43..22a9a02419 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/date-picker.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/date-picker.tsx @@ -17,7 +17,7 @@ type TDatePickerAttributesProps = { isUpdateAllowed: boolean; }; -export const DatePickerAttributes = observer((props: TDatePickerAttributesProps) => { +export const DatePickerAttributes = observer(function DatePickerAttributes(props: TDatePickerAttributesProps) { const { datePickerPropertyDetail, currentOperationMode, onDatePickerDetailChange, isUpdateAllowed } = props; return ( diff --git a/apps/web/ee/components/issue-types/properties/attributes/dropdown.tsx b/apps/web/ee/components/issue-types/properties/attributes/dropdown.tsx index 937258a40d..111e675f15 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/dropdown.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/dropdown.tsx @@ -24,7 +24,7 @@ type TDropdownAttributesProps = { isUpdateAllowed: boolean; }; -export const DropdownAttributes = observer((props: TDropdownAttributesProps) => { +export const DropdownAttributes = observer(function DropdownAttributes(props: TDropdownAttributesProps) { const { dropdownPropertyDetail, currentOperationMode, onDropdownDetailChange, error, isUpdateAllowed } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/member-picker.tsx b/apps/web/ee/components/issue-types/properties/attributes/member-picker.tsx index 89e9b3eff0..b4798327a6 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/member-picker.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/member-picker.tsx @@ -20,7 +20,7 @@ type TMemberPickerAttributesProps = { isUpdateAllowed: boolean; }; -export const MemberPickerAttributes = observer((props: TMemberPickerAttributesProps) => { +export const MemberPickerAttributes = observer(function MemberPickerAttributes(props: TMemberPickerAttributesProps) { const { memberPickerPropertyDetail, currentOperationMode, onMemberPickerDetailChange, isUpdateAllowed } = props; // router const { projectId } = useParams(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/number.tsx b/apps/web/ee/components/issue-types/properties/attributes/number.tsx index 3e128ce743..ae0d2121e0 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/number.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/number.tsx @@ -18,7 +18,7 @@ type TNumberAttributesProps = { isUpdateAllowed: boolean; }; -export const NumberAttributes = observer((props: TNumberAttributesProps) => { +export const NumberAttributes = observer(function NumberAttributes(props: TNumberAttributesProps) { const { numberPropertyDetail, currentOperationMode, onNumberDetailChange, isUpdateAllowed } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/options/default-option-select.tsx b/apps/web/ee/components/issue-types/properties/attributes/options/default-option-select.tsx index bf5ab0f3a9..0c2f27ee05 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/options/default-option-select.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/options/default-option-select.tsx @@ -14,7 +14,7 @@ type TDefaultOptionSelectProps = { isDisabled?: boolean; }; -export const DefaultOptionSelect = observer((props: TDefaultOptionSelectProps) => { +export const DefaultOptionSelect = observer(function DefaultOptionSelect(props: TDefaultOptionSelectProps) { const { isMultiSelect = false, isDisabled = false } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/options/option.tsx b/apps/web/ee/components/issue-types/properties/attributes/options/option.tsx index f1d0ef917e..4401aab120 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/options/option.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/options/option.tsx @@ -20,7 +20,7 @@ type TIssuePropertyOptionItem = { error?: string; }; -export const IssuePropertyOptionItem: FC = observer((props) => { +export const IssuePropertyOptionItem = observer(function IssuePropertyOptionItem(props: TIssuePropertyOptionItem) { const { optionId, propertyOptionData, updateOptionData, scrollIntoNewOptionView, error: optionsError } = props; // plane hooks const { t } = useTranslation(); @@ -85,7 +85,7 @@ export const IssuePropertyOptionItem: FC = observer((p onBlur={() => handleCreateUpdate()} placeholder={t("work_item_types.settings.properties.attributes.option.create_update.form.placeholder")} className={cn("w-full text-sm bg-custom-background-100 border-[0.5px] rounded", { - "border-custom-border-300": !Boolean(error), + "border-custom-border-300": !error, })} inputSize="xs" hasError={Boolean(error)} diff --git a/apps/web/ee/components/issue-types/properties/attributes/options/root.tsx b/apps/web/ee/components/issue-types/properties/attributes/options/root.tsx index 8936eac9ec..28402801e7 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/options/root.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/options/root.tsx @@ -18,7 +18,7 @@ type TIssuePropertyOptionsRoot = { error?: string; }; -export const IssuePropertyOptionsRoot: FC = observer((props) => { +export const IssuePropertyOptionsRoot = observer(function IssuePropertyOptionsRoot(props: TIssuePropertyOptionsRoot) { const { customPropertyId, error } = props; // plane imports const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/attributes/text.tsx b/apps/web/ee/components/issue-types/properties/attributes/text.tsx index 71df5b2cac..901eb78ce0 100644 --- a/apps/web/ee/components/issue-types/properties/attributes/text.tsx +++ b/apps/web/ee/components/issue-types/properties/attributes/text.tsx @@ -20,7 +20,7 @@ type TTextAttributesProps = { isUpdateAllowed: boolean; }; -export const TextAttributes = observer((props: TTextAttributesProps) => { +export const TextAttributes = observer(function TextAttributes(props: TTextAttributesProps) { const { textPropertyDetail, currentOperationMode, onTextDetailChange, isUpdateAllowed } = props; // states const [data, setData] = useState([]); diff --git a/apps/web/ee/components/issue-types/properties/common/issue-property-logo.tsx b/apps/web/ee/components/issue-types/properties/common/issue-property-logo.tsx index 6f51c9bdc8..e4d13aacec 100644 --- a/apps/web/ee/components/issue-types/properties/common/issue-property-logo.tsx +++ b/apps/web/ee/components/issue-types/properties/common/issue-property-logo.tsx @@ -12,7 +12,7 @@ type Props = { colorClassName?: string; }; -export const IssuePropertyLogo: FC = (props) => { +export function IssuePropertyLogo(props: Props) { const { icon_props, size = 16, colorClassName = "" } = props; // derived values const LucideIcon = LUCIDE_ICONS_LIST.find((item) => item.name === icon_props?.name)?.element ?? TriangleAlert; @@ -30,4 +30,4 @@ export const IssuePropertyLogo: FC = (props) => { /> ); -}; +} diff --git a/apps/web/ee/components/issue-types/properties/delete-confirmation-modal.tsx b/apps/web/ee/components/issue-types/properties/delete-confirmation-modal.tsx index 4402d68366..00201fae9f 100644 --- a/apps/web/ee/components/issue-types/properties/delete-confirmation-modal.tsx +++ b/apps/web/ee/components/issue-types/properties/delete-confirmation-modal.tsx @@ -16,7 +16,7 @@ type TProps = { onDelete: () => Promise; }; -export const DeleteConfirmationModal: React.FC = observer((props) => { +export const DeleteConfirmationModal = observer(function DeleteConfirmationModal(props: TProps) { const { isOpen, isDisabledAlready, onClose, onDisable, onDelete } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/dropdowns/property-attributes.tsx b/apps/web/ee/components/issue-types/properties/dropdowns/property-attributes.tsx index 9fd2ee42dc..b3f389f3dc 100644 --- a/apps/web/ee/components/issue-types/properties/dropdowns/property-attributes.tsx +++ b/apps/web/ee/components/issue-types/properties/dropdowns/property-attributes.tsx @@ -18,7 +18,7 @@ type TPropertyAttributesProps = { isUpdateAllowed: boolean; }; -export const PropertyAttributes = observer((props: TPropertyAttributesProps) => { +export const PropertyAttributes = observer(function PropertyAttributes(props: TPropertyAttributesProps) { const { propertyDetail, currentOperationMode, onPropertyDetailChange, error, isUpdateAllowed } = props; // list of property types that should not be allowed to change attributes const DISABLE_ATTRIBUTE_CHANGE_LIST = [EIssuePropertyType.BOOLEAN, EIssuePropertyType.DATETIME]; diff --git a/apps/web/ee/components/issue-types/properties/dropdowns/property-title.tsx b/apps/web/ee/components/issue-types/properties/dropdowns/property-title.tsx index 1493be9d81..36eb121cf4 100644 --- a/apps/web/ee/components/issue-types/properties/dropdowns/property-title.tsx +++ b/apps/web/ee/components/issue-types/properties/dropdowns/property-title.tsx @@ -15,7 +15,9 @@ type TPropertyTitleDescriptionInputProps = { ) => void; }; -export const PropertyTitleDescriptionInput = observer((props: TPropertyTitleDescriptionInputProps) => { +export const PropertyTitleDescriptionInput = observer(function PropertyTitleDescriptionInput( + props: TPropertyTitleDescriptionInputProps +) { const { propertyDetail, error, onPropertyDetailChange } = props; // plane hooks const { t } = useTranslation(); @@ -25,7 +27,7 @@ export const PropertyTitleDescriptionInput = observer((props: TPropertyTitleDesc onPropertyDetailChange("display_name", e.target.value)} diff --git a/apps/web/ee/components/issue-types/properties/dropdowns/property-type.tsx b/apps/web/ee/components/issue-types/properties/dropdowns/property-type.tsx index 9d3109d945..c51e0e6c1d 100644 --- a/apps/web/ee/components/issue-types/properties/dropdowns/property-type.tsx +++ b/apps/web/ee/components/issue-types/properties/dropdowns/property-type.tsx @@ -23,7 +23,7 @@ type TPropertyTypeDropdownProps = { isUpdateAllowed: boolean; }; -export const PropertyTypeDropdown = observer((props: TPropertyTypeDropdownProps) => { +export const PropertyTypeDropdown = observer(function PropertyTypeDropdown(props: TPropertyTypeDropdownProps) { const { propertyType, propertyRelationType, diff --git a/apps/web/ee/components/issue-types/properties/dropdowns/selected-attribute-properties.tsx b/apps/web/ee/components/issue-types/properties/dropdowns/selected-attribute-properties.tsx index c2776b617f..5ea5eb6893 100644 --- a/apps/web/ee/components/issue-types/properties/dropdowns/selected-attribute-properties.tsx +++ b/apps/web/ee/components/issue-types/properties/dropdowns/selected-attribute-properties.tsx @@ -24,7 +24,9 @@ type TSelectedPropertyAttributesProps = { isUpdateAllowed: boolean; }; -export const SelectedAttributeProperties = observer((props: TSelectedPropertyAttributesProps) => { +export const SelectedAttributeProperties = observer(function SelectedAttributeProperties( + props: TSelectedPropertyAttributesProps +) { const { propertyDetail, currentOperationMode, onPropertyDetailChange, error, isUpdateAllowed } = props; const ISSUE_PROPERTY_ATTRIBUTE_DETAILS: Partial> = { diff --git a/apps/web/ee/components/issue-types/properties/empty-state.tsx b/apps/web/ee/components/issue-types/properties/empty-state.tsx index acc526e61c..d52c76b79e 100644 --- a/apps/web/ee/components/issue-types/properties/empty-state.tsx +++ b/apps/web/ee/components/issue-types/properties/empty-state.tsx @@ -2,7 +2,7 @@ import { useTranslation } from "@plane/i18n"; import { WorkItemsIcon } from "@plane/propel/icons"; -export const IssueTypePropertiesEmptyState = () => { +export function IssueTypePropertiesEmptyState() { // plane hooks const { t } = useTranslation(); @@ -21,4 +21,4 @@ export const IssueTypePropertiesEmptyState = () => {
    ); -}; +} diff --git a/apps/web/ee/components/issue-types/properties/mandatory-field.tsx b/apps/web/ee/components/issue-types/properties/mandatory-field.tsx index a2c1cd857e..8f08969daa 100644 --- a/apps/web/ee/components/issue-types/properties/mandatory-field.tsx +++ b/apps/web/ee/components/issue-types/properties/mandatory-field.tsx @@ -14,7 +14,9 @@ type TPropertyMandatoryFieldCheckboxProps = { onMandatoryFieldChange: (value: boolean) => void; }; -export const PropertyMandatoryFieldCheckbox = observer((props: TPropertyMandatoryFieldCheckboxProps) => { +export const PropertyMandatoryFieldCheckbox = observer(function PropertyMandatoryFieldCheckbox( + props: TPropertyMandatoryFieldCheckboxProps +) { const { value, defaultValue, isDisabled = false, onMandatoryFieldChange } = props; // plane imports const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/property-icon.tsx b/apps/web/ee/components/issue-types/properties/property-icon.tsx index e9e8c671e9..4c083e460a 100644 --- a/apps/web/ee/components/issue-types/properties/property-icon.tsx +++ b/apps/web/ee/components/issue-types/properties/property-icon.tsx @@ -21,7 +21,7 @@ type TPropertyTypeIconProps = { className?: string; }; -export const PropertyTypeIcon = ({ iconKey, className }: TPropertyTypeIconProps) => { +export function PropertyTypeIcon({ iconKey, className }: TPropertyTypeIconProps) { const Icon = CUSTOM_PROPERTY_ICON_MAP[iconKey]; return ; -}; +} diff --git a/apps/web/ee/components/issue-types/properties/property-list-item.tsx b/apps/web/ee/components/issue-types/properties/property-list-item.tsx index be21061f29..c41a06fee7 100644 --- a/apps/web/ee/components/issue-types/properties/property-list-item.tsx +++ b/apps/web/ee/components/issue-types/properties/property-list-item.tsx @@ -66,7 +66,7 @@ const defaultIssuePropertyError: TIssuePropertyFormError = { property_type: "", }; -export const IssuePropertyListItem = observer((props: TIssuePropertyListItem) => { +export const IssuePropertyListItem = observer(function IssuePropertyListItem(props: TIssuePropertyListItem) { const { customPropertyId, issuePropertyCreateListData, @@ -176,7 +176,6 @@ export const IssuePropertyListItem = observer((props: TIssuePropertyListItem) => if (issuePropertyData.property_type === EIssuePropertyType.OPTION) { optionsPayload = sanitizeOptionsData(propertyOptions) .map((item) => { - // eslint-disable-next-line @typescript-eslint/no-unused-vars const { key, ...rest } = item; return rest; }) diff --git a/apps/web/ee/components/issue-types/properties/property-list.tsx b/apps/web/ee/components/issue-types/properties/property-list.tsx index 3193805b50..30dd4e1b03 100644 --- a/apps/web/ee/components/issue-types/properties/property-list.tsx +++ b/apps/web/ee/components/issue-types/properties/property-list.tsx @@ -25,7 +25,7 @@ type TIssuePropertyList = { }; }; -export const IssuePropertyList: FC = observer((props) => { +export const IssuePropertyList = observer(function IssuePropertyList(props: TIssuePropertyList) { const { properties, issuePropertyCreateList, diff --git a/apps/web/ee/components/issue-types/properties/quick-actions.tsx b/apps/web/ee/components/issue-types/properties/quick-actions.tsx index 7c20a257d3..f134e209a4 100644 --- a/apps/web/ee/components/issue-types/properties/quick-actions.tsx +++ b/apps/web/ee/components/issue-types/properties/quick-actions.tsx @@ -25,7 +25,9 @@ type TIssuePropertyQuickActions = { }; }; -export const IssuePropertyQuickActions = observer((props: TIssuePropertyQuickActions) => { +export const IssuePropertyQuickActions = observer(function IssuePropertyQuickActions( + props: TIssuePropertyQuickActions +) { const { isPropertyDisabled, onDisable, onDelete, onIssuePropertyOperationMode, trackers } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issue-types/properties/root.tsx b/apps/web/ee/components/issue-types/properties/root.tsx index 473e94804c..49c9cc3b52 100644 --- a/apps/web/ee/components/issue-types/properties/root.tsx +++ b/apps/web/ee/components/issue-types/properties/root.tsx @@ -44,7 +44,7 @@ const defaultIssueProperty: Partial> = { is_required: false, }; -export const IssuePropertiesRoot = observer((props: TIssuePropertiesRoot) => { +export const IssuePropertiesRoot = observer(function IssuePropertiesRoot(props: TIssuePropertiesRoot) { const { issueTypeId, propertiesLoader, getWorkItemTypeById } = props; // states const [issuePropertyCreateList, setIssuePropertyCreateList] = useState([]); @@ -63,9 +63,9 @@ export const IssuePropertiesRoot = observer((props: TIssuePropertiesRoot) => { const scrollIntoElementView = () => { if (lastElementRef.current) { lastElementRef.current.scrollIntoView({ behavior: "auto", block: "nearest", inline: "start" }); - const propertyTitleDropdownElement = lastElementRef.current.querySelector( + const propertyTitleDropdownElement = lastElementRef.current.querySelector( "button.property-title-dropdown" - ) as HTMLButtonElement | null; + ); setTimeout(() => { propertyTitleDropdownElement?.focus(); propertyTitleDropdownElement?.click(); diff --git a/apps/web/ee/components/issue-types/quick-actions.tsx b/apps/web/ee/components/issue-types/quick-actions.tsx index d3f2618899..1922c66bc8 100644 --- a/apps/web/ee/components/issue-types/quick-actions.tsx +++ b/apps/web/ee/components/issue-types/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { Pencil, Trash2 } from "lucide-react"; @@ -22,7 +20,7 @@ type Props = { onEnableDisableIssueType: (issueTypeId: string) => Promise; }; -export const IssueTypeQuickActions: React.FC = observer((props) => { +export const IssueTypeQuickActions = observer(function IssueTypeQuickActions(props: Props) { const { issueTypeId, getWorkItemTypeById, diff --git a/apps/web/ee/components/issue-types/root.tsx b/apps/web/ee/components/issue-types/root.tsx index d30e87d2c9..ecc1976a4c 100644 --- a/apps/web/ee/components/issue-types/root.tsx +++ b/apps/web/ee/components/issue-types/root.tsx @@ -1,4 +1,3 @@ -"use client"; import { useCallback, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -15,7 +14,7 @@ import { IssueTypeEmptyState } from "./empty-state"; import { IssueTypeDeleteConfirmationModal } from "./issue-type-delete-confirmation-modal"; import { IssueTypesList } from "./issue-types-list"; -export const IssueTypesRoot = observer(() => { +export const IssueTypesRoot = observer(function IssueTypesRoot() { // router const { workspaceSlug, projectId } = useParams(); // states diff --git a/apps/web/ee/components/issue-types/values/addition-properties-update-base.tsx b/apps/web/ee/components/issue-types/values/addition-properties-update-base.tsx index 08d32bb885..67114fad86 100644 --- a/apps/web/ee/components/issue-types/values/addition-properties-update-base.tsx +++ b/apps/web/ee/components/issue-types/values/addition-properties-update-base.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { setToast, TOAST_TYPE } from "@plane/propel/toast"; @@ -38,80 +36,81 @@ type TIssueAdditionalPropertyValuesUpdateBaseProps = TIssueAdditionalPropertyVal * Receives all data and methods as props to enable reusability across different contexts. * Use the wrapper component for automatic store integration. */ -export const IssueAdditionalPropertyValuesUpdateBase: React.FC = - observer((props) => { - const { - entityType = EWorkItemTypeEntity.WORK_ITEM, - getWorkItemTypeById, - areCustomPropertiesInitializing, - isDisabled, - arePropertyValuesInitializing, - issuePropertyValues, - issueTypeId, - isWorkItemTypeEntityEnabled, - propertyValueChangeCallback, - projectId, - onPropertyValueChange, - updateService, - workspaceSlug, - } = props; - // store hooks - const issueType = getWorkItemTypeById(issueTypeId); - // derived values - const isWorkItemTypeEnabled = isWorkItemTypeEntityEnabled(workspaceSlug?.toString(), projectId, entityType); - const issueTypeDetails = issueType?.asJSON; - const activeProperties = issueType?.activeProperties; +export const IssueAdditionalPropertyValuesUpdateBase = observer(function IssueAdditionalPropertyValuesUpdateBase( + props: TIssueAdditionalPropertyValuesUpdateBaseProps +) { + const { + entityType = EWorkItemTypeEntity.WORK_ITEM, + getWorkItemTypeById, + areCustomPropertiesInitializing, + isDisabled, + arePropertyValuesInitializing, + issuePropertyValues, + issueTypeId, + isWorkItemTypeEntityEnabled, + propertyValueChangeCallback, + projectId, + onPropertyValueChange, + updateService, + workspaceSlug, + } = props; + // store hooks + const issueType = getWorkItemTypeById(issueTypeId); + // derived values + const isWorkItemTypeEnabled = isWorkItemTypeEntityEnabled(workspaceSlug?.toString(), projectId, entityType); + const issueTypeDetails = issueType?.asJSON; + const activeProperties = issueType?.activeProperties; - const handlePropertyValueChange = async (propertyId: string, value: string[]) => { - const beforeUpdateValue = issuePropertyValues[propertyId]; - onPropertyValueChange((prev) => ({ - ...prev, - [propertyId]: value, - })); - // update the property value - await updateService(propertyId, value) - .then(() => propertyValueChangeCallback(propertyId, value)) - .catch((error) => { - // revert the value if update fails - onPropertyValueChange((prev) => ({ - ...prev, - [propertyId]: beforeUpdateValue, - })); - setToast({ - type: TOAST_TYPE.ERROR, - title: "Error!", - message: error?.error ?? "Property could not be update. Please try again.", - }); + const handlePropertyValueChange = async (propertyId: string, value: string[]) => { + const beforeUpdateValue = issuePropertyValues[propertyId]; + onPropertyValueChange((prev) => ({ + ...prev, + [propertyId]: value, + })); + // update the property value + await updateService(propertyId, value) + .then(() => propertyValueChangeCallback(propertyId, value)) + .catch((error) => { + // revert the value if update fails + onPropertyValueChange((prev) => ({ + ...prev, + [propertyId]: beforeUpdateValue, + })); + setToast({ + type: TOAST_TYPE.ERROR, + title: "Error!", + message: error?.error ?? "Property could not be update. Please try again.", }); - }; + }); + }; - // if issue types are not enabled, return null - if (!isWorkItemTypeEnabled) return <>; - - if (areCustomPropertiesInitializing) { - return ( - - - - - - - ); - } - - // if issue type details or active properties are not available, return null - if (!issueTypeDetails || !activeProperties?.length) return null; + // if issue types are not enabled, return null + if (!isWorkItemTypeEnabled) return <>; + if (areCustomPropertiesInitializing) { return ( - + + + + + + ); - }); + } + + // if issue type details or active properties are not available, return null + if (!issueTypeDetails || !activeProperties?.length) return null; + + return ( + + ); +}); diff --git a/apps/web/ee/components/issue-types/values/addition-properties-update.tsx b/apps/web/ee/components/issue-types/values/addition-properties-update.tsx index 8ace4ba85a..45cea0c092 100644 --- a/apps/web/ee/components/issue-types/values/addition-properties-update.tsx +++ b/apps/web/ee/components/issue-types/values/addition-properties-update.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -17,83 +15,83 @@ import { IssueAdditionalPropertyValuesUpdateBase } from "./addition-properties-u * Store-connected wrapper for issue additional properties update. * Handles work item type store integration and data fetching. */ -export const IssueAdditionalPropertyValuesUpdate: React.FC = observer( - (props) => { - const { - issueId, - projectId, - workspaceSlug, - entityType = EWorkItemTypeEntity.WORK_ITEM, - issueServiceType = EIssueServiceType.ISSUES, - } = props; - // store hooks - const { - getIssueTypeById, - isWorkItemTypeEntityEnabledForProject, - getProjectWorkItemPropertiesLoader, - fetchAllPropertiesAndOptions, - } = useIssueTypes(); - const { fetchPropertyActivities } = useIssuePropertiesActivity(); - // services - const issuePropertyValuesService = new IssuePropertyValuesService(issueServiceType); - // derived values - const isWorkItemTypeEntityEnabled = isWorkItemTypeEntityEnabledForProject( - workspaceSlug?.toString(), - projectId, - entityType - ); - const propertiesLoader = getProjectWorkItemPropertiesLoader(projectId, entityType); - // fetch methods - async function fetchIssuePropertyValues() { - // This is required when accessing the peek overview from workspace level. - await fetchAllPropertiesAndOptions(workspaceSlug, projectId, entityType); - return issuePropertyValuesService.fetchAll(workspaceSlug, projectId, issueId); - } - - // fetch issue property values - const { - data: issuePropertyValues, - isLoading, - mutate, - } = useSWR( - workspaceSlug && projectId && issueId && entityType && isWorkItemTypeEntityEnabled - ? `ISSUE_PROPERTY_VALUES_${workspaceSlug}_${projectId}_${issueId}_${entityType}_${isWorkItemTypeEntityEnabled}` - : null, - () => - workspaceSlug && projectId && issueId && entityType && isWorkItemTypeEntityEnabled - ? fetchIssuePropertyValues() - : null, - { - revalidateOnFocus: false, - } - ); - - const handlePropertyValueChange = ( - value: TIssuePropertyValues | ((prev: TIssuePropertyValues) => TIssuePropertyValues) - ) => { - mutate((prevData) => { - const valueObj = typeof value === "function" ? value(prevData || {}) : value; - return { ...prevData, ...valueObj }; - }, false); - }; - - return ( - fetchPropertyActivities(workspaceSlug, projectId, issueId)} - onPropertyValueChange={handlePropertyValueChange} - updateService={issuePropertyValuesService.update.bind( - issuePropertyValuesService, - workspaceSlug, - projectId, - issueId - )} - /> - ); +export const IssueAdditionalPropertyValuesUpdate = observer(function IssueAdditionalPropertyValuesUpdate( + props: TIssueAdditionalPropertyValuesUpdateProps +) { + const { + issueId, + projectId, + workspaceSlug, + entityType = EWorkItemTypeEntity.WORK_ITEM, + issueServiceType = EIssueServiceType.ISSUES, + } = props; + // store hooks + const { + getIssueTypeById, + isWorkItemTypeEntityEnabledForProject, + getProjectWorkItemPropertiesLoader, + fetchAllPropertiesAndOptions, + } = useIssueTypes(); + const { fetchPropertyActivities } = useIssuePropertiesActivity(); + // services + const issuePropertyValuesService = new IssuePropertyValuesService(issueServiceType); + // derived values + const isWorkItemTypeEntityEnabled = isWorkItemTypeEntityEnabledForProject( + workspaceSlug?.toString(), + projectId, + entityType + ); + const propertiesLoader = getProjectWorkItemPropertiesLoader(projectId, entityType); + // fetch methods + async function fetchIssuePropertyValues() { + // This is required when accessing the peek overview from workspace level. + await fetchAllPropertiesAndOptions(workspaceSlug, projectId, entityType); + return issuePropertyValuesService.fetchAll(workspaceSlug, projectId, issueId); } -); + + // fetch issue property values + const { + data: issuePropertyValues, + isLoading, + mutate, + } = useSWR( + workspaceSlug && projectId && issueId && entityType && isWorkItemTypeEntityEnabled + ? `ISSUE_PROPERTY_VALUES_${workspaceSlug}_${projectId}_${issueId}_${entityType}_${isWorkItemTypeEntityEnabled}` + : null, + () => + workspaceSlug && projectId && issueId && entityType && isWorkItemTypeEntityEnabled + ? fetchIssuePropertyValues() + : null, + { + revalidateOnFocus: false, + } + ); + + const handlePropertyValueChange = ( + value: TIssuePropertyValues | ((prev: TIssuePropertyValues) => TIssuePropertyValues) + ) => { + mutate((prevData) => { + const valueObj = typeof value === "function" ? value(prevData || {}) : value; + return { ...prevData, ...valueObj }; + }, false); + }; + + return ( + fetchPropertyActivities(workspaceSlug, projectId, issueId)} + onPropertyValueChange={handlePropertyValueChange} + updateService={issuePropertyValuesService.update.bind( + issuePropertyValuesService, + workspaceSlug, + projectId, + issueId + )} + /> + ); +}); diff --git a/apps/web/ee/components/issue-types/values/components/boolean-input.tsx b/apps/web/ee/components/issue-types/values/components/boolean-input.tsx index e2a17554a7..98c555a361 100644 --- a/apps/web/ee/components/issue-types/values/components/boolean-input.tsx +++ b/apps/web/ee/components/issue-types/values/components/boolean-input.tsx @@ -11,7 +11,7 @@ type TBooleanInputProps = { onBooleanValueChange: (value: string[]) => Promise; }; -export const BooleanInput = observer((props: TBooleanInputProps) => { +export const BooleanInput = observer(function BooleanInput(props: TBooleanInputProps) { const { value, isDisabled = false, onBooleanValueChange } = props; // states const [data, setData] = useState([]); diff --git a/apps/web/ee/components/issue-types/values/components/date-select.tsx b/apps/web/ee/components/issue-types/values/components/date-select.tsx index 6f70066cb9..e2f1e7c151 100644 --- a/apps/web/ee/components/issue-types/values/components/date-select.tsx +++ b/apps/web/ee/components/issue-types/values/components/date-select.tsx @@ -23,7 +23,7 @@ type TDateValueSelectProps = { onDateValueChange: (value: string[]) => Promise; }; -export const DateValueSelect = observer((props: TDateValueSelectProps) => { +export const DateValueSelect = observer(function DateValueSelect(props: TDateValueSelectProps) { const { propertyDetail, value, @@ -54,7 +54,7 @@ export const DateValueSelect = observer((props: TDateValueSelectProps) => { value={data?.[0]} onChange={handleDateChange} placeholder="Choose date" - buttonVariant={variant === "update" && !Boolean(error) ? "transparent-with-text" : "border-with-text"} + buttonVariant={variant === "update" && !error ? "transparent-with-text" : "border-with-text"} disabled={isDisabled} className="w-full flex-grow group" buttonContainerClassName="w-full text-left" diff --git a/apps/web/ee/components/issue-types/values/components/member-select.tsx b/apps/web/ee/components/issue-types/values/components/member-select.tsx index 80133a91a0..c6d90b9c14 100644 --- a/apps/web/ee/components/issue-types/values/components/member-select.tsx +++ b/apps/web/ee/components/issue-types/values/components/member-select.tsx @@ -21,7 +21,7 @@ type TMemberValueSelectProps = { onMemberValueChange: (value: string[]) => Promise; }; -export const MemberValueSelect = observer((props: TMemberValueSelectProps) => { +export const MemberValueSelect = observer(function MemberValueSelect(props: TMemberValueSelectProps) { const { propertyDetail, value, @@ -80,7 +80,7 @@ export const MemberValueSelect = observer((props: TMemberValueSelectProps) => { handleChange(memberIds); }} buttonVariant={ - variant === "update" && !Boolean(error) + variant === "update" && !error ? value.length > 1 ? "transparent-without-text" : "transparent-with-text" @@ -104,7 +104,7 @@ export const MemberValueSelect = observer((props: TMemberValueSelectProps) => { } }} buttonVariant={ - variant === "update" && !Boolean(error) + variant === "update" && !error ? value.length > 1 ? "transparent-without-text" : "transparent-with-text" diff --git a/apps/web/ee/components/issue-types/values/components/number-input.tsx b/apps/web/ee/components/issue-types/values/components/number-input.tsx index 5e6f2b3415..26c86a3e1c 100644 --- a/apps/web/ee/components/issue-types/values/components/number-input.tsx +++ b/apps/web/ee/components/issue-types/values/components/number-input.tsx @@ -18,7 +18,7 @@ type TNumberValueInputProps = { onNumberValueChange: (value: string[]) => Promise; }; -export const NumberValueInput = observer((props: TNumberValueInputProps) => { +export const NumberValueInput = observer(function NumberValueInput(props: TNumberValueInputProps) { const { propertyDetail, value, diff --git a/apps/web/ee/components/issue-types/values/components/option-select.tsx b/apps/web/ee/components/issue-types/values/components/option-select.tsx index c7cab9521b..f56688df50 100644 --- a/apps/web/ee/components/issue-types/values/components/option-select.tsx +++ b/apps/web/ee/components/issue-types/values/components/option-select.tsx @@ -28,7 +28,7 @@ type TOptionValueSelectProps = { getPropertyInstanceById: (customPropertyId: string) => IIssueProperty | undefined; }; -export const OptionValueSelect = observer((props: TOptionValueSelectProps) => { +export const OptionValueSelect = observer(function OptionValueSelect(props: TOptionValueSelectProps) { const { propertyDetail, value, diff --git a/apps/web/ee/components/issue-types/values/components/text-input.tsx b/apps/web/ee/components/issue-types/values/components/text-input.tsx index 08f19a394f..8147db1560 100644 --- a/apps/web/ee/components/issue-types/values/components/text-input.tsx +++ b/apps/web/ee/components/issue-types/values/components/text-input.tsx @@ -26,7 +26,7 @@ type TTextValueInputProps = { onTextValueChange: (value: string[]) => void; }; -export const TextValueInput = observer((props: TTextValueInputProps) => { +export const TextValueInput = observer(function TextValueInput(props: TTextValueInputProps) { const { propertyDetail, value, diff --git a/apps/web/ee/components/issue-types/values/components/truncated-url.tsx b/apps/web/ee/components/issue-types/values/components/truncated-url.tsx index 7a75aad5b6..598f555740 100644 --- a/apps/web/ee/components/issue-types/values/components/truncated-url.tsx +++ b/apps/web/ee/components/issue-types/values/components/truncated-url.tsx @@ -12,13 +12,13 @@ interface TruncatedUrlProps { const MAX_PATH_LENGTH = 15; -export const TruncatedUrl: React.FC = ({ +export function TruncatedUrl({ url, maxPathLength = MAX_PATH_LENGTH, className = "", showLinkIcon = false, onClick, -}) => { +}: TruncatedUrlProps) { const { pathname, full: fullURL } = url; const displayDomain = fullURL.hostname; const fullDisplayUrl = (pathname ?? "") + (fullURL.search ?? "") + (fullURL.hash ?? ""); @@ -53,4 +53,4 @@ export const TruncatedUrl: React.FC = ({ )} ); -}; +} diff --git a/apps/web/ee/components/issue-types/values/components/url-input.tsx b/apps/web/ee/components/issue-types/values/components/url-input.tsx index 7040903429..bf27a5246c 100644 --- a/apps/web/ee/components/issue-types/values/components/url-input.tsx +++ b/apps/web/ee/components/issue-types/values/components/url-input.tsx @@ -19,7 +19,7 @@ type TUrlValueInputProps = { onTextValueChange: (value: string[]) => void; }; -export const UrlValueInput = observer((props: TUrlValueInputProps) => { +export const UrlValueInput = observer(function UrlValueInput(props: TUrlValueInputProps) { const { propertyDetail, value, variant, error, className = "", isDisabled = false, onTextValueChange } = props; // states diff --git a/apps/web/ee/components/issue-types/values/create.tsx b/apps/web/ee/components/issue-types/values/create.tsx index bd17f029ea..61e0d1ed32 100644 --- a/apps/web/ee/components/issue-types/values/create.tsx +++ b/apps/web/ee/components/issue-types/values/create.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect } from "react"; import { observer } from "mobx-react"; // plane imports @@ -19,60 +17,60 @@ type TIssueAdditionalPropertyValuesCreateProps = { shouldLoadDefaultValues: boolean; }; -export const IssueAdditionalPropertyValuesCreate: React.FC = observer( - (props) => { - const { - arePropertyValuesInitializing, - getWorkItemTypeById, - issuePropertyValues, - issueTypeId, - projectId, - shouldLoadDefaultValues, - } = props; - // store hooks - const { - issuePropertyValues: issuePropertyDefaultValues, - issuePropertyValueErrors, - setIssuePropertyValues: handleIssuePropertyValueUpdate, - } = useIssueModal(); - const issueType = getWorkItemTypeById(issueTypeId); - // derived values - const issueTypeDetail = issueType?.asJSON; - const activeProperties = issueType?.activeProperties; +export const IssueAdditionalPropertyValuesCreate = observer(function IssueAdditionalPropertyValuesCreate( + props: TIssueAdditionalPropertyValuesCreateProps +) { + const { + arePropertyValuesInitializing, + getWorkItemTypeById, + issuePropertyValues, + issueTypeId, + projectId, + shouldLoadDefaultValues, + } = props; + // store hooks + const { + issuePropertyValues: issuePropertyDefaultValues, + issuePropertyValueErrors, + setIssuePropertyValues: handleIssuePropertyValueUpdate, + } = useIssueModal(); + const issueType = getWorkItemTypeById(issueTypeId); + // derived values + const issueTypeDetail = issueType?.asJSON; + const activeProperties = issueType?.activeProperties; - useEffect(() => { - // Only set default values if shouldLoadDefaultValues is true and we have active properties - if (shouldLoadDefaultValues && activeProperties?.length && !arePropertyValuesInitializing) { - handleIssuePropertyValueUpdate({ - ...getPropertiesDefaultValues(activeProperties), - ...issuePropertyValues, - }); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [activeProperties, arePropertyValuesInitializing, handleIssuePropertyValueUpdate, shouldLoadDefaultValues]); + useEffect(() => { + // Only set default values if shouldLoadDefaultValues is true and we have active properties + if (shouldLoadDefaultValues && activeProperties?.length && !arePropertyValuesInitializing) { + handleIssuePropertyValueUpdate({ + ...getPropertiesDefaultValues(activeProperties), + ...issuePropertyValues, + }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [activeProperties, arePropertyValuesInitializing, handleIssuePropertyValueUpdate, shouldLoadDefaultValues]); - const handlePropertyValueChange = (propertyId: string, value: string[]) => { - handleIssuePropertyValueUpdate((prev) => ({ - ...prev, - [propertyId]: value, - })); - }; + const handlePropertyValueChange = (propertyId: string, value: string[]) => { + handleIssuePropertyValueUpdate((prev) => ({ + ...prev, + [propertyId]: value, + })); + }; - if (!issueTypeDetail || !activeProperties?.length) return null; + if (!issueTypeDetail || !activeProperties?.length) return null; - return ( -
    - -
    - ); - } -); + return ( +
    + +
    + ); +}); diff --git a/apps/web/ee/components/issue-types/values/root.tsx b/apps/web/ee/components/issue-types/values/root.tsx index 0895d0e903..aff30e59d8 100644 --- a/apps/web/ee/components/issue-types/values/root.tsx +++ b/apps/web/ee/components/issue-types/values/root.tsx @@ -17,7 +17,9 @@ type TIssueAdditionalPropertyValuesProps = { variant: TPropertyValueVariant; }; -export const IssueAdditionalPropertyValues: React.FC = observer((props) => { +export const IssueAdditionalPropertyValues = observer(function IssueAdditionalPropertyValues( + props: TIssueAdditionalPropertyValuesProps +) { const { getWorkItemTypeById, handlePropertyValueChange, diff --git a/apps/web/ee/components/issue-types/values/value-select.tsx b/apps/web/ee/components/issue-types/values/value-select.tsx index 95fdf22b3e..7bae312610 100644 --- a/apps/web/ee/components/issue-types/values/value-select.tsx +++ b/apps/web/ee/components/issue-types/values/value-select.tsx @@ -39,7 +39,7 @@ type TPropertyValueSelectProps = { getPropertyInstanceById: (customPropertyId: string) => IIssueProperty | undefined; }; -export const PropertyValueSelect = observer((props: TPropertyValueSelectProps) => { +export const PropertyValueSelect = observer(function PropertyValueSelect(props: TPropertyValueSelectProps) { const { propertyDetail, propertyValue, @@ -56,30 +56,32 @@ export const PropertyValueSelect = observer((props: TPropertyValueSelectProps) = // derived values const isPeekOverview = peekIssue ? true : false; - const IssuePropertyDetail = () => ( - <> -
    - {propertyDetail?.logo_props?.in_use && ( - - )} -
    - - - {propertyDetail?.display_name} - {propertyDetail?.is_required && *} - {propertyDetail.description && ( - - - + function IssuePropertyDetail() { + return ( + <> +
    + {propertyDetail?.logo_props?.in_use && ( + )} +
    + + + {propertyDetail?.display_name} + {propertyDetail?.is_required && *} + {propertyDetail.description && ( + + + + )} + -     - - ); + + ); + } const ISSUE_PROPERTY_ATTRIBUTE_DETAILS: Partial> = { TEXT: ( diff --git a/apps/web/ee/components/issues/advanced-header.tsx b/apps/web/ee/components/issues/advanced-header.tsx index 431a0a3d2d..b736742189 100644 --- a/apps/web/ee/components/issues/advanced-header.tsx +++ b/apps/web/ee/components/issues/advanced-header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // icons @@ -29,11 +27,11 @@ import { usePlatformOS } from "@/hooks/use-platform-os"; // plane web imports import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common"; -export const AdvancedIssuesHeader = observer(() => { +export const AdvancedIssuesHeader = observer(function AdvancedIssuesHeader() { const { t } = useTranslation(); // router const router = useAppRouter(); - const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string }; + const { workspaceSlug, projectId } = useParams(); // store hooks const { issues: { getGroupIssueCount }, diff --git a/apps/web/ee/components/issues/bulk-operations/actions/archive.tsx b/apps/web/ee/components/issues/bulk-operations/actions/archive.tsx index aa36c35eec..2ef3fac97d 100644 --- a/apps/web/ee/components/issues/bulk-operations/actions/archive.tsx +++ b/apps/web/ee/components/issues/bulk-operations/actions/archive.tsx @@ -18,7 +18,7 @@ type Props = { selectedIssueIds: string[]; }; -export const BulkArchiveIssues: React.FC = observer((props) => { +export const BulkArchiveIssues = observer(function BulkArchiveIssues(props: Props) { const { handleClearSelection, selectedIssueIds } = props; // states const [isBulkArchiveModalOpen, setIsBulkArchiveModalOpen] = useState(false); diff --git a/apps/web/ee/components/issues/bulk-operations/actions/delete.tsx b/apps/web/ee/components/issues/bulk-operations/actions/delete.tsx index 1b7b4b084b..62d82a3165 100644 --- a/apps/web/ee/components/issues/bulk-operations/actions/delete.tsx +++ b/apps/web/ee/components/issues/bulk-operations/actions/delete.tsx @@ -18,7 +18,7 @@ type Props = { selectedIssueIds: string[]; }; -export const BulkDeleteIssues: React.FC = observer((props) => { +export const BulkDeleteIssues = observer(function BulkDeleteIssues(props: Props) { const { handleClearSelection, selectedIssueIds } = props; // states const [isBulkDeleteModalOpen, setIsBulkDeleteModalOpen] = useState(false); diff --git a/apps/web/ee/components/issues/bulk-operations/actions/root.tsx b/apps/web/ee/components/issues/bulk-operations/actions/root.tsx index 3d5dd69c43..0d8533a191 100644 --- a/apps/web/ee/components/issues/bulk-operations/actions/root.tsx +++ b/apps/web/ee/components/issues/bulk-operations/actions/root.tsx @@ -9,7 +9,7 @@ type Props = { selectedEntityIds: string[]; }; -export const BulkOperationsActionsRoot: React.FC = observer((props) => { +export const BulkOperationsActionsRoot = observer(function BulkOperationsActionsRoot(props: Props) { const { handleClearSelection, selectedEntityIds } = props; return ( diff --git a/apps/web/ee/components/issues/bulk-operations/actions/subscribe.tsx b/apps/web/ee/components/issues/bulk-operations/actions/subscribe.tsx index e174e016c3..b280a7a646 100644 --- a/apps/web/ee/components/issues/bulk-operations/actions/subscribe.tsx +++ b/apps/web/ee/components/issues/bulk-operations/actions/subscribe.tsx @@ -11,7 +11,7 @@ type Props = { selectedIssueIds: string[]; }; -export const BulkSubscribeIssues: React.FC = observer((props) => { +export const BulkSubscribeIssues = observer(function BulkSubscribeIssues(props: Props) { const { handleClearSelection, selectedIssueIds } = props; // states const [isBulkSubscribeModalOpen, setIsBulkSubscribeModalOpen] = useState(false); diff --git a/apps/web/ee/components/issues/bulk-operations/modals/bulk-archive-modal.tsx b/apps/web/ee/components/issues/bulk-operations/modals/bulk-archive-modal.tsx index 9d5826cdc2..b5020e5221 100644 --- a/apps/web/ee/components/issues/bulk-operations/modals/bulk-archive-modal.tsx +++ b/apps/web/ee/components/issues/bulk-operations/modals/bulk-archive-modal.tsx @@ -18,7 +18,7 @@ type Props = { workspaceSlug: string; }; -export const BulkArchiveConfirmationModal: React.FC = observer((props) => { +export const BulkArchiveConfirmationModal = observer(function BulkArchiveConfirmationModal(props: Props) { const { handleClose, isOpen, issueIds, onSubmit, projectId, workspaceSlug } = props; // states const [isArchiving, setIsDeleting] = useState(false); diff --git a/apps/web/ee/components/issues/bulk-operations/modals/bulk-delete-modal.tsx b/apps/web/ee/components/issues/bulk-operations/modals/bulk-delete-modal.tsx index 849a39e5fe..6736794940 100644 --- a/apps/web/ee/components/issues/bulk-operations/modals/bulk-delete-modal.tsx +++ b/apps/web/ee/components/issues/bulk-operations/modals/bulk-delete-modal.tsx @@ -16,7 +16,7 @@ type Props = { workspaceSlug: string; }; -export const BulkDeleteConfirmationModal: React.FC = observer((props) => { +export const BulkDeleteConfirmationModal = observer(function BulkDeleteConfirmationModal(props: Props) { const { handleClose, isOpen, issueIds, onSubmit, projectId, workspaceSlug } = props; // states const [isDeleting, setIsDeleting] = useState(false); diff --git a/apps/web/ee/components/issues/bulk-operations/modals/bulk-subscribe-modal.tsx b/apps/web/ee/components/issues/bulk-operations/modals/bulk-subscribe-modal.tsx index 9c7d731867..7c8d1ce745 100644 --- a/apps/web/ee/components/issues/bulk-operations/modals/bulk-subscribe-modal.tsx +++ b/apps/web/ee/components/issues/bulk-operations/modals/bulk-subscribe-modal.tsx @@ -20,7 +20,7 @@ type Props = { workspaceSlug: string; }; -export const BulkSubscribeConfirmationModal: React.FC = observer((props) => { +export const BulkSubscribeConfirmationModal = observer(function BulkSubscribeConfirmationModal(props: Props) { const { handleClose, isOpen, issueIds, onSubmit, projectId, workspaceSlug } = props; // states const [isArchiving, setIsDeleting] = useState(false); diff --git a/apps/web/ee/components/issues/bulk-operations/properties.tsx b/apps/web/ee/components/issues/bulk-operations/properties.tsx index a5a599fb04..353904495d 100644 --- a/apps/web/ee/components/issues/bulk-operations/properties.tsx +++ b/apps/web/ee/components/issues/bulk-operations/properties.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -53,7 +51,7 @@ const defaultValues: TBulkIssueProperties = { type_id: null, }; -export const IssueBulkOperationsProperties: React.FC = observer((props) => { +export const IssueBulkOperationsProperties = observer(function IssueBulkOperationsProperties(props: Props) { const { snapshot } = props; // router const { workspaceSlug, projectId } = useParams(); @@ -269,7 +267,7 @@ export const IssueBulkOperationsProperties: React.FC = observer((props) = control={control} render={({ field: { onChange, value } }) => ( = observer((props) = control={control} render={({ field: { onChange, value } }) => ( = observer((props) => { +export const IssueBulkOperationsRoot = observer(function IssueBulkOperationsRoot(props: Props) { const { className, selectionHelpers } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/issues/conversion-toast-action-items.tsx b/apps/web/ee/components/issues/conversion-toast-action-items.tsx index fc22c7ac77..6e06ec35ad 100644 --- a/apps/web/ee/components/issues/conversion-toast-action-items.tsx +++ b/apps/web/ee/components/issues/conversion-toast-action-items.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useState } from "react"; import { observer } from "mobx-react"; @@ -14,7 +13,9 @@ type TConversionToastActionItems = { workItemId: string | undefined; }; -export const ConversionToastActionItems: FC = observer((props) => { +export const ConversionToastActionItems = observer(function ConversionToastActionItems( + props: TConversionToastActionItems +) { const { workspaceSlug, workItemId } = props; // state const [copied, setCopied] = useState(false); diff --git a/apps/web/ee/components/issues/filters/applied-filters/issue-types.tsx b/apps/web/ee/components/issues/filters/applied-filters/issue-types.tsx index ea261a568e..e510f9beeb 100644 --- a/apps/web/ee/components/issues/filters/applied-filters/issue-types.tsx +++ b/apps/web/ee/components/issues/filters/applied-filters/issue-types.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; import { CloseIcon } from "@plane/propel/icons"; @@ -14,7 +12,7 @@ type Props = { editable: boolean | undefined; }; -export const AppliedIssueTypeFilters: React.FC = observer((props) => { +export const AppliedIssueTypeFilters = observer(function AppliedIssueTypeFilters(props: Props) { const { handleRemove, values, editable } = props; // router const { workspaceSlug, projectId } = useParams(); diff --git a/apps/web/ee/components/issues/filters/issue-types.tsx b/apps/web/ee/components/issues/filters/issue-types.tsx index ebfb32113c..7edca1f16e 100644 --- a/apps/web/ee/components/issues/filters/issue-types.tsx +++ b/apps/web/ee/components/issues/filters/issue-types.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { searchQuery: string; }; -export const FilterIssueTypes: React.FC = observer((props) => { +export const FilterIssueTypes = observer(function FilterIssueTypes(props: Props) { const { appliedFilters, handleUpdate, searchQuery } = props; // states const [itemsToRender, setItemsToRender] = useState(5); diff --git a/apps/web/ee/components/issues/filters/team-project.tsx b/apps/web/ee/components/issues/filters/team-project.tsx index 638c5ca8fb..439063968b 100644 --- a/apps/web/ee/components/issues/filters/team-project.tsx +++ b/apps/web/ee/components/issues/filters/team-project.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo, useState } from "react"; import { sortBy } from "lodash-es"; import { observer } from "mobx-react"; @@ -19,7 +17,7 @@ type Props = { searchQuery: string; }; -export const FilterTeamProjects: React.FC = observer((props) => { +export const FilterTeamProjects = observer(function FilterTeamProjects(props: Props) { const { appliedFilters, handleUpdate, searchQuery } = props; // states const [itemsToRender, setItemsToRender] = useState(5); diff --git a/apps/web/ee/components/issues/header.tsx b/apps/web/ee/components/issues/header.tsx index 565614870c..e45a38ad27 100644 --- a/apps/web/ee/components/issues/header.tsx +++ b/apps/web/ee/components/issues/header.tsx @@ -3,7 +3,7 @@ import { IssuesHeader as CeIssueHeader } from "@/ce/components/issues/header"; import { WithFeatureFlagHOC } from "../feature-flags"; import { AdvancedIssuesHeader } from "./advanced-header"; -export const IssuesHeader = () => { +export function IssuesHeader() { const { workspaceSlug } = useParams(); return ( // Add CE component for fallback @@ -11,4 +11,4 @@ export const IssuesHeader = () => { ); -}; +} diff --git a/apps/web/ee/components/issues/issue-detail-widgets/action-buttons.tsx b/apps/web/ee/components/issues/issue-detail-widgets/action-buttons.tsx index ba188e4ead..800d00da6d 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/action-buttons.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/action-buttons.tsx @@ -7,7 +7,7 @@ import { IssueDetailWidgetButton } from "@/components/issues/issue-detail-widget import { WithFeatureFlagHOC } from "@/plane-web/components/feature-flags"; import { PagesActionButton } from "./pages"; -export const WorkItemAdditionalWidgetActionButtons: FC = (props) => { +export function WorkItemAdditionalWidgetActionButtons(props: TWorkItemAdditionalWidgetActionButtonsProps) { const { workspaceSlug, workItemId, disabled, issueServiceType, hideWidgets } = props; const { t } = useTranslation(); return ( @@ -30,4 +30,4 @@ export const WorkItemAdditionalWidgetActionButtons: FC ); -}; +} diff --git a/apps/web/ee/components/issues/issue-detail-widgets/collapsibles.tsx b/apps/web/ee/components/issues/issue-detail-widgets/collapsibles.tsx index 6576248d72..a2f78c93fe 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/collapsibles.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/collapsibles.tsx @@ -13,36 +13,36 @@ import { useCustomers } from "@/plane-web/hooks/store"; // local imports import { PagesCollapsible } from "./pages"; -export const WorkItemAdditionalWidgetCollapsibles: FC = observer( - (props) => { - const { disabled, workspaceSlug, workItemId, hideWidgets, issueServiceType } = props; - // store hooks - const { - issue: { getIssueById }, - } = useIssueDetail(issueServiceType); - const { isCustomersFeatureEnabled } = useCustomers(); +export const WorkItemAdditionalWidgetCollapsibles = observer(function WorkItemAdditionalWidgetCollapsibles( + props: TWorkItemAdditionalWidgetCollapsiblesProps +) { + const { disabled, workspaceSlug, workItemId, hideWidgets, issueServiceType } = props; + // store hooks + const { + issue: { getIssueById }, + } = useIssueDetail(issueServiceType); + const { isCustomersFeatureEnabled } = useCustomers(); - // derived values - const issue = getIssueById(workItemId); - const shouldRenderCustomerRequest = Boolean(issue?.customer_request_ids?.length) && !issue?.is_epic; - const shouldRenderPages = !hideWidgets?.includes("pages"); - return ( - <> - {shouldRenderCustomerRequest && isCustomersFeatureEnabled && ( - + // derived values + const issue = getIssueById(workItemId); + const shouldRenderCustomerRequest = Boolean(issue?.customer_request_ids?.length) && !issue?.is_epic; + const shouldRenderPages = !hideWidgets?.includes("pages"); + return ( + <> + {shouldRenderCustomerRequest && isCustomersFeatureEnabled && ( + + )} + }> + {shouldRenderPages && ( + )} - }> - {shouldRenderPages && ( - - )} - - - ); - } -); + + + ); +}); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/content.tsx b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/content.tsx index 6687f00ba1..8b9e6de2f9 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/content.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/content.tsx @@ -13,7 +13,7 @@ type TProps = { isTabs?: boolean; }; -export const WorkItemRequestCollapsibleContent: FC = observer((props) => { +export const WorkItemRequestCollapsibleContent = observer(function WorkItemRequestCollapsibleContent(props: TProps) { const { workspaceSlug, workItemId, disabled, isTabs = false } = props; const { diff --git a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/form.tsx b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/form.tsx index 6448cbf55c..b0d6163b6d 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/form.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/form.tsx @@ -46,7 +46,7 @@ const defaultValues = { // services const workspaceService = new WorkspaceService(); -export const WorkItemRequestForm: FC = observer((props) => { +export const WorkItemRequestForm = observer(function WorkItemRequestForm(props: TProps) { const { isOpen, handleClose, workspaceSlug, data, workItemId } = props; // states const [isSubmitting, setSubmitting] = useState(false); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/quick-action-button.tsx b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/quick-action-button.tsx index 38c1f4541e..7b5fcf6444 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/quick-action-button.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/quick-action-button.tsx @@ -11,7 +11,7 @@ type TProps = { disabled: boolean; }; -export const CustomerRequestActionButton: FC = observer((props) => { +export const CustomerRequestActionButton = observer(function CustomerRequestActionButton(props: TProps) { const { disabled, workItemId } = props; const { createUpdateRequestModalId, toggleCreateUpdateRequestModal } = useCustomers(); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/request-list-item.tsx b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/request-list-item.tsx index a76a74e8c0..3b306ed5a4 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/request-list-item.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/request-list-item.tsx @@ -26,7 +26,7 @@ type TProps = { workItemId: string; }; -export const WorkItemRequestListItem: FC = observer((props) => { +export const WorkItemRequestListItem = observer(function WorkItemRequestListItem(props: TProps) { const { requestId, workspaceSlug, isEditable = false, workItemId } = props; // states const [link, setLink] = useState(); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/root.tsx b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/root.tsx index bc71c6be6b..27d7969667 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/root.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/root.tsx @@ -16,7 +16,7 @@ type TProps = { disabled: boolean; }; -export const CustomerRequestsCollapsible: FC = observer((props) => { +export const CustomerRequestsCollapsible = observer(function CustomerRequestsCollapsible(props: TProps) { const { workspaceSlug, workItemId, disabled } = props; // store hooks const { openWidgets, toggleOpenWidget } = useIssueDetail(); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/title.tsx b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/title.tsx index 352bd1d0ac..fd3986c12e 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/title.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/customer-requests/title.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -19,7 +18,7 @@ type Props = { issueServiceType?: TIssueServiceType; }; -export const CustomerRequestsCollapsibleTitle: FC = observer((props) => { +export const CustomerRequestsCollapsibleTitle = observer(function CustomerRequestsCollapsibleTitle(props: Props) { const { isOpen, workspaceSlug, workItemId, disabled, issueServiceType = EIssueServiceType.ISSUES } = props; const { t } = useTranslation(); // store hooks diff --git a/apps/web/ee/components/issues/issue-detail-widgets/modals.tsx b/apps/web/ee/components/issues/issue-detail-widgets/modals.tsx index 413f6bc753..4039d17018 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/modals.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/modals.tsx @@ -8,7 +8,9 @@ import { useIssueDetail } from "@/hooks/store/use-issue-detail"; // local imports import { PagesMultiSelectModal } from "./pages/multi-select-modal"; -export const WorkItemAdditionalWidgetModals: FC = observer((props) => { +export const WorkItemAdditionalWidgetModals = observer(function WorkItemAdditionalWidgetModals( + props: TWorkItemAdditionalWidgetModalsProps +) { const { issueServiceType, workItemId, workspaceSlug } = props; const { issue: { getIssueById }, diff --git a/apps/web/ee/components/issues/issue-detail-widgets/pages/block.tsx b/apps/web/ee/components/issues/issue-detail-widgets/pages/block.tsx index fe4a622f4e..0c385033e0 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/pages/block.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/pages/block.tsx @@ -23,7 +23,7 @@ type TProps = { page: TIssuePage; }; -export const PagesCollapsibleContentBlock: FC = observer((props) => { +export const PagesCollapsibleContentBlock = observer(function PagesCollapsibleContentBlock(props: TProps) { const { page, workspaceSlug, projectId, workItemId, issueServiceType } = props; // hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/pages/content.tsx b/apps/web/ee/components/issues/issue-detail-widgets/pages/content.tsx index ca2b87ef81..51b088fe71 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/pages/content.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/pages/content.tsx @@ -14,7 +14,7 @@ type TProps = { issueServiceType: TIssueServiceType; }; -export const PagesCollapsibleContent: FC = observer((props) => { +export const PagesCollapsibleContent = observer(function PagesCollapsibleContent(props: TProps) { const { workspaceSlug, workItemId, projectId, isTabs = false, data, issueServiceType } = props; return ( diff --git a/apps/web/ee/components/issues/issue-detail-widgets/pages/multi-select-modal.tsx b/apps/web/ee/components/issues/issue-detail-widgets/pages/multi-select-modal.tsx index 6faa103488..5d0a377298 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/pages/multi-select-modal.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/pages/multi-select-modal.tsx @@ -1,6 +1,4 @@ // PagesMultiSelectModal rewritten to follow ExistingIssuesListModal pattern -"use client"; - import React, { useCallback, useEffect, useState } from "react"; import { debounce } from "lodash-es"; import { observer } from "mobx-react"; @@ -26,240 +24,234 @@ import { WorkspacePageService } from "@/plane-web/services/page"; const service = new WorkspacePageService(); -const PagesMultiSelectModal = observer( - (props: { - isOpen: boolean; - selectedPages: TIssuePage[]; - workItemId: string; - projectId: string | null | undefined; - workspaceSlug: string; - issueServiceType: TIssueServiceType; - onClose: () => void; - }) => { - const { isOpen, onClose, workItemId, projectId, workspaceSlug, issueServiceType } = props; - // plane hooks - const { t } = useTranslation(); - const { - pages: { updateIssuePages, getPageById, getPagesByIssueId }, - } = useIssueDetail(issueServiceType); - const { isMobile } = usePlatformOS(); - const { baseTabIndex } = getTabIndex(undefined, isMobile); - // state - const [searchTerm, setSearchTerm] = useState(""); - const [filteredPages, setFilteredPages] = useState([]); - const [selectedPages, setSelectedPages] = useState([]); - const [isSubmitting, setIsSubmitting] = useState(false); - const [showWikiPages, setShowWikiPages] = useState(false); - const [isLoading, setIsLoading] = useState(true); +const PagesMultiSelectModal = observer(function PagesMultiSelectModal(props: { + isOpen: boolean; + selectedPages: TIssuePage[]; + workItemId: string; + projectId: string | null | undefined; + workspaceSlug: string; + issueServiceType: TIssueServiceType; + onClose: () => void; +}) { + const { isOpen, onClose, workItemId, projectId, workspaceSlug, issueServiceType } = props; + // plane hooks + const { t } = useTranslation(); + const { + pages: { updateIssuePages, getPageById, getPagesByIssueId }, + } = useIssueDetail(issueServiceType); + const { isMobile } = usePlatformOS(); + const { baseTabIndex } = getTabIndex(undefined, isMobile); + // state + const [searchTerm, setSearchTerm] = useState(""); + const [filteredPages, setFilteredPages] = useState([]); + const [selectedPages, setSelectedPages] = useState([]); + const [isSubmitting, setIsSubmitting] = useState(false); + const [showWikiPages, setShowWikiPages] = useState(false); + const [isLoading, setIsLoading] = useState(true); - const issuePages = getPagesByIssueId(workItemId) - .map((id) => getPageById(id)) - .filter((page) => page !== undefined); + const issuePages = getPagesByIssueId(workItemId) + .map((id) => getPageById(id)) + .filter((page) => page !== undefined); - const handleClose = () => { - onClose(); - setSearchTerm(""); - setFilteredPages([]); - setShowWikiPages(false); - }; + const handleClose = () => { + onClose(); + setSearchTerm(""); + setFilteredPages([]); + setShowWikiPages(false); + }; - const onSubmit = async () => { - setIsSubmitting(true); - await updateIssuePages( - workspaceSlug, - projectId ?? "", - workItemId, - selectedPages.map((p) => p.id) - ) - .then(() => { - setToast({ - type: TOAST_TYPE.SUCCESS, - title: t("issue.pages.toasts.link.success.title"), - message: t("issue.pages.toasts.link.success.message"), - }); - handleClose(); - }) - .catch(() => { - setToast({ - type: TOAST_TYPE.ERROR, - title: t("issue.pages.toasts.link.error.title"), - message: t("issue.pages.toasts.link.error.message"), - }); - }) - .finally(() => setIsSubmitting(false)); - }; - - const handleSearch = async (currentSearchTerm: string) => { - if (!isOpen || !workspaceSlug) return; - - setIsLoading(true); - try { - const pages = await service.searchPages(workspaceSlug, projectId ?? "", { - is_global: showWikiPages, - search: currentSearchTerm, + const onSubmit = async () => { + setIsSubmitting(true); + await updateIssuePages( + workspaceSlug, + projectId ?? "", + workItemId, + selectedPages.map((p) => p.id) + ) + .then(() => { + setToast({ + type: TOAST_TYPE.SUCCESS, + title: t("issue.pages.toasts.link.success.title"), + message: t("issue.pages.toasts.link.success.message"), }); - setFilteredPages(pages); - } catch (error) { - console.error("Error searching pages", error); - } finally { - setIsLoading(false); - } - }; - // Debounce the search function - const debouncedSearch = useCallback( - debounce((currentSearchTerm: string) => { - handleSearch(currentSearchTerm); - }, 500), // 500ms debounce delay - [isOpen, workspaceSlug, projectId, showWikiPages] // Dependencies for useCallback - ); + handleClose(); + }) + .catch(() => { + setToast({ + type: TOAST_TYPE.ERROR, + title: t("issue.pages.toasts.link.error.title"), + message: t("issue.pages.toasts.link.error.message"), + }); + }) + .finally(() => setIsSubmitting(false)); + }; - useEffect(() => { - debouncedSearch(searchTerm); - return () => debouncedSearch.cancel(); - }, [searchTerm, isOpen, showWikiPages, debouncedSearch]); + const handleSearch = async (currentSearchTerm: string) => { + if (!isOpen || !workspaceSlug) return; - useEffect(() => { - if (isOpen) setIsLoading(true); - setSelectedPages(issuePages); - }, [isOpen]); + setIsLoading(true); + try { + const pages = await service.searchPages(workspaceSlug, projectId ?? "", { + is_global: showWikiPages, + search: currentSearchTerm, + }); + setFilteredPages(pages); + } catch (error) { + console.error("Error searching pages", error); + } finally { + setIsLoading(false); + } + }; + // Debounce the search function + const debouncedSearch = useCallback( + debounce((currentSearchTerm: string) => { + handleSearch(currentSearchTerm); + }, 500), // 500ms debounce delay + [isOpen, workspaceSlug, projectId, showWikiPages] // Dependencies for useCallback + ); - return ( - - { - if (selectedPages.some((p) => p.id === val.id)) { - setSelectedPages((prev) => prev.filter((p) => p.id !== val.id)); - } else { - setSelectedPages((prev) => [...prev, val]); - } - }} - > -
    -
    -

    Link pages to

    - -
    -
    -
    -
    - {t("issue.pages.show_wiki_pages")} - setShowWikiPages(!showWikiPages)} /> -
    + useEffect(() => { + debouncedSearch(searchTerm); + return () => debouncedSearch.cancel(); + }, [searchTerm, isOpen, showWikiPages, debouncedSearch]); + + useEffect(() => { + if (isOpen) setIsLoading(true); + setSelectedPages(issuePages); + }, [isOpen]); + + return ( + + { + if (selectedPages.some((p) => p.id === val.id)) { + setSelectedPages((prev) => prev.filter((p) => p.id !== val.id)); + } else { + setSelectedPages((prev) => [...prev, val]); + } + }} + > +
    +
    +

    Link pages to

    +
    +
    +
    +
    + {t("issue.pages.show_wiki_pages")} + setShowWikiPages(!showWikiPages)} /> +
    +
    - {selectedPages.length > 0 && ( -
    - {selectedPages.map((page) => ( -
    setSelectedPages((prev) => prev.filter((p) => p.id !== page.id))} - > -
    - {page?.logo_props && page.logo_props?.in_use ? ( - - ) : ( - - )} -
    -

    - {getPageName(page?.name ?? "")} -

    - + {selectedPages.length > 0 && ( +
    + {selectedPages.map((page) => ( +
    setSelectedPages((prev) => prev.filter((p) => p.id !== page.id))} + > +
    + {page?.logo_props && page.logo_props?.in_use ? ( + + ) : ( + + )}
    - ))} +

    + {getPageName(page?.name ?? "")} +

    + +
    + ))} +
    + )} + + + {isLoading && filteredPages.length === 0 ? ( +
    + + + + +
    + ) : filteredPages.length > 0 ? ( + filteredPages.map((page) => { + const selected = selectedPages.some((p) => p.id === page.id); + return ( + + `group flex w-full cursor-pointer 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" : ""}` + } + > +
    + +
    + {page.logo_props && page.logo_props?.in_use ? ( + + ) : ( + + )} +
    + {getPageName(page.name)} +
    + {page.access != null && ( +
    + {page.access === EPageAccess.PUBLIC ? : } +
    + )} +     + ); + }) + ) : ( +
    +

    No pages found

    )} - - - {isLoading && filteredPages.length === 0 ? ( -
    - - - - -
    - ) : filteredPages.length > 0 ? ( - filteredPages.map((page) => { - const selected = selectedPages.some((p) => p.id === page.id); - return ( - - `group flex w-full cursor-pointer 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" : ""}` - } - > -
    - -
    - {page.logo_props && page.logo_props?.in_use ? ( - - ) : ( - - )} -
    - {getPageName(page.name)} -
    - {page.access != null && ( -
    - {page.access === EPageAccess.PUBLIC ? ( - - ) : ( - - )} -
    - )} -     - ); - }) - ) : ( -
    -

    No pages found

    -
    - )} -     - -
    - - -
    - - ); - } -); +     + +
    + + +
    + + ); +}); export { PagesMultiSelectModal }; diff --git a/apps/web/ee/components/issues/issue-detail-widgets/pages/quick-action-button.tsx b/apps/web/ee/components/issues/issue-detail-widgets/pages/quick-action-button.tsx index 7aeb5af193..d6e8d6fa10 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/pages/quick-action-button.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/pages/quick-action-button.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -15,7 +14,7 @@ type Props = { issueServiceType: TIssueServiceType; }; -export const PagesActionButton: FC = observer((props) => { +export const PagesActionButton = observer(function PagesActionButton(props: Props) { const { customButton, disabled = false, workItemId, issueServiceType } = props; // store hooks const { togglePagesModal } = useIssueDetail(issueServiceType); diff --git a/apps/web/ee/components/issues/issue-detail-widgets/pages/root.tsx b/apps/web/ee/components/issues/issue-detail-widgets/pages/root.tsx index ac9b967c86..e3d311955b 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/pages/root.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/pages/root.tsx @@ -15,7 +15,7 @@ type TProps = { issueServiceType: TIssueServiceType; }; -export const PagesCollapsible: FC = observer((props) => { +export const PagesCollapsible = observer(function PagesCollapsible(props: TProps) { const { workspaceSlug, workItemId, disabled, projectId, issueServiceType } = props; // store hooks const { diff --git a/apps/web/ee/components/issues/issue-detail-widgets/pages/title.tsx b/apps/web/ee/components/issues/issue-detail-widgets/pages/title.tsx index 7c2646132f..e9677272c6 100644 --- a/apps/web/ee/components/issues/issue-detail-widgets/pages/title.tsx +++ b/apps/web/ee/components/issues/issue-detail-widgets/pages/title.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -17,7 +16,7 @@ type Props = { issueServiceType: TIssueServiceType; }; -export const PagesCollapsibleTitle: FC = observer((props) => { +export const PagesCollapsibleTitle = observer(function PagesCollapsibleTitle(props: Props) { const { isOpen, workItemId, disabled, count, issueServiceType } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/issues/issue-details/additional-activity-root.tsx b/apps/web/ee/components/issues/issue-details/additional-activity-root.tsx index 9b76b2c474..c4695f3cae 100644 --- a/apps/web/ee/components/issues/issue-details/additional-activity-root.tsx +++ b/apps/web/ee/components/issues/issue-details/additional-activity-root.tsx @@ -9,7 +9,7 @@ import { EpicActivity } from "./epic-activity-root"; import { IssueEstimateTimeActivity } from "./estimate-time-activity"; import { MilestoneActivity } from "./milestone-activity-root"; -export const AdditionalActivityRoot: FC = (props) => { +export function AdditionalActivityRoot(props: TAdditionalActivityRoot) { const { field, activityId, ends } = props; switch (field) { @@ -28,4 +28,4 @@ export const AdditionalActivityRoot: FC = (props) => { default: return <>; } -}; +} diff --git a/apps/web/ee/components/issues/issue-details/additional-properties.tsx b/apps/web/ee/components/issues/issue-details/additional-properties.tsx index 63e9055dca..525c6eba9e 100644 --- a/apps/web/ee/components/issues/issue-details/additional-properties.tsx +++ b/apps/web/ee/components/issues/issue-details/additional-properties.tsx @@ -10,7 +10,9 @@ import { WorkItemSideBarMilestoneItem } from "@/plane-web/components/issues/issu import { useCustomers } from "@/plane-web/hooks/store"; import { useMilestones } from "@/plane-web/hooks/store/use-milestone"; -export const WorkItemAdditionalSidebarProperties: FC = observer((props) => { +export const WorkItemAdditionalSidebarProperties = observer(function WorkItemAdditionalSidebarProperties( + props: TWorkItemAdditionalSidebarProperties +) { const { workItemId, projectId, workItemTypeId, workspaceSlug, isEditable, isPeekView = false } = props; const { isCustomersFeatureEnabled } = useCustomers(); const { isMilestonesEnabled } = useMilestones(); diff --git a/apps/web/ee/components/issues/issue-details/convert.tsx b/apps/web/ee/components/issues/issue-details/convert.tsx index 7860cb6110..f4fb852a67 100644 --- a/apps/web/ee/components/issues/issue-details/convert.tsx +++ b/apps/web/ee/components/issues/issue-details/convert.tsx @@ -12,7 +12,7 @@ type TWorkItemConvertActivity = { ends: "top" | "bottom" | undefined; }; -export const WorkItemConvertActivity: FC = observer((props) => { +export const WorkItemConvertActivity = observer(function WorkItemConvertActivity(props: TWorkItemConvertActivity) { const { activityId, ends } = props; // hooks const { diff --git a/apps/web/ee/components/issues/issue-details/customer-activity.tsx b/apps/web/ee/components/issues/issue-details/customer-activity.tsx index 11870db89a..9ba63e876c 100644 --- a/apps/web/ee/components/issues/issue-details/customer-activity.tsx +++ b/apps/web/ee/components/issues/issue-details/customer-activity.tsx @@ -8,7 +8,7 @@ type TCustomerActivityProps = { ends: "top" | "bottom" | undefined; }; -export const CustomerActivity: FC = (props) => { +export function CustomerActivity(props: TCustomerActivityProps) { const { activityId, ends } = props; // hooks const { @@ -53,4 +53,4 @@ export const CustomerActivity: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/customer-request-activity.tsx b/apps/web/ee/components/issues/issue-details/customer-request-activity.tsx index 1ca1bc3bab..9ea9e88561 100644 --- a/apps/web/ee/components/issues/issue-details/customer-request-activity.tsx +++ b/apps/web/ee/components/issues/issue-details/customer-request-activity.tsx @@ -8,7 +8,7 @@ type TCustomerRequestActivityProps = { ends: "top" | "bottom" | undefined; }; -export const CustomerRequestActivity: FC = (props) => { +export function CustomerRequestActivity(props: TCustomerRequestActivityProps) { const { activityId, ends } = props; // hooks const { @@ -53,4 +53,4 @@ export const CustomerRequestActivity: FC = (props ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/epic-activity-root.tsx b/apps/web/ee/components/issues/issue-details/epic-activity-root.tsx index 3c11bd24a0..f853508cc2 100644 --- a/apps/web/ee/components/issues/issue-details/epic-activity-root.tsx +++ b/apps/web/ee/components/issues/issue-details/epic-activity-root.tsx @@ -14,7 +14,7 @@ type TEpicActivityProps = { const commonIconClassName = "h-3 w-3 flex-shrink-0 text-custom-text-300"; -export const EpicActivity: FC = observer((props) => { +export const EpicActivity = observer(function EpicActivity(props: TEpicActivityProps) { const { activityId, ends } = props; // hooks const { diff --git a/apps/web/ee/components/issues/issue-details/estimate-time-activity.tsx b/apps/web/ee/components/issues/issue-details/estimate-time-activity.tsx index 3b3b744e94..67083cab76 100644 --- a/apps/web/ee/components/issues/issue-details/estimate-time-activity.tsx +++ b/apps/web/ee/components/issues/issue-details/estimate-time-activity.tsx @@ -12,7 +12,9 @@ import { useIssueDetail } from "@/hooks/store/use-issue-detail"; type TIssueEstimateTimeActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined }; -export const IssueEstimateTimeActivity: FC = observer((props) => { +export const IssueEstimateTimeActivity = observer(function IssueEstimateTimeActivity( + props: TIssueEstimateTimeActivity +) { const { activityId, showIssue = true, ends } = props; // hooks const { diff --git a/apps/web/ee/components/issues/issue-details/issue-creator.tsx b/apps/web/ee/components/issues/issue-details/issue-creator.tsx index 61f6516557..67fa07f56a 100644 --- a/apps/web/ee/components/issues/issue-details/issue-creator.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-creator.tsx @@ -8,7 +8,7 @@ type TIssueUser = { customUserName?: string; }; -export const IssueCreatorDisplay: FC = (props) => { +export function IssueCreatorDisplay(props: TIssueUser) { const { activityId, customUserName } = props; // hooks const { @@ -42,4 +42,4 @@ export const IssueCreatorDisplay: FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/issue-identifier.tsx b/apps/web/ee/components/issues/issue-details/issue-identifier.tsx index 07f695934e..1a0c60c3b0 100644 --- a/apps/web/ee/components/issues/issue-details/issue-identifier.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-identifier.tsx @@ -25,7 +25,7 @@ type TIdentifierTextProps = { textContainerClassName?: string; }; -export const IdentifierText: React.FC = (props) => { +export function IdentifierText(props: TIdentifierTextProps) { const { identifier, enableClickToCopyIdentifier = false, textContainerClassName } = props; // handlers const handleCopyIssueIdentifier = () => { @@ -55,7 +55,7 @@ export const IdentifierText: React.FC = (props) => { ); -}; +} type TIssueTypeIdentifier = { getWorkItemTypeById?: (workItemTypeId: string) => IIssueType | undefined; @@ -63,7 +63,7 @@ type TIssueTypeIdentifier = { size?: "xs" | "sm" | "md" | "lg"; }; -export const IssueTypeIdentifier: FC = observer((props) => { +export const IssueTypeIdentifier = observer(function IssueTypeIdentifier(props: TIssueTypeIdentifier) { const { getWorkItemTypeById, issueTypeId, size = "sm" } = props; // derived values const workItemTypeFromStore = useIssueType(issueTypeId); @@ -88,7 +88,7 @@ type TIssueIdentifierPropsExtended = TIssueIdentifierProps & { isWorkItemTypeEntityEnabled?: (workspaceSlug: string, projectId: string, entityType: EWorkItemTypeEntity) => boolean; }; -export const IssueIdentifier: React.FC = observer((props) => { +export const IssueIdentifier = observer(function IssueIdentifier(props: TIssueIdentifierPropsExtended) { const { displayProperties, enableClickToCopyIdentifier = false, diff --git a/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/activity-block.tsx b/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/activity-block.tsx index 78de119ea0..329be9041a 100644 --- a/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/activity-block.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/activity-block.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, ReactNode } from "react"; import { useEffect, useRef } from "react"; // plane imports @@ -21,7 +19,7 @@ type TIssueActivityBlockComponent = { children: ReactNode; }; -export const IssueActivityBlockComponent: FC = (props) => { +export function IssueActivityBlockComponent(props: TIssueActivityBlockComponent) { const { activityId, propertyId, ends, children } = props; const activityBlockRef = useRef(null); // hooks @@ -80,4 +78,4 @@ export const IssueActivityBlockComponent: FC = (pr
    ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/issue-user.tsx b/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/issue-user.tsx index 078a98679b..115571f905 100644 --- a/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/issue-user.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-properties-activity/common/issue-user.tsx @@ -9,7 +9,7 @@ type TIssueUser = { activityId: string; }; -export const IssueUser: FC = (props) => { +export function IssueUser(props: TIssueUser) { const { activityId } = props; // hooks const { getPropertyActivityById } = useIssuePropertiesActivity(); @@ -29,4 +29,4 @@ export const IssueUser: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/issue-properties-activity/root.tsx b/apps/web/ee/components/issues/issue-details/issue-properties-activity/root.tsx index dcde2a9870..a422458692 100644 --- a/apps/web/ee/components/issues/issue-details/issue-properties-activity/root.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-properties-activity/root.tsx @@ -18,7 +18,9 @@ export type TIssueAdditionalPropertiesActivityItem = { customPropertyId: string; }; -export const IssueAdditionalPropertiesActivity: FC = observer((props) => { +export const IssueAdditionalPropertiesActivity = observer(function IssueAdditionalPropertiesActivity( + props: TIssueAdditionalPropertiesActivity +) { const { activityId, ends } = props; // hooks and derived values const { diff --git a/apps/web/ee/components/issues/issue-details/issue-type-activity.tsx b/apps/web/ee/components/issues/issue-details/issue-type-activity.tsx index 8fb7403e08..11fd90fde3 100644 --- a/apps/web/ee/components/issues/issue-details/issue-type-activity.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-type-activity.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -26,7 +24,7 @@ type TIssueTypeDetail = { className?: string; }; -const IssueTypeDetail: FC = observer((props) => { +const IssueTypeDetail = observer(function IssueTypeDetail(props: TIssueTypeDetail) { const { issueTypeId, className = "" } = props; // hooks const { getIssueTypeById } = useIssueTypes(); @@ -41,7 +39,7 @@ const IssueTypeDetail: FC = observer((props) => { ); }); -export const IssueTypeActivity: FC = observer((props) => { +export const IssueTypeActivity = observer(function IssueTypeActivity(props: TIssueTypeActivity) { const { activityId, showIssue = false, ends } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/issues/issue-details/issue-type-switcher.tsx b/apps/web/ee/components/issues/issue-details/issue-type-switcher.tsx index e17bd60080..9854d1636e 100644 --- a/apps/web/ee/components/issues/issue-details/issue-type-switcher.tsx +++ b/apps/web/ee/components/issues/issue-details/issue-type-switcher.tsx @@ -16,7 +16,7 @@ import { useIssueDetail } from "@/hooks/store/use-issue-detail"; import { IssueIdentifier } from "@/plane-web/components/issues/issue-details/issue-identifier"; import { useIssueTypes } from "@/plane-web/hooks/store"; -export const IssueTypeSwitcher: React.FC = observer((props) => { +export const IssueTypeSwitcher = observer(function IssueTypeSwitcher(props: TIssueTypeSwitcherProps) { const { issueId, disabled } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/issues/issue-details/milestone-activity-root.tsx b/apps/web/ee/components/issues/issue-details/milestone-activity-root.tsx index 8ce0b4debb..2216656a62 100644 --- a/apps/web/ee/components/issues/issue-details/milestone-activity-root.tsx +++ b/apps/web/ee/components/issues/issue-details/milestone-activity-root.tsx @@ -8,7 +8,7 @@ type TMilestoneActivityProps = { ends: "top" | "bottom" | undefined; }; -export const MilestoneActivity: FC = (props) => { +export function MilestoneActivity(props: TMilestoneActivityProps) { const { activityId, ends } = props; // hooks const { @@ -76,4 +76,4 @@ export const MilestoneActivity: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/page.tsx b/apps/web/ee/components/issues/issue-details/page.tsx index b25a0cef54..2602410eb4 100644 --- a/apps/web/ee/components/issues/issue-details/page.tsx +++ b/apps/web/ee/components/issues/issue-details/page.tsx @@ -7,7 +7,7 @@ import { useIssueDetail } from "@/hooks/store/use-issue-detail"; export type TIssuePageActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined }; -export const IssuePageActivity: FC = observer((props) => { +export const IssuePageActivity = observer(function IssuePageActivity(props: TIssuePageActivity) { const { activityId, ends } = props; // hooks const { diff --git a/apps/web/ee/components/issues/issue-details/parent-select-root.tsx b/apps/web/ee/components/issues/issue-details/parent-select-root.tsx index 1b9e029ef8..5786311bf1 100644 --- a/apps/web/ee/components/issues/issue-details/parent-select-root.tsx +++ b/apps/web/ee/components/issues/issue-details/parent-select-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useTranslation } from "@plane/i18n"; @@ -22,7 +20,7 @@ type TIssueParentSelect = { workspaceSlug: string; }; -export const IssueParentSelectRoot: React.FC = observer((props) => { +export const IssueParentSelectRoot = observer(function IssueParentSelectRoot(props: TIssueParentSelect) { const { issueId, issueOperations, projectId, workspaceSlug } = props; const { t } = useTranslation(); // store hooks diff --git a/apps/web/ee/components/issues/issue-details/properties.tsx b/apps/web/ee/components/issues/issue-details/properties.tsx index 197a0513ac..1c06d4dfc1 100644 --- a/apps/web/ee/components/issues/issue-details/properties.tsx +++ b/apps/web/ee/components/issues/issue-details/properties.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -21,7 +20,7 @@ type Props = { issueServiceType?: TIssueServiceType; }; -export const WorkItemPropertiesLite: FC = observer((props) => { +export const WorkItemPropertiesLite = observer(function WorkItemPropertiesLite(props: Props) { const { workspaceSlug, workItemId, diff --git a/apps/web/ee/components/issues/issue-details/sidebar/customer-list-item.tsx b/apps/web/ee/components/issues/issue-details/sidebar/customer-list-item.tsx index a161b7e213..1269163a5b 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/customer-list-item.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/customer-list-item.tsx @@ -20,7 +20,7 @@ type TCustomerListItem = { workspaceSlug: string; }; -export const CustomerSidebarListitem: FC = observer((props) => { +export const CustomerSidebarListitem = observer(function CustomerSidebarListitem(props: TCustomerListItem) { const { customerId, isPeekView, workspaceSlug } = props; // refs const [referenceElement, setReferenceElement] = useState(null); diff --git a/apps/web/ee/components/issues/issue-details/sidebar/customer-list-root.tsx b/apps/web/ee/components/issues/issue-details/sidebar/customer-list-root.tsx index f968551fd0..145a19cab0 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/customer-list-root.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/customer-list-root.tsx @@ -13,7 +13,9 @@ type TWorkItemSidebarCustomerList = { isPeekView?: boolean; }; -export const WorkItemSidebarCustomers: FC = observer((props) => { +export const WorkItemSidebarCustomers = observer(function WorkItemSidebarCustomers( + props: TWorkItemSidebarCustomerList +) { const { workItemId, workspaceSlug, isPeekView = false } = props; // hooks diff --git a/apps/web/ee/components/issues/issue-details/sidebar/customer-select.tsx b/apps/web/ee/components/issues/issue-details/sidebar/customer-select.tsx index 172235ad4f..0026c30c5f 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/customer-select.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/customer-select.tsx @@ -21,7 +21,7 @@ type TProps = { compact?: boolean; }; -export const CustomerSelect: FC = observer((props) => { +export const CustomerSelect = observer(function CustomerSelect(props: TProps) { const { workItemId, value, workspaceSlug, compact = false } = props; // hooks const { diff --git a/apps/web/ee/components/issues/issue-details/sidebar/customers-list.tsx b/apps/web/ee/components/issues/issue-details/sidebar/customers-list.tsx index d524bc34ce..cc251d72c9 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/customers-list.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/customers-list.tsx @@ -17,7 +17,7 @@ type TProps = { workItemId: string; }; -export const SidebarCustomersList: FC = observer((props) => { +export const SidebarCustomersList = observer(function SidebarCustomersList(props: TProps) { const { isPeekView, workspaceSlug, workItemId } = props; // hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/issues/issue-details/sidebar/date-alert.tsx b/apps/web/ee/components/issues/issue-details/sidebar/date-alert.tsx index acfb17075e..567a674558 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/date-alert.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/date-alert.tsx @@ -3,7 +3,7 @@ import { Tooltip } from "@plane/propel/tooltip"; import type { TDateAlertProps } from "@/ce/components/issues/issue-details/sidebar.tsx/date-alert"; import { useMilestones } from "@/plane-web/hooks/store/use-milestone"; -export const DateAlert = (props: TDateAlertProps) => { +export function DateAlert(props: TDateAlertProps) { const { date, workItem, projectId } = props; // store hooks @@ -29,4 +29,4 @@ export const DateAlert = (props: TDateAlertProps) => { ); -}; +} diff --git a/apps/web/ee/components/issues/issue-details/sidebar/milestones/milestones-dropdown.tsx b/apps/web/ee/components/issues/issue-details/sidebar/milestones/milestones-dropdown.tsx index c0d9505278..a157ef0954 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/milestones/milestones-dropdown.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/milestones/milestones-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo } from "react"; import { observer } from "mobx-react"; import { Check } from "lucide-react"; @@ -21,7 +19,7 @@ type Props = { readonly?: boolean; }; -export const MilestonesDropdown: React.FC = observer((props) => { +export const MilestonesDropdown = observer(function MilestonesDropdown(props: Props) { const { projectId, value, diff --git a/apps/web/ee/components/issues/issue-details/sidebar/milestones/root.tsx b/apps/web/ee/components/issues/issue-details/sidebar/milestones/root.tsx index 53dd79cf26..62ce9dcfad 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/milestones/root.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/milestones/root.tsx @@ -13,7 +13,9 @@ type TWorkItemSideBarMilestoneItemProps = { isPeekView?: boolean; }; -export const WorkItemSideBarMilestoneItem = observer((props: TWorkItemSideBarMilestoneItemProps) => { +export const WorkItemSideBarMilestoneItem = observer(function WorkItemSideBarMilestoneItem( + props: TWorkItemSideBarMilestoneItemProps +) { const { workspaceSlug, projectId, workItemId, isPeekView } = props; //store hooks diff --git a/apps/web/ee/components/issues/issue-details/sidebar/preview.tsx b/apps/web/ee/components/issues/issue-details/sidebar/preview.tsx index ee9c83ec75..e3bf7ba595 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/preview.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/preview.tsx @@ -18,7 +18,7 @@ type TProps = { styles: { [key: string]: React.CSSProperties }; workspaceSlug: string; }; -export const CustomerPreview: FC = (props) => { +export function CustomerPreview(props: TProps) { const { customer, setPopperElement, styles, workspaceSlug } = props; // hooks const { t } = useTranslation(); @@ -134,16 +134,19 @@ export const CustomerPreview: FC = (props) => {
    ); -}; +} type TPreviewProps = { name: string; children: ReactNode; }; -const PreviewProperty: FC = (props) => ( -
    -
    - {props.name} + +function PreviewProperty(props: TPreviewProps) { + return ( +
    +
    + {props.name} +
    +
    {props.children}
    -
    {props.children}
    -
    -); + ); +} diff --git a/apps/web/ee/components/issues/issue-details/sidebar/transfer-hop-info.tsx b/apps/web/ee/components/issues/issue-details/sidebar/transfer-hop-info.tsx index fab10c9a94..88fe493694 100644 --- a/apps/web/ee/components/issues/issue-details/sidebar/transfer-hop-info.tsx +++ b/apps/web/ee/components/issues/issue-details/sidebar/transfer-hop-info.tsx @@ -10,31 +10,37 @@ import { useCycle } from "@/hooks/store/use-cycle"; // plane web imports import { useFlag } from "@/plane-web/hooks/store"; -const TransferHistoryItem = observer(({ cycleDetails, isLast }: { cycleDetails: ICycle; isLast: boolean }) => ( -
    - {/* Vertical line */} - {!isLast &&
    } - - {/* Dot indicator */} -
    - - {/* Content */} -
    -

    {cycleDetails.name}

    - {cycleDetails.start_date && cycleDetails.end_date && ( -

    - {renderFormattedDate(cycleDetails.start_date)} - {renderFormattedDate(cycleDetails.end_date)} -

    - )} +const TransferHistoryItem = observer(function TransferHistoryItem({ + cycleDetails, + isLast, +}: { + cycleDetails: ICycle; + isLast: boolean; +}) { + return ( +
    + {/* Vertical line */} + {!isLast &&
    } + {/* Dot indicator */} +
    + {/* Content */} +
    +

    {cycleDetails.name}

    + {cycleDetails.start_date && cycleDetails.end_date && ( +

    + {renderFormattedDate(cycleDetails.start_date)} - {renderFormattedDate(cycleDetails.end_date)} +

    + )} +
    -
    -)); + ); +}); -export const TransferHopInfo = ({ workItem }: { workItem: TIssue }) => { +export function TransferHopInfo({ workItem }: { workItem: TIssue }) { // params const { workspaceSlug } = useParams(); // hooks @@ -73,4 +79,4 @@ export const TransferHopInfo = ({ workItem }: { workItem: TIssue }) => {
    ); -}; +} diff --git a/apps/web/ee/components/issues/issue-layouts/additional-properties.tsx b/apps/web/ee/components/issues/issue-layouts/additional-properties.tsx index e4239eb50b..6db4e7a5b0 100644 --- a/apps/web/ee/components/issues/issue-layouts/additional-properties.tsx +++ b/apps/web/ee/components/issues/issue-layouts/additional-properties.tsx @@ -11,7 +11,9 @@ import type { TWorkItemLayoutAdditionalProperties } from "@/ce/components/issues import { WithDisplayPropertiesHOC } from "@/components/issues/issue-layouts/properties/with-display-properties-HOC"; import { useCustomers } from "@/plane-web/hooks/store"; -export const WorkItemLayoutAdditionalProperties: FC = observer((props) => { +export const WorkItemLayoutAdditionalProperties = observer(function WorkItemLayoutAdditionalProperties( + props: TWorkItemLayoutAdditionalProperties +) { const { displayProperties, issue } = props; // i18n const { t } = useTranslation(); diff --git a/apps/web/ee/components/issues/issue-layouts/board/teamspace-view-root.tsx b/apps/web/ee/components/issues/issue-layouts/board/teamspace-view-root.tsx index 1fa16af024..a70739bda2 100644 --- a/apps/web/ee/components/issues/issue-layouts/board/teamspace-view-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/board/teamspace-view-root.tsx @@ -10,7 +10,7 @@ import { ProjectIssueQuickActions } from "@/components/issues/issue-layouts/quic // hooks import { useUserPermissions } from "@/hooks/store/user"; -export const TeamspaceViewBoardLayout: React.FC = observer(() => { +export const TeamspaceViewBoardLayout = observer(function TeamspaceViewBoardLayout() { // router const { workspaceSlug, viewId } = useParams(); // hooks diff --git a/apps/web/ee/components/issues/issue-layouts/calendar-epic-root.tsx b/apps/web/ee/components/issues/issue-layouts/calendar-epic-root.tsx index f00ab9653b..c427624712 100644 --- a/apps/web/ee/components/issues/issue-layouts/calendar-epic-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/calendar-epic-root.tsx @@ -2,6 +2,6 @@ import { observer } from "mobx-react"; import { BaseCalendarRoot } from "@/components/issues/issue-layouts/calendar/base-calendar-root"; import { ProjectEpicQuickActions } from "@/plane-web/components/epics/quick-actions/epic-quick-action"; -export const EpicCalendarLayout: React.FC = observer(() => ( - -)); +export const EpicCalendarLayout = observer(function EpicCalendarLayout() { + return ; +}); diff --git a/apps/web/ee/components/issues/issue-layouts/calendar/teamspace-view-root.tsx b/apps/web/ee/components/issues/issue-layouts/calendar/teamspace-view-root.tsx index d4e756e954..5e3b6f2bda 100644 --- a/apps/web/ee/components/issues/issue-layouts/calendar/teamspace-view-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/calendar/teamspace-view-root.tsx @@ -10,7 +10,7 @@ import { ProjectIssueQuickActions } from "@/components/issues/issue-layouts/quic // hooks import { useUserPermissions } from "@/hooks/store/user"; -export const TeamspaceViewCalendarLayout: React.FC = observer(() => { +export const TeamspaceViewCalendarLayout = observer(function TeamspaceViewCalendarLayout() { // router const { workspaceSlug, viewId } = useParams(); // hooks diff --git a/apps/web/ee/components/issues/issue-layouts/empty-states/team-issues.tsx b/apps/web/ee/components/issues/issue-layouts/empty-states/team-issues.tsx index b416a95e48..f58b489640 100644 --- a/apps/web/ee/components/issues/issue-layouts/empty-states/team-issues.tsx +++ b/apps/web/ee/components/issues/issue-layouts/empty-states/team-issues.tsx @@ -18,7 +18,7 @@ import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-w // plane web imports import { useTeamspaces } from "@/plane-web/hooks/store/teamspaces/use-teamspaces"; -export const TeamEmptyState: React.FC = observer(() => { +export const TeamEmptyState = observer(function TeamEmptyState() { // router const { workspaceSlug: routerWorkspaceSlug, teamspaceId: routerTeamspaceId } = useParams(); const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined; diff --git a/apps/web/ee/components/issues/issue-layouts/empty-states/team-project.tsx b/apps/web/ee/components/issues/issue-layouts/empty-states/team-project.tsx index 20c85774c2..71c4380d86 100644 --- a/apps/web/ee/components/issues/issue-layouts/empty-states/team-project.tsx +++ b/apps/web/ee/components/issues/issue-layouts/empty-states/team-project.tsx @@ -16,7 +16,7 @@ import { useCommandPalette } from "@/hooks/store/use-command-palette"; import { useUserPermissions } from "@/hooks/store/user"; import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-work-item-filter-instance"; -export const TeamProjectWorkItemEmptyState: React.FC = observer(() => { +export const TeamProjectWorkItemEmptyState = observer(function TeamProjectWorkItemEmptyState() { // router const { workspaceSlug: routerWorkspaceSlug, diff --git a/apps/web/ee/components/issues/issue-layouts/empty-states/team-view-issues.tsx b/apps/web/ee/components/issues/issue-layouts/empty-states/team-view-issues.tsx index 403863752a..700ab8d311 100644 --- a/apps/web/ee/components/issues/issue-layouts/empty-states/team-view-issues.tsx +++ b/apps/web/ee/components/issues/issue-layouts/empty-states/team-view-issues.tsx @@ -19,7 +19,7 @@ import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-w // plane web imports import { useTeamspaces } from "@/plane-web/hooks/store/teamspaces/use-teamspaces"; -export const TeamViewEmptyState: React.FC = observer(() => { +export const TeamViewEmptyState = observer(function TeamViewEmptyState() { // router const { workspaceSlug: routerWorkspaceSlug, teamspaceId: routerTeamspaceId, viewId: routerViewId } = useParams(); const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined; diff --git a/apps/web/ee/components/issues/issue-layouts/epic-layout-root.tsx b/apps/web/ee/components/issues/issue-layouts/epic-layout-root.tsx index b230211561..353fda3deb 100644 --- a/apps/web/ee/components/issues/issue-layouts/epic-layout-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/epic-layout-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -24,7 +22,7 @@ import { EpicKanBanLayout } from "./kanban-epic-root"; import { EpicListLayout } from "./list-epic-root"; import { EpicSpreadsheetLayout } from "./spreadsheet-epic-root"; -const ProjectEpicsLayout = (props: { activeLayout: EIssueLayoutTypes | undefined }) => { +function ProjectEpicsLayout(props: { activeLayout: EIssueLayoutTypes | undefined }) { switch (props.activeLayout) { case EIssueLayoutTypes.LIST: return ; @@ -39,9 +37,9 @@ const ProjectEpicsLayout = (props: { activeLayout: EIssueLayoutTypes | undefined default: return null; } -}; +} -export const ProjectEpicsLayoutRoot: FC = observer(() => { +export const ProjectEpicsLayoutRoot = observer(function ProjectEpicsLayoutRoot() { // router const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId } = useParams(); const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined; diff --git a/apps/web/ee/components/issues/issue-layouts/export-modal.tsx b/apps/web/ee/components/issues/issue-layouts/export-modal.tsx index 9be868aecc..077364c803 100644 --- a/apps/web/ee/components/issues/issue-layouts/export-modal.tsx +++ b/apps/web/ee/components/issues/issue-layouts/export-modal.tsx @@ -10,7 +10,7 @@ type Props = { defaultProvider?: TExportProvider; }; -export const ExportModal: React.FC = (props) => { +export function ExportModal(props: Props) { const { isOpen, onClose, onConfirm, defaultProvider = null } = props; const [provider, setProvider] = useState(defaultProvider); @@ -50,4 +50,4 @@ export const ExportModal: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/issues/issue-layouts/gantt/root.tsx b/apps/web/ee/components/issues/issue-layouts/gantt/root.tsx index 5e6923b3a3..e157a00f92 100644 --- a/apps/web/ee/components/issues/issue-layouts/gantt/root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/gantt/root.tsx @@ -14,7 +14,7 @@ type Props = { issuesLoading: boolean; }; -export const WorkspaceGanttRoot: React.FC = observer((props: Props) => { +export const WorkspaceGanttRoot = observer(function WorkspaceGanttRoot(props: Props) { const { isLoading = false, workspaceSlug, globalViewId, fetchNextPages, issuesLoading } = props; return ( diff --git a/apps/web/ee/components/issues/issue-layouts/gantt/workspace-gantt-chart.tsx b/apps/web/ee/components/issues/issue-layouts/gantt/workspace-gantt-chart.tsx index 407f83e3e4..c4f89783c6 100644 --- a/apps/web/ee/components/issues/issue-layouts/gantt/workspace-gantt-chart.tsx +++ b/apps/web/ee/components/issues/issue-layouts/gantt/workspace-gantt-chart.tsx @@ -27,7 +27,7 @@ type Props = { issuesLoading: boolean; }; -export const WorkspaceGanttChart: React.FC = observer((props: Props) => { +export const WorkspaceGanttChart = observer(function WorkspaceGanttChart(props: Props) { const { isLoading = false, workspaceSlug, globalViewId, fetchNextPages, issuesLoading } = props; // Hooks diff --git a/apps/web/ee/components/issues/issue-layouts/issue-stats.tsx b/apps/web/ee/components/issues/issue-layouts/issue-stats.tsx index 5b55d86a8e..c6e827f06e 100644 --- a/apps/web/ee/components/issues/issue-layouts/issue-stats.tsx +++ b/apps/web/ee/components/issues/issue-layouts/issue-stats.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { CircularProgressIndicator } from "@plane/ui"; @@ -14,7 +12,7 @@ type Props = { showLabel?: boolean; }; -export const IssueStats: FC = observer((props) => { +export const IssueStats = observer(function IssueStats(props: Props) { const { issueId, className, size = 14, showProgressText = true, showLabel = false } = props; const { getEpicStatsById } = useEpicAnalytics(); diff --git a/apps/web/ee/components/issues/issue-layouts/kanban-epic-root.tsx b/apps/web/ee/components/issues/issue-layouts/kanban-epic-root.tsx index cdd5403b00..08943a285f 100644 --- a/apps/web/ee/components/issues/issue-layouts/kanban-epic-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/kanban-epic-root.tsx @@ -2,6 +2,6 @@ import { observer } from "mobx-react"; import { BaseKanBanRoot } from "@/components/issues/issue-layouts/kanban/base-kanban-root"; import { ProjectEpicQuickActions } from "@/plane-web/components/epics/quick-actions/epic-quick-action"; -export const EpicKanBanLayout: React.FC = observer(() => ( - -)); +export const EpicKanBanLayout = observer(function EpicKanBanLayout() { + return ; +}); diff --git a/apps/web/ee/components/issues/issue-layouts/list-epic-root.tsx b/apps/web/ee/components/issues/issue-layouts/list-epic-root.tsx index f4e68b2346..0e3a15b132 100644 --- a/apps/web/ee/components/issues/issue-layouts/list-epic-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/list-epic-root.tsx @@ -11,7 +11,7 @@ import { useUserPermissions } from "@/hooks/store/user"; // plane-web import { ProjectEpicQuickActions } from "@/plane-web/components/epics/quick-actions/epic-quick-action"; -export const EpicListLayout: FC = observer(() => { +export const EpicListLayout = observer(function EpicListLayout() { const { workspaceSlug, projectId } = useParams(); const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/issues/issue-layouts/list/teamspace-view-root.tsx b/apps/web/ee/components/issues/issue-layouts/list/teamspace-view-root.tsx index 1937b7732c..56a79683ea 100644 --- a/apps/web/ee/components/issues/issue-layouts/list/teamspace-view-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/list/teamspace-view-root.tsx @@ -10,7 +10,7 @@ import { ProjectIssueQuickActions } from "@/components/issues/issue-layouts/quic // hooks import { useUserPermissions } from "@/hooks/store/user"; -export const TeamspaceViewListLayout: React.FC = observer(() => { +export const TeamspaceViewListLayout = observer(function TeamspaceViewListLayout() { // router const { workspaceSlug, viewId } = useParams(); // hooks diff --git a/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx b/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx index 660d8ef882..c4e2f09831 100644 --- a/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx +++ b/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx @@ -21,7 +21,7 @@ type TDuplicateWorkItemModalProps = { serviceType?: TIssueServiceType; }; -export const DuplicateWorkItemModal: FC = observer((props) => { +export const DuplicateWorkItemModal = observer(function DuplicateWorkItemModal(props: TDuplicateWorkItemModalProps) { const { workItemId, onClose, isOpen, workspaceSlug, projectId, serviceType = EIssueServiceType.ISSUES } = props; const [selectedProject, setSelectedProject] = useState(null); diff --git a/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/project-dropdown.tsx b/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/project-dropdown.tsx index 09512434e1..70ac933562 100644 --- a/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/project-dropdown.tsx +++ b/apps/web/ee/components/issues/issue-layouts/quick-action-dropdowns/project-dropdown.tsx @@ -17,17 +17,19 @@ type ProjectOptionProps = { isEpic: boolean; }; -const ProjectOption: React.FC = ({ project, isEpicsEnabled, isEpic }) => ( -
    - - - -

    - {project.name} - {!isEpicsEnabled && isEpic && Epics not enabled} -

    -
    -); +function ProjectOption({ project, isEpicsEnabled, isEpic }: ProjectOptionProps) { + return ( +
    + + + +

    + {project.name} + {!isEpicsEnabled && isEpic && Epics not enabled} +

    +
    + ); +} type Props = { value: string | null; @@ -38,7 +40,7 @@ type Props = { isEpic?: boolean; }; -export const ProjectDropdown: React.FC = observer((props) => { +export const ProjectDropdown = observer(function ProjectDropdown(props: Props) { const { t } = useTranslation(); const { value, onChange, placeholder = "Select project", disabled = false, currentProjectId, isEpic = false } = props; diff --git a/apps/web/ee/components/issues/issue-layouts/roots/teamspace-layout-root.tsx b/apps/web/ee/components/issues/issue-layouts/roots/teamspace-layout-root.tsx index 1ee1eb6a07..444632b9d9 100644 --- a/apps/web/ee/components/issues/issue-layouts/roots/teamspace-layout-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/roots/teamspace-layout-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -22,7 +20,7 @@ import { useWorkspaceIssueProperties } from "@/hooks/use-workspace-issue-propert // plane web imports import { TeamspaceLevelWorkItemFiltersHOC } from "@/plane-web/components/work-item-filters/filters-hoc/teamspace-level"; -const TeamspaceWorkItemLayout: FC<{ activeLayout: EIssueLayoutTypes | undefined }> = ({ activeLayout }) => { +function TeamspaceWorkItemLayout({ activeLayout }: { activeLayout: EIssueLayoutTypes | undefined }) { switch (activeLayout) { case EIssueLayoutTypes.LIST: return ; @@ -35,30 +33,34 @@ const TeamspaceWorkItemLayout: FC<{ activeLayout: EIssueLayoutTypes | undefined default: return null; } -}; +} -const TeamspaceWorkItemLayoutContent: FC<{ issueLoader: string | undefined; teamspaceId: string }> = observer( - ({ issueLoader, teamspaceId }) => { - // store hooks - const { issuesFilter } = useIssues(EIssuesStoreType.TEAM); - // derived values - const issueFilters = issuesFilter?.getIssueFilters(teamspaceId); - const activeLayout = issueFilters?.displayFilters?.layout; +const TeamspaceWorkItemLayoutContent = observer(function TeamspaceWorkItemLayoutContent({ + issueLoader, + teamspaceId, +}: { + issueLoader: string | undefined; + teamspaceId: string; +}) { + // store hooks + const { issuesFilter } = useIssues(EIssuesStoreType.TEAM); + // derived values + const issueFilters = issuesFilter?.getIssueFilters(teamspaceId); + const activeLayout = issueFilters?.displayFilters?.layout; - return ( -
    - {issueLoader === "mutation" && ( -
    - -
    - )} - -
    - ); - } -); + return ( +
    + {issueLoader === "mutation" && ( +
    + +
    + )} + +
    + ); +}); -export const TeamspaceLayoutRoot: FC = observer(() => { +export const TeamspaceLayoutRoot = observer(function TeamspaceLayoutRoot() { // router const { workspaceSlug: routerWorkspaceSlug, teamspaceId: routerTeamspaceId } = useParams(); const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined; diff --git a/apps/web/ee/components/issues/issue-layouts/roots/teamspace-project-root.tsx b/apps/web/ee/components/issues/issue-layouts/roots/teamspace-project-root.tsx index 8adc5924d2..87314423ee 100644 --- a/apps/web/ee/components/issues/issue-layouts/roots/teamspace-project-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/roots/teamspace-project-root.tsx @@ -20,7 +20,7 @@ import { useIssues } from "@/hooks/store/use-issues"; import { IssuesStoreContext } from "@/hooks/use-issue-layout-store"; import { useWorkspaceIssueProperties } from "@/hooks/use-workspace-issue-properties"; -const TeamspaceProjectWorkItemLayout: FC<{ activeLayout: EIssueLayoutTypes | undefined }> = ({ activeLayout }) => { +function TeamspaceProjectWorkItemLayout({ activeLayout }: { activeLayout: EIssueLayoutTypes | undefined }) { switch (activeLayout) { case EIssueLayoutTypes.LIST: return ; @@ -33,9 +33,9 @@ const TeamspaceProjectWorkItemLayout: FC<{ activeLayout: EIssueLayoutTypes | und default: return null; } -}; +} -export const TeamspaceProjectWorkLayoutRoot: React.FC = observer(() => { +export const TeamspaceProjectWorkLayoutRoot = observer(function TeamspaceProjectWorkLayoutRoot() { // router const { workspaceSlug: routerWorkspaceSlug, diff --git a/apps/web/ee/components/issues/issue-layouts/roots/teamspace-view-layout-root.tsx b/apps/web/ee/components/issues/issue-layouts/roots/teamspace-view-layout-root.tsx index 0de185fc5b..b321d81647 100644 --- a/apps/web/ee/components/issues/issue-layouts/roots/teamspace-view-layout-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/roots/teamspace-view-layout-root.tsx @@ -21,7 +21,7 @@ import { TeamspaceViewTableLayout } from "@/plane-web/components/issues/issue-la import { TeamspaceLevelWorkItemFiltersHOC } from "@/plane-web/components/work-item-filters/filters-hoc/teamspace-level"; import { useTeamspaceViews } from "@/plane-web/hooks/store/teamspaces/use-teamspace-views"; -const TeamspaceViewIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undefined }) => { +function TeamspaceViewIssueLayout(props: { activeLayout: EIssueLayoutTypes | undefined }) { switch (props.activeLayout) { case EIssueLayoutTypes.LIST: return ; @@ -34,9 +34,9 @@ const TeamspaceViewIssueLayout = (props: { activeLayout: EIssueLayoutTypes | und default: return null; } -}; +} -export const TeamspaceViewLayoutRoot: React.FC = observer(() => { +export const TeamspaceViewLayoutRoot = observer(function TeamspaceViewLayoutRoot() { // router const { workspaceSlug: routerWorkspaceSlug, teamspaceId: routerTeamspaceId, viewId: routerViewId } = useParams(); const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined; diff --git a/apps/web/ee/components/issues/issue-layouts/spreadsheet-epic-root.tsx b/apps/web/ee/components/issues/issue-layouts/spreadsheet-epic-root.tsx index a3064a8a63..997aa414a8 100644 --- a/apps/web/ee/components/issues/issue-layouts/spreadsheet-epic-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/spreadsheet-epic-root.tsx @@ -5,6 +5,6 @@ import { BaseSpreadsheetRoot } from "@/components/issues/issue-layouts/spreadshe // plane web imports import { ProjectEpicQuickActions } from "@/plane-web/components/epics/quick-actions/epic-quick-action"; -export const EpicSpreadsheetLayout: React.FC = observer(() => ( - -)); +export const EpicSpreadsheetLayout = observer(function EpicSpreadsheetLayout() { + return ; +}); diff --git a/apps/web/ee/components/issues/issue-layouts/spreadsheet/customer-requests.tsx b/apps/web/ee/components/issues/issue-layouts/spreadsheet/customer-requests.tsx index 842e19867a..8ec3b3d862 100644 --- a/apps/web/ee/components/issues/issue-layouts/spreadsheet/customer-requests.tsx +++ b/apps/web/ee/components/issues/issue-layouts/spreadsheet/customer-requests.tsx @@ -8,7 +8,7 @@ type TProps = { issue: TIssue; }; -export const SpreadSheetCustomerRequestColumn: React.FC = observer((props) => { +export const SpreadSheetCustomerRequestColumn = observer(function SpreadSheetCustomerRequestColumn(props: TProps) { const { issue } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/issues/issue-layouts/spreadsheet/customers.tsx b/apps/web/ee/components/issues/issue-layouts/spreadsheet/customers.tsx index e20c25536b..b92aabbdeb 100644 --- a/apps/web/ee/components/issues/issue-layouts/spreadsheet/customers.tsx +++ b/apps/web/ee/components/issues/issue-layouts/spreadsheet/customers.tsx @@ -9,7 +9,7 @@ type TProps = { issue: TIssue; }; -export const SpreadsheetCustomerColumn: React.FC = observer((props) => { +export const SpreadsheetCustomerColumn = observer(function SpreadsheetCustomerColumn(props: TProps) { const { issue } = props; const { t } = useTranslation(); // hooks diff --git a/apps/web/ee/components/issues/issue-layouts/table/teamspace-view-root.tsx b/apps/web/ee/components/issues/issue-layouts/table/teamspace-view-root.tsx index 13710b9fd4..53ca1e9c90 100644 --- a/apps/web/ee/components/issues/issue-layouts/table/teamspace-view-root.tsx +++ b/apps/web/ee/components/issues/issue-layouts/table/teamspace-view-root.tsx @@ -10,7 +10,7 @@ import { BaseSpreadsheetRoot } from "@/components/issues/issue-layouts/spreadshe // hooks import { useUserPermissions } from "@/hooks/store/user"; -export const TeamspaceViewTableLayout: React.FC = observer(() => { +export const TeamspaceViewTableLayout = observer(function TeamspaceViewTableLayout() { // router const { workspaceSlug, viewId } = useParams(); // hooks diff --git a/apps/web/ee/components/issues/issue-modal/additional-properties-base.tsx b/apps/web/ee/components/issues/issue-modal/additional-properties-base.tsx index 7b9114cabb..628e2e3ecd 100644 --- a/apps/web/ee/components/issues/issue-modal/additional-properties-base.tsx +++ b/apps/web/ee/components/issues/issue-modal/additional-properties-base.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import type { IIssueType, TIssuePropertyValues } from "@plane/types"; @@ -28,7 +26,9 @@ type TIssueAdditionalPropertiesBaseProps = { * Use the wrapper component for automatic store integration. * Required Issue Modal context to be available in the parent component. */ -export const IssueAdditionalPropertiesBase: React.FC = observer((props) => { +export const IssueAdditionalPropertiesBase = observer(function IssueAdditionalPropertiesBase( + props: TIssueAdditionalPropertiesBaseProps +) { const { areCustomPropertiesInitializing = false, arePropertyValuesInitializing = false, diff --git a/apps/web/ee/components/issues/issue-modal/additional-properties.tsx b/apps/web/ee/components/issues/issue-modal/additional-properties.tsx index ad53296adc..53f4900fa9 100644 --- a/apps/web/ee/components/issues/issue-modal/additional-properties.tsx +++ b/apps/web/ee/components/issues/issue-modal/additional-properties.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -29,7 +27,9 @@ type TIssueAdditionalPropertiesProps = { * Store-connected wrapper for issue additional properties. * Handles work item type store integration and data fetching. */ -export const IssueAdditionalProperties: React.FC = observer((props) => { +export const IssueAdditionalProperties = observer(function IssueAdditionalProperties( + props: TIssueAdditionalPropertiesProps +) { const { entityType = EWorkItemTypeEntity.WORK_ITEM, isDraft = false, diff --git a/apps/web/ee/components/issues/issue-modal/issue-type-select.tsx b/apps/web/ee/components/issues/issue-modal/issue-type-select.tsx index d9ce29054d..b9803ea1e6 100644 --- a/apps/web/ee/components/issues/issue-modal/issue-type-select.tsx +++ b/apps/web/ee/components/issues/issue-modal/issue-type-select.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -18,7 +16,9 @@ import { useIssueModal } from "@/hooks/context/use-issue-modal"; import { IssueTypeDropdown } from "@/plane-web/components/issue-types/dropdowns/issue-type"; import { useIssueTypes } from "@/plane-web/hooks/store"; -export const IssueTypeSelect = observer(>(props: TIssueTypeSelectProps) => { +export const IssueTypeSelect = observer(function IssueTypeSelect>( + props: TIssueTypeSelectProps +) { const { control, projectId, diff --git a/apps/web/ee/components/issues/issue-modal/modal-additional-properties.tsx b/apps/web/ee/components/issues/issue-modal/modal-additional-properties.tsx index e63dfb4537..9d80f57d7b 100644 --- a/apps/web/ee/components/issues/issue-modal/modal-additional-properties.tsx +++ b/apps/web/ee/components/issues/issue-modal/modal-additional-properties.tsx @@ -17,40 +17,40 @@ import { TemplateSubWorkitemsList } from "./template-sub-workitems-list"; * Includes custom properties and sub work item list for template creation. * This requires issue modal context to be available in the parent component. */ -export const WorkItemModalAdditionalProperties: React.FC = observer( - (props) => { - const { isDraft = false, workItemId, projectId, workspaceSlug } = props; - // form context - const { watch } = useFormContext(); - // modal context - const { getActiveAdditionalPropertiesLength } = useIssueModal(); - const activeAdditionalPropertiesLength = getActiveAdditionalPropertiesLength({ - projectId: projectId, - workspaceSlug: workspaceSlug, - watch: watch, - }); +export const WorkItemModalAdditionalProperties = observer(function WorkItemModalAdditionalProperties( + props: TWorkItemModalAdditionalPropertiesProps +) { + const { isDraft = false, workItemId, projectId, workspaceSlug } = props; + // form context + const { watch } = useFormContext(); + // modal context + const { getActiveAdditionalPropertiesLength } = useIssueModal(); + const activeAdditionalPropertiesLength = getActiveAdditionalPropertiesLength({ + projectId: projectId, + workspaceSlug: workspaceSlug, + watch: watch, + }); - return ( -
    - {projectId && ( - - )} - -
    - ); - } -); + return ( +
    + {projectId && ( + + )} + +
    + ); +}); diff --git a/apps/web/ee/components/issues/issue-modal/provider.tsx b/apps/web/ee/components/issues/issue-modal/provider.tsx index a8f12841e1..697b3e1fab 100644 --- a/apps/web/ee/components/issues/issue-modal/provider.tsx +++ b/apps/web/ee/components/issues/issue-modal/provider.tsx @@ -41,7 +41,7 @@ const workItemService = new IssueService(); const issuePropertyValuesService = new IssuePropertyValuesService(); const draftIssuePropertyValuesService = new DraftIssuePropertyValuesService(); -export const IssueModalProvider = observer((props: TIssueModalProviderProps) => { +export const IssueModalProvider = observer(function IssueModalProvider(props: TIssueModalProviderProps) { const { children, templateId, dataForPreload, allowedProjectIds } = props; // states const [workItemTemplateId, setWorkItemTemplateId] = useState(templateId ?? null); diff --git a/apps/web/ee/components/issues/issue-modal/template-select.tsx b/apps/web/ee/components/issues/issue-modal/template-select.tsx index a106d5fc9b..3c7052e1a6 100644 --- a/apps/web/ee/components/issues/issue-modal/template-select.tsx +++ b/apps/web/ee/components/issues/issue-modal/template-select.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -20,7 +18,7 @@ import { useUserPermissions } from "@/hooks/store/user"; import { WorkItemTemplateDropdown } from "@/plane-web/components/templates/dropdowns"; import { useFlag } from "@/plane-web/hooks/store"; -export const WorkItemTemplateSelect = observer((props: TWorkItemTemplateSelect) => { +export const WorkItemTemplateSelect = observer(function WorkItemTemplateSelect(props: TWorkItemTemplateSelect) { const { projectId, typeId, diff --git a/apps/web/ee/components/issues/issue-modal/template-sub-workitems-list.tsx b/apps/web/ee/components/issues/issue-modal/template-sub-workitems-list.tsx index 5a081ffbb5..4ba7c248aa 100644 --- a/apps/web/ee/components/issues/issue-modal/template-sub-workitems-list.tsx +++ b/apps/web/ee/components/issues/issue-modal/template-sub-workitems-list.tsx @@ -10,7 +10,7 @@ import { TemplateCollapsibleWrapper } from "@/plane-web/components/templates/set import { WorkItemBlueprintListItem } from "@/plane-web/components/templates/settings/work-item/blueprint/list/list-item"; import { useWorkItemTemplates } from "@/plane-web/hooks/store"; -export const TemplateSubWorkitemsList: React.FC = observer(() => { +export const TemplateSubWorkitemsList = observer(function TemplateSubWorkitemsList() { // plane hooks const { t } = useTranslation(); // store hooks diff --git a/apps/web/ee/components/issues/quick-add/root.tsx b/apps/web/ee/components/issues/quick-add/root.tsx index a96446494a..274a2ee46c 100644 --- a/apps/web/ee/components/issues/quick-add/root.tsx +++ b/apps/web/ee/components/issues/quick-add/root.tsx @@ -24,7 +24,7 @@ export type TQuickAddIssueFormRoot = { isEpic?: boolean; }; -export const QuickAddIssueFormRoot: FC = observer((props) => { +export const QuickAddIssueFormRoot = observer(function QuickAddIssueFormRoot(props: TQuickAddIssueFormRoot) { const { isOpen, layout, diff --git a/apps/web/ee/components/issues/worklog/activity/filter-root.tsx b/apps/web/ee/components/issues/worklog/activity/filter-root.tsx index 74e9df621b..8504966ab3 100644 --- a/apps/web/ee/components/issues/worklog/activity/filter-root.tsx +++ b/apps/web/ee/components/issues/worklog/activity/filter-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane constants @@ -14,7 +12,7 @@ import { useWorkspace } from "@/hooks/store/use-workspace"; // plane web hooks import { useWorkspaceWorklogs } from "@/plane-web/hooks/store"; -export const ActivityFilterRoot: FC = observer((props) => { +export const ActivityFilterRoot = observer(function ActivityFilterRoot(props: TActivityFilterRoot) { const { selectedFilters, toggleFilter, isIntakeIssue = false, projectId } = props; // hooks const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/issues/worklog/activity/root.tsx b/apps/web/ee/components/issues/worklog/activity/root.tsx index f6ac1ea8c2..1a19fbb214 100644 --- a/apps/web/ee/components/issues/worklog/activity/root.tsx +++ b/apps/web/ee/components/issues/worklog/activity/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -32,7 +30,7 @@ type TIssueActivityWorklog = { ends: "top" | "bottom" | undefined; }; -export const IssueActivityWorklog: FC = observer((props) => { +export const IssueActivityWorklog = observer(function IssueActivityWorklog(props: TIssueActivityWorklog) { const { workspaceSlug, projectId, issueId, activityComment, ends } = props; // hooks const { deleteWorklogById } = useWorkspaceWorklogs(); diff --git a/apps/web/ee/components/issues/worklog/activity/worklog-create-button.tsx b/apps/web/ee/components/issues/worklog/activity/worklog-create-button.tsx index 8993149659..0ea48a3d8f 100644 --- a/apps/web/ee/components/issues/worklog/activity/worklog-create-button.tsx +++ b/apps/web/ee/components/issues/worklog/activity/worklog-create-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -19,7 +17,9 @@ type TIssueActivityWorklogCreateButton = { disabled: boolean; }; -export const IssueActivityWorklogCreateButton: FC = observer((props) => { +export const IssueActivityWorklogCreateButton = observer(function IssueActivityWorklogCreateButton( + props: TIssueActivityWorklogCreateButton +) { const { workspaceSlug, projectId, issueId, disabled } = props; // hooks const { isWorklogsEnabledByProjectId } = useWorkspaceWorklogs(); diff --git a/apps/web/ee/components/issues/worklog/create-update/create.tsx b/apps/web/ee/components/issues/worklog/create-update/create.tsx index 5071b7c9ff..beba8419bb 100644 --- a/apps/web/ee/components/issues/worklog/create-update/create.tsx +++ b/apps/web/ee/components/issues/worklog/create-update/create.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { setToast, TOAST_TYPE } from "@plane/propel/toast"; @@ -16,7 +14,7 @@ type TWorklogCreate = { handleClose?: () => void; }; -export const WorklogCreate: FC = (props) => { +export function WorklogCreate(props: TWorklogCreate) { const { workspaceSlug, projectId, issueId, handleClose } = props; // hooks const { createWorklog } = useWorkspaceWorklogs(); @@ -65,4 +63,4 @@ export const WorklogCreate: FC = (props) => { buttonTitle={loader ? `Saving` : `Save`} /> ); -}; +} diff --git a/apps/web/ee/components/issues/worklog/create-update/form.tsx b/apps/web/ee/components/issues/worklog/create-update/form.tsx index 63e177dc1a..46dd7fac13 100644 --- a/apps/web/ee/components/issues/worklog/create-update/form.tsx +++ b/apps/web/ee/components/issues/worklog/create-update/form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, FormEvent } from "react"; import { useEffect, useState } from "react"; import { Timer } from "lucide-react"; @@ -26,7 +24,7 @@ type TWorklogFormRoot = { buttonTitle: string; }; -export const WorklogFormRoot: FC = (props) => { +export function WorklogFormRoot(props: TWorklogFormRoot) { const { data, onSubmit, onCancel, buttonDisabled, buttonTitle } = props; // states const [formData, setFromData] = useState | undefined>(undefined); @@ -130,4 +128,4 @@ export const WorklogFormRoot: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/issues/worklog/create-update/update.tsx b/apps/web/ee/components/issues/worklog/create-update/update.tsx index 8709fedcf4..a82730a35e 100644 --- a/apps/web/ee/components/issues/worklog/create-update/update.tsx +++ b/apps/web/ee/components/issues/worklog/create-update/update.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { setToast, TOAST_TYPE } from "@plane/propel/toast"; @@ -19,7 +17,7 @@ type TWorklogUpdate = { handleClose?: () => void; }; -export const WorklogUpdate: FC = (props) => { +export function WorklogUpdate(props: TWorklogUpdate) { const { workspaceSlug, projectId, issueId, worklogId, handleClose } = props; // hooks const { asJson: worklog, updateWorklog } = useWorklog(worklogId); @@ -73,4 +71,4 @@ export const WorklogUpdate: FC = (props) => { />
    ); -}; +} diff --git a/apps/web/ee/components/issues/worklog/property/button.tsx b/apps/web/ee/components/issues/worklog/property/button.tsx index c22b8d5f24..6e275ad676 100644 --- a/apps/web/ee/components/issues/worklog/property/button.tsx +++ b/apps/web/ee/components/issues/worklog/property/button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { Loader, Plus } from "lucide-react"; // helpers @@ -7,7 +5,7 @@ import { cn } from "@plane/utils"; type TIssueWorklogPropertyButton = { content?: string; isLoading?: boolean }; -export const IssueWorklogPropertyButton: FC = (props) => { +export function IssueWorklogPropertyButton(props: TIssueWorklogPropertyButton) { const { content, isLoading } = props; return ( @@ -30,4 +28,4 @@ export const IssueWorklogPropertyButton: FC = (prop )}
    ); -}; +} diff --git a/apps/web/ee/components/issues/worklog/property/root.tsx b/apps/web/ee/components/issues/worklog/property/root.tsx index 26dc871412..14c625378d 100644 --- a/apps/web/ee/components/issues/worklog/property/root.tsx +++ b/apps/web/ee/components/issues/worklog/property/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -19,7 +17,7 @@ type TIssueWorklogProperty = { disabled: boolean; }; -export const IssueWorklogProperty: FC = observer((props) => { +export const IssueWorklogProperty = observer(function IssueWorklogProperty(props: TIssueWorklogProperty) { const { workspaceSlug, projectId, issueId } = props; // hooks const { issueWorklogTotalMinutes, isWorklogsEnabledByProjectId, getIssueWorklogTotalMinutes } = diff --git a/apps/web/ee/components/license/activation/helper.tsx b/apps/web/ee/components/license/activation/helper.tsx index 933c427a8b..d61db08cba 100644 --- a/apps/web/ee/components/license/activation/helper.tsx +++ b/apps/web/ee/components/license/activation/helper.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo } from "react"; import { observer } from "mobx-react"; import { Copy } from "lucide-react"; @@ -17,7 +15,7 @@ type Props = { description?: string | React.ReactNode; }; -const CopyField: React.FC = (props) => { +function CopyField(props: Props) { const { label, value, description } = props; const handleCopy = () => { @@ -46,13 +44,15 @@ const CopyField: React.FC = (props) => { {description &&
    {description}
    }
    ); -}; +} type TInstanceDetailsForLicenseActivationProps = { workspaceSlug: string; }; -export const InstanceDetailsForLicenseActivation = observer((props: TInstanceDetailsForLicenseActivationProps) => { +export const InstanceDetailsForLicenseActivation = observer(function InstanceDetailsForLicenseActivation( + props: TInstanceDetailsForLicenseActivationProps +) { const { workspaceSlug } = props; // store hooks const { instance } = useInstance(); diff --git a/apps/web/ee/components/license/activation/license-file-form.tsx b/apps/web/ee/components/license/activation/license-file-form.tsx index af803a2c30..195e707f0d 100644 --- a/apps/web/ee/components/license/activation/license-file-form.tsx +++ b/apps/web/ee/components/license/activation/license-file-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState, useCallback } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ export type TLicenseFileFormProps = { handleClose: () => void; }; -export const LicenseFileForm: FC = observer((props) => { +export const LicenseFileForm = observer(function LicenseFileForm(props: TLicenseFileFormProps) { const { workspaceSlug, hasPermission, onSuccess, onError, handleClose } = props; // hooks const { activateUsingLicenseFile } = useSelfHostedSubscription(); diff --git a/apps/web/ee/components/license/activation/license-key-form.tsx b/apps/web/ee/components/license/activation/license-key-form.tsx index af6a090b5d..35c5c784f7 100644 --- a/apps/web/ee/components/license/activation/license-key-form.tsx +++ b/apps/web/ee/components/license/activation/license-key-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, FormEvent } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ export type TLicenseKeyFormProps = { handleClose: () => void; }; -export const LicenseKeyForm: FC = observer((props) => { +export const LicenseKeyForm = observer(function LicenseKeyForm(props: TLicenseKeyFormProps) { const { workspaceSlug, hasPermission, onSuccess, onError, handleClose } = props; // hooks const { activateUsingLicenseKey } = useSelfHostedSubscription(); diff --git a/apps/web/ee/components/license/activation/modal.tsx b/apps/web/ee/components/license/activation/modal.tsx index 32afcee300..a7008064b8 100644 --- a/apps/web/ee/components/license/activation/modal.tsx +++ b/apps/web/ee/components/license/activation/modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback, useMemo } from "react"; import { observer } from "mobx-react"; @@ -27,7 +25,9 @@ type TSubscriptionActivationModal = { handleClose: () => void; }; -export const SubscriptionActivationModal: FC = observer((props) => { +export const SubscriptionActivationModal = observer(function SubscriptionActivationModal( + props: TSubscriptionActivationModal +) { const { isOpen, handleClose } = props; // params const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/license/badge/cloud-badge.tsx b/apps/web/ee/components/license/badge/cloud-badge.tsx index 1fd48efd82..fb37748cbb 100644 --- a/apps/web/ee/components/license/badge/cloud-badge.tsx +++ b/apps/web/ee/components/license/badge/cloud-badge.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { usePathname, useSearchParams } from "next/navigation"; @@ -15,7 +13,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; import { SubscriptionButton } from "@/plane-web/components/common/subscription/subscription-button"; import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const CloudEditionBadge = observer(() => { +export const CloudEditionBadge = observer(function CloudEditionBadge() { // router const router = useAppRouter(); const pathname = usePathname(); diff --git a/apps/web/ee/components/license/badge/plane-one-badge.tsx b/apps/web/ee/components/license/badge/plane-one-badge.tsx index da6ba64db3..ebc47169e2 100644 --- a/apps/web/ee/components/license/badge/plane-one-badge.tsx +++ b/apps/web/ee/components/license/badge/plane-one-badge.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { PlaneOneIcon } from "@plane/propel/icons"; @@ -13,7 +11,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os"; import { SubscriptionButton } from "@/plane-web/components/common/subscription/subscription-button"; import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const PlaneOneEditionBadge = observer(() => { +export const PlaneOneEditionBadge = observer(function PlaneOneEditionBadge() { // hooks const { isMobile } = usePlatformOS(); // store hooks diff --git a/apps/web/ee/components/license/badge/self-hosted-badge.tsx b/apps/web/ee/components/license/badge/self-hosted-badge.tsx index 8c391cacdb..5794e7ce77 100644 --- a/apps/web/ee/components/license/badge/self-hosted-badge.tsx +++ b/apps/web/ee/components/license/badge/self-hosted-badge.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { useTranslation } from "@plane/i18n"; @@ -11,7 +9,7 @@ import { SubscriptionButton } from "@/plane-web/components/common/subscription/s import { PlaneOneEditionBadge } from "@/plane-web/components/license"; import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const SelfHostedEditionBadge = observer(() => { +export const SelfHostedEditionBadge = observer(function SelfHostedEditionBadge() { // hooks const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail, diff --git a/apps/web/ee/components/license/banner/seats-banner.tsx b/apps/web/ee/components/license/banner/seats-banner.tsx index 05f8598767..b5f8d5ea0a 100644 --- a/apps/web/ee/components/license/banner/seats-banner.tsx +++ b/apps/web/ee/components/license/banner/seats-banner.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Button } from "@plane/propel/button"; @@ -20,7 +18,7 @@ type TPlanMessageKeys = EPlanMessageKeys.FREE_PLAN | EPlanMessageKeys.NEAR_LIMIT const MAX_FREE_SEATS = 12; -export const LicenseSeatsBanner: FC = observer(() => { +export const LicenseSeatsBanner = observer(function LicenseSeatsBanner() { // hooks const { currentWorkspace } = useWorkspace(); const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail, togglePaidPlanModal } = useWorkspaceSubscription(); diff --git a/apps/web/ee/components/license/banner/trial-banner.tsx b/apps/web/ee/components/license/banner/trial-banner.tsx index 54538de30e..37af01795f 100644 --- a/apps/web/ee/components/license/banner/trial-banner.tsx +++ b/apps/web/ee/components/license/banner/trial-banner.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -18,7 +16,7 @@ import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; const COMMON_BUTTON_STYLE = "flex flex-shrink-0 items-center justify-center py-1 px-2 w-fit text-xs font-medium rounded focus:outline-none transition-all duration-300 animate-slide-up"; -export const TrialBanner: FC = observer(() => { +export const TrialBanner = observer(function TrialBanner() { // hooks const { config } = useInstance(); const { allowPermissions } = useUserPermissions(); @@ -62,6 +60,7 @@ export const TrialBanner: FC = observer(() => { href={SUBSCRIPTION_WEBPAGE_URLS[currentPlan]} target="_blank" className={cn(getButtonStyling("neutral-primary", "sm"), COMMON_BUTTON_STYLE, "border-custom-border-400")} + rel="noreferrer" > Learn more diff --git a/apps/web/ee/components/license/modal/success-modal.tsx b/apps/web/ee/components/license/modal/success-modal.tsx index b99aa8f3c4..06c7dc0b33 100644 --- a/apps/web/ee/components/license/modal/success-modal.tsx +++ b/apps/web/ee/components/license/modal/success-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect } from "react"; import { observer } from "mobx-react"; @@ -65,7 +63,7 @@ export const getPlanFeatures = (variant: EProductSubscriptionEnum) => { return []; }; -export const PaidPlanSuccessModal: FC = observer((props) => { +export const PaidPlanSuccessModal = observer(function PaidPlanSuccessModal(props: PaidPlanSuccessModalProps) { const { variant = EProductSubscriptionEnum.PRO, isOpen, handleClose } = props; // router const { workspaceSlug } = useParams(); @@ -100,6 +98,7 @@ export const PaidPlanSuccessModal: FC = observer((pro href={getRecapLink(variant)} target="_blank" className="text-custom-primary-200 text-center text-sm font-medium underline outline-none focus:outline-none" + rel="noreferrer" > Recap what {getSubscriptionName(variant)} packs anytime diff --git a/apps/web/ee/components/license/modal/trial-button.tsx b/apps/web/ee/components/license/modal/trial-button.tsx index f26007d7f0..40423b5f92 100644 --- a/apps/web/ee/components/license/modal/trial-button.tsx +++ b/apps/web/ee/components/license/modal/trial-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { useParams } from "next/navigation"; // plane imports @@ -19,7 +17,7 @@ export type TTrialButtonProps = { variant: EProductSubscriptionEnum; }; -export const TrialButton: React.FC = (props: TTrialButtonProps) => { +export function TrialButton(props: TTrialButtonProps) { const { handleClose, productId, priceId, variant } = props; // router const { workspaceSlug } = useParams(); @@ -50,7 +48,7 @@ export const TrialButton: React.FC = (props: TTrialButtonProp }, }); } catch (error) { - const currentError = error as unknown as { error: string; detail: string }; + const currentError = error as { error: string; detail: string }; console.error("Error in freeTrialSubscription", error); setToast({ type: TOAST_TYPE.ERROR, @@ -81,4 +79,4 @@ export const TrialButton: React.FC = (props: TTrialButtonProp Start free trial ); -}; +} diff --git a/apps/web/ee/components/license/modal/upgrade-modal.tsx b/apps/web/ee/components/license/modal/upgrade-modal.tsx index 959652a897..7dabbeae73 100644 --- a/apps/web/ee/components/license/modal/upgrade-modal.tsx +++ b/apps/web/ee/components/license/modal/upgrade-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -37,7 +35,7 @@ export type PaidPlanUpgradeModalProps = { handleClose: () => void; }; -export const PaidPlanUpgradeModal: FC = observer((props) => { +export const PaidPlanUpgradeModal = observer(function PaidPlanUpgradeModal(props: PaidPlanUpgradeModalProps) { const { isOpen, handleClose } = props; // router const { workspaceSlug } = useParams(); @@ -188,7 +186,7 @@ export const PaidPlanUpgradeModal: FC = observer((pro verticalFeatureList extraFeatures={

    - + See full features list

    @@ -211,7 +209,11 @@ export const PaidPlanUpgradeModal: FC = observer((pro verticalFeatureList extraFeatures={

    - + See full features list

    @@ -234,7 +236,11 @@ export const PaidPlanUpgradeModal: FC = observer((pro verticalFeatureList extraFeatures={

    - + See full features list

    diff --git a/apps/web/ee/components/license/plans-card/business.tsx b/apps/web/ee/components/license/plans-card/business.tsx index cf4ed1ec97..0bbdc10aa0 100644 --- a/apps/web/ee/components/license/plans-card/business.tsx +++ b/apps/web/ee/components/license/plans-card/business.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -22,7 +20,7 @@ type TBusinessPlanCardProps = { handleUpgrade: (selectedSubscriptionType: EProductSubscriptionEnum) => void; }; -export const BusinessPlanCard: React.FC = observer((props: TBusinessPlanCardProps) => { +export const BusinessPlanCard = observer(function BusinessPlanCard(props: TBusinessPlanCardProps) { const { upgradeLoader, handleUpgrade } = props; // params const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/license/plans-card/cloud-free.tsx b/apps/web/ee/components/license/plans-card/cloud-free.tsx index ecd3138281..090d0fc119 100644 --- a/apps/web/ee/components/license/plans-card/cloud-free.tsx +++ b/apps/web/ee/components/license/plans-card/cloud-free.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Loader as LoaderIcon } from "lucide-react"; @@ -22,7 +20,7 @@ type TCloudFreePlanCardProps = { handleUpgrade: (selectedSubscriptionType: EProductSubscriptionEnum) => void; }; -export const CloudFreePlanCard: FC = observer((props: TCloudFreePlanCardProps) => { +export const CloudFreePlanCard = observer(function CloudFreePlanCard(props: TCloudFreePlanCardProps) { const { upgradeProductType, isProductsAPILoading, trialLoader, upgradeLoader, handleTrial, handleUpgrade } = props; // store hooks const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail } = useWorkspaceSubscription(); diff --git a/apps/web/ee/components/license/plans-card/common/plan-card.tsx b/apps/web/ee/components/license/plans-card/common/plan-card.tsx index 1fd27359b3..d50beeffc7 100644 --- a/apps/web/ee/components/license/plans-card/common/plan-card.tsx +++ b/apps/web/ee/components/license/plans-card/common/plan-card.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import type { EProductSubscriptionEnum } from "@plane/types"; // plane imports @@ -14,7 +12,7 @@ type TPlanCard = { button: React.ReactNode; }; -export const PlanCard = observer(({ planVariant, planDescription, button }: TPlanCard) => { +export const PlanCard = observer(function PlanCard({ planVariant, planDescription, button }: TPlanCard) { const { getIsInTrialPeriod } = useWorkspaceSubscription(); // derived values const planName = getSubscriptionName(planVariant); diff --git a/apps/web/ee/components/license/plans-card/common/self-managed-license-actions.tsx b/apps/web/ee/components/license/plans-card/common/self-managed-license-actions.tsx index eda9583d42..44405521ef 100644 --- a/apps/web/ee/components/license/plans-card/common/self-managed-license-actions.tsx +++ b/apps/web/ee/components/license/plans-card/common/self-managed-license-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -20,7 +18,9 @@ type TSelfManagedLicenseActionsProps = { type TLicenseSyncStatus = "synced" | "syncing" | "success" | "error"; -export const SelfManagedLicenseActions = observer((props: TSelfManagedLicenseActionsProps) => { +export const SelfManagedLicenseActions = observer(function SelfManagedLicenseActions( + props: TSelfManagedLicenseActionsProps +) { const { showSyncButton = true, showDeactivateButton = true } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/license/plans-card/enterprise.tsx b/apps/web/ee/components/license/plans-card/enterprise.tsx index eeccf6492e..e4c692262e 100644 --- a/apps/web/ee/components/license/plans-card/enterprise.tsx +++ b/apps/web/ee/components/license/plans-card/enterprise.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -22,7 +20,7 @@ type TEnterprisePlanCardProps = { handleUpgrade: (selectedSubscriptionType: EProductSubscriptionEnum) => void; }; -export const EnterprisePlanCard: React.FC = observer((props: TEnterprisePlanCardProps) => { +export const EnterprisePlanCard = observer(function EnterprisePlanCard(props: TEnterprisePlanCardProps) { const { upgradeLoader, handleUpgrade } = props; // params const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/license/plans-card/one.tsx b/apps/web/ee/components/license/plans-card/one.tsx index bcaa608af6..7e3f58cacd 100644 --- a/apps/web/ee/components/license/plans-card/one.tsx +++ b/apps/web/ee/components/license/plans-card/one.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { ExternalLink } from "lucide-react"; import { getButtonStyling } from "@plane/propel/button"; @@ -10,29 +8,32 @@ import { cn } from "@plane/utils"; // plane web components import { PlanCard, SelfManagedLicenseActions } from "@/plane-web/components/license"; -export const OnePlanCard: React.FC = observer(() => ( - -
    Active cycles, Time Tracking, Public View + Pages, ~50 Members
    - - - } - button={ - <> - - {"Manage your license"} - - - - } - /> -)); +export const OnePlanCard = observer(function OnePlanCard() { + return ( + +
    Active cycles, Time Tracking, Public View + Pages, ~50 Members
    + + + } + button={ + <> + + {"Manage your license"} + + + + } + /> + ); +}); diff --git a/apps/web/ee/components/license/plans-card/pro.tsx b/apps/web/ee/components/license/plans-card/pro.tsx index a4b23c67de..901b401c46 100644 --- a/apps/web/ee/components/license/plans-card/pro.tsx +++ b/apps/web/ee/components/license/plans-card/pro.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ type TProPlanCardProps = { handleUpgrade: (selectedSubscriptionType: EProductSubscriptionEnum) => void; }; -export const ProPlanCard: React.FC = observer((props: TProPlanCardProps) => { +export const ProPlanCard = observer(function ProPlanCard(props: TProPlanCardProps) { const { upgradeLoader, handleUpgrade } = props; // params const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/license/plans-card/self-hosted-free.tsx b/apps/web/ee/components/license/plans-card/self-hosted-free.tsx index 318052f59d..791599b8d4 100644 --- a/apps/web/ee/components/license/plans-card/self-hosted-free.tsx +++ b/apps/web/ee/components/license/plans-card/self-hosted-free.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { Button } from "@plane/propel/button"; import { EProductSubscriptionEnum } from "@plane/types"; @@ -11,7 +9,7 @@ import { PlanCard, SelfManagedLicenseActions } from "@/plane-web/components/lice // plane web hooks import { useSelfHostedSubscription, useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const SelfHostedFreePlanCard = observer(() => { +export const SelfHostedFreePlanCard = observer(function SelfHostedFreePlanCard() { // hooks const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail } = useWorkspaceSubscription(); const { toggleLicenseActivationModal } = useSelfHostedSubscription(); diff --git a/apps/web/ee/components/license/workspace-disabled.tsx b/apps/web/ee/components/license/workspace-disabled.tsx index 6824fdcec6..e61323faa4 100644 --- a/apps/web/ee/components/license/workspace-disabled.tsx +++ b/apps/web/ee/components/license/workspace-disabled.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { ProjectAppSidebar } from "app/(all)/[workspaceSlug]/(projects)/_sidebar"; import { observer } from "mobx-react"; @@ -16,7 +14,7 @@ import { useAppRouter } from "@/hooks/use-app-router"; // plane web components import { PaidPlanUpgradeModal } from "@/plane-web/components/license"; -export const WorkspaceDisabledPage: React.FC = observer(() => { +export const WorkspaceDisabledPage = observer(function WorkspaceDisabledPage() { // router const router = useAppRouter(); const { workspaceSlug: routerWorkspaceSlug } = useParams(); diff --git a/apps/web/ee/components/marketplace/applications/applications-upgrade.tsx b/apps/web/ee/components/marketplace/applications/applications-upgrade.tsx index 3a13c8dd5a..975c42bd02 100644 --- a/apps/web/ee/components/marketplace/applications/applications-upgrade.tsx +++ b/apps/web/ee/components/marketplace/applications/applications-upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -13,7 +11,7 @@ import TemplatesUpgradeLight from "@/app/assets/empty-state/templates/upgrade-li // components import { SettingsHeading } from "@/components/settings/heading"; -export const ApplicationsUpgrade: FC = observer(() => { +export const ApplicationsUpgrade = observer(function ApplicationsUpgrade() { // router // store hooks const { resolvedTheme } = useTheme(); diff --git a/apps/web/ee/components/marketplace/applications/details/delete-modal.tsx b/apps/web/ee/components/marketplace/applications/details/delete-modal.tsx index 3bb2c23b74..f46cf2c0ee 100644 --- a/apps/web/ee/components/marketplace/applications/details/delete-modal.tsx +++ b/apps/web/ee/components/marketplace/applications/details/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; @@ -16,7 +14,7 @@ interface IDeleteApplication { handleClose: () => void; } -export const DeleteApplicationModal: React.FC = observer((props) => { +export const DeleteApplicationModal = observer(function DeleteApplicationModal(props: IDeleteApplication) { const { app, isOpen, handleClose } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/marketplace/applications/details/list.tsx b/apps/web/ee/components/marketplace/applications/details/list.tsx index 3f6945da36..21d636c3f7 100644 --- a/apps/web/ee/components/marketplace/applications/details/list.tsx +++ b/apps/web/ee/components/marketplace/applications/details/list.tsx @@ -1,4 +1,3 @@ -"use client"; import React from "react"; import type { TUserApplication } from "@plane/types"; import { AppTile } from "@/plane-web/components/marketplace"; @@ -11,8 +10,8 @@ type AppListProps = { apps: TUserApplication[]; }; -export const AppList: React.FC = (props) => { +export function AppList(props: AppListProps) { const { apps } = props; return apps.map((app) => ); -}; +} diff --git a/apps/web/ee/components/marketplace/applications/details/menu-item.tsx b/apps/web/ee/components/marketplace/applications/details/menu-item.tsx index 18c0d0923d..190390ee8a 100644 --- a/apps/web/ee/components/marketplace/applications/details/menu-item.tsx +++ b/apps/web/ee/components/marketplace/applications/details/menu-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // components @@ -7,7 +5,7 @@ import { cn } from "@plane/utils"; import type { TPopoverMenuOptions } from "@/plane-web/components/marketplace"; // helpers -export const ApplicationTileMenuItem: FC = observer((props) => { +export const ApplicationTileMenuItem = observer(function ApplicationTileMenuItem(props: TPopoverMenuOptions) { const { type, label = "", isActive, prependIcon, appendIcon, onClick, isDanger } = props; if (!isActive) { diff --git a/apps/web/ee/components/marketplace/applications/details/menu-options.tsx b/apps/web/ee/components/marketplace/applications/details/menu-options.tsx index a68ce001bf..9c5b61abb1 100644 --- a/apps/web/ee/components/marketplace/applications/details/menu-options.tsx +++ b/apps/web/ee/components/marketplace/applications/details/menu-options.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, ReactNode } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -39,7 +37,9 @@ type ApplicationTileMenuOptionsProps = { app: TUserApplication; }; -export const ApplicationTileMenuOptions: FC = observer((props) => { +export const ApplicationTileMenuOptions = observer(function ApplicationTileMenuOptions( + props: ApplicationTileMenuOptionsProps +) { // hooks const { app } = props; const { t } = useTranslation(); diff --git a/apps/web/ee/components/marketplace/applications/details/revoke-modal.tsx b/apps/web/ee/components/marketplace/applications/details/revoke-modal.tsx index e48869e5f6..321f659851 100644 --- a/apps/web/ee/components/marketplace/applications/details/revoke-modal.tsx +++ b/apps/web/ee/components/marketplace/applications/details/revoke-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; @@ -18,7 +16,7 @@ interface ICycleDelete { handleClose: () => void; } -export const RevokeAccessModal: React.FC = observer((props) => { +export const RevokeAccessModal = observer(function RevokeAccessModal(props: ICycleDelete) { const { app, isOpen, handleClose } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/marketplace/applications/details/root.tsx b/apps/web/ee/components/marketplace/applications/details/root.tsx index ab9d82f104..f6cfb55b4a 100644 --- a/apps/web/ee/components/marketplace/applications/details/root.tsx +++ b/apps/web/ee/components/marketplace/applications/details/root.tsx @@ -1,4 +1,3 @@ -"use client"; import React from "react"; import { observer } from "mobx-react"; import { E_FEATURE_FLAGS } from "@plane/constants"; @@ -115,7 +114,7 @@ export const getInternalApps = (supportedIntegrations: E_INTEGRATION_KEYS[]): TU return internalApps; }; -export const AppListRoot: React.FC = observer((props) => { +export const AppListRoot = observer(function AppListRoot(props: AppListProps) { const { supportedIntegrations } = props; const internalApps = getInternalApps(supportedIntegrations); // filter apps which has same slug as internal apps diff --git a/apps/web/ee/components/marketplace/applications/details/tile-logo.tsx b/apps/web/ee/components/marketplace/applications/details/tile-logo.tsx index 8f0e1b0d32..8745367d5e 100644 --- a/apps/web/ee/components/marketplace/applications/details/tile-logo.tsx +++ b/apps/web/ee/components/marketplace/applications/details/tile-logo.tsx @@ -6,7 +6,7 @@ type AppTileLogoProps = { app: TUserApplication; }; -export const AppTileLogo = (props: AppTileLogoProps) => { +export function AppTileLogo(props: AppTileLogoProps) { const { app } = props; const logoUrl = getLogoUrl(app); return logoUrl ? ( @@ -16,7 +16,7 @@ export const AppTileLogo = (props: AppTileLogoProps) => {
    {app.name?.charAt(0)}
    ); -}; +} /** * Get the logo url for the app diff --git a/apps/web/ee/components/marketplace/applications/details/tile.tsx b/apps/web/ee/components/marketplace/applications/details/tile.tsx index 5b70311983..a0638f1b84 100644 --- a/apps/web/ee/components/marketplace/applications/details/tile.tsx +++ b/apps/web/ee/components/marketplace/applications/details/tile.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams, useRouter } from "next/navigation"; @@ -27,7 +25,7 @@ type AppTileProps = { app: TUserApplication; }; -export const AppTile: React.FC = observer((props) => { +export const AppTile = observer(function AppTile(props: AppTileProps) { const { app } = props; const { workspaceSlug } = useParams(); const { t } = useTranslation(); diff --git a/apps/web/ee/components/marketplace/applications/form/client-secret-modal.tsx b/apps/web/ee/components/marketplace/applications/form/client-secret-modal.tsx index 82d38669fc..95eaa7cb70 100644 --- a/apps/web/ee/components/marketplace/applications/form/client-secret-modal.tsx +++ b/apps/web/ee/components/marketplace/applications/form/client-secret-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { CheckCircle, Copy } from "lucide-react"; import { useTranslation } from "@plane/i18n"; import { Button } from "@plane/propel/button"; @@ -18,7 +16,7 @@ type Props = { mode?: "create" | "update"; }; -export const GeneratedCredentialsModal: React.FC = (props) => { +export function GeneratedCredentialsModal(props: Props) { const { isOpen, clientSecret, clientId, handleClose, mode = "create" } = props; const { isMobile } = usePlatformOS(); const { t } = useTranslation(); @@ -116,4 +114,4 @@ export const GeneratedCredentialsModal: React.FC = (props) => {     ); -}; +} diff --git a/apps/web/ee/components/marketplace/applications/form/create-update.tsx b/apps/web/ee/components/marketplace/applications/form/create-update.tsx index 94c7214a03..9cc8723238 100644 --- a/apps/web/ee/components/marketplace/applications/form/create-update.tsx +++ b/apps/web/ee/components/marketplace/applications/form/create-update.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useRouter } from "next/navigation"; @@ -60,7 +58,7 @@ const defaultFormData: Partial = { supported_plans: [], }; -export const CreateUpdateApplication: React.FC = observer((props) => { +export const CreateUpdateApplication = observer(function CreateUpdateApplication(props: Props) { const { formData, handleFormSubmit } = props; const { diff --git a/apps/web/ee/components/marketplace/applications/form/fields/base-field.tsx b/apps/web/ee/components/marketplace/applications/form/fields/base-field.tsx index f5adff95ba..4a9b450f8e 100644 --- a/apps/web/ee/components/marketplace/applications/form/fields/base-field.tsx +++ b/apps/web/ee/components/marketplace/applications/form/fields/base-field.tsx @@ -12,22 +12,24 @@ export type BaseFieldProps = { validation?: RegisterOptions; }; -export const FieldWrapper = ({ +export function FieldWrapper({ label, description, error, validation, children, -}: BaseFieldProps & { children: React.ReactNode }) => ( -
    - {label && ( -
    - {label} - {validation?.required && *} -
    - )} - {description &&
    {description}
    } - {children} - {error &&

    {error.message}

    } -
    -); +}: BaseFieldProps & { children: React.ReactNode }) { + return ( +
    + {label && ( +
    + {label} + {validation?.required && *} +
    + )} + {description &&
    {description}
    } + {children} + {error &&

    {error.message}

    } +
    + ); +} diff --git a/apps/web/ee/components/marketplace/applications/form/fields/input-field.tsx b/apps/web/ee/components/marketplace/applications/form/fields/input-field.tsx index 119a758761..1c51f24fd7 100644 --- a/apps/web/ee/components/marketplace/applications/form/fields/input-field.tsx +++ b/apps/web/ee/components/marketplace/applications/form/fields/input-field.tsx @@ -9,7 +9,7 @@ type Props = BaseFieldProps & { onChange?: (value: string) => void; }; -export const InputField = (props: Props) => { +export function InputField(props: Props) { const { id, type, placeholder, disabled, tabIndex, error, className = "", register, validation, onChange } = props; return ( @@ -29,4 +29,4 @@ export const InputField = (props: Props) => { /> ); -}; +} diff --git a/apps/web/ee/components/marketplace/applications/form/fields/rich-text-field.tsx b/apps/web/ee/components/marketplace/applications/form/fields/rich-text-field.tsx index 4e8e6581ad..7e199f56bc 100644 --- a/apps/web/ee/components/marketplace/applications/form/fields/rich-text-field.tsx +++ b/apps/web/ee/components/marketplace/applications/form/fields/rich-text-field.tsx @@ -16,7 +16,7 @@ type Props = BaseFieldProps & { searchEntityCallback: (payload: TSearchEntityRequestPayload) => Promise; }; -export const RichTextField = (props: Props) => { +export function RichTextField(props: Props) { const { id, placeholder, @@ -68,4 +68,4 @@ export const RichTextField = (props: Props) => { /> ); -}; +} diff --git a/apps/web/ee/components/marketplace/applications/form/form-section.tsx b/apps/web/ee/components/marketplace/applications/form/form-section.tsx index 330fffd9e2..ce31de4faa 100644 --- a/apps/web/ee/components/marketplace/applications/form/form-section.tsx +++ b/apps/web/ee/components/marketplace/applications/form/form-section.tsx @@ -8,7 +8,7 @@ type Props = { title: string; } & PropsWithChildren; -export const FormSection = ({ collapsible, title, children }: Props) => { +export function FormSection({ collapsible, title, children }: Props) { const [collapsibleOpen, setCollapsibleOpen] = useState(true); const handleToggle = () => { @@ -37,4 +37,4 @@ export const FormSection = ({ collapsible, title, children }: Props) => { {(!collapsible || collapsibleOpen) &&
    {children}
    } ); -}; +} diff --git a/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret-modal.tsx b/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret-modal.tsx index 8440813cc7..b883361cdd 100644 --- a/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret-modal.tsx +++ b/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { Copy } from "lucide-react"; @@ -21,7 +19,7 @@ type Props = { handleClose: () => void; }; -export const RegenerateClientSecretModal: React.FC = observer((props) => { +export const RegenerateClientSecretModal = observer(function RegenerateClientSecretModal(props: Props) { const { application, isOpen, handleClose } = props; // hooks diff --git a/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret.tsx b/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret.tsx index 2b415402ca..c045b6b27a 100644 --- a/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret.tsx +++ b/apps/web/ee/components/marketplace/applications/form/regenerate-client-secret.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { Copy } from "lucide-react"; @@ -20,7 +18,7 @@ type Props = { handleRegenerateSuccess: (data: Partial) => void; }; -export const RegenerateClientSecret: React.FC = observer((props) => { +export const RegenerateClientSecret = observer(function RegenerateClientSecret(props: Props) { const { application, handleRegenerateSuccess } = props; // hooks diff --git a/apps/web/ee/components/marketplace/applications/form/regenerate-confirm-modal.tsx b/apps/web/ee/components/marketplace/applications/form/regenerate-confirm-modal.tsx index 3ba42832be..615fa94d47 100644 --- a/apps/web/ee/components/marketplace/applications/form/regenerate-confirm-modal.tsx +++ b/apps/web/ee/components/marketplace/applications/form/regenerate-confirm-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { AlertCircle } from "lucide-react"; import { useTranslation } from "@plane/i18n"; @@ -15,7 +13,7 @@ type Props = { handleRegenerated: (data: TUserApplication) => void; }; -export const RegenerateConfirmModal: React.FC = observer((props) => { +export const RegenerateConfirmModal = observer(function RegenerateConfirmModal(props: Props) { const { isOpen, handleClose, applicationId, handleRegenerated } = props; const { regenerateApplicationSecret } = useApplications(); diff --git a/apps/web/ee/components/marketplace/applications/form/select-categories.tsx b/apps/web/ee/components/marketplace/applications/form/select-categories.tsx index 3491403c95..e2292034da 100644 --- a/apps/web/ee/components/marketplace/applications/form/select-categories.tsx +++ b/apps/web/ee/components/marketplace/applications/form/select-categories.tsx @@ -15,7 +15,7 @@ type TSelectCategoriesProps = { const COMMON_DROPDOWN_CONTAINER_CLASSNAME = "bg-custom-background-100 border border-custom-border-200 rounded-md px-2 py-1"; -export const SelectCategories: React.FC = observer((props) => { +export const SelectCategories = observer(function SelectCategories(props: TSelectCategoriesProps) { const { value, handleChange } = props; // plane hooks const { t } = useTranslation(); @@ -30,7 +30,7 @@ export const SelectCategories: React.FC = observer((prop handleChange(value as string[])} + onChange={(value) => handleChange(value)} keyExtractor={(option) => option.data} buttonContainerClassName={COMMON_DROPDOWN_CONTAINER_CLASSNAME} buttonContent={(isOpen, val) => ( diff --git a/apps/web/ee/components/marketplace/applications/form/select-supported-plans.tsx b/apps/web/ee/components/marketplace/applications/form/select-supported-plans.tsx index 1b6b0acd87..daaf297d13 100644 --- a/apps/web/ee/components/marketplace/applications/form/select-supported-plans.tsx +++ b/apps/web/ee/components/marketplace/applications/form/select-supported-plans.tsx @@ -22,7 +22,7 @@ const PLAN_OPTIONS = [ { data: EProductSubscriptionEnum.ENTERPRISE, value: "Enterprise" }, ]; -export const SelectSupportedPlans: React.FC = observer((props) => { +export const SelectSupportedPlans = observer(function SelectSupportedPlans(props: TSelectSupportedPlansProps) { const { value, handleChange } = props; // plane hooks const { t } = useTranslation(); @@ -31,7 +31,7 @@ export const SelectSupportedPlans: React.FC = observ handleChange(value as string[])} + onChange={(value) => handleChange(value)} keyExtractor={(option) => option.data} buttonContainerClassName={COMMON_DROPDOWN_CONTAINER_CLASSNAME} buttonContent={(isOpen, val) => ( diff --git a/apps/web/ee/components/marketplace/applications/form/upload-attachments.tsx b/apps/web/ee/components/marketplace/applications/form/upload-attachments.tsx index 667ac111b1..391acb4121 100644 --- a/apps/web/ee/components/marketplace/applications/form/upload-attachments.tsx +++ b/apps/web/ee/components/marketplace/applications/form/upload-attachments.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import type { Accept } from "react-dropzone"; @@ -31,7 +29,7 @@ type Props = { const ACCEPTED_FILE_TYPES: Accept = { "image/*": [".png", ".jpg", ".jpeg", ".webp"] }; -export const UploadAppAttachments: React.FC = observer((props) => { +export const UploadAppAttachments = observer(function UploadAppAttachments(props: Props) { const { onFilesFinalise, initialValue, entityType, hasError } = props; // states const [allImages, setAllImages] = useState(initialValue ?? []); @@ -253,7 +251,7 @@ type TImagePreviewProps = { onRemove: () => void; }; -const ImagePreview: React.FC = (props) => { +function ImagePreview(props: TImagePreviewProps) { const { image, isURL, onRemove, isLoading } = props; // derived values const imageSrc = isURL ? getFileURL(image as string) : URL.createObjectURL(image as File); @@ -273,6 +271,6 @@ const ImagePreview: React.FC = (props) => { Uploaded preview ); -}; +} export default UploadAppAttachments; diff --git a/apps/web/ee/components/marketplace/applications/installation/details.tsx b/apps/web/ee/components/marketplace/applications/installation/details.tsx index 88c36a4821..14e2adb8d2 100644 --- a/apps/web/ee/components/marketplace/applications/installation/details.tsx +++ b/apps/web/ee/components/marketplace/applications/installation/details.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -62,7 +60,9 @@ export const workspaceLevelPermissions = permissions.filter( (permission) => permission.enitity_type === EntityType.WORKSPACE ); -export const ApplicationInstallationDetails: React.FC = observer((props) => { +export const ApplicationInstallationDetails = observer(function ApplicationInstallationDetails( + props: ApplicationInstallationDetailsProps +) { const { app } = props; const { currentWorkspace } = useWorkspace(); @@ -141,7 +141,7 @@ export const ApplicationInstallationDetails: React.FC = (props) => { +export function ApplicationPermissionText(props: { permission: ApplicationPermission }) { const { permission } = props; const { t } = useTranslation(); return ( @@ -150,4 +150,4 @@ export const ApplicationPermissionText: React.FC<{ permission: ApplicationPermis
    {t(permission.i18n_description)}
    ); -}; +} diff --git a/apps/web/ee/components/marketplace/applications/publish/publish-modal.tsx b/apps/web/ee/components/marketplace/applications/publish/publish-modal.tsx index b46891c8a9..96f7e8dd09 100644 --- a/apps/web/ee/components/marketplace/applications/publish/publish-modal.tsx +++ b/apps/web/ee/components/marketplace/applications/publish/publish-modal.tsx @@ -1,4 +1,3 @@ -"use client"; import React, { useState } from "react"; import { observer } from "mobx-react"; import { useForm } from "react-hook-form"; @@ -24,7 +23,7 @@ const defaultFormData: TApplicationPublishDetails = { photo_urls: "", }; -export const ApplicationPublishModal: React.FC = observer((props) => { +export const ApplicationPublishModal = observer(function ApplicationPublishModal(props: ApplicationPublishModalProps) { const { isOpen, handleClose, app } = props; // states const [isPublishing, setIsPublishing] = React.useState(false); diff --git a/apps/web/ee/components/marketplace/applications/ui/checkbox.tsx b/apps/web/ee/components/marketplace/applications/ui/checkbox.tsx index 59a4580c52..1357da992a 100644 --- a/apps/web/ee/components/marketplace/applications/ui/checkbox.tsx +++ b/apps/web/ee/components/marketplace/applications/ui/checkbox.tsx @@ -8,7 +8,7 @@ interface CustomCheckboxProps { onChange: (value: boolean) => void; } -export const CustomCheckbox: React.FC = ({ label, checked, className = "", onChange }) => { +export function CustomCheckbox({ label, checked, className = "", onChange }: CustomCheckboxProps) { const handleClick = (value: boolean) => { onChange(value); }; @@ -32,4 +32,4 @@ export const CustomCheckbox: React.FC = ({ label, checked, ); -}; +} diff --git a/apps/web/ee/components/marketplace/oauth/app-consent.tsx b/apps/web/ee/components/marketplace/oauth/app-consent.tsx index b0223bce13..7b9a39e41e 100644 --- a/apps/web/ee/components/marketplace/oauth/app-consent.tsx +++ b/apps/web/ee/components/marketplace/oauth/app-consent.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useMemo, useState } from "react"; import { observer } from "mobx-react"; import { useRouter } from "next/navigation"; @@ -37,274 +35,272 @@ const oauthService = new OAuthService(); const applicationService = new ApplicationService(); const authService = new AuthService(); -export const AppConsent = observer( - ({ - application, - consentParams, - workspaceSlug, - workspacePermissions = {}, - workspaceAppInstallations = {}, - disableDropdown, - }: TAppConsentProps) => { - const { t } = useTranslation(); - const router = useRouter(); - const { userSettings } = useUser(); - const workspaceSlugFromParams = workspaceSlug; +export const AppConsent = observer(function AppConsent({ + application, + consentParams, + workspaceSlug, + workspacePermissions = {}, + workspaceAppInstallations = {}, + disableDropdown, +}: TAppConsentProps) { + const { t } = useTranslation(); + const router = useRouter(); + const { userSettings } = useUser(); + const workspaceSlugFromParams = workspaceSlug; - // if workspaceSlug is not available in URL, pick last visited workspace's slug from settings - if (!workspaceSlug) { - workspaceSlug = userSettings?.data?.workspace?.last_workspace_slug ?? ""; + // if workspaceSlug is not available in URL, pick last visited workspace's slug from settings + if (!workspaceSlug) { + workspaceSlug = userSettings?.data?.workspace?.last_workspace_slug ?? ""; + } + + const { workspaces } = useWorkspace(); + const allWorkspacesList = Object.values(workspaces ?? {}); + + // Fetch supported workspace IDs from API (API handles filtering based on supported_plans) + const { data: supportedWorkspaceIds, isLoading: isLoadingWorkspaces } = useSWR( + consentParams.client_id ? `supported-workspace-ids-${consentParams.client_id}` : null, + async () => { + if (!consentParams.client_id) return []; + return (await applicationService.getSupportedWorkspaceIds(consentParams.client_id)) ?? []; + } + ); + + // Filter workspaces from store based on supported workspace IDs + const workspacesList = useMemo(() => { + // Wait for API to load before filtering + if (supportedWorkspaceIds === undefined || supportedWorkspaceIds === null) { + return []; } - const { workspaces } = useWorkspace(); - const allWorkspacesList = Object.values(workspaces ?? {}); + // Filter workspaces to only include supported ones + const supportedIdsSet = new Set(supportedWorkspaceIds); + return allWorkspacesList.filter((workspace) => supportedIdsSet.has(workspace.id)); + }, [allWorkspacesList, supportedWorkspaceIds]); - // Fetch supported workspace IDs from API (API handles filtering based on supported_plans) - const { data: supportedWorkspaceIds, isLoading: isLoadingWorkspaces } = useSWR( - consentParams.client_id ? `supported-workspace-ids-${consentParams.client_id}` : null, - async () => { - if (!consentParams.client_id) return []; - return (await applicationService.getSupportedWorkspaceIds(consentParams.client_id)) ?? []; - } - ); + const workspaceFromParams = useMemo( + () => (workspacesList || []).find((workspace) => workspace.slug === workspaceSlug), + [workspacesList, workspaceSlug] + ); - // Filter workspaces from store based on supported workspace IDs - const workspacesList = useMemo(() => { - // Wait for API to load before filtering - if (supportedWorkspaceIds === undefined || supportedWorkspaceIds === null) { - return []; - } + const [selectedWorkspace, setSelectedWorkspace] = useState(undefined); + const [isSubmitting, setIsSubmitting] = useState(false); + const [csrfToken, setCsrfToken] = useState(undefined); - // Filter workspaces to only include supported ones - const supportedIdsSet = new Set(supportedWorkspaceIds); - return allWorkspacesList.filter((workspace) => supportedIdsSet.has(workspace.id)); - }, [allWorkspacesList, supportedWorkspaceIds]); + // Initialize selected workspace only once when workspaces list is available + useEffect(() => { + if (!selectedWorkspace && workspacesList.length > 0) { + const initialWorkspace = workspaceFromParams ?? workspacesList[0]; + setSelectedWorkspace(initialWorkspace); + } + }, [workspacesList, workspaceFromParams, selectedWorkspace]); - const workspaceFromParams = useMemo( - () => (workspacesList || []).find((workspace) => workspace.slug === workspaceSlug), - [workspacesList, workspaceSlug] - ); + const hasPermissions = workspacePermissions?.[selectedWorkspace?.id?.toString() ?? ""] === "allowed"; + const isInstalled = useMemo( + () => workspaceAppInstallations?.[selectedWorkspace?.id?.toString() ?? ""] ?? false, + [workspaceAppInstallations, selectedWorkspace] + ); + const handleWorkspaceChange = (workspace: IWorkspace) => { + setSelectedWorkspace(workspace); + }; - const [selectedWorkspace, setSelectedWorkspace] = useState(undefined); - const [isSubmitting, setIsSubmitting] = useState(false); - const [csrfToken, setCsrfToken] = useState(undefined); + const handleAccept = async () => { + try { + setIsSubmitting(true); + if (!selectedWorkspace || !application?.id || !csrfToken) return; - // Initialize selected workspace only once when workspaces list is available - useEffect(() => { - if (!selectedWorkspace && workspacesList.length > 0) { - const initialWorkspace = workspaceFromParams ?? workspacesList[0]; - setSelectedWorkspace(initialWorkspace); - } - }, [workspacesList, workspaceFromParams, selectedWorkspace]); + // create the installation + const installation = await applicationService.installApplication(selectedWorkspace.slug, application?.id); + // post to oauth with additional params + await oauthService.authorizeApplication(consentParams, csrfToken, { app_installation_id: installation?.id }); + return; + } catch (error) { + console.error(error); + setToast({ + type: TOAST_TYPE.ERROR, + title: "Error", + message: "Failed to authorize application", + }); + setIsSubmitting(false); + } finally { + setIsSubmitting(false); + } + }; - const hasPermissions = workspacePermissions?.[selectedWorkspace?.id?.toString() ?? ""] === "allowed"; - const isInstalled = useMemo( - () => workspaceAppInstallations?.[selectedWorkspace?.id?.toString() ?? ""] ?? false, - [workspaceAppInstallations, selectedWorkspace] - ); - const handleWorkspaceChange = (workspace: IWorkspace) => { - setSelectedWorkspace(workspace); - }; + const handleCancel = () => { + router.back(); + }; - const handleAccept = async () => { - try { - setIsSubmitting(true); - if (!selectedWorkspace || !application?.id || !csrfToken) return; + const fetchCsrfToken = async () => { + const data = await authService.requestCSRFToken(); + if (data?.csrf_token) { + setCsrfToken(data.csrf_token); + } + }; - // create the installation - const installation = await applicationService.installApplication(selectedWorkspace.slug, application?.id); - // post to oauth with additional params - await oauthService.authorizeApplication(consentParams, csrfToken, { app_installation_id: installation?.id }); - return; - } catch (error) { - console.error(error); - setToast({ - type: TOAST_TYPE.ERROR, - title: "Error", - message: "Failed to authorize application", - }); - setIsSubmitting(false); - } finally { - setIsSubmitting(false); - } - }; + useEffect(() => { + if (csrfToken === undefined) { + fetchCsrfToken(); + } + // redirect only if the workspace slug is available from the params + if (isInstalled && workspaceSlugFromParams) { + handleAccept(); + } + }, [csrfToken, isInstalled]); - const handleCancel = () => { - router.back(); - }; - - const fetchCsrfToken = async () => { - const data = await authService.requestCSRFToken(); - if (data?.csrf_token) { - setCsrfToken(data.csrf_token); - } - }; - - useEffect(() => { - if (csrfToken === undefined) { - fetchCsrfToken(); - } - // redirect only if the workspace slug is available from the params - if (isInstalled && workspaceSlugFromParams) { - handleAccept(); - } - }, [csrfToken, isInstalled]); - - return ( -
    -
    - {application?.logo_url ? ( - Plane logo - ) : ( -
    - {application?.name?.[0] ?? "..."} -
    - )} - Connect - -
    -

    {t("workspace_settings.settings.applications.app_consent_title", { app: application?.name })}

    - - {!application?.published_at && !application?.is_internal && ( -
    -
    - -
    -
    - {t("workspace_settings.settings.applications.app_consent_unapproved_title")} -
    -
    - {t("workspace_settings.settings.applications.app_consent_unapproved_description")} -
    -
    -
    + return ( +
    +
    + {application?.logo_url ? ( + Plane logo + ) : ( +
    + {application?.name?.[0] ?? "..."}
    )} + Connect + +
    +

    {t("workspace_settings.settings.applications.app_consent_title", { app: application?.name })}

    -
    -
    - {t("workspace_settings.settings.applications.choose_workspace_to_connect_app_with")} + {!application?.published_at && !application?.is_internal && ( +
    +
    + +
    +
    + {t("workspace_settings.settings.applications.app_consent_unapproved_title")} +
    +
    + {t("workspace_settings.settings.applications.app_consent_unapproved_description")} +
    +
    - {isLoadingWorkspaces ? ( -
    Loading workspaces...
    - ) : workspacesList.length > 0 ? ( - - {selectedWorkspace ? ( - - ) : ( - Select workspace... - )} - -
    - } - customButtonClassName="flex flex-grow border border-custom-border-200 rounded-md p-2 bg-custom-background-100 text-custom-text-200 text-sm w-40" - closeOnSelect - disabled={disableDropdown} - > - {workspacesList.map((workspace) => ( - { - handleWorkspaceChange(workspace); - }} - className={cn( - "flex items-center gap-2", - selectedWorkspace?.id === workspace.id && "bg-custom-background-80" - )} - > - - - ))} - - ) : ( -
    No workspaces available for this application.
    - )} - {hasPermissions ? ( - <> -
    -
    - {t("workspace_settings.settings.applications.app_consent_workspace_permissions_title", { - app: application?.name, - })} -
    -
    - {workspaceLevelPermissions.map((permission) => ( - - ))} -
    +
    + )} + +
    +
    + {t("workspace_settings.settings.applications.choose_workspace_to_connect_app_with")} +
    + {isLoadingWorkspaces ? ( +
    Loading workspaces...
    + ) : workspacesList.length > 0 ? ( + + {selectedWorkspace ? ( + + ) : ( + Select workspace... + )} +
    -
    -
    - {t("workspace_settings.settings.applications.user_permissions")} -
    -
    - {t("workspace_settings.settings.applications.app_consent_user_permissions_title", { - app: application?.name, - })} -
    + } + customButtonClassName="flex flex-grow border border-custom-border-200 rounded-md p-2 bg-custom-background-100 text-custom-text-200 text-sm w-40" + closeOnSelect + disabled={disableDropdown} + > + {workspacesList.map((workspace) => ( + { + handleWorkspaceChange(workspace); + }} + className={cn( + "flex items-center gap-2", + selectedWorkspace?.id === workspace.id && "bg-custom-background-80" + )} + > + + + ))} + + ) : ( +
    No workspaces available for this application.
    + )} + {hasPermissions ? ( + <> +
    +
    + {t("workspace_settings.settings.applications.app_consent_workspace_permissions_title", { + app: application?.name, + })}
    -
    - {userLevelPermissions.map((permission) => ( +
    + {workspaceLevelPermissions.map((permission) => ( ))}
    +
    +
    +
    + {t("workspace_settings.settings.applications.user_permissions")} +
    +
    + {t("workspace_settings.settings.applications.app_consent_user_permissions_title", { + app: application?.name, + })} +
    +
    +
    + {userLevelPermissions.map((permission) => ( + + ))} +
    -
    -
    - {t("workspace_settings.settings.applications.app_consent_accept_title")} -
    -
      -
    • {t("workspace_settings.settings.applications.app_consent_accept_1")}
      • -
    • - {t("workspace_settings.settings.applications.app_consent_accept_2", { app: application?.name })} -
      • -
    +
    +
    + {t("workspace_settings.settings.applications.app_consent_accept_title")}
    - - ) : ( - <> -
    -
    - -
    - {t("workspace_settings.settings.applications.app_consent_no_access_description")} -
    +
      +
    • {t("workspace_settings.settings.applications.app_consent_accept_1")}
      • +
    • + {t("workspace_settings.settings.applications.app_consent_accept_2", { app: application?.name })} +
      • +
    +
    + + ) : ( + <> +
    +
    + +
    + {t("workspace_settings.settings.applications.app_consent_no_access_description")}
    - - )} -
    -
    - {hasPermissions && ( - - )} - -
    +
    + + )}
    - ); - } -); +
    + {hasPermissions && ( + + )} + +
    +
    + ); +}); -const WorkspaceDetails = (props: { workspace: IWorkspace }) => { +function WorkspaceDetails(props: { workspace: IWorkspace }) { const { workspace } = props; return ( <> @@ -324,4 +320,4 @@ const WorkspaceDetails = (props: { workspace: IWorkspace }) => { {workspace?.name} ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/banner.tsx b/apps/web/ee/components/mobile/authentication/banner.tsx index aaccf686a4..bd7465547a 100644 --- a/apps/web/ee/components/mobile/authentication/banner.tsx +++ b/apps/web/ee/components/mobile/authentication/banner.tsx @@ -10,7 +10,7 @@ type TMobileAuthBanner = { handleBannerData?: (bannerData: TMobileAuthErrorInfo | undefined) => void; }; -export const MobileAuthBanner: FC = (props) => { +export function MobileAuthBanner(props: TMobileAuthBanner) { const { bannerData, handleBannerData } = props; // translation const { t } = useTranslation(); @@ -36,4 +36,4 @@ export const MobileAuthBanner: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/forms/email-confirmation.tsx b/apps/web/ee/components/mobile/authentication/forms/email-confirmation.tsx index 08fbb86df6..e09350fa06 100644 --- a/apps/web/ee/components/mobile/authentication/forms/email-confirmation.tsx +++ b/apps/web/ee/components/mobile/authentication/forms/email-confirmation.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, FormEvent } from "react"; import { useMemo, useRef, useState } from "react"; import { CircleAlert, XCircle } from "lucide-react"; @@ -23,7 +21,7 @@ type TMobileAuthEmailValidationForm = { generateEmailUniqueCode: (email: string) => Promise<{ code: string } | undefined>; }; -export const MobileAuthEmailValidationForm: FC = (props) => { +export function MobileAuthEmailValidationForm(props: TMobileAuthEmailValidationForm) { const { email: defaultEmail, handleEmail, @@ -160,4 +158,4 @@ export const MobileAuthEmailValidationForm: FC =
    ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/forms/password-strength-meter.tsx b/apps/web/ee/components/mobile/authentication/forms/password-strength-meter.tsx index 5f1ca5ed2b..6390d38ee8 100644 --- a/apps/web/ee/components/mobile/authentication/forms/password-strength-meter.tsx +++ b/apps/web/ee/components/mobile/authentication/forms/password-strength-meter.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useMemo } from "react"; import { E_PASSWORD_STRENGTH } from "@plane/constants"; @@ -10,7 +8,7 @@ type TMobilePasswordStrengthMeter = { isFocused?: boolean; }; -export const MobilePasswordStrengthMeter: FC = (props) => { +export function MobilePasswordStrengthMeter(props: TMobilePasswordStrengthMeter) { const { password, isFocused = false } = props; // derived values @@ -72,4 +70,4 @@ export const MobilePasswordStrengthMeter: FC = (pr
    ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/forms/password.tsx b/apps/web/ee/components/mobile/authentication/forms/password.tsx index 5496763306..9076e1c16f 100644 --- a/apps/web/ee/components/mobile/authentication/forms/password.tsx +++ b/apps/web/ee/components/mobile/authentication/forms/password.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useRef, useState } from "react"; import { Eye, EyeOff, XCircle } from "lucide-react"; @@ -40,7 +38,7 @@ const defaultFormValues: TFormValues = { passwordConfirmation: "", }; -export const MobileAuthPasswordForm: FC = (props) => { +export function MobileAuthPasswordForm(props: TMobileAuthPasswordForm) { const { authMode, invitationId, email, handleEmail, handleAuthStep, generateEmailUniqueCode, isSMTPConfigured } = props; // ref @@ -257,4 +255,4 @@ export const MobileAuthPasswordForm: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/forms/unique-code.tsx b/apps/web/ee/components/mobile/authentication/forms/unique-code.tsx index cfae9d6bd1..74d1c73b48 100644 --- a/apps/web/ee/components/mobile/authentication/forms/unique-code.tsx +++ b/apps/web/ee/components/mobile/authentication/forms/unique-code.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useRef, useState } from "react"; import { CircleCheck, XCircle } from "lucide-react"; @@ -34,7 +32,7 @@ const defaultFormValues: TFormValues = { const defaultResetTimerValue = 5; -export const MobileAuthUniqueCodeForm: FC = (props) => { +export function MobileAuthUniqueCodeForm(props: TMobileAuthUniqueCodeForm) { const { authMode, invitationId, email, handleEmail, handleAuthStep, generateEmailUniqueCode } = props; // ref const authFormRef = useRef(null); @@ -176,4 +174,4 @@ export const MobileAuthUniqueCodeForm: FC = (props) =
    ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/header.tsx b/apps/web/ee/components/mobile/authentication/header.tsx index 01b52f9b52..f15f783414 100644 --- a/apps/web/ee/components/mobile/authentication/header.tsx +++ b/apps/web/ee/components/mobile/authentication/header.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import type { TMobileAuthModes, TMobileAuthSteps } from "@plane/constants"; import { EMobileAuthModes, EMobileAuthSteps } from "@plane/constants"; @@ -42,7 +40,7 @@ type TMobileAuthHeader = { invitationDetails: TMobileWorkspaceInvitation | undefined; }; -export const MobileAuthHeader: FC = (props) => { +export function MobileAuthHeader(props: TMobileAuthHeader) { // props const { authMode, authStep, invitationDetails } = props; @@ -75,4 +73,4 @@ export const MobileAuthHeader: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/o-auth/github.tsx b/apps/web/ee/components/mobile/authentication/o-auth/github.tsx index 0284864d6d..799b9d11da 100644 --- a/apps/web/ee/components/mobile/authentication/o-auth/github.tsx +++ b/apps/web/ee/components/mobile/authentication/o-auth/github.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTheme } from "next-themes"; // helpers @@ -13,7 +11,7 @@ export type TGitHubAuthButton = { invitationId?: string; }; -export const GitHubAuthButton: FC = (props) => { +export function GitHubAuthButton(props: TGitHubAuthButton) { // props const { title, invitationId } = props; // hooks @@ -41,4 +39,4 @@ export const GitHubAuthButton: FC = (props) => { {title} ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/o-auth/google.tsx b/apps/web/ee/components/mobile/authentication/o-auth/google.tsx index 1c03e5b907..2489f57889 100644 --- a/apps/web/ee/components/mobile/authentication/o-auth/google.tsx +++ b/apps/web/ee/components/mobile/authentication/o-auth/google.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTheme } from "next-themes"; // helpers @@ -12,7 +10,7 @@ export type TGoogleAuthButton = { invitationId?: string; }; -export const GoogleAuthButton: FC = (props) => { +export function GoogleAuthButton(props: TGoogleAuthButton) { // props const { title, invitationId } = props; // hooks @@ -35,4 +33,4 @@ export const GoogleAuthButton: FC = (props) => { {title} ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/o-auth/oidc.tsx b/apps/web/ee/components/mobile/authentication/o-auth/oidc.tsx index 2b2bfc9fbc..f52c2eae34 100644 --- a/apps/web/ee/components/mobile/authentication/o-auth/oidc.tsx +++ b/apps/web/ee/components/mobile/authentication/o-auth/oidc.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTheme } from "next-themes"; import { Key } from "lucide-react"; @@ -11,7 +9,7 @@ export type TOIDCAuthButton = { invitationId?: string; }; -export const OIDCAuthButton: FC = (props) => { +export function OIDCAuthButton(props: TOIDCAuthButton) { // props const { title, invitationId } = props; // hooks @@ -34,4 +32,4 @@ export const OIDCAuthButton: FC = (props) => { {title} ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/o-auth/root.tsx b/apps/web/ee/components/mobile/authentication/o-auth/root.tsx index b2515579ca..712db3a186 100644 --- a/apps/web/ee/components/mobile/authentication/o-auth/root.tsx +++ b/apps/web/ee/components/mobile/authentication/o-auth/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import type { TInstanceConfig, TMobileWorkspaceInvitation } from "@plane/types"; // plane web components @@ -13,7 +11,7 @@ type TOAuthRoot = { config: TInstanceConfig; }; -export const OAuthRoot: FC = (props) => { +export function OAuthRoot(props: TOAuthRoot) { const { invitationDetails, config } = props; // derived values @@ -63,4 +61,4 @@ export const OAuthRoot: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/o-auth/saml.tsx b/apps/web/ee/components/mobile/authentication/o-auth/saml.tsx index c12b96d854..259709c690 100644 --- a/apps/web/ee/components/mobile/authentication/o-auth/saml.tsx +++ b/apps/web/ee/components/mobile/authentication/o-auth/saml.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useTheme } from "next-themes"; import { Key } from "lucide-react"; @@ -11,7 +9,7 @@ export type TSAMLButton = { invitationId?: string; }; -export const SAMLButton: FC = (props) => { +export function SAMLButton(props: TSAMLButton) { // props const { title, invitationId } = props; // hooks @@ -34,4 +32,4 @@ export const SAMLButton: FC = (props) => { {title} ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/root.tsx b/apps/web/ee/components/mobile/authentication/root.tsx index e047dd723f..5bcfa4e861 100644 --- a/apps/web/ee/components/mobile/authentication/root.tsx +++ b/apps/web/ee/components/mobile/authentication/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useState } from "react"; import { useSearchParams } from "next/navigation"; @@ -49,7 +47,7 @@ type TAuthRoot = { config: TInstanceConfig; }; -export const AuthRoot: FC = (props) => { +export function AuthRoot(props: TAuthRoot) { const { config } = props; // router const searchParams = useSearchParams(); @@ -90,7 +88,7 @@ export const AuthRoot: FC = (props) => { // validating and defining the errors useEffect(() => { if (!errorCodeParam) return; - const errorhandler = mobileAuthErrorHandler(errorCodeParam?.toString() as TMobileAuthErrorCodes); + const errorhandler = mobileAuthErrorHandler(errorCodeParam?.toString()); if (!errorhandler) return; // password handler if (PASSWORD_ERROR_CODES.includes(errorhandler.code)) setAuthStep(EMobileAuthSteps.PASSWORD); @@ -165,4 +163,4 @@ export const AuthRoot: FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/mobile/authentication/terms-and-conditions.tsx b/apps/web/ee/components/mobile/authentication/terms-and-conditions.tsx index ed754bacf6..94caa434b6 100644 --- a/apps/web/ee/components/mobile/authentication/terms-and-conditions.tsx +++ b/apps/web/ee/components/mobile/authentication/terms-and-conditions.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import Link from "next/link"; import { EAuthModes } from "@plane/constants"; @@ -20,18 +18,22 @@ const MESSAGES = { } as const; // Reusable link component to reduce duplication -const LegalLink: React.FC<{ href: string; children: React.ReactNode }> = ({ href, children }) => ( - - {children} - -); +function LegalLink({ href, children }: { href: string; children: React.ReactNode }) { + return ( + + {children} + + ); +} -export const MobileTermsAndConditions: React.FC = ({ authType = EAuthModes.SIGN_IN }) => ( -
    -

    - {`${MESSAGES[authType]}, you understand and agree to \n our `} - Terms of Service and{" "} - Privacy Policy. -

    -
    -); +export function MobileTermsAndConditions({ authType = EAuthModes.SIGN_IN }: TermsAndConditionsProps) { + return ( +
    +

    + {`${MESSAGES[authType]}, you understand and agree to \n our `} + Terms of Service and{" "} + Privacy Policy. +

    +
    + ); +} diff --git a/apps/web/ee/components/mobile/authentication/wrappers/invitation.tsx b/apps/web/ee/components/mobile/authentication/wrappers/invitation.tsx index f9c513aff3..47d958b38a 100644 --- a/apps/web/ee/components/mobile/authentication/wrappers/invitation.tsx +++ b/apps/web/ee/components/mobile/authentication/wrappers/invitation.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC, ReactNode } from "react"; import { useEffect } from "react"; import useSWR from "swr"; @@ -15,7 +13,7 @@ type TMobileAuthInvitationWrapper = { children: ReactNode; }; -export const MobileAuthInvitationWrapper: FC = (props) => { +export function MobileAuthInvitationWrapper(props: TMobileAuthInvitationWrapper) { // props const { invitationId, email, handleInvitationDetails, children } = props; @@ -52,4 +50,4 @@ export const MobileAuthInvitationWrapper: FC = (pr } return
    {children}
    ; -}; +} diff --git a/apps/web/ee/components/navigations/top-nav-search.tsx b/apps/web/ee/components/navigations/top-nav-search.tsx index 1e6fb1693b..f049db53fc 100644 --- a/apps/web/ee/components/navigations/top-nav-search.tsx +++ b/apps/web/ee/components/navigations/top-nav-search.tsx @@ -12,7 +12,7 @@ import { cn } from "@plane/utils"; import { usePowerK } from "@/hooks/store/use-power-k"; import { useExpandableSearch } from "@/hooks/use-expandable-search"; -export const TopNavSearch = observer(() => { +export const TopNavSearch = observer(function TopNavSearch() { // states const [searchQuery, setSearchQuery] = useState(""); const [flattenedSearchResults, setFlattenedSearchResults] = useState([]); diff --git a/apps/web/ee/components/navigations/top-navigation-root.tsx b/apps/web/ee/components/navigations/top-navigation-root.tsx index 5699d95c16..c1127b3f7f 100644 --- a/apps/web/ee/components/navigations/top-navigation-root.tsx +++ b/apps/web/ee/components/navigations/top-navigation-root.tsx @@ -27,7 +27,7 @@ import { DesktopHeaderProvider } from "../desktop/root"; import { WorkspaceAppSwitcher } from "../workspace/app-switcher"; import { TopNavSearch } from "./top-nav-search"; -export const TopNavigationRoot = observer(() => { +export const TopNavigationRoot = observer(function TopNavigationRoot() { // store hooks const { config } = useInstance(); const { togglePiChatDrawer, isPiChatDrawerOpen } = usePiChat(); diff --git a/apps/web/ee/components/pages/badge/archived-badge.tsx b/apps/web/ee/components/pages/badge/archived-badge.tsx index 2473e5dd16..07c0ecf705 100644 --- a/apps/web/ee/components/pages/badge/archived-badge.tsx +++ b/apps/web/ee/components/pages/badge/archived-badge.tsx @@ -1,6 +1,6 @@ import { ArchiveIcon } from "@plane/propel/icons"; import { Badge } from "./badge"; -export const ArchivedBadge: React.FC = () => ( - } /> -); +export function ArchivedBadge() { + return } />; +} diff --git a/apps/web/ee/components/pages/badge/badge.tsx b/apps/web/ee/components/pages/badge/badge.tsx index 334cbd92e0..926ed2d077 100644 --- a/apps/web/ee/components/pages/badge/badge.tsx +++ b/apps/web/ee/components/pages/badge/badge.tsx @@ -1,6 +1,8 @@ -export const Badge = ({ text, icon }: { text: string; icon?: React.ReactNode }) => ( -
    - {icon} - {text} -
    -); +export function Badge({ text, icon }: { text: string; icon?: React.ReactNode }) { + return ( +
    + {icon} + {text} +
    + ); +} diff --git a/apps/web/ee/components/pages/badge/moved-badge.tsx b/apps/web/ee/components/pages/badge/moved-badge.tsx index 554efd0a7a..ce4571ac15 100644 --- a/apps/web/ee/components/pages/badge/moved-badge.tsx +++ b/apps/web/ee/components/pages/badge/moved-badge.tsx @@ -1,3 +1,5 @@ import { Badge } from "./badge"; -export const MovedBadge: React.FC = () => ; +export function MovedBadge() { + return ; +} diff --git a/apps/web/ee/components/pages/collaborators-list.tsx b/apps/web/ee/components/pages/collaborators-list.tsx index a8982dbb00..9cc6bb52b6 100644 --- a/apps/web/ee/components/pages/collaborators-list.tsx +++ b/apps/web/ee/components/pages/collaborators-list.tsx @@ -16,7 +16,7 @@ interface CollaboratorsListProps { className?: string; } -export const CollaboratorsList = observer((props: CollaboratorsListProps) => { +export const CollaboratorsList = observer(function CollaboratorsList(props: CollaboratorsListProps) { const { page, initialVisibleCount = 3, expandedVisibleCount = 7, className = "mr-3" } = props; const [isGroupHovered, setIsGroupHovered] = useState(false); diff --git a/apps/web/ee/components/pages/comments/comment-avatar.tsx b/apps/web/ee/components/pages/comments/comment-avatar.tsx index fd779d2f56..0a370eb056 100644 --- a/apps/web/ee/components/pages/comments/comment-avatar.tsx +++ b/apps/web/ee/components/pages/comments/comment-avatar.tsx @@ -10,7 +10,11 @@ type PageCommentAvatarProps = { className?: string; }; -export const PageCommentAvatar = observer(({ userId, size = "sm", className = "" }: PageCommentAvatarProps) => { +export const PageCommentAvatar = observer(function PageCommentAvatar({ + userId, + size = "sm", + className = "", +}: PageCommentAvatarProps) { const { workspace: { getWorkspaceMemberDetails }, } = useMember(); diff --git a/apps/web/ee/components/pages/comments/comment-creation-handler.tsx b/apps/web/ee/components/pages/comments/comment-creation-handler.tsx index 21b0ce1d0d..dfc4c17082 100644 --- a/apps/web/ee/components/pages/comments/comment-creation-handler.tsx +++ b/apps/web/ee/components/pages/comments/comment-creation-handler.tsx @@ -31,7 +31,7 @@ type CommentHandlers = { onCreateCommentMark?: (selection: { from: number; to: number }, commentId: string) => void; onScrollToElement: ( element: HTMLElement, - // eslint-disable-next-line + options?: { behavior?: ScrollBehavior; block?: "start" | "center" | "end"; offset?: number } ) => void; }; @@ -43,131 +43,134 @@ export type CommentComposerProps = { handlers: CommentHandlers; }; -export const PageCommentCreationHandler = observer( - ({ page, workspaceConfig, pendingComment, handlers }: CommentComposerProps) => { - const { workspaceSlug, workspaceId } = workspaceConfig; - const { onPendingCommentCancel, onRegisterStartNewComment, onCreateCommentMark, onScrollToElement } = handlers; - const newCommentBoxRef = useRef(null); +export const PageCommentCreationHandler = observer(function PageCommentCreationHandler({ + page, + workspaceConfig, + pendingComment, + handlers, +}: CommentComposerProps) { + const { workspaceSlug, workspaceId } = workspaceConfig; + const { onPendingCommentCancel, onRegisterStartNewComment, onCreateCommentMark, onScrollToElement } = handlers; + const newCommentBoxRef = useRef(null); - const { - showNewCommentBox, - isSubmittingComment, - newCommentSelection, - handleAddComment, - handleNewCommentCancel, - handleStartNewComment, - } = useNewComment({ page, onCreateCommentMark }); + const { + showNewCommentBox, + isSubmittingComment, + newCommentSelection, + handleAddComment, + handleNewCommentCancel, + handleStartNewComment, + } = useNewComment({ page, onCreateCommentMark }); - // Register the start new comment handler - useEffect(() => { - if (onRegisterStartNewComment) { - onRegisterStartNewComment(handleStartNewComment); - } - }, [handleStartNewComment, onRegisterStartNewComment]); - - // Auto-scroll to pending comment box - useEffect(() => { - if (pendingComment && newCommentBoxRef.current) { - const scrollToNewComment = () => { - if (newCommentBoxRef.current) { - onScrollToElement(newCommentBoxRef.current, { block: "start", offset: SCROLL_OFFSET }); - } - }; - - const timeouts = [ - setTimeout(scrollToNewComment, SCROLL_DELAY_SHORT), - setTimeout(scrollToNewComment, SCROLL_DELAY_LONG), - ]; - return () => timeouts.forEach(clearTimeout); - } - }, [pendingComment, onScrollToElement]); - - const showCommentBox = showNewCommentBox || pendingComment; - const referenceText = pendingComment?.referenceText || newCommentSelection?.referenceText; - const commentSelection = pendingComment - ? { - from: pendingComment.selection.from, - to: pendingComment.selection.to, - referenceText: pendingComment.referenceText, - } - : newCommentSelection; - - const handleCancel = () => { - handleNewCommentCancel({ pendingComment, onPendingCommentCancel }); - }; - - const handleSubmit = async (data: { - description: { description_html: string; description_json: JSONContent }; - uploadedAssetIds: string[]; - }) => { - handleAddComment({ data, pendingComment, onPendingCommentCancel }); - - // Update bulk asset status - if (data.uploadedAssetIds.length > 0 && page.id) { - if (page.project_ids?.length && page.project_ids?.length > 0) { - await fileService.updateBulkProjectAssetsUploadStatus(workspaceSlug, page.project_ids[0], page.id, { - asset_ids: data.uploadedAssetIds, - }); - } else { - await fileService.updateBulkWorkspaceAssetsUploadStatus(workspaceSlug, page.id, { - asset_ids: data.uploadedAssetIds, - }); - } - } - }; - - if (!showCommentBox || !page.canCurrentUserCommentOnPage) { - return null; + // Register the start new comment handler + useEffect(() => { + if (onRegisterStartNewComment) { + onRegisterStartNewComment(handleStartNewComment); } + }, [handleStartNewComment, onRegisterStartNewComment]); - return ( -
    - {/* Reference Text Quote with Overlay Cancel Button */} - {referenceText && ( -
    -
    -

    {referenceText}

    - -
    - )} + // Auto-scroll to pending comment box + useEffect(() => { + if (pendingComment && newCommentBoxRef.current) { + const scrollToNewComment = () => { + if (newCommentBoxRef.current) { + onScrollToElement(newCommentBoxRef.current, { block: "start", offset: SCROLL_OFFSET }); + } + }; - {/* Cancel Button for when there's no reference text */} - {!referenceText && ( -
    - -
    - )} + const timeouts = [ + setTimeout(scrollToNewComment, SCROLL_DELAY_SHORT), + setTimeout(scrollToNewComment, SCROLL_DELAY_LONG), + ]; + return () => timeouts.forEach(clearTimeout); + } + }, [pendingComment, onScrollToElement]); - -
    - ); + const showCommentBox = showNewCommentBox || pendingComment; + const referenceText = pendingComment?.referenceText || newCommentSelection?.referenceText; + const commentSelection = pendingComment + ? { + from: pendingComment.selection.from, + to: pendingComment.selection.to, + referenceText: pendingComment.referenceText, + } + : newCommentSelection; + + const handleCancel = () => { + handleNewCommentCancel({ pendingComment, onPendingCommentCancel }); + }; + + const handleSubmit = async (data: { + description: { description_html: string; description_json: JSONContent }; + uploadedAssetIds: string[]; + }) => { + handleAddComment({ data, pendingComment, onPendingCommentCancel }); + + // Update bulk asset status + if (data.uploadedAssetIds.length > 0 && page.id) { + if (page.project_ids?.length && page.project_ids?.length > 0) { + await fileService.updateBulkProjectAssetsUploadStatus(workspaceSlug, page.project_ids[0], page.id, { + asset_ids: data.uploadedAssetIds, + }); + } else { + await fileService.updateBulkWorkspaceAssetsUploadStatus(workspaceSlug, page.id, { + asset_ids: data.uploadedAssetIds, + }); + } + } + }; + + if (!showCommentBox || !page.canCurrentUserCommentOnPage) { + return null; } -); + + return ( +
    + {/* Reference Text Quote with Overlay Cancel Button */} + {referenceText && ( +
    +
    +

    {referenceText}

    + +
    + )} + + {/* Cancel Button for when there's no reference text */} + {!referenceText && ( +
    + +
    + )} + + +
    + ); +}); diff --git a/apps/web/ee/components/pages/comments/comment-display.tsx b/apps/web/ee/components/pages/comments/comment-display.tsx index 3c622b1072..a377215331 100644 --- a/apps/web/ee/components/pages/comments/comment-display.tsx +++ b/apps/web/ee/components/pages/comments/comment-display.tsx @@ -25,7 +25,12 @@ type CommentItemProps = { className?: string; }; -export const PageCommentDisplay = observer(({ comment, page, isParent, className = "" }: CommentItemProps) => { +export const PageCommentDisplay = observer(function PageCommentDisplay({ + comment, + page, + isParent, + className = "", +}: CommentItemProps) { // Local state for UI controls (optimized to only essential states) const [isEditing, setIsEditing] = useState(false); const [deleteCommentModal, setDeleteCommentModal] = useState(false); diff --git a/apps/web/ee/components/pages/comments/comment-filter-controls.tsx b/apps/web/ee/components/pages/comments/comment-filter-controls.tsx index d6bc59a01d..8d31fc7ee8 100644 --- a/apps/web/ee/components/pages/comments/comment-filter-controls.tsx +++ b/apps/web/ee/components/pages/comments/comment-filter-controls.tsx @@ -12,7 +12,10 @@ export type CommentFiltersProps = { onFilterChange: (filterKey: "showAll" | "showActive" | "showResolved") => void; }; -export const PageCommentFilterControls = observer(({ filters, onFilterChange }: CommentFiltersProps) => { +export const PageCommentFilterControls = observer(function PageCommentFilterControls({ + filters, + onFilterChange, +}: CommentFiltersProps) { const isFiltersApplied = filters.showActive || filters.showResolved; return ( diff --git a/apps/web/ee/components/pages/comments/comment-form.tsx b/apps/web/ee/components/pages/comments/comment-form.tsx index 5cb2e15e35..dadb7c40c9 100644 --- a/apps/web/ee/components/pages/comments/comment-form.tsx +++ b/apps/web/ee/components/pages/comments/comment-form.tsx @@ -56,7 +56,7 @@ export const EMPTY_COMMENT_JSON: JSONContent = { ], }; -export const PageCommentForm = observer((props: CommentBoxProps) => { +export const PageCommentForm = observer(function PageCommentForm(props: CommentBoxProps) { const { workspaceSlug, page, diff --git a/apps/web/ee/components/pages/comments/comment-reply-controller.tsx b/apps/web/ee/components/pages/comments/comment-reply-controller.tsx index c0547d0eef..0e45d726dc 100644 --- a/apps/web/ee/components/pages/comments/comment-reply-controller.tsx +++ b/apps/web/ee/components/pages/comments/comment-reply-controller.tsx @@ -9,29 +9,32 @@ type TCommentReplyController = { page: TPageInstance; }; -export const PageCommentReplyController = observer( - ({ comment, handleShowRepliesToggle, showReplies, page }: TCommentReplyController) => { - // Use centralized thread display state for consistency - const threadState = page.comments.getThreadDisplayState(comment.id, showReplies); +export const PageCommentReplyController = observer(function PageCommentReplyController({ + comment, + handleShowRepliesToggle, + showReplies, + page, +}: TCommentReplyController) { + // Use centralized thread display state for consistency + const threadState = page.comments.getThreadDisplayState(comment.id, showReplies); - if (!threadState || !threadState.shouldShowReplyController) return null; + if (!threadState || !threadState.shouldShowReplyController) return null; - return ( -
    -
    -
    -
    - -
    + return ( +
    +
    +
    +
    +
    - ); - } -); +
    + ); +}); diff --git a/apps/web/ee/components/pages/comments/comment-timestamp-display.tsx b/apps/web/ee/components/pages/comments/comment-timestamp-display.tsx index 2f9a3efacf..de1c7b5ea6 100644 --- a/apps/web/ee/components/pages/comments/comment-timestamp-display.tsx +++ b/apps/web/ee/components/pages/comments/comment-timestamp-display.tsx @@ -7,14 +7,16 @@ type TimeDisplayProps = { showResolved?: boolean; }; -export const PageCommentTimestampDisplay = ({ timestamp, className = "", showResolved = false }: TimeDisplayProps) => ( -
    - {calculateTimeAgoShort(timestamp)} - {showResolved && Resolved} -
    -); +export function PageCommentTimestampDisplay({ timestamp, className = "", showResolved = false }: TimeDisplayProps) { + return ( +
    + {calculateTimeAgoShort(timestamp)} + {showResolved && Resolved} +
    + ); +} diff --git a/apps/web/ee/components/pages/comments/comment-user-details.tsx b/apps/web/ee/components/pages/comments/comment-user-details.tsx index db63995ab2..daea7c6410 100644 --- a/apps/web/ee/components/pages/comments/comment-user-details.tsx +++ b/apps/web/ee/components/pages/comments/comment-user-details.tsx @@ -12,7 +12,11 @@ type PageCommentUserDetailsProps = { className?: string; }; -export const PageCommentUserDetails = observer(({ userId, timestamp, className = "" }: PageCommentUserDetailsProps) => { +export const PageCommentUserDetails = observer(function PageCommentUserDetails({ + userId, + timestamp, + className = "", +}: PageCommentUserDetailsProps) { const { workspace: { getWorkspaceMemberDetails }, } = useMember(); diff --git a/apps/web/ee/components/pages/comments/comments-navigation-extension.tsx b/apps/web/ee/components/pages/comments/comments-navigation-extension.tsx index 51ef8359ea..eac8014fb9 100644 --- a/apps/web/ee/components/pages/comments/comments-navigation-extension.tsx +++ b/apps/web/ee/components/pages/comments/comments-navigation-extension.tsx @@ -1,13 +1,15 @@ -import React, { useCallback, useState, useEffect } from "react"; +import { useCallback, useState, useEffect } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // types -import type { INavigationPaneExtensionComponent } from "@/components/pages/navigation-pane/types"; +import type { INavigationPaneExtensionProps } from "@/components/pages/navigation-pane/types"; // local components import { usePageStore } from "@/plane-web/hooks/store"; import { PageCommentsSidebarPanel } from "./comments-sidebar-panel"; -export const PageCommentsNavigationExtension: INavigationPaneExtensionComponent = observer((props) => { +export const PageCommentsNavigationExtension = observer(function PageCommentsNavigationExtension( + props: INavigationPaneExtensionProps +) { const { page, extensionData, storeType } = props; const { isCommentsEnabled } = usePageStore(storeType); const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/pages/comments/comments-sidebar-panel.tsx b/apps/web/ee/components/pages/comments/comments-sidebar-panel.tsx index 3136da324d..4008fc7766 100644 --- a/apps/web/ee/components/pages/comments/comments-sidebar-panel.tsx +++ b/apps/web/ee/components/pages/comments/comments-sidebar-panel.tsx @@ -33,7 +33,7 @@ export type ThreadsSidebarProps = { handlers?: CommentHandlers; }; -export const PageCommentsSidebarPanel = observer(function ThreadsSidebar({ +export const PageCommentsSidebarPanel = observer(function PageCommentsSidebarPanel({ page, selectedThreadId, pendingComment, diff --git a/apps/web/ee/components/pages/comments/comments-thread-list.tsx b/apps/web/ee/components/pages/comments/comments-thread-list.tsx index e79605e8c0..7c1108c4fd 100644 --- a/apps/web/ee/components/pages/comments/comments-thread-list.tsx +++ b/apps/web/ee/components/pages/comments/comments-thread-list.tsx @@ -11,27 +11,30 @@ export type CommentsListProps = { onSetItemRef: (id: string) => (element: HTMLDivElement | null) => void; }; -export const PageCommentsThreadList = observer( - ({ comments, page, selectedThreadId, onSetItemRef }: CommentsListProps) => { - const commentsFilters = page.comments.commentsFilters; - const isFiltering = - commentsFilters && (!commentsFilters.showAll || !commentsFilters.showActive || !commentsFilters.showResolved); +export const PageCommentsThreadList = observer(function PageCommentsThreadList({ + comments, + page, + selectedThreadId, + onSetItemRef, +}: CommentsListProps) { + const commentsFilters = page.comments.commentsFilters; + const isFiltering = + commentsFilters && (!commentsFilters.showAll || !commentsFilters.showActive || !commentsFilters.showResolved); - return ( -
    - {comments.map((comment) => ( - - ))} -
    - ); - } -); + return ( +
    + {comments.map((comment) => ( + + ))} +
    + ); +}); diff --git a/apps/web/ee/components/pages/comments/reply-loading-skeleton.tsx b/apps/web/ee/components/pages/comments/reply-loading-skeleton.tsx index 2681720539..ecf58de203 100644 --- a/apps/web/ee/components/pages/comments/reply-loading-skeleton.tsx +++ b/apps/web/ee/components/pages/comments/reply-loading-skeleton.tsx @@ -4,26 +4,28 @@ type PageCommentReplyLoadingSkeletonProps = { commentReplyCount: number; }; -export const PageCommentReplyLoadingSkeleton = ({ commentReplyCount }: PageCommentReplyLoadingSkeletonProps) => ( - - {Array.from({ length: commentReplyCount }, (_, index) => ( -
    -
    - {/* User avatar and timestamp */} -
    -
    - +export function PageCommentReplyLoadingSkeleton({ commentReplyCount }: PageCommentReplyLoadingSkeletonProps) { + return ( + + {Array.from({ length: commentReplyCount }, (_, index) => ( +
    +
    + {/* User avatar and timestamp */} +
    +
    + +
    + +
    + {/* Reply content */} +
    + + + {index % 3 === 1 && }
    - -
    - {/* Reply content */} -
    - - - {index % 3 === 1 && }
    -
    - ))} - -); + ))} + + ); +} diff --git a/apps/web/ee/components/pages/comments/thread-loading-skeleton.tsx b/apps/web/ee/components/pages/comments/thread-loading-skeleton.tsx index 4e08b5cbbb..90780cbbe3 100644 --- a/apps/web/ee/components/pages/comments/thread-loading-skeleton.tsx +++ b/apps/web/ee/components/pages/comments/thread-loading-skeleton.tsx @@ -1,116 +1,118 @@ import { Filter } from "lucide-react"; import { Loader } from "@plane/ui"; -export const PageCommentThreadLoader = () => ( -
    -
    - {/* Header with title and filter button */} -
    -

    Comments

    -
    -
    - - Filters +export function PageCommentThreadLoader() { + return ( +
    +
    + {/* Header with title and filter button */} +
    +

    Comments

    +
    +
    + + Filters +
    -
    - {/* Comments skeleton loader */} -
    - - {/* Comment Thread 1 */} -
    - {/* Reference text quote skeleton */} -
    - - -
    - - {/* Main comment */} -
    - {/* User avatar and timestamp */} -
    - - + {/* Comments skeleton loader */} +
    + + {/* Comment Thread 1 */} +
    + {/* Reference text quote skeleton */} +
    + +
    - {/* Comment content */} - - - -
    - {/* Reply button */} - -
    - - {/* Comment Thread 2 */} -
    - {/* Main comment */} -
    - {/* User avatar and timestamp */} -
    - - + {/* Main comment */} +
    + {/* User avatar and timestamp */} +
    + + +
    + {/* Comment content */} + + +
    - {/* Comment content */} - - + + {/* Reply button */} +
    - {/* Show replies button */} - - - {/* Reply button */} - -
    - - {/* Comment Thread 3 */} -
    - {/* Main comment */} -
    - {/* User avatar and timestamp */} -
    - - + {/* Comment Thread 2 */} +
    + {/* Main comment */} +
    + {/* User avatar and timestamp */} +
    + + +
    + {/* Comment content */} + +
    - {/* Comment content */} - - - + + {/* Show replies button */} + + + {/* Reply button */} +
    - {/* Replies */} -
    -
    - - + {/* Comment Thread 3 */} +
    + {/* Main comment */} +
    + {/* User avatar and timestamp */} +
    + + +
    + {/* Comment content */} + + +
    - - -
    - {/* Reply button */} - -
    - - {/* Comment Thread 4 (shorter) */} -
    - {/* Main comment */} -
    - {/* User avatar and timestamp */} -
    - - + {/* Replies */} +
    +
    + + +
    + +
    - {/* Comment content */} - + + {/* Reply button */} +
    - {/* Reply button */} - -
    - + {/* Comment Thread 4 (shorter) */} +
    + {/* Main comment */} +
    + {/* User avatar and timestamp */} +
    + + +
    + {/* Comment content */} + +
    + + {/* Reply button */} + +
    + +
    -
    -); + ); +} diff --git a/apps/web/ee/components/pages/comments/thread-reply-list.tsx b/apps/web/ee/components/pages/comments/thread-reply-list.tsx index fc6cc1d9f3..90c72d4828 100644 --- a/apps/web/ee/components/pages/comments/thread-reply-list.tsx +++ b/apps/web/ee/components/pages/comments/thread-reply-list.tsx @@ -14,47 +14,50 @@ type ThreadRepliesProps = { page: TPageInstance; }; -export const PageCommentThreadReplyList: React.FC = observer( - ({ threadId, showReplies, showReplyBox, page }) => { - const { fetchThreadComments } = page.comments; +export const PageCommentThreadReplyList = observer(function PageCommentThreadReplyList({ + threadId, + showReplies, + showReplyBox, + page, +}: ThreadRepliesProps) { + const { fetchThreadComments } = page.comments; - // Get thread display state - single source of truth - const threadState = page.comments.getThreadDisplayState(threadId, showReplies); + // Get thread display state - single source of truth + const threadState = page.comments.getThreadDisplayState(threadId, showReplies); - if (!threadState) return null; + if (!threadState) return null; - // Only fetch thread comments when showReplies is true (user clicked to expand) - const { isLoading, data: dataFromServer } = useSWR( - showReplies && threadId ? `THREAD-COMMENTS-${threadId}` : null, - async () => { - if (!threadId) return []; - return await fetchThreadComments(threadId); - }, - { - revalidateOnFocus: true, - revalidateOnReconnect: true, - dedupingInterval: 5000, - } - ); + // Only fetch thread comments when showReplies is true (user clicked to expand) + const { isLoading, data: dataFromServer } = useSWR( + showReplies && threadId ? `THREAD-COMMENTS-${threadId}` : null, + async () => { + if (!threadId) return []; + return await fetchThreadComments(threadId); + }, + { + revalidateOnFocus: true, + revalidateOnReconnect: true, + dedupingInterval: 5000, + } + ); - return ( -
    - {isLoading && !dataFromServer && ( - - )} - {threadState.displayItems.map((item, index, array) => { - const isLastItem = index === array.length - 1; + return ( +
    + {isLoading && !dataFromServer && ( + + )} + {threadState.displayItems.map((item, index, array) => { + const isLastItem = index === array.length - 1; - return ( -
    - {(!isLastItem || showReplyBox) && ( -
    - )} - -
    - ); - })} -
    - ); - } -); + return ( +
    + {(!isLastItem || showReplyBox) && ( +
    + )} + +
    + ); + })} +
    + ); +}); diff --git a/apps/web/ee/components/pages/editor/ai/ask-pi-menu.tsx b/apps/web/ee/components/pages/editor/ai/ask-pi-menu.tsx index c1455f22d9..3d05147b09 100644 --- a/apps/web/ee/components/pages/editor/ai/ask-pi-menu.tsx +++ b/apps/web/ee/components/pages/editor/ai/ask-pi-menu.tsx @@ -16,7 +16,7 @@ type Props = { workspaceSlug: string; }; -export const AskPiMenu: React.FC = (props) => { +export function AskPiMenu(props: Props) { const { handleInsertText, handleRegenerate, isRegenerating, response, workspaceSlug } = props; // states const [query, setQuery] = useState(""); @@ -109,4 +109,4 @@ export const AskPiMenu: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/pages/editor/ai/menu.tsx b/apps/web/ee/components/pages/editor/ai/menu.tsx index 56e77996df..fef3e671c4 100644 --- a/apps/web/ee/components/pages/editor/ai/menu.tsx +++ b/apps/web/ee/components/pages/editor/ai/menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect, useRef, useState } from "react"; import type { LucideIcon } from "lucide-react"; import { CornerDownRight, PencilLine, RefreshCcw, Sparkles } from "lucide-react"; @@ -95,7 +93,7 @@ const TONES_LIST = [ }, ]; -export const EditorAIMenu: React.FC = (props) => { +export function EditorAIMenu(props: Props) { const { editorRef, isOpen, onClose, projectId, workspaceId, workspaceSlug } = props; // states const [activeTask, setActiveTask] = useState(null); @@ -308,4 +306,4 @@ export const EditorAIMenu: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/pages/editor/embed/issue-embed-upgrade-card.tsx b/apps/web/ee/components/pages/editor/embed/issue-embed-upgrade-card.tsx index 1e6cb887b6..090be51088 100644 --- a/apps/web/ee/components/pages/editor/embed/issue-embed-upgrade-card.tsx +++ b/apps/web/ee/components/pages/editor/embed/issue-embed-upgrade-card.tsx @@ -3,7 +3,7 @@ import { Crown } from "lucide-react"; import { Button } from "@plane/propel/button"; import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const IssueEmbedUpgradeCard: React.FC = (props) => { +export function IssueEmbedUpgradeCard(props: any) { const { togglePaidPlanModal } = useWorkspaceSubscription(); return (
    = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/pages/editor/embed/issue-embed.tsx b/apps/web/ee/components/pages/editor/embed/issue-embed.tsx index ffc5118e57..7011b34e84 100644 --- a/apps/web/ee/components/pages/editor/embed/issue-embed.tsx +++ b/apps/web/ee/components/pages/editor/embed/issue-embed.tsx @@ -22,7 +22,7 @@ type Props = { workspaceSlug: string; }; -export const IssueEmbedCard: React.FC = observer((props) => { +export const IssueEmbedCard = observer(function IssueEmbedCard(props: Props) { const { issueId, projectId, workspaceSlug } = props; // states const [error, setError] = useState(null); diff --git a/apps/web/ee/components/pages/editor/external-embed/embed-handler.tsx b/apps/web/ee/components/pages/editor/external-embed/embed-handler.tsx index 3ddd532b8d..65d1b892df 100644 --- a/apps/web/ee/components/pages/editor/external-embed/embed-handler.tsx +++ b/apps/web/ee/components/pages/editor/external-embed/embed-handler.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { memo } from "react"; import { observer } from "mobx-react"; // plane imports @@ -27,17 +25,7 @@ type ErrorData = { export type EmbedData = IframelyResponse | ErrorData | null; // Pure JSX Renderer Family - Clean JSX rendering without complex logic -const EmbedRenderer: React.FC<{ - isLoading: boolean; - currentEmbedData: EmbedData; - isThemeDark: boolean; - src: string; - isRichCardView: boolean; - directEmbedState: { hasTriedEmbedding: boolean; isEmbeddable: boolean }; - isEmbedFailed: boolean; - handleDirectEmbedLoaded: () => void; - handleDirectEmbedError: () => void; -}> = ({ +function EmbedRenderer({ isLoading, currentEmbedData, isThemeDark, @@ -47,7 +35,17 @@ const EmbedRenderer: React.FC<{ isEmbedFailed, handleDirectEmbedLoaded, handleDirectEmbedError, -}) => { +}: { + isLoading: boolean; + currentEmbedData: EmbedData; + isThemeDark: boolean; + src: string; + isRichCardView: boolean; + directEmbedState: { hasTriedEmbedding: boolean; isEmbeddable: boolean }; + isEmbedFailed: boolean; + handleDirectEmbedLoaded: () => void; + handleDirectEmbedError: () => void; +}) { const theme = isThemeDark ? "dark" : "light"; // Determine if we should show loading animations based on whether we have data const showLoading = !currentEmbedData; @@ -103,7 +101,7 @@ const EmbedRenderer: React.FC<{ ); } -}; +} // Main Entry Component - Simple orchestration export const EmbedHandler: React.FC = memo( @@ -119,7 +117,7 @@ export const EmbedHandler: React.FC = memo( ); // Main Component - Clean orchestration of families -const EmbedHandlerRender: React.FC = observer((externalEmbedNodeView) => { +const EmbedHandlerRender = observer(function EmbedHandlerRender(externalEmbedNodeView: ExternalEmbedNodeViewProps) { // Data Management Family const { isLoading, currentEmbedData, isThemeDark } = useEmbedDataManager(externalEmbedNodeView); diff --git a/apps/web/ee/components/pages/editor/template-picker.tsx b/apps/web/ee/components/pages/editor/template-picker.tsx index 2ae01b452e..341c8a1186 100644 --- a/apps/web/ee/components/pages/editor/template-picker.tsx +++ b/apps/web/ee/components/pages/editor/template-picker.tsx @@ -11,7 +11,7 @@ import { PageTemplatePicker as PageTemplatePickerCE } from "@/ce/components/page import { TemplateSelectModal } from "@/plane-web/components/pages/modals"; import { useFlag } from "@/plane-web/hooks/store"; -export const PageTemplatePicker: React.FC = observer((props) => { +export const PageTemplatePicker = observer(function PageTemplatePicker(props: TPageTemplatePickerProps) { const { isPageLoading, page, projectId, titleEditorRef, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/pages/embed/content.tsx b/apps/web/ee/components/pages/embed/content.tsx index 6b5eb2aa85..335fe02f46 100644 --- a/apps/web/ee/components/pages/embed/content.tsx +++ b/apps/web/ee/components/pages/embed/content.tsx @@ -37,7 +37,7 @@ type PageDisplayState = { }; // Component that renders page embed content once embedPageId is defined -export const PageEmbedContent: React.FC = observer((props) => { +export const PageEmbedContent = observer(function PageEmbedContent(props: Props) { const { embedPageId, previewDisabled = false, diff --git a/apps/web/ee/components/pages/embed/preview.tsx b/apps/web/ee/components/pages/embed/preview.tsx index 6ccaca84ab..b94a868d40 100644 --- a/apps/web/ee/components/pages/embed/preview.tsx +++ b/apps/web/ee/components/pages/embed/preview.tsx @@ -21,7 +21,7 @@ type Props = { logo: React.ReactNode; }; -export const PageEmbedPreview: React.FC = observer((props) => { +export const PageEmbedPreview = observer(function PageEmbedPreview(props: Props) { const { page, storeType, logo } = props; // params const { workspaceSlug, projectId } = useParams(); diff --git a/apps/web/ee/components/pages/embed/root.tsx b/apps/web/ee/components/pages/embed/root.tsx index 02bd29f86c..5b225248ee 100644 --- a/apps/web/ee/components/pages/embed/root.tsx +++ b/apps/web/ee/components/pages/embed/root.tsx @@ -21,13 +21,17 @@ type Props = { parentPage?: TPage; }; -export const PageEmbedCardRoot: React.FC = observer((props) => ); +export const PageEmbedCardRoot = observer(function PageEmbedCardRoot(props: Props) { + return ; +}); -export const PlaceholderEmbed = () => ( -
    -
    - +export function PlaceholderEmbed() { + return ( +
    +
    + +
    +
    -
    -
    -); + ); +} diff --git a/apps/web/ee/components/pages/extra-actions.tsx b/apps/web/ee/components/pages/extra-actions.tsx index ba0cf80e93..944eba53ff 100644 --- a/apps/web/ee/components/pages/extra-actions.tsx +++ b/apps/web/ee/components/pages/extra-actions.tsx @@ -4,7 +4,9 @@ import { observer } from "mobx-react"; import type { TPageHeaderExtraActionsProps } from "@/ce/components/pages/extra-actions"; import { PagePublishActions } from "./publish-actions"; -export const PageDetailsHeaderExtraActions: React.FC = observer((props) => { +export const PageDetailsHeaderExtraActions = observer(function PageDetailsHeaderExtraActions( + props: TPageHeaderExtraActionsProps +) { const { page, storeType } = props; if (!page.canCurrentUserEditPage) return null; diff --git a/apps/web/ee/components/pages/header/comment-control.tsx b/apps/web/ee/components/pages/header/comment-control.tsx index 770b9ced78..edf16ce688 100644 --- a/apps/web/ee/components/pages/header/comment-control.tsx +++ b/apps/web/ee/components/pages/header/comment-control.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; import { MessageSquareText } from "lucide-react"; @@ -18,7 +16,7 @@ type TPageCommentControlProps = { storeType: EPageStoreType; }; -export const PageCommentControl: React.FC = observer((props) => { +export const PageCommentControl = observer(function PageCommentControl(props: TPageCommentControlProps) { const { storeType } = props; const { workspaceSlug } = useParams(); const { isCommentsEnabled: canShowComments } = usePageStore(storeType); diff --git a/apps/web/ee/components/pages/header/lock-control.tsx b/apps/web/ee/components/pages/header/lock-control.tsx index 01bb937fc3..b6335ccd9b 100644 --- a/apps/web/ee/components/pages/header/lock-control.tsx +++ b/apps/web/ee/components/pages/header/lock-control.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState, useEffect, useRef, useCallback } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -22,7 +20,7 @@ type Props = { storeType: EPageStoreType; }; -export const PageLockControl = observer(({ page, storeType }: Props) => { +export const PageLockControl = observer(function PageLockControl({ page, storeType }: Props) { // Initial state: if locked, then "locked", otherwise default to "neutral" const [displayState, setDisplayState] = useState(page.is_locked ? "locked" : "neutral"); // Show lock options popup state (Restored) diff --git a/apps/web/ee/components/pages/header/move-control.tsx b/apps/web/ee/components/pages/header/move-control.tsx index 0960445b53..69f8e84220 100644 --- a/apps/web/ee/components/pages/header/move-control.tsx +++ b/apps/web/ee/components/pages/header/move-control.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -13,7 +11,7 @@ import { usePageFlag } from "@/plane-web/hooks/use-page-flag"; // local imports import { MovePageModal } from "../modals/move"; -export const PageMoveControl = observer((props: TPageMoveControlProps) => { +export const PageMoveControl = observer(function PageMoveControl(props: TPageMoveControlProps) { const { page } = props; // states const [isMovePageModalOpen, setIsMovePageModalOpen] = useState(false); diff --git a/apps/web/ee/components/pages/header/share-control.tsx b/apps/web/ee/components/pages/header/share-control.tsx index d0565716cd..2f998751e3 100644 --- a/apps/web/ee/components/pages/header/share-control.tsx +++ b/apps/web/ee/components/pages/header/share-control.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,7 +19,7 @@ type TPageShareControlProps = { storeType: EPageStoreType; }; -export const PageShareControl: React.FC = observer((props) => { +export const PageShareControl = observer(function PageShareControl(props: TPageShareControlProps) { const { page, storeType } = props; // states diff --git a/apps/web/ee/components/pages/list/root.tsx b/apps/web/ee/components/pages/list/root.tsx index 7e8ab29201..d6f5cacf34 100644 --- a/apps/web/ee/components/pages/list/root.tsx +++ b/apps/web/ee/components/pages/list/root.tsx @@ -28,7 +28,7 @@ type Props = { pageType: TPageNavigationTabs; }; -export const WikiPagesListLayoutRoot: React.FC = observer((props) => { +export const WikiPagesListLayoutRoot = observer(function WikiPagesListLayoutRoot(props: Props) { const { pageType } = props; const { workspaceSlug } = useParams(); const [isCreatingPage, setIsCreatingPage] = useState(false); diff --git a/apps/web/ee/components/pages/modals/confirmation-modal.tsx b/apps/web/ee/components/pages/modals/confirmation-modal.tsx index c0310e62f2..1522395413 100644 --- a/apps/web/ee/components/pages/modals/confirmation-modal.tsx +++ b/apps/web/ee/components/pages/modals/confirmation-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { TOAST_TYPE, setToast } from "@plane/propel/toast"; @@ -22,7 +20,7 @@ type TConfirmationModalProps = { eventName: string; }; -export const ConfirmationModal: React.FC = observer((props) => { +export const ConfirmationModal = observer(function ConfirmationModal(props: TConfirmationModalProps) { const { page, isOpen, onClose, action, title, contentText, successMessage, errorMessage, eventName } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/pages/modals/create-page-modal.tsx b/apps/web/ee/components/pages/modals/create-page-modal.tsx index b26263b015..2195eae3ca 100644 --- a/apps/web/ee/components/pages/modals/create-page-modal.tsx +++ b/apps/web/ee/components/pages/modals/create-page-modal.tsx @@ -22,7 +22,7 @@ type Props = { redirectionEnabled?: boolean; }; -export const WikiCreatePageModal: FC = observer((props) => { +export const WikiCreatePageModal = observer(function WikiCreatePageModal(props: Props) { const { workspaceSlug, isModalOpen, pageAccess, handleModalClose, redirectionEnabled = false } = props; // states const [pageFormData, setPageFormData] = useState>({ diff --git a/apps/web/ee/components/pages/modals/delete-multiple-pages-modal.tsx b/apps/web/ee/components/pages/modals/delete-multiple-pages-modal.tsx index ca2938209e..26308513a3 100644 --- a/apps/web/ee/components/pages/modals/delete-multiple-pages-modal.tsx +++ b/apps/web/ee/components/pages/modals/delete-multiple-pages-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; // constants @@ -28,7 +26,7 @@ type TConfirmPagesDeleteProps = { editorRef?: EditorRefApi | null; }; -export const DeleteMultiplePagesModal: React.FC = observer((props) => { +export const DeleteMultiplePagesModal = observer(function DeleteMultiplePagesModal(props: TConfirmPagesDeleteProps) { const { isOpen, onClose, pages, storeType, editorRef } = props; // states const [isDeleting, setIsDeleting] = useState(false); diff --git a/apps/web/ee/components/pages/modals/delete-page-modal.tsx b/apps/web/ee/components/pages/modals/delete-page-modal.tsx index cae28ae4ae..b9857e2300 100644 --- a/apps/web/ee/components/pages/modals/delete-page-modal.tsx +++ b/apps/web/ee/components/pages/modals/delete-page-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { useRouter } from "next/navigation"; @@ -20,7 +18,7 @@ type TConfirmPageDeletionProps = { page: TPageInstance; }; -export const WikiDeletePageModal: React.FC = observer((props) => { +export const WikiDeletePageModal = observer(function WikiDeletePageModal(props: TConfirmPageDeletionProps) { const { isOpen, onClose, page } = props; // states const [isDeleting, setIsDeleting] = useState(false); diff --git a/apps/web/ee/components/pages/modals/lock-page-modal.tsx b/apps/web/ee/components/pages/modals/lock-page-modal.tsx index d24ce21928..401ce339a0 100644 --- a/apps/web/ee/components/pages/modals/lock-page-modal.tsx +++ b/apps/web/ee/components/pages/modals/lock-page-modal.tsx @@ -11,7 +11,7 @@ import type { TPageInstance } from "@/store/pages/base-page"; // local imports import { ConfirmationModal } from "./confirmation-modal"; -export const LockPageModal = ({ +export function LockPageModal({ page, lockPageModal, setLockPageModal, @@ -19,7 +19,7 @@ export const LockPageModal = ({ page: TPageInstance; lockPageModal: boolean; setLockPageModal: React.Dispatch>; -}) => { +}) { const [actionType, setActionType] = useState(false); const { pageOperations } = usePageOperations({ page, @@ -55,4 +55,4 @@ export const LockPageModal = ({ eventName={page.is_locked ? PROJECT_PAGE_TRACKER_EVENTS.unlock : PROJECT_PAGE_TRACKER_EVENTS.lock} /> ); -}; +} diff --git a/apps/web/ee/components/pages/modals/modals.tsx b/apps/web/ee/components/pages/modals/modals.tsx index 9d67f51f9c..5a4457d477 100644 --- a/apps/web/ee/components/pages/modals/modals.tsx +++ b/apps/web/ee/components/pages/modals/modals.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // components @@ -13,7 +11,7 @@ export type TPageModalsProps = { storeType: EPageStoreType; }; -export const PageModals: React.FC = observer((props) => { +export const PageModals = observer(function PageModals(props: TPageModalsProps) { const { page, storeType } = props; return ( diff --git a/apps/web/ee/components/pages/modals/move/body.tsx b/apps/web/ee/components/pages/modals/move/body.tsx index 37d23f8905..cffb60d09f 100644 --- a/apps/web/ee/components/pages/modals/move/body.tsx +++ b/apps/web/ee/components/pages/modals/move/body.tsx @@ -10,7 +10,7 @@ type Props = { searchTerm: string; }; -export const MovePageModalBody: React.FC = (props) => { +export function MovePageModalBody(props: Props) { const { canPageBeMovedToTeamspace, searchTerm } = props; // translation const { t } = useTranslation(); @@ -28,4 +28,4 @@ export const MovePageModalBody: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/pages/modals/move/footer.tsx b/apps/web/ee/components/pages/modals/move/footer.tsx index 909aa74fc6..a63e3b6cb4 100644 --- a/apps/web/ee/components/pages/modals/move/footer.tsx +++ b/apps/web/ee/components/pages/modals/move/footer.tsx @@ -9,7 +9,7 @@ type Props = { onMove: () => void; }; -export const MovePageModalFooter: React.FC = (props) => { +export function MovePageModalFooter(props: Props) { const { onClose, onMove, isMoving, disabled } = props; // translation const { t } = useTranslation(); @@ -26,4 +26,4 @@ export const MovePageModalFooter: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/pages/modals/move/input.tsx b/apps/web/ee/components/pages/modals/move/input.tsx index bb6adfad08..ea1504a1ff 100644 --- a/apps/web/ee/components/pages/modals/move/input.tsx +++ b/apps/web/ee/components/pages/modals/move/input.tsx @@ -11,7 +11,7 @@ type Props = { updateSearchTerm: (searchTerm: string) => void; }; -export const MovePageModalInput: React.FC = (props) => { +export function MovePageModalInput(props: Props) { const { canPageBeMovedToTeamspace, searchTerm, updateSearchTerm } = props; // navigation const { teamspaceId, projectId } = useParams(); @@ -47,4 +47,4 @@ export const MovePageModalInput: React.FC = (props) => { />
    ); -}; +} diff --git a/apps/web/ee/components/pages/modals/move/list-item.tsx b/apps/web/ee/components/pages/modals/move/list-item.tsx index 43e4b90e62..b5d3b6eac8 100644 --- a/apps/web/ee/components/pages/modals/move/list-item.tsx +++ b/apps/web/ee/components/pages/modals/move/list-item.tsx @@ -13,7 +13,7 @@ type Props = { item: TMovePageModalListItem; }; -export const MovePageModalListItem: React.FC = (props) => { +export function MovePageModalListItem(props: Props) { const { item } = props; return ( @@ -48,4 +48,4 @@ export const MovePageModalListItem: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/pages/modals/move/list-section.tsx b/apps/web/ee/components/pages/modals/move/list-section.tsx index 08864296db..f2379bbad0 100644 --- a/apps/web/ee/components/pages/modals/move/list-section.tsx +++ b/apps/web/ee/components/pages/modals/move/list-section.tsx @@ -8,7 +8,7 @@ type Props = { title: string; }; -export const MovePageModalListSection: React.FC = (props) => { +export function MovePageModalListSection(props: Props) { const { getItemDetails, items, title } = props; return ( @@ -23,4 +23,4 @@ export const MovePageModalListSection: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/pages/modals/move/root.tsx b/apps/web/ee/components/pages/modals/move/root.tsx index d14e69ac89..c3bda15568 100644 --- a/apps/web/ee/components/pages/modals/move/root.tsx +++ b/apps/web/ee/components/pages/modals/move/root.tsx @@ -19,7 +19,7 @@ import { MovePageModalInput } from "./input"; export type TMovePageSelectedValue = `project-${string}` | `teamspace-${string}` | "workspace"; -export const MovePageModal: React.FC = observer((props) => { +export const MovePageModal = observer(function MovePageModal(props: TMovePageModalProps) { const { isOpen, onClose, page } = props; // states const [searchTerm, setSearchTerm] = useState(""); diff --git a/apps/web/ee/components/pages/modals/move/sections/projects-list.tsx b/apps/web/ee/components/pages/modals/move/sections/projects-list.tsx index e1c8541330..c36c71975a 100644 --- a/apps/web/ee/components/pages/modals/move/sections/projects-list.tsx +++ b/apps/web/ee/components/pages/modals/move/sections/projects-list.tsx @@ -14,7 +14,7 @@ type Props = { searchTerm: string; }; -export const MovePageModalProjectsListSection: React.FC = observer((props) => { +export const MovePageModalProjectsListSection = observer(function MovePageModalProjectsListSection(props: Props) { const { searchTerm } = props; // store hooks const { currentProjectDetails, getProjectById, joinedProjectIds } = useProject(); diff --git a/apps/web/ee/components/pages/modals/move/sections/root.tsx b/apps/web/ee/components/pages/modals/move/sections/root.tsx index a2bff2bba9..c36a1260b7 100644 --- a/apps/web/ee/components/pages/modals/move/sections/root.tsx +++ b/apps/web/ee/components/pages/modals/move/sections/root.tsx @@ -20,7 +20,7 @@ type Props = { searchTerm: string; }; -export const MovePageModalSections: React.FC = observer((props) => { +export const MovePageModalSections = observer(function MovePageModalSections(props: Props) { const { canPageBeMovedToTeamspace, searchTerm } = props; // navigation const { workspaceSlug, teamspaceId, projectId } = useParams(); diff --git a/apps/web/ee/components/pages/modals/move/sections/teamspaces-list.tsx b/apps/web/ee/components/pages/modals/move/sections/teamspaces-list.tsx index afb7b0995d..9269cd9dc2 100644 --- a/apps/web/ee/components/pages/modals/move/sections/teamspaces-list.tsx +++ b/apps/web/ee/components/pages/modals/move/sections/teamspaces-list.tsx @@ -13,7 +13,7 @@ type Props = { searchTerm: string; }; -export const MovePageModalTeamspacesListSection: React.FC = observer((props) => { +export const MovePageModalTeamspacesListSection = observer(function MovePageModalTeamspacesListSection(props: Props) { const { searchTerm } = props; // navigation const { teamspaceId } = useParams(); diff --git a/apps/web/ee/components/pages/modals/publish-page-modal.tsx b/apps/web/ee/components/pages/modals/publish-page-modal.tsx index 56d13b8076..001a03aeae 100644 --- a/apps/web/ee/components/pages/modals/publish-page-modal.tsx +++ b/apps/web/ee/components/pages/modals/publish-page-modal.tsx @@ -20,7 +20,7 @@ type Props = { unpublishPage: () => Promise; }; -export const PublishPageModal: React.FC = observer((props) => { +export const PublishPageModal = observer(function PublishPageModal(props: Props) { const { anchor, fetchPagePublishSettings, isOpen, onClose, pagePublishSettings, publishPage, unpublishPage } = props; // states const [isPublishing, setIsPublishing] = useState(false); diff --git a/apps/web/ee/components/pages/modals/share-page-root-modal.tsx b/apps/web/ee/components/pages/modals/share-page-root-modal.tsx index af9a83c360..009766310b 100644 --- a/apps/web/ee/components/pages/modals/share-page-root-modal.tsx +++ b/apps/web/ee/components/pages/modals/share-page-root-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState, useCallback, useMemo } from "react"; import { observer } from "mobx-react"; import useSWR from "swr"; @@ -21,242 +19,248 @@ import { SharePageModal } from "../share/share-page-modal"; // types import type { TSharePageModalProps } from "../share/types"; -export const SharePageRoolModal: React.FC = observer( - ({ isOpen, onClose, page, storeType, shareForm, isSharedUsersAccordionOpen, onToggleSharedUsersAccordion }) => { - // store hooks - const { - workspace: { workspaceMemberIds, getWorkspaceMemberDetails }, - } = useMember(); - const { data: currentUser } = useUser(); +export const SharePageRoolModal = observer(function SharePageRoolModal({ + isOpen, + onClose, + page, + storeType, + shareForm, + isSharedUsersAccordionOpen, + onToggleSharedUsersAccordion, +}: TSharePageModalProps) { + // store hooks + const { + workspace: { workspaceMemberIds, getWorkspaceMemberDetails }, + } = useMember(); + const { data: currentUser } = useUser(); - const { fetchPageSharedUsers, bulkUpdatePageSharedUsers } = usePageStore(storeType); + const { fetchPageSharedUsers, bulkUpdatePageSharedUsers } = usePageStore(storeType); - // states - const [copied, setCopied] = useState(false); + // states + const [copied, setCopied] = useState(false); - const { isLoading: isLoadingSharedUsers } = useSWR( - isOpen && page?.id ? `page-shared-users-${page.id}` : null, - async () => { - if (!page?.id) return null; + const { isLoading: isLoadingSharedUsers } = useSWR( + isOpen && page?.id ? `page-shared-users-${page.id}` : null, + async () => { + if (!page?.id) return null; - await fetchPageSharedUsers(page.id); - }, - { - revalidateOnFocus: false, - revalidateOnMount: true, - revalidateOnReconnect: true, - dedupingInterval: 5000, - onError: () => { - setToast({ - type: TOAST_TYPE.ERROR, - title: "Error fetching shared users", - message: "Could not load page shared users. Please try again.", - }); - }, - } - ); - - const { memberOptions } = useMemberOptions({ - workspaceMemberIds: workspaceMemberIds || [], - currentUserId: currentUser?.id, - sharedUsers: shareForm?.data?.sharedUsers || [], - getWorkspaceMemberDetails, - }); - - const handleCopyLink = useCallback(async () => { - try { - await navigator.clipboard.writeText(window.location.href); - setToast({ - type: TOAST_TYPE.SUCCESS, - title: "Link copied", - message: "Page link has been copied to clipboard.", - }); - } catch (err) { + await fetchPageSharedUsers(page.id); + }, + { + revalidateOnFocus: false, + revalidateOnMount: true, + revalidateOnReconnect: true, + dedupingInterval: 5000, + onError: () => { setToast({ type: TOAST_TYPE.ERROR, - title: "Failed to copy link", - message: "Could not copy link to clipboard.", + title: "Error fetching shared users", + message: "Could not load page shared users. Please try again.", }); + }, + } + ); + + const { memberOptions } = useMemberOptions({ + workspaceMemberIds: workspaceMemberIds || [], + currentUserId: currentUser?.id, + sharedUsers: shareForm?.data?.sharedUsers || [], + getWorkspaceMemberDetails, + }); + + const handleCopyLink = useCallback(async () => { + try { + await navigator.clipboard.writeText(window.location.href); + setToast({ + type: TOAST_TYPE.SUCCESS, + title: "Link copied", + message: "Page link has been copied to clipboard.", + }); + } catch (err) { + setToast({ + type: TOAST_TYPE.ERROR, + title: "Failed to copy link", + message: "Could not copy link to clipboard.", + }); + } + setCopied(true); + setTimeout(() => setCopied(false), 2000); + }, []); + + const pageTitle = getPageName(page?.name); + + const handleSave = useCallback(async () => { + let originalState: TPageShareFormUser[] = []; + + let toastId: string | undefined; + try { + if (!shareForm?.formState?.isDirty || !page?.id) { + return; } - setCopied(true); - setTimeout(() => setCopied(false), 2000); - }, []); - const pageTitle = getPageName(page?.name); + toastId = setToast({ + type: TOAST_TYPE.LOADING, + title: "Saving...", + }); - const handleSave = useCallback(async () => { - let originalState: TPageShareFormUser[] = []; + // Optimistically move pending users to existing users and get rollback state + originalState = shareForm?.actions?.optimisticSave?.() || []; - let toastId: string | undefined; - try { - if (!shareForm?.formState?.isDirty || !page?.id) { + const finalSharedUsers = (shareForm.data?.sharedUsers || []) + .filter((user) => !user.isOwner) + .map((user) => ({ + user_id: user.user_id, + access: user.access, + })); + + await bulkUpdatePageSharedUsers(page.id, finalSharedUsers); + + dismissToast(toastId); + setToast({ + type: TOAST_TYPE.SUCCESS, + title: "Success!", + message: "Page sharing updated successfully.", + }); + + shareForm?.actions?.reset(); + onClose(); + } catch (error) { + // Rollback optimistic changes on error + if (shareForm?.actions?.rollback && originalState.length > 0) { + shareForm.actions.rollback(originalState); + } + + if (toastId) dismissToast(toastId); + setToast({ + type: TOAST_TYPE.ERROR, + title: "Error updating sharing", + message: "Failed to update page sharing. Please try again.", + }); + } + }, [shareForm, bulkUpdatePageSharedUsers, page?.id, onClose]); + + const handleCancel = useCallback(() => { + shareForm?.actions?.reset(); + onClose(); + }, [shareForm?.actions, onClose]); + + const modalData = useMemo(() => { + const pageOwner = page?.owned_by ? getWorkspaceMemberDetails(page.owned_by) : null; + const ownerUser = + pageOwner?.member && page.owned_by + ? { + id: `owner-${page.owned_by}`, + user_id: page.owned_by, + access: 2, + isNew: false, + isOwner: true, + } + : null; + + const sharedUsers = shareForm?.data?.sharedUsers || []; + const allDisplayUsers = ownerUser + ? [ownerUser, ...sharedUsers.filter((user) => !user.isNew)] + : sharedUsers.filter((user) => !user.isNew); + + // Filter out page owner and guest users from member options + const filteredMemberOptions = (memberOptions || []).filter((option) => { + if (option.value === page?.owned_by) return false; + + const memberDetails = getWorkspaceMemberDetails(option.value); + if (memberDetails?.role === EUserWorkspaceRoles.GUEST) return false; + + return true; + }); + + return { + pageTitle, + copied, + sharedUsers, + pendingSharedUsers: (shareForm?.actions?.getNewUsers() || []).map((user) => ({ + user_id: user.user_id, + access: user.access, + })), + modifiedSharedUsers: (shareForm?.actions?.getModifiedUsers() || []).map((user) => ({ + user_id: user.user_id, + originalAccess: user.originalAccess!, + newAccess: user.access, + })), + existingUsers: allDisplayUsers, + memberOptions: filteredMemberOptions, + totalSharedUsers: sharedUsers.length + (ownerUser ? 1 : 0), + hasUnsavedChanges: shareForm?.formState?.isDirty || false, + isSubmitting: shareForm?.formState?.isSubmitting || false, + isLoadingSharedUsers, + isSharedUsersAccordionOpen, + canCurrentUserChangeAccess: page?.canCurrentUserChangeAccess || false, + }; + }, [ + pageTitle, + copied, + shareForm, + memberOptions, + isLoadingSharedUsers, + page?.owned_by, + page?.canCurrentUserChangeAccess, + getWorkspaceMemberDetails, + isSharedUsersAccordionOpen, + ]); + + const modalActions = useMemo( + () => ({ + copyLink: handleCopyLink, + selectMember: (memberId: string) => { + const memberDetails = getWorkspaceMemberDetails(memberId); + if (!memberDetails?.member?.id) { + setToast({ + type: TOAST_TYPE.ERROR, + title: "Error adding shared user", + message: "Could not find member details. Please try again.", + }); return; } - toastId = setToast({ - type: TOAST_TYPE.LOADING, - title: "Saving...", - }) as string; - - // Optimistically move pending users to existing users and get rollback state - originalState = shareForm?.actions?.optimisticSave?.() || []; - - const finalSharedUsers = (shareForm.data?.sharedUsers || []) - .filter((user) => !user.isOwner) - .map((user) => ({ - user_id: user.user_id, - access: user.access, - })); - - await bulkUpdatePageSharedUsers(page.id, finalSharedUsers); - - dismissToast(toastId); - setToast({ - type: TOAST_TYPE.SUCCESS, - title: "Success!", - message: "Page sharing updated successfully.", + shareForm?.actions?.addUser({ + user_id: memberDetails.member.id, }); + }, + toggleSharedUsersAccordion: onToggleSharedUsersAccordion, + updateExistingAccess: (userId: string, access: EPageSharedUserAccess) => { + if (userId === page?.owned_by) return; - shareForm?.actions?.reset(); - onClose(); - } catch (error) { - // Rollback optimistic changes on error - if (shareForm?.actions?.rollback && originalState.length > 0) { - shareForm.actions.rollback(originalState); - } + shareForm?.actions?.updateUserAccess(userId, access); + }, + removeExisting: (userId: string) => { + if (userId === page?.owned_by) return; - if (toastId) dismissToast(toastId); - setToast({ - type: TOAST_TYPE.ERROR, - title: "Error updating sharing", - message: "Failed to update page sharing. Please try again.", - }); - } - }, [shareForm, bulkUpdatePageSharedUsers, page?.id, onClose]); + shareForm?.actions?.removeUser(userId); + }, + updatePendingAccess: (userId: string, access: EPageSharedUserAccess) => { + shareForm?.actions?.updateUserAccess(userId, access); + }, + removePending: (userId: string) => { + shareForm?.actions?.removeUser(userId); + }, + getMemberDetails: getWorkspaceMemberDetails, + isUserModified: (userId: string) => { + if (userId === page?.owned_by) return false; - const handleCancel = useCallback(() => { - shareForm?.actions?.reset(); - onClose(); - }, [shareForm?.actions, onClose]); - - const modalData = useMemo(() => { - const pageOwner = page?.owned_by ? getWorkspaceMemberDetails(page.owned_by) : null; - const ownerUser = - pageOwner?.member && page.owned_by - ? { - id: `owner-${page.owned_by}`, - user_id: page.owned_by, - access: 2, - isNew: false, - isOwner: true, - } - : null; - - const sharedUsers = shareForm?.data?.sharedUsers || []; - const allDisplayUsers = ownerUser - ? [ownerUser, ...sharedUsers.filter((user) => !user.isNew)] - : sharedUsers.filter((user) => !user.isNew); - - // Filter out page owner and guest users from member options - const filteredMemberOptions = (memberOptions || []).filter((option) => { - if (option.value === page?.owned_by) return false; - - const memberDetails = getWorkspaceMemberDetails(option.value); - if (memberDetails?.role === EUserWorkspaceRoles.GUEST) return false; - - return true; - }); - - return { - pageTitle, - copied, - sharedUsers, - pendingSharedUsers: (shareForm?.actions?.getNewUsers() || []).map((user) => ({ - user_id: user.user_id, - access: user.access, - })), - modifiedSharedUsers: (shareForm?.actions?.getModifiedUsers() || []).map((user) => ({ - user_id: user.user_id, - originalAccess: user.originalAccess!, - newAccess: user.access, - })), - existingUsers: allDisplayUsers, - memberOptions: filteredMemberOptions, - totalSharedUsers: sharedUsers.length + (ownerUser ? 1 : 0), - hasUnsavedChanges: shareForm?.formState?.isDirty || false, - isSubmitting: shareForm?.formState?.isSubmitting || false, - isLoadingSharedUsers, - isSharedUsersAccordionOpen, - canCurrentUserChangeAccess: page?.canCurrentUserChangeAccess || false, - }; - }, [ - pageTitle, - copied, - shareForm, - memberOptions, - isLoadingSharedUsers, - page?.owned_by, - page?.canCurrentUserChangeAccess, + const modifiedUsers = shareForm?.actions?.getModifiedUsers() || []; + return modifiedUsers.some((user) => user.user_id === userId); + }, + save: handleSave, + cancel: handleCancel, + }), + [ + handleCopyLink, getWorkspaceMemberDetails, - isSharedUsersAccordionOpen, - ]); + shareForm, + handleSave, + handleCancel, + page?.owned_by, + onToggleSharedUsersAccordion, + ] + ); - const modalActions = useMemo( - () => ({ - copyLink: handleCopyLink, - selectMember: (memberId: string) => { - const memberDetails = getWorkspaceMemberDetails(memberId); - if (!memberDetails?.member?.id) { - setToast({ - type: TOAST_TYPE.ERROR, - title: "Error adding shared user", - message: "Could not find member details. Please try again.", - }); - return; - } - - shareForm?.actions?.addUser({ - user_id: memberDetails.member.id, - }); - }, - toggleSharedUsersAccordion: onToggleSharedUsersAccordion, - updateExistingAccess: (userId: string, access: EPageSharedUserAccess) => { - if (userId === page?.owned_by) return; - - shareForm?.actions?.updateUserAccess(userId, access); - }, - removeExisting: (userId: string) => { - if (userId === page?.owned_by) return; - - shareForm?.actions?.removeUser(userId); - }, - updatePendingAccess: (userId: string, access: EPageSharedUserAccess) => { - shareForm?.actions?.updateUserAccess(userId, access); - }, - removePending: (userId: string) => { - shareForm?.actions?.removeUser(userId); - }, - getMemberDetails: getWorkspaceMemberDetails, - isUserModified: (userId: string) => { - if (userId === page?.owned_by) return false; - - const modifiedUsers = shareForm?.actions?.getModifiedUsers() || []; - return modifiedUsers.some((user) => user.user_id === userId); - }, - save: handleSave, - cancel: handleCancel, - }), - [ - handleCopyLink, - getWorkspaceMemberDetails, - shareForm, - handleSave, - handleCancel, - page?.owned_by, - onToggleSharedUsersAccordion, - ] - ); - - return ; - } -); + return ; +}); diff --git a/apps/web/ee/components/pages/modals/template-select-modal.tsx b/apps/web/ee/components/pages/modals/template-select-modal.tsx index 6f0b2e715f..47b4e1813d 100644 --- a/apps/web/ee/components/pages/modals/template-select-modal.tsx +++ b/apps/web/ee/components/pages/modals/template-select-modal.tsx @@ -32,7 +32,7 @@ type TTemplateSelectModalProps = { workspaceSlug: string; }; -export const TemplateSelectModal: React.FC = observer((props) => { +export const TemplateSelectModal = observer(function TemplateSelectModal(props: TTemplateSelectModalProps) { const { isOpen, onClose, page, projectId, titleEditorRef, workspaceSlug } = props; // refs const applyButtonRef = useRef(null); diff --git a/apps/web/ee/components/pages/navigation-pane/tab-panels/assets.tsx b/apps/web/ee/components/pages/navigation-pane/tab-panels/assets.tsx index 55db2b74cb..ca61e3cf95 100644 --- a/apps/web/ee/components/pages/navigation-pane/tab-panels/assets.tsx +++ b/apps/web/ee/components/pages/navigation-pane/tab-panels/assets.tsx @@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n"; // ce imports import type { TAdditionalPageNavigationPaneAssetItemProps } from "@/ce/components/pages/navigation-pane/tab-panels/assets"; -export const AdditionalPageNavigationPaneAssetItem: React.FC = (props) => { +export function AdditionalPageNavigationPaneAssetItem(props: TAdditionalPageNavigationPaneAssetItemProps) { const { asset, assetSrc, assetDownloadSrc } = props; // translation const { t } = useTranslation(); @@ -39,4 +39,4 @@ export const AdditionalPageNavigationPaneAssetItem: React.FC { +export function PageNavigationPaneAssetsTabEmptyState() { // theme hook const { resolvedTheme } = useTheme(); // asset resolved path @@ -32,4 +32,4 @@ export const PageNavigationPaneAssetsTabEmptyState = () => {
    ); -}; +} diff --git a/apps/web/ee/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx b/apps/web/ee/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx index 8c68a0b2d2..ef47c753c6 100644 --- a/apps/web/ee/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx +++ b/apps/web/ee/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx @@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n"; import outlineDark from "@/app/assets/empty-state/wiki/navigation-pane/outline-dark.webp?url"; import outlineLight from "@/app/assets/empty-state/wiki/navigation-pane/outline-light.webp?url"; -export const PageNavigationPaneOutlineTabEmptyState = () => { +export function PageNavigationPaneOutlineTabEmptyState() { // theme hook const { resolvedTheme } = useTheme(); // asset resolved path @@ -32,4 +32,4 @@ export const PageNavigationPaneOutlineTabEmptyState = () => {
    ); -}; +} diff --git a/apps/web/ee/components/pages/navigation-pane/tab-panels/root.tsx b/apps/web/ee/components/pages/navigation-pane/tab-panels/root.tsx index 1581b4948f..a12d26be41 100644 --- a/apps/web/ee/components/pages/navigation-pane/tab-panels/root.tsx +++ b/apps/web/ee/components/pages/navigation-pane/tab-panels/root.tsx @@ -8,6 +8,6 @@ export type TPageNavigationPaneAdditionalTabPanelsRootProps = { page: TPageInstance; }; -export const PageNavigationPaneAdditionalTabPanelsRoot: React.FC< - TPageNavigationPaneAdditionalTabPanelsRootProps -> = () => null; +export function PageNavigationPaneAdditionalTabPanelsRoot(_props: TPageNavigationPaneAdditionalTabPanelsRootProps) { + return null; +} diff --git a/apps/web/ee/components/pages/publish-actions.tsx b/apps/web/ee/components/pages/publish-actions.tsx index 19a8666a1b..3f9949162d 100644 --- a/apps/web/ee/components/pages/publish-actions.tsx +++ b/apps/web/ee/components/pages/publish-actions.tsx @@ -20,7 +20,7 @@ interface PagePublishActionsProps { storeType: EPageStoreType; } -export const PagePublishActions: React.FC = observer((props) => { +export const PagePublishActions = observer(function PagePublishActions(props: PagePublishActionsProps) { const { page, storeType } = props; // states const [isPublishModalOpen, setIsPublishModalOpen] = useState(false); diff --git a/apps/web/ee/components/pages/share/access-menu.tsx b/apps/web/ee/components/pages/share/access-menu.tsx index dc6d7c7344..7a92f916bc 100644 --- a/apps/web/ee/components/pages/share/access-menu.tsx +++ b/apps/web/ee/components/pages/share/access-menu.tsx @@ -1,5 +1,3 @@ -"use client"; - import { memo } from "react"; import { Trash2, Eye, Pencil, Check, MessageSquareText } from "lucide-react"; import { ChevronDownIcon } from "@plane/propel/icons"; @@ -19,55 +17,59 @@ type TAccessMenuProps = { canCurrentUserChangeAccess?: boolean; }; -export const AccessMenu = memo( - ({ currentAccess, onUpdateAccess, onRemove, isOwner = false, canCurrentUserChangeAccess = true }) => { - if (isOwner) { - return Owner; - } - - const currentOption = ACCESS_OPTIONS.find((opt) => opt.value === currentAccess.toString()); - const accessLabel = currentOption?.label || "View"; - - // If user cannot change access, show read-only label - if (!canCurrentUserChangeAccess) { - return can {accessLabel.toLowerCase()}; - } - - return ( - - can {accessLabel.toLowerCase()} - -
    - } - placement="bottom-end" - closeOnSelect - > - {ACCESS_OPTIONS.map((option) => { - const IconComponent = option.icon; - const isSelected = option.value === currentAccess.toString(); - return ( - onUpdateAccess(option.value)}> -
    -
    - - can {option.label.toLowerCase()} -
    - {isSelected && } -
    -     - ); - })} - -
    - - Remove -
    -     - - ); +export const AccessMenu = memo(function AccessMenu({ + currentAccess, + onUpdateAccess, + onRemove, + isOwner = false, + canCurrentUserChangeAccess = true, +}: TAccessMenuProps) { + if (isOwner) { + return Owner; } -); + + const currentOption = ACCESS_OPTIONS.find((opt) => opt.value === currentAccess.toString()); + const accessLabel = currentOption?.label || "View"; + + // If user cannot change access, show read-only label + if (!canCurrentUserChangeAccess) { + return can {accessLabel.toLowerCase()}; + } + + return ( + + can {accessLabel.toLowerCase()} + +
    + } + placement="bottom-end" + closeOnSelect + > + {ACCESS_OPTIONS.map((option) => { + const IconComponent = option.icon; + const isSelected = option.value === currentAccess.toString(); + return ( + onUpdateAccess(option.value)}> +
    +
    + + can {option.label.toLowerCase()} +
    + {isSelected && } +
    +     + ); + })} + +
    + + Remove +
    +     + + ); +}); AccessMenu.displayName = "AccessMenu"; diff --git a/apps/web/ee/components/pages/share/empty-state.tsx b/apps/web/ee/components/pages/share/empty-state.tsx index 32d84cce0b..5035860496 100644 --- a/apps/web/ee/components/pages/share/empty-state.tsx +++ b/apps/web/ee/components/pages/share/empty-state.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { memo } from "react"; // plane ui import { MembersPropertyIcon } from "@plane/propel/icons"; @@ -12,51 +10,54 @@ type TEmptyStateProps = { existingUsersCount?: number; }; -export const EmptyState = memo( - ({ isLoading, totalUsers, pendingUsersCount, existingUsersCount = 0 }) => { - if (isLoading && existingUsersCount <= 1) { - return ( -
    - - {Array.from({ length: 3 }).map((_, index) => ( -
    -
    -
    - -
    - -
    -
    - -
    - +export const EmptyState = memo(function EmptyState({ + isLoading, + totalUsers, + pendingUsersCount, + existingUsersCount = 0, +}: TEmptyStateProps) { + if (isLoading && existingUsersCount <= 1) { + return ( +
    + + {Array.from({ length: 3 }).map((_, index) => ( +
    +
    +
    + +
    +
    + +
    + +
    - ))} - -
    - ); - } - - if (existingUsersCount > 0 || pendingUsersCount > 0) { - return null; - } - - if (totalUsers === 0 && pendingUsersCount === 0) { - return ( -
    -
    - -
    -

    No one has access yet

    -

    Add people above to start collaborating on this page

    -
    - ); - } +
    + ))} + +
    + ); + } + if (existingUsersCount > 0 || pendingUsersCount > 0) { return null; } -); + + if (totalUsers === 0 && pendingUsersCount === 0) { + return ( +
    +
    + +
    +

    No one has access yet

    +

    Add people above to start collaborating on this page

    +
    + ); + } + + return null; +}); EmptyState.displayName = "EmptyState"; diff --git a/apps/web/ee/components/pages/share/existing-users-section.tsx b/apps/web/ee/components/pages/share/existing-users-section.tsx index 185dc6cfdd..fad4729291 100644 --- a/apps/web/ee/components/pages/share/existing-users-section.tsx +++ b/apps/web/ee/components/pages/share/existing-users-section.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { ChevronDownIcon } from "@plane/propel/icons"; // plane imports @@ -20,7 +18,7 @@ type TExistingUsersSectionProps = { canCurrentUserChangeAccess?: boolean; }; -export const ExistingUsersSection = ({ +export function ExistingUsersSection({ existingUsers, onUpdateAccess, onRemove, @@ -29,7 +27,7 @@ export const ExistingUsersSection = ({ isAccordionOpen, onToggleAccordion, canCurrentUserChangeAccess = true, -}: TExistingUsersSectionProps) => { +}: TExistingUsersSectionProps) { if (existingUsers.length === 0) return null; return ( @@ -110,6 +108,6 @@ export const ExistingUsersSection = ({
    ); -}; +} ExistingUsersSection.displayName = "ExistingUsersSection"; diff --git a/apps/web/ee/components/pages/share/member-search.tsx b/apps/web/ee/components/pages/share/member-search.tsx index 16b0926223..8e9f24f930 100644 --- a/apps/web/ee/components/pages/share/member-search.tsx +++ b/apps/web/ee/components/pages/share/member-search.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { memo } from "react"; import { Search } from "lucide-react"; import { CustomSearchSelect, Avatar } from "@plane/ui"; @@ -17,22 +15,24 @@ type TMemberSearchProps = { canCurrentUserChangeAccess?: boolean; }; -export const MemberOption = memo<{ member: { display_name: string; avatar_url: string } }>(({ member }) => ( -
    - -
    - {member.display_name} +export const MemberOption = memo(function MemberOption({ + member, +}: { + member: { display_name: string; avatar_url: string }; +}) { + return ( +
    + +
    + {member.display_name} +
    -
    -)); + ); +}); MemberOption.displayName = "MemberOption"; -export const MemberSearch = ({ - memberOptions, - onSelectMember, - canCurrentUserChangeAccess = true, -}: TMemberSearchProps) => { +export function MemberSearch({ memberOptions, onSelectMember, canCurrentUserChangeAccess = true }: TMemberSearchProps) { if (!canCurrentUserChangeAccess) { return null; } @@ -53,6 +53,6 @@ export const MemberSearch = ({ options={memberOptions} /> ); -}; +} MemberSearch.displayName = "MemberSearch"; diff --git a/apps/web/ee/components/pages/share/modal-footer.tsx b/apps/web/ee/components/pages/share/modal-footer.tsx index 66280b7cc1..68a3282600 100644 --- a/apps/web/ee/components/pages/share/modal-footer.tsx +++ b/apps/web/ee/components/pages/share/modal-footer.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Button } from "@plane/propel/button"; type TModalFooterProps = { @@ -10,35 +8,37 @@ type TModalFooterProps = { canCurrentUserChangeAccess?: boolean; }; -export const ModalFooter = ({ +export function ModalFooter({ hasUnsavedChanges, isSubmitting, onCancel, onSave, canCurrentUserChangeAccess = true, -}: TModalFooterProps) => ( -
    -
    -
    - {hasUnsavedChanges && canCurrentUserChangeAccess && ( -
    -
    - Unsaved changes -
    - )} -
    -
    - - {canCurrentUserChangeAccess && ( - - )} + {canCurrentUserChangeAccess && ( + + )} +
    -
    -); + ); +} ModalFooter.displayName = "ModalFooter"; diff --git a/apps/web/ee/components/pages/share/modal-header.tsx b/apps/web/ee/components/pages/share/modal-header.tsx index 7932c01b15..fd960c1ba6 100644 --- a/apps/web/ee/components/pages/share/modal-header.tsx +++ b/apps/web/ee/components/pages/share/modal-header.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Link2 } from "lucide-react"; import { Button } from "@plane/propel/button"; @@ -9,19 +7,21 @@ type TModalHeaderProps = { onCopyLink: () => void; }; -export const ModalHeader = ({ pageTitle, copied, onCopyLink }: TModalHeaderProps) => ( -
    -

    Share {pageTitle}

    - -
    -); +export function ModalHeader({ pageTitle, copied, onCopyLink }: TModalHeaderProps) { + return ( +
    +

    Share {pageTitle}

    + +
    + ); +} ModalHeader.displayName = "ModalHeader"; diff --git a/apps/web/ee/components/pages/share/pending-users-section.tsx b/apps/web/ee/components/pages/share/pending-users-section.tsx index f8b6682508..50048d6b9b 100644 --- a/apps/web/ee/components/pages/share/pending-users-section.tsx +++ b/apps/web/ee/components/pages/share/pending-users-section.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; // plane imports import type { EPageSharedUserAccess } from "@plane/types"; @@ -15,13 +13,13 @@ type TPendingUsersSectionProps = { canCurrentUserChangeAccess?: boolean; }; -export const PendingUsersSection = ({ +export function PendingUsersSection({ pendingUsers, onUpdateAccess, onRemove, getMemberDetails, canCurrentUserChangeAccess = true, -}: TPendingUsersSectionProps) => { +}: TPendingUsersSectionProps) { if (pendingUsers.length === 0) return null; return ( @@ -44,6 +42,6 @@ export const PendingUsersSection = ({ })}
    ); -}; +} PendingUsersSection.displayName = "PendingUsersSection"; diff --git a/apps/web/ee/components/pages/share/share-page-modal.tsx b/apps/web/ee/components/pages/share/share-page-modal.tsx index bf51c66548..2810923525 100644 --- a/apps/web/ee/components/pages/share/share-page-modal.tsx +++ b/apps/web/ee/components/pages/share/share-page-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; // plane imports import type { EPageSharedUserAccess } from "@plane/types"; @@ -54,7 +52,7 @@ type TSharePageModalProps = { originPosition?: { x: number; y: number } | null; }; -export const SharePageModal: React.FC = ({ isOpen, onClose, data, onAction }) => { +export function SharePageModal({ isOpen, onClose, data, onAction }: TSharePageModalProps) { if (!isOpen) return null; return ( @@ -116,6 +114,6 @@ export const SharePageModal: React.FC = ({ isOpen, onClose /> ); -}; +} SharePageModal.displayName = "SharePageModal"; diff --git a/apps/web/ee/components/pages/share/user-list-item.tsx b/apps/web/ee/components/pages/share/user-list-item.tsx index 3accd6bb11..d936843c34 100644 --- a/apps/web/ee/components/pages/share/user-list-item.tsx +++ b/apps/web/ee/components/pages/share/user-list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useTheme } from "next-themes"; import { Avatar } from "@plane/ui"; import { cn, getFileURL } from "@plane/utils"; @@ -18,7 +16,7 @@ type TUserListItemProps = { canCurrentUserChangeAccess?: boolean; }; -export const UserListItem = ({ +export function UserListItem({ userId, displayName, avatarUrl, @@ -29,7 +27,7 @@ export const UserListItem = ({ onRemove, className = "", canCurrentUserChangeAccess = true, -}: TUserListItemProps) => { +}: TUserListItemProps) { const { resolvedTheme } = useTheme(); return ( @@ -55,7 +53,7 @@ export const UserListItem = ({ )} onUpdateAccess(userId, parseInt(accessValue) as number)} + onUpdateAccess={(accessValue) => onUpdateAccess(userId, parseInt(accessValue))} onRemove={() => onRemove(userId)} isOwner={isOwner} canCurrentUserChangeAccess={canCurrentUserChangeAccess} @@ -63,6 +61,6 @@ export const UserListItem = ({
    ); -}; +} UserListItem.displayName = "UserListItem"; diff --git a/apps/web/ee/components/pages/sidebar/list-item-root.tsx b/apps/web/ee/components/pages/sidebar/list-item-root.tsx index 72e4f1692e..bfec08e9d1 100644 --- a/apps/web/ee/components/pages/sidebar/list-item-root.tsx +++ b/apps/web/ee/components/pages/sidebar/list-item-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useCallback, useEffect, useRef, useState } from "react"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; import { draggable, dropTargetForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter"; @@ -38,7 +36,7 @@ type Props = { isLastChild: boolean; }; -export const WikiPageSidebarListItemRoot: React.FC = observer((props) => { +export const WikiPageSidebarListItemRoot = observer(function WikiPageSidebarListItemRoot(props: Props) { const { paddingLeft, pageId, diff --git a/apps/web/ee/components/pages/sidebar/list-item.tsx b/apps/web/ee/components/pages/sidebar/list-item.tsx index c12dd0acfd..36fff670c0 100644 --- a/apps/web/ee/components/pages/sidebar/list-item.tsx +++ b/apps/web/ee/components/pages/sidebar/list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; import { dropTargetForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter"; @@ -34,7 +32,7 @@ type Props = { setLocalIsExpanded: React.Dispatch>; }; -const WikiPageSidebarListItemComponent = observer((props: Props) => { +const WikiPageSidebarListItemComponent = observer(function WikiPageSidebarListItemComponent(props: Props) { const { handleToggleExpanded, isExpanded, diff --git a/apps/web/ee/components/pages/sidebar/list.tsx b/apps/web/ee/components/pages/sidebar/list.tsx index 6f5a38ed25..90a71a4b59 100644 --- a/apps/web/ee/components/pages/sidebar/list.tsx +++ b/apps/web/ee/components/pages/sidebar/list.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -13,7 +11,7 @@ type Props = { setExpandedPageIds?: React.Dispatch>; }; -export const PagesAppSidebarList: React.FC = observer((props) => { +export const PagesAppSidebarList = observer(function PagesAppSidebarList(props: Props) { const { expandedPageIds = [], setExpandedPageIds } = props; // params const { pageId } = useParams(); diff --git a/apps/web/ee/components/pages/sidebar/menu.tsx b/apps/web/ee/components/pages/sidebar/menu.tsx index b662b34547..faf04f7787 100644 --- a/apps/web/ee/components/pages/sidebar/menu.tsx +++ b/apps/web/ee/components/pages/sidebar/menu.tsx @@ -30,7 +30,7 @@ export const SIDEBAR_MENU_ITEMS: { }, ]; -export const PagesAppSidebarMenu = observer(() => { +export const PagesAppSidebarMenu = observer(function PagesAppSidebarMenu() { // params const { workspaceSlug } = useParams(); const pathname = usePathname(); diff --git a/apps/web/ee/components/pages/sidebar/quick-actions.tsx b/apps/web/ee/components/pages/sidebar/quick-actions.tsx index 7e6013964a..e3510208c3 100644 --- a/apps/web/ee/components/pages/sidebar/quick-actions.tsx +++ b/apps/web/ee/components/pages/sidebar/quick-actions.tsx @@ -14,7 +14,7 @@ import { captureError, captureSuccess } from "@/helpers/event-tracker.helper"; import { useAppRouter } from "@/hooks/use-app-router"; import { EPageStoreType, usePageStore } from "@/plane-web/hooks/store/use-page-store"; -export const PagesAppSidebarQuickActions = observer(() => { +export const PagesAppSidebarQuickActions = observer(function PagesAppSidebarQuickActions() { // states const [isCreatingPage, setIsCreatingPage] = useState(false); // params diff --git a/apps/web/ee/components/pages/sidebar/section/components/section-content.tsx b/apps/web/ee/components/pages/sidebar/section/components/section-content.tsx index 3581d54f6c..ed9fd857b1 100644 --- a/apps/web/ee/components/pages/sidebar/section/components/section-content.tsx +++ b/apps/web/ee/components/pages/sidebar/section/components/section-content.tsx @@ -18,151 +18,154 @@ import type { SectionContentProps } from "../types"; * Component for rendering section content with virtualization * Only renders items that are visible in the viewport (with buffer) */ -const VirtualizedSectionContentComponent: React.FC = observer( - ({ pageIds, sectionType, expandedPageIds, setExpandedPageIds }) => { - // Get current page ID to ensure it's always rendered - const { pageId: currentPageId } = useParams(); - // store hooks - const { getPageById } = usePageStore(EPageStoreType.WORKSPACE); +const VirtualizedSectionContentComponent = observer(function VirtualizedSectionContentComponent({ + pageIds, + sectionType, + expandedPageIds, + setExpandedPageIds, +}: SectionContentProps) { + // Get current page ID to ensure it's always rendered + const { pageId: currentPageId } = useParams(); + // store hooks + const { getPageById } = usePageStore(EPageStoreType.WORKSPACE); - // Placeholder for items not currently visible - const renderPlaceholder = () => ( -
    - -
    -
    - ); + // Placeholder for items not currently visible + const renderPlaceholder = () => ( +
    + +
    +
    + ); - // Check if this page or any of its ancestors is the current page - const isActiveOrAncestor = (pageId: string) => { - if (!currentPageId) return false; + // Check if this page or any of its ancestors is the current page + const isActiveOrAncestor = (pageId: string) => { + if (!currentPageId) return false; - // Direct match - if (pageId === currentPageId.toString()) return true; + // Direct match + if (pageId === currentPageId.toString()) return true; - // Check if it's an ancestor of current page (is expanded and in expanded path) - if (expandedPageIds && expandedPageIds.includes(pageId)) { - // This relies on the existing logic in section-root that expands parent pages - // of the current page, so if a page is both expanded and the current page exists, - // there's a good chance it's in the ancestry path - return true; - } + // Check if it's an ancestor of current page (is expanded and in expanded path) + if (expandedPageIds && expandedPageIds.includes(pageId)) { + // This relies on the existing logic in section-root that expands parent pages + // of the current page, so if a page is both expanded and the current page exists, + // there's a good chance it's in the ancestry path + return true; + } - return false; - }; + return false; + }; - const handleReorderPages = useCallback( - (pageId: string, targetId: string, position: "before" | "after") => { - const shouldDropAtEnd = position === "after"; - const sourcePage = getPageById(pageId); - const sourcePageCurrentIndex = pageIds.indexOf(pageId); - const destinationIndex = shouldDropAtEnd ? pageIds.length - 1 : pageIds.indexOf(targetId); + const handleReorderPages = useCallback( + (pageId: string, targetId: string, position: "before" | "after") => { + const shouldDropAtEnd = position === "after"; + const sourcePage = getPageById(pageId); + const sourcePageCurrentIndex = pageIds.indexOf(pageId); + const destinationIndex = shouldDropAtEnd ? pageIds.length - 1 : pageIds.indexOf(targetId); - let sortOrder = sourcePage?.sort_order ?? 65535; - if (sourcePageCurrentIndex !== destinationIndex) { - if (destinationIndex === 0) { - const page = getPageById(pageIds[destinationIndex]); - if (page && page.sort_order !== undefined) { - sortOrder = page.sort_order - PAGE_SORT_ORDER_INCREMENT; - } - } else if (destinationIndex === pageIds.length - 1) { - const page = getPageById(pageIds[destinationIndex]); - if (page && page.sort_order !== undefined) { - sortOrder = page.sort_order + PAGE_SORT_ORDER_INCREMENT; - } - } else { - const page = getPageById(pageIds[destinationIndex - 1]); - const nextPage = getPageById(pageIds[destinationIndex]); - if (page && nextPage && page.sort_order !== undefined && nextPage.sort_order !== undefined) { - sortOrder = (page.sort_order + nextPage.sort_order) / 2; - } + let sortOrder = sourcePage?.sort_order ?? 65535; + if (sourcePageCurrentIndex !== destinationIndex) { + if (destinationIndex === 0) { + const page = getPageById(pageIds[destinationIndex]); + if (page && page.sort_order !== undefined) { + sortOrder = page.sort_order - PAGE_SORT_ORDER_INCREMENT; + } + } else if (destinationIndex === pageIds.length - 1) { + const page = getPageById(pageIds[destinationIndex]); + if (page && page.sort_order !== undefined) { + sortOrder = page.sort_order + PAGE_SORT_ORDER_INCREMENT; + } + } else { + const page = getPageById(pageIds[destinationIndex - 1]); + const nextPage = getPageById(pageIds[destinationIndex]); + if (page && nextPage && page.sort_order !== undefined && nextPage.sort_order !== undefined) { + sortOrder = (page.sort_order + nextPage.sort_order) / 2; } } + } - const payload: Partial = {}; + const payload: Partial = {}; - if (sortOrder !== sourcePage?.sort_order) { - payload.sort_order = sortOrder; - } + if (sortOrder !== sourcePage?.sort_order) { + payload.sort_order = sortOrder; + } - // TODO: remove parent id patch once reordering is implemented for sub-pages - if (sourcePage?.parent_id !== null) { - payload.parent_id = null; - } + // TODO: remove parent id patch once reordering is implemented for sub-pages + if (sourcePage?.parent_id !== null) { + payload.parent_id = null; + } - let newAccess: EPageAccess | undefined; - if (sectionType === "public") { - newAccess = EPageAccess.PUBLIC; - } else if (sectionType === "private") { - newAccess = EPageAccess.PRIVATE; - } + let newAccess: EPageAccess | undefined; + if (sectionType === "public") { + newAccess = EPageAccess.PUBLIC; + } else if (sectionType === "private") { + newAccess = EPageAccess.PRIVATE; + } - if (newAccess !== undefined && sourcePage?.access !== newAccess) { - payload.access = newAccess; - // If we're setting access to public/private, unset the shared flag - payload.is_shared = false; - } + if (newAccess !== undefined && sourcePage?.access !== newAccess) { + payload.access = newAccess; + // If we're setting access to public/private, unset the shared flag + payload.is_shared = false; + } - if (Object.keys(payload).length > 0) { - sourcePage?.update(payload); - } - }, - [getPageById, pageIds, sectionType] - ); + if (Object.keys(payload).length > 0) { + sourcePage?.update(payload); + } + }, + [getPageById, pageIds, sectionType] + ); - return ( - - {pageIds.length > 0 ? ( -
    - {pageIds.map((pageId, index) => { - // If this is the active page or an ancestor, always render it - // without virtualization to ensure it's available for scrolling - const isImportantPage = isActiveOrAncestor(pageId); + return ( + + {pageIds.length > 0 ? ( +
    + {pageIds.map((pageId, index) => { + // If this is the active page or an ancestor, always render it + // without virtualization to ensure it's available for scrolling + const isImportantPage = isActiveOrAncestor(pageId); - return isImportantPage ? ( -
    - -
    - ) : ( - - - - ); - })} -
    - ) : ( -

    - No {sectionType === "public" ? "workspace" : sectionType} pages -

    - )} -     - ); - } -); + return isImportantPage ? ( +
    + +
    + ) : ( + + + + ); + })} +
    + ) : ( +

    + No {sectionType === "public" ? "workspace" : sectionType} pages +

    + )} +     + ); +}); export const SectionContent = memo(VirtualizedSectionContentComponent); diff --git a/apps/web/ee/components/pages/sidebar/section/components/section-header.tsx b/apps/web/ee/components/pages/sidebar/section/components/section-header.tsx index fc2db5503c..7f429ab518 100644 --- a/apps/web/ee/components/pages/sidebar/section/components/section-header.tsx +++ b/apps/web/ee/components/pages/sidebar/section/components/section-header.tsx @@ -15,60 +15,65 @@ import type { SectionHeaderProps } from "../types"; /** * Component for rendering section header with label, icon and actions */ -export const SectionHeader: React.FC = React.memo( - ({ sectionType, sectionDetails, isCreatingPage, handleCreatePage, buttonRef, onButtonClick }) => { - const { workspaceSlug } = useParams(); +export const SectionHeader = React.memo(function SectionHeader({ + sectionType, + sectionDetails, + isCreatingPage, + handleCreatePage, + buttonRef, + onButtonClick, +}: SectionHeaderProps) { + const { workspaceSlug } = useParams(); - return ( -
    + - - {sectionDetails.label === SECTION_DETAILS.public.label ? "Workspace" : sectionDetails.label} - + {sectionDetails.label === SECTION_DETAILS.public.label ? "Workspace" : sectionDetails.label} + -
    - {sectionType !== "archived" && sectionType !== "shared" && ( - - )} - + {sectionType !== "archived" && sectionType !== "shared" && ( +
    + + )} + { + e.stopPropagation(); + if (onButtonClick) onButtonClick(); + }} + > + {({ open }) => ( + + )} +
    - ); - } -); +
    + ); +}); SectionHeader.displayName = "SectionHeader"; diff --git a/apps/web/ee/components/pages/sidebar/section/section-root.tsx b/apps/web/ee/components/pages/sidebar/section/section-root.tsx index b689d3fc0e..870322344a 100644 --- a/apps/web/ee/components/pages/sidebar/section/section-root.tsx +++ b/apps/web/ee/components/pages/sidebar/section/section-root.tsx @@ -22,7 +22,7 @@ import { SECTION_DETAILS } from "./constants"; import { useSectionDragAndDrop, useSectionPages } from "./hooks"; import type { SectionRootProps } from "./types"; -const WikiSidebarListSectionRootContent: React.FC = observer((props) => { +const WikiSidebarListSectionRootContent = observer(function WikiSidebarListSectionRootContent(props: SectionRootProps) { const { expandedPageIds, sectionType, setExpandedPageIds, currentPageId } = props; // states const [isCreatingPage, setIsCreatingPage] = useState(null); diff --git a/apps/web/ee/components/pages/version/editor.tsx b/apps/web/ee/components/pages/version/editor.tsx index a572113840..1fb026b7a7 100644 --- a/apps/web/ee/components/pages/version/editor.tsx +++ b/apps/web/ee/components/pages/version/editor.tsx @@ -14,7 +14,7 @@ import { usePageFilters } from "@/hooks/use-page-filters"; // plane web hooks import { useEditorFlagging } from "@/plane-web/hooks/use-editor-flagging"; -export const WorkspacePagesVersionEditor: React.FC = observer((props) => { +export const WorkspacePagesVersionEditor = observer(function WorkspacePagesVersionEditor(props: TVersionEditorProps) { const { activeVersion, versionDetails } = props; // navigation const { workspaceSlug, projectId } = useParams(); diff --git a/apps/web/ee/components/pi-chat/actions/action-status-block.tsx b/apps/web/ee/components/pi-chat/actions/action-status-block.tsx index a629ebaf92..231ff456d3 100644 --- a/apps/web/ee/components/pi-chat/actions/action-status-block.tsx +++ b/apps/web/ee/components/pi-chat/actions/action-status-block.tsx @@ -19,7 +19,7 @@ type TProps = { dialogue: TDialogue; }; -const ActionStatusBlock = (props: TProps) => { +function ActionStatusBlock(props: TProps) { // props const { isLatest, isPiThinking, workspaceSlug, workspaceId, query_id, activeChatId, isPiTyping, dialogue } = props; @@ -98,6 +98,6 @@ const ActionStatusBlock = (props: TProps) => { )}
    ); -}; +} export default ActionStatusBlock; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/artifact-block-mini.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/artifact-block-mini.tsx index 800115ae96..ce96b31980 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/artifact-block-mini.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/artifact-block-mini.tsx @@ -3,7 +3,7 @@ type TArtifactBlockMiniProps = { description: string; }; -const ArtifactBlockMini = (props: TArtifactBlockMiniProps) => { +function ArtifactBlockMini(props: TArtifactBlockMiniProps) { const { title, description } = props; return (
    @@ -14,6 +14,6 @@ const ArtifactBlockMini = (props: TArtifactBlockMiniProps) => {
    {description}
    ); -}; +} export default ArtifactBlockMini; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/cycle.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/cycle.tsx index 92c91b5171..3d6b8767ea 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/cycle.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/cycle.tsx @@ -16,7 +16,7 @@ interface TCycleDetailProps { activeChatId: string; } -export const CycleDetail = observer((props: TCycleDetailProps) => { +export const CycleDetail = observer(function CycleDetail(props: TCycleDetailProps) { const { data, updateArtifact, workspaceSlug, activeChatId } = props; // hooks const { isMobile } = usePlatformOS(); diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/epic.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/epic.tsx index 75c7e6e502..ff8f1bf876 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/epic.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/epic.tsx @@ -15,7 +15,7 @@ interface TEpicDetailProps { updateArtifact: (data: TUpdatedArtifact) => Promise; } -export const EpicDetail = observer((props: TEpicDetailProps) => { +export const EpicDetail = observer(function EpicDetail(props: TEpicDetailProps) { const { data, workspaceSlug, activeChatId, updateArtifact } = props; // state const [isSaving, setIsSaving] = useState(false); diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/follow-up.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/follow-up.tsx index 221b65e9c4..865f820dfe 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/follow-up.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/follow-up.tsx @@ -27,7 +27,7 @@ type TEditCommands = { clear: () => void; }; -export const FollowUpDetail = observer((props: TProps) => { +export const FollowUpDetail = observer(function FollowUpDetail(props: TProps) { const { projectId, workspaceId, artifactId, messageId, artifactType, onSubmit } = props; // states const [isThinking, setIsThinking] = useState(false); diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/footer.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/footer.tsx index f8575b24d9..1a675e918d 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/footer.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/footer.tsx @@ -18,10 +18,10 @@ type TProps = { error?: string | null; onSubmit?: (artifactData: TUpdatedArtifact) => void; }; -export const PiChatArtifactsFooter = observer((props: TProps) => { +export const PiChatArtifactsFooter = observer(function PiChatArtifactsFooter(props: TProps) { const { artifactsData, workspaceSlug, activeChatId, artifactId, isSaving, showSavedToast, error, onSubmit } = props; const { getWorkspaceBySlug } = useWorkspace(); - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id ?? ""; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id ?? ""; const projectId = artifactsData?.parameters?.project?.id; return (
    @@ -40,6 +40,7 @@ export const PiChatArtifactsFooter = observer((props: TProps) => { target="_blank" className={cn("flex items-center gap-2 text-sm font-medium", getButtonStyling("primary", "md"))} href={artifactsData.entity_url} + rel="noreferrer" >
    Open {artifactsData.artifact_type}
    diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/header.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/header.tsx index 1faccbef81..6d099adc96 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/header.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/header.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { uniqBy } from "lodash-es"; import { observer } from "mobx-react"; import { CloseIcon } from "@plane/propel/icons"; @@ -14,7 +12,7 @@ import { getIcon } from "../../preview-block"; const buttonClass = "w-auto p-2 rounded-lg text-custom-text-200 grid place-items-center border-[0.5px] border-custom-sidebar-border-300 bg-custom-background-200 hover:shadow-sm hover:text-custom-text-300"; -export const Header = observer((props: { artifact: TArtifact }) => { +export const Header = observer(function Header(props: { artifact: TArtifact }) { const { artifact } = props; const { toggleSidebar } = useAppTheme(); const { diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/module.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/module.tsx index ac5556d7ca..3201533305 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/module.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/module.tsx @@ -16,7 +16,7 @@ interface TModuleDetailProps { activeChatId: string; } -export const ModuleDetail = observer((props: TModuleDetailProps) => { +export const ModuleDetail = observer(function ModuleDetail(props: TModuleDetailProps) { const { data, updateArtifact, workspaceSlug, activeChatId } = props; // hooks const { isMobile } = usePlatformOS(); diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/details.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/details.tsx index b9e56ab2a3..6e0e5c1c2f 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/details.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/details.tsx @@ -17,7 +17,7 @@ interface TPageDetailProps { updateArtifact: (data: TUpdatedArtifact) => Promise; } -export const PageDetail: React.FC = observer((props) => { +export const PageDetail = observer(function PageDetail(props: TPageDetailProps) { const { data, artifactId, activeChatId, workspaceSlug, updateArtifact } = props; const updatedData = usePageData(data.artifact_id); const editorRef = useRef(null); diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/editor.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/editor.tsx index cadd330de4..513809d357 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/editor.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/editor.tsx @@ -20,7 +20,7 @@ type Props = { editorRef: React.RefObject; }; -export const PagePreviewEditor = observer((props: Props) => { +export const PagePreviewEditor = observer(function PagePreviewEditor(props: Props) { const { workspaceSlug, projectId, artifactId, initialValue, onChange, editorRef } = props; const { getWorkspaceBySlug } = useWorkspace(); // derived values diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/root.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/root.tsx index 7aa7b66fe2..37f0b4c68d 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/root.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/page/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect, useRef, useState } from "react"; import { observer } from "mobx-react"; import { Controller, FormProvider, useForm } from "react-hook-form"; @@ -17,7 +15,7 @@ type Props = { editorRef: React.RefObject; }; -export const PageFormRoot: React.FC = observer((props) => { +export const PageFormRoot = observer(function PageFormRoot(props: Props) { const { artifactId, workspaceSlug, preloadedData, handleOnChange, editorRef } = props; // states const [isEmojiIconPickerOpen, setIsEmojiIconPickerOpen] = useState(false); diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/root.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/root.tsx index 3279f7c193..c96b3703d5 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/root.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/root.tsx @@ -11,33 +11,31 @@ import { PageDetail } from "./page"; import { TemplateDetail } from "./template"; import { WorkItemDetail } from "./work-item"; -const DetailCardRenderer = observer( - (props: { - artifactId: string; - activeChatId: string; - data: TArtifact; - workspaceSlug: string; - updateArtifact: (data: Partial) => Promise; - }) => { - const { data } = props; - switch (data.artifact_type) { - case "workitem": - return ; - case "page": - return ; - case "epic": - return ; - case "module": - return ; - case "cycle": - return ; - default: - return ; - } +const DetailCardRenderer = observer(function DetailCardRenderer(props: { + artifactId: string; + activeChatId: string; + data: TArtifact; + workspaceSlug: string; + updateArtifact: (data: Partial) => Promise; +}) { + const { data } = props; + switch (data.artifact_type) { + case "workitem": + return ; + case "page": + return ; + case "epic": + return ; + case "module": + return ; + case "cycle": + return ; + default: + return ; } -); +}); -export const PiChatArtifactsRoot = observer(() => { +export const PiChatArtifactsRoot = observer(function PiChatArtifactsRoot() { // params const { workspaceSlug } = useParams(); // hooks diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/template.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/template.tsx index 674f3d19aa..980358241a 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/template.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/template.tsx @@ -10,7 +10,7 @@ type TProps = { data: TArtifact; }; -export const TemplateDetail = (props: TProps) => { +export function TemplateDetail(props: TProps) { const { data } = props; const properties = { ...data?.parameters?.properties, @@ -63,4 +63,4 @@ export const TemplateDetail = (props: TProps) => {
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/toast.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/toast.tsx index 80c23327d8..88679092bc 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/toast.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/toast.tsx @@ -1,7 +1,7 @@ import { FilledCheck, FilledCross } from "@plane/propel/icons"; import { Spinner } from "@plane/ui"; -export const Toast = (props: { error: string | null; isSaving: boolean }) => { +export function Toast(props: { error: string | null; isSaving: boolean }) { const { error, isSaving } = props; if (isSaving) { @@ -28,4 +28,4 @@ export const Toast = (props: { error: string | null; isSaving: boolean }) => {
    ); } -}; +} diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/detail/work-item.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/detail/work-item.tsx index 7a3ca597e2..0fcd8c2a31 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/detail/work-item.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/detail/work-item.tsx @@ -15,7 +15,7 @@ interface TWorkItemDetailProps { activeChatId: string; } -export const WorkItemDetail = observer((props: TWorkItemDetailProps) => { +export const WorkItemDetail = observer(function WorkItemDetail(props: TWorkItemDetailProps) { // props const { data, updateArtifact, workspaceSlug, activeChatId } = props; // state diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/list/root.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/list/root.tsx index ebb7bc543c..1267bd7721 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/list/root.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/list/root.tsx @@ -1,7 +1,7 @@ import type { TArtifact } from "@/plane-web/types"; import { PreviewCard } from "../preview-cards/root"; -export const PiChatArtifactsListRoot = (props: { artifacts: TArtifact[] }) => { +export function PiChatArtifactsListRoot(props: { artifacts: TArtifact[] }) { const { artifacts } = props; return (
    @@ -15,4 +15,4 @@ export const PiChatArtifactsListRoot = (props: { artifacts: TArtifact[] }) => { ))}
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/add-remove.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/add-remove.tsx index 9e462e6816..c6c5984b89 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/add-remove.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/add-remove.tsx @@ -7,7 +7,7 @@ type TProps = { artifactId: string; }; -export const AddRemovePreviewCard = observer((props: TProps) => { +export const AddRemovePreviewCard = observer(function AddRemovePreviewCard(props: TProps) { const { artifactId } = props; const data = useTemplateData(artifactId); const artifactSubType = data?.parameters?.artifact_sub_type; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/cycle.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/cycle.tsx index ca20f97a78..28dc5c531f 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/cycle.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/cycle.tsx @@ -9,7 +9,7 @@ type TProps = { artifactId: string; }; -export const CyclePreviewCard = observer((props: TProps) => { +export const CyclePreviewCard = observer(function CyclePreviewCard(props: TProps) { const { artifactId } = props; const data = useCycleData(artifactId); if (!data) return <>; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/delete-archieve.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/delete-archieve.tsx index a0e6d4e934..0934cd2d46 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/delete-archieve.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/delete-archieve.tsx @@ -7,7 +7,7 @@ type TProps = { artifactId: string; }; -export const DeleteArchivePreviewCard = observer((props: TProps) => { +export const DeleteArchivePreviewCard = observer(function DeleteArchivePreviewCard(props: TProps) { const { artifactId } = props; const data = useTemplateData(artifactId); if (!data) return <>; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/module.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/module.tsx index 26d9325198..03c0431bbf 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/module.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/module.tsx @@ -10,7 +10,7 @@ type TProps = { artifactId: string; }; -export const ModulePreviewCard = observer((props: TProps) => { +export const ModulePreviewCard = observer(function ModulePreviewCard(props: TProps) { const { artifactId } = props; const data = useModuleData(artifactId); if (!data) return <>; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/page.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/page.tsx index 52a009e5ae..ab9e0fa64f 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/page.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/page.tsx @@ -8,7 +8,7 @@ type TProps = { artifactId: string; }; -export const PagePreviewCard = observer((props: TProps) => { +export const PagePreviewCard = observer(function PagePreviewCard(props: TProps) { const { artifactId } = props; const data = usePageData(artifactId); if (!data) return <>; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/project.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/project.tsx index e985a19109..709c2cdbed 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/project.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/project.tsx @@ -10,7 +10,7 @@ type TProps = { artifactId: string; }; -export const ProjectPreviewCard = observer((props: TProps) => { +export const ProjectPreviewCard = observer(function ProjectPreviewCard(props: TProps) { const { artifactId } = props; const data = useTemplateData(artifactId); const properties = { ...data?.parameters?.properties }; @@ -37,7 +37,7 @@ export const ProjectPreviewCard = observer((props: TProps) => { {data.parameters?.name || data.parameters?.project?.name || "Unknown"} - {(data as TArtifact).project_identifier || data.parameters?.project?.identifier} + {data.project_identifier || data.parameters?.project?.identifier}
    diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/properties.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/properties.tsx index a5bde0a15d..92551eae61 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/properties.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/properties.tsx @@ -60,12 +60,12 @@ type TProps = { }; }; -const PropertyWrapper = (props: { +function PropertyWrapper(props: { children: (props: { className: string }) => React.ReactNode; title: string; Icon?: React.ElementType; showContainer: boolean; -}) => { +}) { const { children, title, Icon = ProjectIcon, showContainer } = props; if (!showContainer) return <>{children({ className: "" })}; return ( @@ -79,8 +79,9 @@ const PropertyWrapper = (props: {
    ); -}; -export const Properties = (props: TProps) => { +} + +export function Properties(props: TProps) { const { state, priority, @@ -190,4 +191,4 @@ export const Properties = (props: TProps) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/root.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/root.tsx index 32ad6bdf3d..9fffba634d 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/root.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/root.tsx @@ -10,7 +10,7 @@ import { DeleteArchivePreviewCard } from "./delete-archieve"; import { TemplatePreviewCard } from "./template"; // --- Main PreviewCard Component --- -export const PreviewCard = observer((props: { artifactId: string; type: string; action: string }) => { +export const PreviewCard = observer(function PreviewCard(props: { artifactId: string; type: string; action: string }) { const { artifactId, type, action } = props; // Special cases diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/template.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/template.tsx index ac77b68442..53a9632ed3 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/template.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/template.tsx @@ -8,7 +8,7 @@ type TProps = { artifactId: string; }; -export const TemplatePreviewCard = observer((props: TProps) => { +export const TemplatePreviewCard = observer(function TemplatePreviewCard(props: TProps) { const { artifactId } = props; const data = useTemplateData(artifactId); if (!data) return <>; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/view.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/view.tsx index 368eec56be..9f847f934d 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/view.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/view.tsx @@ -8,7 +8,7 @@ type TProps = { artifactId: string; }; -export const ViewPreviewCard = observer((props: TProps) => { +export const ViewPreviewCard = observer(function ViewPreviewCard(props: TProps) { const { artifactId } = props; const data = useTemplateData(artifactId); const properties = { ...data?.parameters?.properties, project: data?.parameters?.project }; diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/with-preview-hoc.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/with-preview-hoc.tsx index 39dd701f93..c3d6fc4d03 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/with-preview-hoc.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/with-preview-hoc.tsx @@ -14,7 +14,8 @@ interface IPreviewHOC { shouldToggleSidebar?: boolean; showEdited?: boolean; } -const BaseWithPreviewHOC = observer((props: IPreviewHOC) => { + +const BaseWithPreviewHOC = observer(function BaseWithPreviewHOC(props: IPreviewHOC) { const { children, artifactId, shouldToggleSidebar = true, showEdited = true } = props; // router const pathname = usePathname(); @@ -61,7 +62,7 @@ const BaseWithPreviewHOC = observer((props: IPreviewHOC) => { ); }); -const PreviewProperties = (props: { children: React.ReactNode }) => { +function PreviewProperties(props: { children: React.ReactNode }) { const { children } = props; return (
    { {children}
    ); -}; +} // 👇 Extend type manually here interface WithPreviewHOCType extends React.FC { diff --git a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/work-item.tsx b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/work-item.tsx index 134fdd877c..ea79640420 100644 --- a/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/work-item.tsx +++ b/apps/web/ee/components/pi-chat/actions/artifacts/preview-cards/work-item.tsx @@ -18,7 +18,7 @@ type TProps = { isEpic?: boolean; }; -export const WorkItemPreviewCard = observer((props: TProps) => { +export const WorkItemPreviewCard = observer(function WorkItemPreviewCard(props: TProps) { const { artifactId, isEpic = false } = props; const data = useWorkItemData(artifactId); const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/pi-chat/actions/confirm-block.tsx b/apps/web/ee/components/pi-chat/actions/confirm-block.tsx index 18d5cde597..413eb5b278 100644 --- a/apps/web/ee/components/pi-chat/actions/confirm-block.tsx +++ b/apps/web/ee/components/pi-chat/actions/confirm-block.tsx @@ -8,7 +8,7 @@ type TProps = { handleExecuteAction: (workspaceId: string, query_id: string) => void; }; -export const ConfirmBlock = (props: TProps) => { +export function ConfirmBlock(props: TProps) { const { summary, isExecutingAction, handleExecuteAction, workspaceId, query_id } = props; return (
    @@ -23,4 +23,4 @@ export const ConfirmBlock = (props: TProps) => {
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/actions/preview-block.tsx b/apps/web/ee/components/pi-chat/actions/preview-block.tsx index 6faa052ba7..80e3efbf71 100644 --- a/apps/web/ee/components/pi-chat/actions/preview-block.tsx +++ b/apps/web/ee/components/pi-chat/actions/preview-block.tsx @@ -38,7 +38,7 @@ export const getIcon = (type: string, color?: string, defaultRender: "text" | "i ); } }; -export const PreviewBlock = (props: { type: string; name: string; url?: string | null; data?: TArtifact }) => { +export function PreviewBlock(props: { type: string; name: string; url?: string | null; data?: TArtifact }) { const { type, name, url, data } = props; return ( {getIcon(type, "", "text")}
    {(type === "workitem" || type === "project") && data && (
    - {(data as TArtifact).issue_identifier || - (data as TArtifact).project_identifier || - (data as TArtifact).parameters?.project?.identifier} + {data.issue_identifier || data.project_identifier || data.parameters?.project?.identifier}
    )}
    @@ -64,4 +62,4 @@ export const PreviewBlock = (props: { type: string; name: string; url?: string |
    {name}
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/actions/summary.tsx b/apps/web/ee/components/pi-chat/actions/summary.tsx index 342c1d30c3..9d74b82645 100644 --- a/apps/web/ee/components/pi-chat/actions/summary.tsx +++ b/apps/web/ee/components/pi-chat/actions/summary.tsx @@ -22,7 +22,7 @@ type TProps = { chatId: string; }; -export const SummaryBlock = observer((props: TProps) => { +export const SummaryBlock = observer(function SummaryBlock(props: TProps) { // props const { summary, query_id, chatId, status } = props; // states diff --git a/apps/web/ee/components/pi-chat/conversation/ai-message.tsx b/apps/web/ee/components/pi-chat/conversation/ai-message.tsx index 13155c78e2..bf34d4c1a5 100644 --- a/apps/web/ee/components/pi-chat/conversation/ai-message.tsx +++ b/apps/web/ee/components/pi-chat/conversation/ai-message.tsx @@ -22,7 +22,7 @@ type TProps = { isLoading?: boolean; handleConvertToPage?: () => void; }; -export const AiMessage = observer((props: TProps) => { +export const AiMessage = observer(function AiMessage(props: TProps) { // props const { dialogue, id = "", isLatest, isLoading, handleConvertToPage } = props; // store @@ -30,7 +30,7 @@ export const AiMessage = observer((props: TProps) => { const { activeChatId, isPiTyping } = usePiChat(); const { getWorkspaceBySlug } = useWorkspace(); // derived - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; const { query_id, answer, reasoning, current_tick, isPiThinking, feedback } = dialogue || {}; return ( diff --git a/apps/web/ee/components/pi-chat/conversation/feedback.tsx b/apps/web/ee/components/pi-chat/conversation/feedback.tsx index 631d198919..f562fcb020 100644 --- a/apps/web/ee/components/pi-chat/conversation/feedback.tsx +++ b/apps/web/ee/components/pi-chat/conversation/feedback.tsx @@ -19,7 +19,7 @@ export type TProps = { handleConvertToPage?: () => void; }; -export const Feedback = observer((props: TProps) => { +export const Feedback = observer(function Feedback(props: TProps) { // props const { answer, activeChatId, id, workspaceId, feedback, queryId, isLatest, handleConvertToPage } = props; // states diff --git a/apps/web/ee/components/pi-chat/conversation/loading.tsx b/apps/web/ee/components/pi-chat/conversation/loading.tsx index 1e40ea600e..6005ac4316 100644 --- a/apps/web/ee/components/pi-chat/conversation/loading.tsx +++ b/apps/web/ee/components/pi-chat/conversation/loading.tsx @@ -8,7 +8,7 @@ type TProps = { isFullScreen: boolean; }; -export const Loading = observer((props: TProps) => { +export const Loading = observer(function Loading(props: TProps) { const { isLoading } = props; return ( diff --git a/apps/web/ee/components/pi-chat/conversation/messages.tsx b/apps/web/ee/components/pi-chat/conversation/messages.tsx index e6964d374a..96e3d3415e 100644 --- a/apps/web/ee/components/pi-chat/conversation/messages.tsx +++ b/apps/web/ee/components/pi-chat/conversation/messages.tsx @@ -19,7 +19,7 @@ type TProps = { setHasMoreMessages: (value: boolean) => void; }; -export const Messages = observer((props: TProps) => { +export const Messages = observer(function Messages(props: TProps) { const { currentUser, isLoading, diff --git a/apps/web/ee/components/pi-chat/conversation/my-message.tsx b/apps/web/ee/components/pi-chat/conversation/my-message.tsx index c4b8356377..cead42a8af 100644 --- a/apps/web/ee/components/pi-chat/conversation/my-message.tsx +++ b/apps/web/ee/components/pi-chat/conversation/my-message.tsx @@ -10,7 +10,7 @@ type TProps = { message?: string; attachments?: string[]; }; -export const MyMessage = observer((props: TProps) => { +export const MyMessage = observer(function MyMessage(props: TProps) { const { message, id = "", isLoading = false, attachments } = props; return (
    diff --git a/apps/web/ee/components/pi-chat/conversation/new-converstaion.tsx b/apps/web/ee/components/pi-chat/conversation/new-converstaion.tsx index 8169e0b962..c18f28a03a 100644 --- a/apps/web/ee/components/pi-chat/conversation/new-converstaion.tsx +++ b/apps/web/ee/components/pi-chat/conversation/new-converstaion.tsx @@ -17,13 +17,13 @@ type TProps = { shouldRedirect?: boolean; isProjectLevel?: boolean; }; -export const NewConversation = observer((props: TProps) => { +export const NewConversation = observer(function NewConversation(props: TProps) { const { currentUser, isFullScreen, shouldRedirect = true, isProjectLevel = false } = props; // store hooks const { workspaceSlug } = useParams(); const { getInstance } = usePiChat(); const { getWorkspaceBySlug } = useWorkspace(); - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; // SWR const { data: instance, isLoading } = useSWR( workspaceId ? `PI_STARTER_${workspaceId}` : null, diff --git a/apps/web/ee/components/pi-chat/conversation/reasoning.tsx b/apps/web/ee/components/pi-chat/conversation/reasoning.tsx index 9e5736e56d..ce1f3cdcf3 100644 --- a/apps/web/ee/components/pi-chat/conversation/reasoning.tsx +++ b/apps/web/ee/components/pi-chat/conversation/reasoning.tsx @@ -11,7 +11,7 @@ type TProps = { isThinking: boolean | undefined; }; -export const ReasoningBlock = (props: TProps) => { +export function ReasoningBlock(props: TProps) { const { currentTick, reasoning, isThinking } = props; const [isOpen, setIsOpen] = useState(false); @@ -68,4 +68,4 @@ export const ReasoningBlock = (props: TProps) => {
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/conversation/thinking.tsx b/apps/web/ee/components/pi-chat/conversation/thinking.tsx index 8556a20999..87ffe813e0 100644 --- a/apps/web/ee/components/pi-chat/conversation/thinking.tsx +++ b/apps/web/ee/components/pi-chat/conversation/thinking.tsx @@ -1,8 +1,10 @@ import Typing from "./typing"; -export const Thinking = ({ text = "Thinking" }: { text?: string }) => ( -
    - {text}   - -
    -); +export function Thinking({ text = "Thinking" }: { text?: string }) { + return ( +
    + {text}   + +
    + ); +} diff --git a/apps/web/ee/components/pi-chat/conversation/typing.tsx b/apps/web/ee/components/pi-chat/conversation/typing.tsx index 0b6c87250b..4e0a76942a 100644 --- a/apps/web/ee/components/pi-chat/conversation/typing.tsx +++ b/apps/web/ee/components/pi-chat/conversation/typing.tsx @@ -1,14 +1,17 @@ -const Typing = () => ( - <> - - . - - - . - - - . - - -); +function Typing() { + return ( + <> + + . + + + . + + + . + + + ); +} + export default Typing; diff --git a/apps/web/ee/components/pi-chat/converse/voice-chart.tsx b/apps/web/ee/components/pi-chat/converse/voice-chart.tsx index 4757ae8b5c..92252794f2 100644 --- a/apps/web/ee/components/pi-chat/converse/voice-chart.tsx +++ b/apps/web/ee/components/pi-chat/converse/voice-chart.tsx @@ -7,7 +7,7 @@ type TProps = { }; const MIN_HEIGHT = 2; // px minimum height for a bar -export const Waveform: React.FC = ({ data, barCount = 100 }) => { +export function Waveform({ data, barCount = 100 }: TProps) { if (!data || data.length === 0) return null; // --- Resample data so we always render `barCount` bars --- @@ -45,4 +45,4 @@ export const Waveform: React.FC = ({ data, barCount = 100 }) => {
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/converse/voice-input.tsx b/apps/web/ee/components/pi-chat/converse/voice-input.tsx index da3b860b77..3ae2cd667d 100644 --- a/apps/web/ee/components/pi-chat/converse/voice-input.tsx +++ b/apps/web/ee/components/pi-chat/converse/voice-input.tsx @@ -25,7 +25,7 @@ type TProps = { }; const piChatService = new PiChatService(); -const AudioRecorder = (props: TProps) => { +function AudioRecorder(props: TProps) { const { workspaceId, chatId, @@ -193,6 +193,6 @@ const AudioRecorder = (props: TProps) => { )}
    ); -}; +} export default AudioRecorder; diff --git a/apps/web/ee/components/pi-chat/detail.tsx b/apps/web/ee/components/pi-chat/detail.tsx index 70660e7531..05a22e7a87 100644 --- a/apps/web/ee/components/pi-chat/detail.tsx +++ b/apps/web/ee/components/pi-chat/detail.tsx @@ -1,4 +1,3 @@ -"use client"; import { useState } from "react"; import { observer } from "mobx-react"; import { usePathname } from "next/navigation"; @@ -20,7 +19,7 @@ type TProps = { isProjectLevel?: boolean; contextData?: TChatContextData; }; -export const PiChatDetail = observer((props: TProps) => { +export const PiChatDetail = observer(function PiChatDetail(props: TProps) { const { isFullScreen: isFullScreenProp = false, shouldRedirect = true, isProjectLevel = false, contextData } = props; const [hasMoreMessages, setHasMoreMessages] = useState(false); // router diff --git a/apps/web/ee/components/pi-chat/empty.tsx b/apps/web/ee/components/pi-chat/empty.tsx index fd7668b38c..8ad4081645 100644 --- a/apps/web/ee/components/pi-chat/empty.tsx +++ b/apps/web/ee/components/pi-chat/empty.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useTheme } from "next-themes"; import { Crown } from "lucide-react"; @@ -17,7 +15,7 @@ import { useUserPermissions } from "@/hooks/store/user"; import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; import { BetaBadge } from "../common/beta"; -export const EmptyPiChat = observer(() => { +export const EmptyPiChat = observer(function EmptyPiChat() { // store hooks const { allowPermissions } = useUserPermissions(); const { togglePaidPlanModal } = useWorkspaceSubscription(); @@ -61,6 +59,7 @@ export const EmptyPiChat = observer(() => { href="https://plane.so/pricing" target="_blank" className={"underline my-auto text-pi-700 font-medium"} + rel="noreferrer" > Talk custom pricing diff --git a/apps/web/ee/components/pi-chat/floating-bot.tsx b/apps/web/ee/components/pi-chat/floating-bot.tsx index bebed337c7..8b73d88a2e 100644 --- a/apps/web/ee/components/pi-chat/floating-bot.tsx +++ b/apps/web/ee/components/pi-chat/floating-bot.tsx @@ -45,7 +45,7 @@ const getEntityData = ( return null; }; -export const PiChatFloatingBot = observer(() => { +export const PiChatFloatingBot = observer(function PiChatFloatingBot() { // query params const pathName = usePathname(); const params = useParams(); diff --git a/apps/web/ee/components/pi-chat/header/header.tsx b/apps/web/ee/components/pi-chat/header/header.tsx index 64ec044c1d..0b2162c542 100644 --- a/apps/web/ee/components/pi-chat/header/header.tsx +++ b/apps/web/ee/components/pi-chat/header/header.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { useParams, useRouter } from "next/navigation"; @@ -26,7 +24,7 @@ type THeaderProps = { const buttonClass = "w-auto p-2 rounded-lg text-custom-text-200 grid place-items-center border-[0.5px] border-custom-sidebar-border-300 bg-custom-background-200 hover:shadow-sm hover:text-custom-text-300"; -export const Header = observer((props: THeaderProps) => { +export const Header = observer(function Header(props: THeaderProps) { const router = useRouter(); const { workspaceSlug } = useParams(); const { isProjectLevel = false, isFullScreen, toggleSidePanel, isSidePanelOpen } = props; diff --git a/apps/web/ee/components/pi-chat/header/models-dropdown.tsx b/apps/web/ee/components/pi-chat/header/models-dropdown.tsx index bcbfb8bc4f..c96ca8e114 100644 --- a/apps/web/ee/components/pi-chat/header/models-dropdown.tsx +++ b/apps/web/ee/components/pi-chat/header/models-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { ChevronDownIcon } from "@plane/propel/icons"; @@ -14,11 +12,11 @@ export type TModelsDropdown = { setActiveModel: (model: TAiModels) => void; }; -export const ModelsDropdown: FC = observer((props) => { +export const ModelsDropdown = observer(function ModelsDropdown(props: TModelsDropdown) { const { className, activeModel, models, setActiveModel } = props; - const DropdownOptions = () => - models?.map((model) => ( + function DropdownOptions() { + return models?.map((model) => ( = observer((props) => {
    {model.name}
     )); + } return ( void) => React.ReactNode; }; -export const DndWrapper: FC = observer((props) => { +export const DndWrapper = observer(function DndWrapper(props: Props) { const { workspaceSlug, workspaceId, diff --git a/apps/web/ee/components/pi-chat/input/feedback-modal.tsx b/apps/web/ee/components/pi-chat/input/feedback-modal.tsx index 8a7d59d87f..b22ba85bf4 100644 --- a/apps/web/ee/components/pi-chat/input/feedback-modal.tsx +++ b/apps/web/ee/components/pi-chat/input/feedback-modal.tsx @@ -10,7 +10,7 @@ type TProps = { onSubmit: (feedbackMessage: string) => void; }; -export const FeedbackModal = observer((props: TProps) => { +export const FeedbackModal = observer(function FeedbackModal(props: TProps) { const { isOpen, onClose, onSubmit } = props; // react hook form const { diff --git a/apps/web/ee/components/pi-chat/input/focus-filter.tsx b/apps/web/ee/components/pi-chat/input/focus-filter.tsx index 03d87d6f1e..84751485e3 100644 --- a/apps/web/ee/components/pi-chat/input/focus-filter.tsx +++ b/apps/web/ee/components/pi-chat/input/focus-filter.tsx @@ -28,7 +28,7 @@ type TProps = { isLoading: boolean; setFocus: Dispatch>; }; -export const FocusFilter = observer((props: TProps) => { +export const FocusFilter = observer(function FocusFilter(props: TProps) { const { focus, setFocus, isLoading, workspaceId, projectId } = props; // router params const { workspaceSlug } = useParams(); @@ -37,7 +37,7 @@ export const FocusFilter = observer((props: TProps) => { const { workspaceProjectIds, getProjectById } = useProject(); const { allowPermissions } = useUserPermissions(); // derived values - const workspace = getWorkspaceBySlug(workspaceSlug as string); + const workspace = getWorkspaceBySlug(workspaceSlug); const selectedFocus = focus.entityType === "workspace_id" ? workspace : getProjectById(focus.entityIdentifier); // helper const updateFocus = (key: K, value: TFocus[K]) => { diff --git a/apps/web/ee/components/pi-chat/input/mode.tsx b/apps/web/ee/components/pi-chat/input/mode.tsx index 2a7b7378bd..b0ee6836af 100644 --- a/apps/web/ee/components/pi-chat/input/mode.tsx +++ b/apps/web/ee/components/pi-chat/input/mode.tsx @@ -15,7 +15,7 @@ const MODE_OPTIONS = [ icon: , }, ]; -export const AiMode = (props: { aiMode: string; setAiMode: (mode: string) => void }) => { +export function AiMode(props: { aiMode: string; setAiMode: (mode: string) => void }) { const { aiMode, setAiMode } = props; const selectedMode = MODE_OPTIONS.find((option) => option.value === aiMode); return ( @@ -58,4 +58,4 @@ export const AiMode = (props: { aiMode: string; setAiMode: (mode: string) => voi
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/input/quick-action-button.tsx b/apps/web/ee/components/pi-chat/input/quick-action-button.tsx index d5f62da001..f231920f1f 100644 --- a/apps/web/ee/components/pi-chat/input/quick-action-button.tsx +++ b/apps/web/ee/components/pi-chat/input/quick-action-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -11,7 +9,7 @@ type Props = { open: () => void; }; -export const AttachmentActionButton: FC = observer((props) => { +export const AttachmentActionButton = observer(function AttachmentActionButton(props: Props) { const { isLoading, disabled = false, open } = props; return ( diff --git a/apps/web/ee/components/pi-chat/input/root.tsx b/apps/web/ee/components/pi-chat/input/root.tsx index 73122e7266..d2c597b876 100644 --- a/apps/web/ee/components/pi-chat/input/root.tsx +++ b/apps/web/ee/components/pi-chat/input/root.tsx @@ -41,7 +41,7 @@ type TProps = { contextData?: TChatContextData; }; -export const InputBox = observer((props: TProps) => { +export const InputBox = observer(function InputBox(props: TProps) { const { className, activeChatId, @@ -73,7 +73,7 @@ export const InputBox = observer((props: TProps) => { const routerWithProgress = useAppRouter(); const pathname = usePathname(); // derived values - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; const [projectIdentifier] = workItem?.split("-") ?? []; const projectDetails = getProjectByIdentifier(projectIdentifier); const projectIdToUse = projectDetails?.id || projectId || ""; diff --git a/apps/web/ee/components/pi-chat/layout.tsx b/apps/web/ee/components/pi-chat/layout.tsx index 94d58f94c7..559650b3df 100644 --- a/apps/web/ee/components/pi-chat/layout.tsx +++ b/apps/web/ee/components/pi-chat/layout.tsx @@ -16,7 +16,7 @@ type TProps = { isOpen?: boolean; }; -export const PiChatLayout = observer((props: TProps) => { +export const PiChatLayout = observer(function PiChatLayout(props: TProps) { const { isFullScreen: isFullScreenProp = false, children, @@ -41,7 +41,7 @@ export const PiChatLayout = observer((props: TProps) => { const pathName = usePathname(); // derived states const isFullScreen = pathName.includes("pi-chat") || isFullScreenProp; - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; useSWR( workspaceSlug ? `PI_USER_THREADS_${workspaceSlug}_${isProjectLevel}` : null, @@ -85,7 +85,7 @@ export const PiChatLayout = observer((props: TProps) => { // Handle initialization useEffect(() => { if (!chatId) return; - initPiChat(chatId as string); + initPiChat(chatId); }, [chatId]); if (!isOpen) return <>; diff --git a/apps/web/ee/components/pi-chat/list/list-item.tsx b/apps/web/ee/components/pi-chat/list/list-item.tsx index d62104fe0c..8527862e6e 100644 --- a/apps/web/ee/components/pi-chat/list/list-item.tsx +++ b/apps/web/ee/components/pi-chat/list/list-item.tsx @@ -18,7 +18,7 @@ type TProps = { thread: TUserThreads; }; -export const PiChatListItem = observer((props: TProps) => { +export const PiChatListItem = observer(function PiChatListItem(props: TProps) { const { thread } = props; // refs const parentRef = useRef(null); @@ -32,7 +32,7 @@ export const PiChatListItem = observer((props: TProps) => { const { favoriteChat, unfavoriteChat } = usePiChat(); const { getWorkspaceBySlug } = useWorkspace(); // derived - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; const handleFavorite = async () => { if (thread.is_favorite) { diff --git a/apps/web/ee/components/pi-chat/list/list.tsx b/apps/web/ee/components/pi-chat/list/list.tsx index d7b3b87b0f..e1b53405ee 100644 --- a/apps/web/ee/components/pi-chat/list/list.tsx +++ b/apps/web/ee/components/pi-chat/list/list.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { uniqBy } from "lodash-es"; import { observer } from "mobx-react"; import type { TUserThreads } from "@/plane-web/types"; @@ -10,7 +8,7 @@ type TProps = { userThreads: TUserThreads[] | undefined; isLoading: boolean; }; -const PiChatList = observer((props: TProps) => { +const PiChatList = observer(function PiChatList(props: TProps) { const { userThreads, isLoading } = props; return ( diff --git a/apps/web/ee/components/pi-chat/list/loader.tsx b/apps/web/ee/components/pi-chat/list/loader.tsx index 0bd6dbebf7..b37949fed0 100644 --- a/apps/web/ee/components/pi-chat/list/loader.tsx +++ b/apps/web/ee/components/pi-chat/list/loader.tsx @@ -1,8 +1,8 @@ import { Loader } from "@plane/ui"; import { cn } from "@plane/utils"; -const PiChatListLoader = () => - Array.from({ length: 3 }).map((_, index) => ( +function PiChatListLoader() { + return Array.from({ length: 3 }).map((_, index) => ( )); +} export default PiChatListLoader; diff --git a/apps/web/ee/components/pi-chat/list/root.tsx b/apps/web/ee/components/pi-chat/list/root.tsx index c2d5b73b34..0aa5a66509 100644 --- a/apps/web/ee/components/pi-chat/list/root.tsx +++ b/apps/web/ee/components/pi-chat/list/root.tsx @@ -4,7 +4,7 @@ import { useParams } from "next/navigation"; import { usePiChat } from "@/plane-web/hooks/store/use-pi-chat"; import PiChatList from "./list"; -export const AllChats = observer(() => { +export const AllChats = observer(function AllChats() { // router const { workspaceSlug } = useParams(); // store hooks diff --git a/apps/web/ee/components/pi-chat/modals/delete-modal.tsx b/apps/web/ee/components/pi-chat/modals/delete-modal.tsx index c9a163a86e..8afe229f77 100644 --- a/apps/web/ee/components/pi-chat/modals/delete-modal.tsx +++ b/apps/web/ee/components/pi-chat/modals/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams, useRouter } from "next/navigation"; @@ -15,7 +13,7 @@ interface IChatDelete { handleClose: () => void; } -export const ChatDeleteModal: React.FC = observer((props) => { +export const ChatDeleteModal = observer(function ChatDeleteModal(props: IChatDelete) { const { chatId, workspaceSlug, isOpen, chatTitle, handleClose } = props; // states diff --git a/apps/web/ee/components/pi-chat/modals/edit-form.tsx b/apps/web/ee/components/pi-chat/modals/edit-form.tsx index 33d93fe6d4..ddf5a865f3 100644 --- a/apps/web/ee/components/pi-chat/modals/edit-form.tsx +++ b/apps/web/ee/components/pi-chat/modals/edit-form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FormEvent } from "react"; import { useState } from "react"; // types @@ -20,7 +18,7 @@ type Props = { handleModalClose: () => void; }; -export const EditForm: React.FC = (props) => { +export function EditForm(props: Props) { const { chatId, title, handleModalClose, workspaceId } = props; // hooks const { isMobile } = usePlatformOS(); @@ -95,4 +93,4 @@ export const EditForm: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/modals/save-page-modal.tsx b/apps/web/ee/components/pi-chat/modals/save-page-modal.tsx index 213a3a7f1c..8a53d5b9ae 100644 --- a/apps/web/ee/components/pi-chat/modals/save-page-modal.tsx +++ b/apps/web/ee/components/pi-chat/modals/save-page-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FormEvent } from "react"; import { useState } from "react"; // types @@ -30,7 +28,7 @@ type Props = { >; }; -export const SavePageModal: React.FC = observer((props) => { +export const SavePageModal = observer(function SavePageModal(props: Props) { const { workspaceSlug, isOpen, handleModalClose, handleConvertToPage } = props; // state const [isSubmitting, setIsSubmitting] = useState(false); diff --git a/apps/web/ee/components/pi-chat/sidebar/favorites.tsx b/apps/web/ee/components/pi-chat/sidebar/favorites.tsx index 2594e033e8..d462e33243 100644 --- a/apps/web/ee/components/pi-chat/sidebar/favorites.tsx +++ b/apps/web/ee/components/pi-chat/sidebar/favorites.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { uniqBy } from "lodash-es"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -10,7 +8,7 @@ type TProps = { favoriteChats: TUserThreads[]; isProjectLevel?: boolean; }; -const FavoriteChats = observer((props: TProps) => { +const FavoriteChats = observer(function FavoriteChats(props: TProps) { const { favoriteChats, isProjectLevel = false } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/pi-chat/sidebar/recents.tsx b/apps/web/ee/components/pi-chat/sidebar/recents.tsx index 943e3f94b8..f64089a610 100644 --- a/apps/web/ee/components/pi-chat/sidebar/recents.tsx +++ b/apps/web/ee/components/pi-chat/sidebar/recents.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { uniqBy } from "lodash-es"; import { observer } from "mobx-react"; // plane imports @@ -17,7 +15,7 @@ type TProps = { isFullScreen: boolean; activeChatId: string; }; -const RecentChats = observer((props: TProps) => { +const RecentChats = observer(function RecentChats(props: TProps) { const { userThreads, isProjectLevel = false, isLoading = false, isFullScreen = false, activeChatId } = props; const { workspaceSlug, chatId } = useParams(); diff --git a/apps/web/ee/components/pi-chat/sidebar/right-side-panel.tsx b/apps/web/ee/components/pi-chat/sidebar/right-side-panel.tsx index 7f7df6ccea..b760603490 100644 --- a/apps/web/ee/components/pi-chat/sidebar/right-side-panel.tsx +++ b/apps/web/ee/components/pi-chat/sidebar/right-side-panel.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -17,7 +15,7 @@ type TProps = { isFullScreen?: boolean; toggleSidePanel: (value: boolean) => void; }; -export const RightSidePanel = observer((props: TProps) => { +export const RightSidePanel = observer(function RightSidePanel(props: TProps) { const { isSidePanelOpen, toggleSidePanel, isMobile = false, isFullScreen = false } = props; // states const [searchQuery, setSearchQuery] = useState(""); diff --git a/apps/web/ee/components/pi-chat/sidebar/root.tsx b/apps/web/ee/components/pi-chat/sidebar/root.tsx index 5af568644b..4f03a8f93f 100644 --- a/apps/web/ee/components/pi-chat/sidebar/root.tsx +++ b/apps/web/ee/components/pi-chat/sidebar/root.tsx @@ -1,5 +1,3 @@ -"use-client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -11,7 +9,7 @@ import FavoriteChats from "./favorites"; import RecentChats from "./recents"; import { Toolbar } from "./toolbar"; -export const PiSidebar = observer(() => { +export const PiSidebar = observer(function PiSidebar() { // states const [searchQuery, setSearchQuery] = useState(""); // store @@ -22,7 +20,7 @@ export const PiSidebar = observer(() => { useSWR( workspaceSlug ? `PI_FAVORITE_CHATS_${workspaceSlug}` : null, - workspaceSlug ? () => fetchFavoriteChats(getWorkspaceBySlug(workspaceSlug as string)?.id || "") : null, + workspaceSlug ? () => fetchFavoriteChats(getWorkspaceBySlug(workspaceSlug)?.id || "") : null, { revalidateOnFocus: false, revalidateIfStale: false, diff --git a/apps/web/ee/components/pi-chat/sidebar/sidebar-item.tsx b/apps/web/ee/components/pi-chat/sidebar/sidebar-item.tsx index b1680da43f..366bfb1fee 100644 --- a/apps/web/ee/components/pi-chat/sidebar/sidebar-item.tsx +++ b/apps/web/ee/components/pi-chat/sidebar/sidebar-item.tsx @@ -24,7 +24,7 @@ type TProps = { isFullScreen?: boolean; }; -export const SidebarItem = observer((props: TProps) => { +export const SidebarItem = observer(function SidebarItem(props: TProps) { const { isActive, chatId, @@ -44,7 +44,7 @@ export const SidebarItem = observer((props: TProps) => { // hooks const { favoriteChat, unfavoriteChat, initPiChat } = usePiChat(); const { getWorkspaceBySlug } = useWorkspace(); - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; const handleFavorite = async () => { if (isFavorite) { diff --git a/apps/web/ee/components/pi-chat/sidebar/toolbar.tsx b/apps/web/ee/components/pi-chat/sidebar/toolbar.tsx index d3a1a3adde..37178d3a24 100644 --- a/apps/web/ee/components/pi-chat/sidebar/toolbar.tsx +++ b/apps/web/ee/components/pi-chat/sidebar/toolbar.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -17,7 +15,7 @@ type Props = { isProjectLevel?: boolean; }; -export const Toolbar: FC = observer((props) => { +export const Toolbar = observer(function Toolbar(props: Props) { const { searchQuery, updateSearchQuery, isProjectLevel = false } = props; const { workspaceSlug } = useParams(); // refs diff --git a/apps/web/ee/components/pi-chat/system-prompts.tsx b/apps/web/ee/components/pi-chat/system-prompts.tsx index 80c1fe423d..62b6097dae 100644 --- a/apps/web/ee/components/pi-chat/system-prompts.tsx +++ b/apps/web/ee/components/pi-chat/system-prompts.tsx @@ -14,7 +14,8 @@ type TSystemPrompt = { isInitializing?: boolean; setIsInitializing: (value: string) => void; }; -const SystemPrompts = (props: TSystemPrompt) => { + +function SystemPrompts(props: TSystemPrompt) { const { prompt, isProjectLevel = false, shouldRedirect = true, isInitializing, setIsInitializing } = props; // store hooks const { getAnswer, isPiTyping, createNewChat } = usePiChat(); @@ -96,5 +97,6 @@ const SystemPrompts = (props: TSystemPrompt) => { {prompt.text} ); -}; +} + export default SystemPrompts; diff --git a/apps/web/ee/components/pi-chat/unauthorized.tsx b/apps/web/ee/components/pi-chat/unauthorized.tsx index ccbb17be90..1a48ce35bf 100644 --- a/apps/web/ee/components/pi-chat/unauthorized.tsx +++ b/apps/web/ee/components/pi-chat/unauthorized.tsx @@ -8,7 +8,7 @@ import lightState from "@/app/assets/auth/pi-chat-light.webp?url"; import { useWorkspace } from "@/hooks/store/use-workspace"; import { usePiChat } from "@/plane-web/hooks/store/use-pi-chat"; -export const UnauthorizedView = (props: { className?: string; imgClassName?: string }) => { +export function UnauthorizedView(props: { className?: string; imgClassName?: string }) { const { className, imgClassName } = props; // router const pathname = usePathname(); @@ -18,7 +18,7 @@ export const UnauthorizedView = (props: { className?: string; imgClassName?: str const { resolvedTheme } = useTheme(); const { getWorkspaceBySlug } = useWorkspace(); // derived values - const workspaceId = getWorkspaceBySlug(workspaceSlug as string)?.id; + const workspaceId = getWorkspaceBySlug(workspaceSlug)?.id; // SWR const { data: instance } = useSWR( workspaceId ? `PI_STARTER_${workspaceId}` : null, @@ -64,4 +64,4 @@ export const UnauthorizedView = (props: { className?: string; imgClassName?: str
    ); -}; +} diff --git a/apps/web/ee/components/pi-chat/upgrade.tsx b/apps/web/ee/components/pi-chat/upgrade.tsx index 8af673fde4..edbfe130d2 100644 --- a/apps/web/ee/components/pi-chat/upgrade.tsx +++ b/apps/web/ee/components/pi-chat/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -15,7 +13,7 @@ import PiUpgradeLight from "@/app/assets/empty-state/pi/chat-light.webp?url"; // plane web hooks import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const PiChatUpgrade: FC = observer(() => { +export const PiChatUpgrade = observer(function PiChatUpgrade() { const { resolvedTheme } = useTheme(); const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail, togglePaidPlanModal } = useWorkspaceSubscription(); // derived values @@ -30,6 +28,7 @@ export const PiChatUpgrade: FC = observer(() => { href="https://prime.plane.so/" target="_blank" className={getButtonStyling("primary", "md")} + rel="noreferrer" > Upgrade to higher subscription diff --git a/apps/web/ee/components/pi-chat/uploads/image-preview.tsx b/apps/web/ee/components/pi-chat/uploads/image-preview.tsx index 5389e875e1..55546327d5 100644 --- a/apps/web/ee/components/pi-chat/uploads/image-preview.tsx +++ b/apps/web/ee/components/pi-chat/uploads/image-preview.tsx @@ -11,7 +11,7 @@ type Props = { loadingPercentage?: number; onRemove?: () => void; }; -export const ImagePreview = (props: Props) => { +export function ImagePreview(props: Props) { const { attachment, onRemove, isLoading = false, loadingPercentage } = props; const [scaledWidth, setScaledWidth] = useState(null); const [meta, setMeta] = useState<{ width: number; height: number | null; aspect_ratio: number | null } | null>(null); @@ -70,4 +70,4 @@ export const ImagePreview = (props: Props) => { ) ); -}; +} diff --git a/apps/web/ee/components/pi-chat/uploads/input-preview-uploads.tsx b/apps/web/ee/components/pi-chat/uploads/input-preview-uploads.tsx index 50db59d1f5..1be71ace50 100644 --- a/apps/web/ee/components/pi-chat/uploads/input-preview-uploads.tsx +++ b/apps/web/ee/components/pi-chat/uploads/input-preview-uploads.tsx @@ -11,7 +11,7 @@ type Props = { setAttachments: (attachments: TPiAttachment[]) => void; }; -export const InputPreviewUploads = observer((props: Props) => { +export const InputPreviewUploads = observer(function InputPreviewUploads(props: Props) { const { chatId, attachments, setAttachments } = props; const { attachmentStore: { getAttachmentsUploadStatusByChatId }, diff --git a/apps/web/ee/components/pi-chat/uploads/root.tsx b/apps/web/ee/components/pi-chat/uploads/root.tsx index 99cf6450e3..846ed032ec 100644 --- a/apps/web/ee/components/pi-chat/uploads/root.tsx +++ b/apps/web/ee/components/pi-chat/uploads/root.tsx @@ -8,7 +8,7 @@ type Props = { onRemove?: (id: string) => void; }; -export const PreviewUploads = observer((props: Props) => { +export const PreviewUploads = observer(function PreviewUploads(props: Props) { const { attachmentId, onRemove } = props; const { attachmentStore: { getAttachmentById }, diff --git a/apps/web/ee/components/pi-chat/uploads/template-preview.tsx b/apps/web/ee/components/pi-chat/uploads/template-preview.tsx index 44c5a1da27..cd889f43a7 100644 --- a/apps/web/ee/components/pi-chat/uploads/template-preview.tsx +++ b/apps/web/ee/components/pi-chat/uploads/template-preview.tsx @@ -26,7 +26,7 @@ function formatBytes(bytes: number | undefined | null): string { return `${size.toFixed(2)} ${units[i]}`; } -export const TemplatePreview = (props: Props) => { +export function TemplatePreview(props: Props) { const { attachment, onRemove, isLoading = false, loadingPercentage } = props; const displayStatus = useUploadStatus(loadingPercentage ?? 0); return ( @@ -51,4 +51,4 @@ export const TemplatePreview = (props: Props) => { /> ); -}; +} diff --git a/apps/web/ee/components/preferences/smooth-cursor-toggle.tsx b/apps/web/ee/components/preferences/smooth-cursor-toggle.tsx index 0aff627051..fe31751934 100644 --- a/apps/web/ee/components/preferences/smooth-cursor-toggle.tsx +++ b/apps/web/ee/components/preferences/smooth-cursor-toggle.tsx @@ -4,37 +4,35 @@ import { ToggleSwitch } from "@plane/ui"; import { PreferencesSection } from "@/components/preferences/section"; import { useUserProfile } from "@/hooks/store/user"; -export const SmoothCursorToggle = observer( - (props: { - option: { - id: string; - title: string; - description: string; - }; - }) => { - const { - data: { is_smooth_cursor_enabled }, - updateUserProfile, - } = useUserProfile(); - const { t } = useTranslation(); +export const SmoothCursorToggle = observer(function SmoothCursorToggle(props: { + option: { + id: string; + title: string; + description: string; + }; +}) { + const { + data: { is_smooth_cursor_enabled }, + updateUserProfile, + } = useUserProfile(); + const { t } = useTranslation(); - return ( - - { - updateUserProfile({ is_smooth_cursor_enabled: value }); - }} - label={"smooth-cursor-toggle"} - size={"sm"} - /> - - } - /> - ); - } -); + return ( + + { + updateUserProfile({ is_smooth_cursor_enabled: value }); + }} + label={"smooth-cursor-toggle"} + size={"sm"} + /> + + } + /> + ); +}); diff --git a/apps/web/ee/components/preferences/theme-switcher.tsx b/apps/web/ee/components/preferences/theme-switcher.tsx index b7a08c994b..63263eae20 100644 --- a/apps/web/ee/components/preferences/theme-switcher.tsx +++ b/apps/web/ee/components/preferences/theme-switcher.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState, useCallback } from "react"; import { observer } from "mobx-react"; import { useTheme } from "next-themes"; @@ -17,90 +15,88 @@ import { PreferencesSection } from "@/components/preferences/section"; // hooks import { useUserProfile } from "@/hooks/store/user"; -export const ThemeSwitcher = observer( - (props: { - option: { - id: string; - title: string; - description: string; - }; - }) => { - // hooks - const { setTheme } = useTheme(); - const { data: userProfile, updateUserTheme } = useUserProfile(); +export const ThemeSwitcher = observer(function ThemeSwitcher(props: { + option: { + id: string; + title: string; + description: string; + }; +}) { + // hooks + const { setTheme } = useTheme(); + const { data: userProfile, updateUserTheme } = useUserProfile(); - // states - const [currentTheme, setCurrentTheme] = useState(null); + // states + const [currentTheme, setCurrentTheme] = useState(null); - const { t } = useTranslation(); + const { t } = useTranslation(); - // initialize theme - useEffect(() => { - if (!userProfile?.theme?.theme) return; + // initialize theme + useEffect(() => { + if (!userProfile?.theme?.theme) return; - const userThemeOption = THEME_OPTIONS.find((t) => t.value === userProfile.theme.theme); + const userThemeOption = THEME_OPTIONS.find((t) => t.value === userProfile.theme.theme); - if (userThemeOption) { - setCurrentTheme(userThemeOption); + if (userThemeOption) { + setCurrentTheme(userThemeOption); + } + }, [userProfile?.theme?.theme]); + + // handlers + const applyThemeChange = useCallback( + (theme: Partial) => { + const themeValue = theme?.theme || "system"; + setTheme(themeValue); + + if (theme?.theme === "custom" && theme?.palette) { + const defaultPalette = "#0d101b,#c5c5c5,#3f76ff,#0d101b,#c5c5c5"; + const palette = theme.palette !== ",,,," ? theme.palette : defaultPalette; + applyTheme(palette, false); + } else { + unsetCustomCssVariables(); } - }, [userProfile?.theme?.theme]); + }, + [setTheme] + ); - // handlers - const applyThemeChange = useCallback( - (theme: Partial) => { - const themeValue = theme?.theme || "system"; - setTheme(themeValue); + const handleThemeChange = useCallback( + async (themeOption: I_THEME_OPTION) => { + try { + applyThemeChange({ theme: themeOption.value }); - if (theme?.theme === "custom" && theme?.palette) { - const defaultPalette = "#0d101b,#c5c5c5,#3f76ff,#0d101b,#c5c5c5"; - const palette = theme.palette !== ",,,," ? theme.palette : defaultPalette; - applyTheme(palette, false); - } else { - unsetCustomCssVariables(); + const updatePromise = updateUserTheme({ theme: themeOption.value }); + setPromiseToast(updatePromise, { + loading: "Updating theme...", + success: { + title: "Success!", + message: () => "Theme updated successfully!", + }, + error: { + title: "Error!", + message: () => "Failed to update the theme", + }, + }); + } catch (error) { + console.error("Error updating theme:", error); + } + }, + [applyThemeChange, updateUserTheme] + ); + + if (!userProfile) return null; + + return ( + <> + + + } - }, - [setTheme] - ); - - const handleThemeChange = useCallback( - async (themeOption: I_THEME_OPTION) => { - try { - applyThemeChange({ theme: themeOption.value }); - - const updatePromise = updateUserTheme({ theme: themeOption.value }); - setPromiseToast(updatePromise, { - loading: "Updating theme...", - success: { - title: "Success!", - message: () => "Theme updated successfully!", - }, - error: { - title: "Error!", - message: () => "Failed to update the theme", - }, - }); - } catch (error) { - console.error("Error updating theme:", error); - } - }, - [applyThemeChange, updateUserTheme] - ); - - if (!userProfile) return null; - - return ( - <> - - - - } - /> - {userProfile.theme?.theme === "custom" && } - - ); - } -); + /> + {userProfile.theme?.theme === "custom" && } + + ); +}); diff --git a/apps/web/ee/components/profile/loader.tsx b/apps/web/ee/components/profile/loader.tsx index e20b9c9caa..945f23971a 100644 --- a/apps/web/ee/components/profile/loader.tsx +++ b/apps/web/ee/components/profile/loader.tsx @@ -1,34 +1,34 @@ import { Loader } from "@plane/ui"; -export const ConnectionLoader = () => ( -
    - {/* Icon and Title Section */} -
    - - - - - - -
    - - {/* Description Section */} -
    - - - -
    - - {/* Connection Status Section */} -
    -
    +export function ConnectionLoader() { + return ( +
    + {/* Icon and Title Section */} +
    - + + + + + +
    + {/* Description Section */} +
    + + + +
    + {/* Connection Status Section */} +
    +
    + + + +
    + +
    - - -
    -
    -); + ); +} diff --git a/apps/web/ee/components/profile/user-connections-view.tsx b/apps/web/ee/components/profile/user-connections-view.tsx index 3f542aeab2..e0583fcbf5 100644 --- a/apps/web/ee/components/profile/user-connections-view.tsx +++ b/apps/web/ee/components/profile/user-connections-view.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -21,14 +19,14 @@ import { useSlackIntegration } from "@/plane-web/hooks/store/integrations/use-sl import { ConnectionLoader } from "./loader"; import { PersonalAccountConnectView } from "./personal-account-view"; -export const UserConnectionsView = observer(() => { +export const UserConnectionsView = observer(function UserConnectionsView() { // route params const { workspaceSlug } = useParams(); // store const { getWorkspaceBySlug } = useWorkspace(); const { fetchUserConnections, getConnectionsByWorkspaceSlug } = useConnections(); // derived - const selectedWorkspace = getWorkspaceBySlug(workspaceSlug as string); + const selectedWorkspace = getWorkspaceBySlug(workspaceSlug); const connections = selectedWorkspace && getConnectionsByWorkspaceSlug(selectedWorkspace?.slug); const { isLoading } = useSWR( @@ -78,115 +76,116 @@ export const UserConnectionsView = observer(() => { ); }); -export const ConnectionMapper = observer( - (props: { selectedWorkspace: IWorkspace; connections: TWorkspaceUserConnection[] }) => { - const { selectedWorkspace } = props; +export const ConnectionMapper = observer(function ConnectionMapper(props: { + selectedWorkspace: IWorkspace; + connections: TWorkspaceUserConnection[]; +}) { + const { selectedWorkspace } = props; - const { connectUser, disconnectUser, fetchExternalApiToken: fetchSlackExternalApiToken } = useSlackIntegration(); - const { - auth: { connectGithubUserCredential, disconnectGithubUserCredential }, - fetchExternalApiToken: fetchGithubExternalApiToken, - } = useGithubIntegration(); - const { - auth: { - connectGithubUserCredential: connectGithubEnterpriseUserCredential, - disconnectGithubUserCredential: disconnectGithubEnterpriseUserCredential, - }, - } = useGithubIntegration(true); - const user = useUser(); - const { isLoading: isLoadingExternalApiTokens } = useSWR( - selectedWorkspace ? `SLACK_EXTERNAL_API_TOKEN_${selectedWorkspace.slug}` : null, - selectedWorkspace - ? async () => - Promise.all([ - fetchSlackExternalApiToken(selectedWorkspace.slug), - fetchGithubExternalApiToken(selectedWorkspace.slug), - ]) - : null - ); + const { connectUser, disconnectUser, fetchExternalApiToken: fetchSlackExternalApiToken } = useSlackIntegration(); + const { + auth: { connectGithubUserCredential, disconnectGithubUserCredential }, + fetchExternalApiToken: fetchGithubExternalApiToken, + } = useGithubIntegration(); + const { + auth: { + connectGithubUserCredential: connectGithubEnterpriseUserCredential, + disconnectGithubUserCredential: disconnectGithubEnterpriseUserCredential, + }, + } = useGithubIntegration(true); + const user = useUser(); + const { isLoading: isLoadingExternalApiTokens } = useSWR( + selectedWorkspace ? `SLACK_EXTERNAL_API_TOKEN_${selectedWorkspace.slug}` : null, + selectedWorkspace + ? async () => + Promise.all([ + fetchSlackExternalApiToken(selectedWorkspace.slug), + fetchGithubExternalApiToken(selectedWorkspace.slug), + ]) + : null + ); - const [connections, setConnections] = useState(props.connections); + const [connections, setConnections] = useState(props.connections); - const handleConnection = async (source: TUserConnection) => { - if (source === E_INTEGRATION_KEYS.GITHUB) { - const response = await connectGithubUserCredential( - selectedWorkspace.id, - selectedWorkspace.slug, - user.data?.id, - true - ); - captureSuccess({ - eventName: INTEGRATION_TRACKER_EVENTS.integration_started, - payload: { - type: "GITHUB_USER", - workspaceId: selectedWorkspace.id, - }, - }); - if (response) window.open(response, "_self"); - } else if (source === E_INTEGRATION_KEYS.SLACK) { - const response = await connectUser(selectedWorkspace.id, selectedWorkspace.slug, true); - captureSuccess({ - eventName: INTEGRATION_TRACKER_EVENTS.integration_started, - payload: { - type: "SLACK_USER", - workspaceId: selectedWorkspace.id, - }, - }); - if (response) window.open(response, "_self"); - } else if (source === E_INTEGRATION_KEYS.GITHUB_ENTERPRISE) { - const response = await connectGithubEnterpriseUserCredential( - selectedWorkspace.id, - selectedWorkspace.slug, - user.data?.id, - true - ); - if (response) window.open(response, "_self"); - } - }; - - const handleDisconnection = async (source: TUserConnection) => { - if (source === E_INTEGRATION_KEYS.GITHUB) { - await disconnectGithubUserCredential(selectedWorkspace.id, user.data?.id); - captureSuccess({ - eventName: INTEGRATION_TRACKER_EVENTS.integration_disconnected, - payload: { - type: "GITHUB_USER", - workspaceId: selectedWorkspace.id, - }, - }); - } else if (source === E_INTEGRATION_KEYS.SLACK) { - await disconnectUser(selectedWorkspace.id); - captureSuccess({ - eventName: INTEGRATION_TRACKER_EVENTS.integration_disconnected, - payload: { - type: "SLACK_USER", - workspaceId: selectedWorkspace.id, - }, - }); - } else if (source === E_INTEGRATION_KEYS.GITHUB_ENTERPRISE) { - await disconnectGithubEnterpriseUserCredential(selectedWorkspace.id, user.data?.id); - } - - setConnections( - connections.map((connection) => { - if (connection.connection_type === source) { - connection.isUserConnected = false; - } - return connection; - }) + const handleConnection = async (source: TUserConnection) => { + if (source === E_INTEGRATION_KEYS.GITHUB) { + const response = await connectGithubUserCredential( + selectedWorkspace.id, + selectedWorkspace.slug, + user.data?.id, + true ); - }; + captureSuccess({ + eventName: INTEGRATION_TRACKER_EVENTS.integration_started, + payload: { + type: "GITHUB_USER", + workspaceId: selectedWorkspace.id, + }, + }); + if (response) window.open(response, "_self"); + } else if (source === E_INTEGRATION_KEYS.SLACK) { + const response = await connectUser(selectedWorkspace.id, selectedWorkspace.slug, true); + captureSuccess({ + eventName: INTEGRATION_TRACKER_EVENTS.integration_started, + payload: { + type: "SLACK_USER", + workspaceId: selectedWorkspace.id, + }, + }); + if (response) window.open(response, "_self"); + } else if (source === E_INTEGRATION_KEYS.GITHUB_ENTERPRISE) { + const response = await connectGithubEnterpriseUserCredential( + selectedWorkspace.id, + selectedWorkspace.slug, + user.data?.id, + true + ); + if (response) window.open(response, "_self"); + } + }; - return connections.map((connection) => ( - - )); - } -); + const handleDisconnection = async (source: TUserConnection) => { + if (source === E_INTEGRATION_KEYS.GITHUB) { + await disconnectGithubUserCredential(selectedWorkspace.id, user.data?.id); + captureSuccess({ + eventName: INTEGRATION_TRACKER_EVENTS.integration_disconnected, + payload: { + type: "GITHUB_USER", + workspaceId: selectedWorkspace.id, + }, + }); + } else if (source === E_INTEGRATION_KEYS.SLACK) { + await disconnectUser(selectedWorkspace.id); + captureSuccess({ + eventName: INTEGRATION_TRACKER_EVENTS.integration_disconnected, + payload: { + type: "SLACK_USER", + workspaceId: selectedWorkspace.id, + }, + }); + } else if (source === E_INTEGRATION_KEYS.GITHUB_ENTERPRISE) { + await disconnectGithubEnterpriseUserCredential(selectedWorkspace.id, user.data?.id); + } + + setConnections( + connections.map((connection) => { + if (connection.connection_type === source) { + connection.isUserConnected = false; + } + return connection; + }) + ); + }; + + return connections.map((connection) => ( + + )); +}); diff --git a/apps/web/ee/components/project-overview/details/main/collapsible-section-root.tsx b/apps/web/ee/components/project-overview/details/main/collapsible-section-root.tsx index 60dd6dba5f..d3ff257e67 100644 --- a/apps/web/ee/components/project-overview/details/main/collapsible-section-root.tsx +++ b/apps/web/ee/components/project-overview/details/main/collapsible-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -23,7 +21,9 @@ type Props = { disabled?: boolean; }; -export const ProjectOverviewCollapsibleSectionRoot: FC = observer((props) => { +export const ProjectOverviewCollapsibleSectionRoot = observer(function ProjectOverviewCollapsibleSectionRoot( + props: Props +) { const { workspaceSlug, projectId, disabled = false } = props; // store hooks const { openCollapsibleSection, toggleOpenCollapsibleSection } = useProject(); diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-item.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-item.tsx index 9f4cfc1593..24939548fd 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-item.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Trash } from "lucide-react"; @@ -24,7 +22,7 @@ type Props = { toggleDeleteAttachmentModal: (attachmentId: string | null) => void; }; -export const ProjectAttachmentsListItem: FC = observer((props) => { +export const ProjectAttachmentsListItem = observer(function ProjectAttachmentsListItem(props: Props) { // props const { attachmentId, disabled, toggleDeleteAttachmentModal } = props; // store hooks diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-upload-item.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-upload-item.tsx index 2cc18a80aa..a65aa048b6 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-upload-item.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/attachment-list-upload-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane imports import { Tooltip } from "@plane/propel/tooltip"; @@ -17,7 +15,7 @@ type Props = { uploadStatus: TAttachmentUploadStatus; }; -export const AttachmentsUploadItem: React.FC = observer((props) => { +export const AttachmentsUploadItem = observer(function AttachmentsUploadItem(props: Props) { // props const { uploadStatus } = props; // derived values diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/delete-attachment-modal.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/delete-attachment-modal.tsx index 755bf96861..506e2cbb26 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/delete-attachment-modal.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/delete-attachment-modal.tsx @@ -20,7 +20,7 @@ type Props = { attachmentOperations: TAttachmentOperationsRemoveModal; }; -export const ProjectAttachmentDeleteModal: FC = observer((props) => { +export const ProjectAttachmentDeleteModal = observer(function ProjectAttachmentDeleteModal(props: Props) { const { isOpen, onClose, attachmentId, attachmentOperations } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/quick-action-button.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/quick-action-button.tsx index 3dac116e8a..cf806133ac 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/quick-action-button.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/quick-action-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useCallback, useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { disabled?: boolean; }; -export const ProjectAttachmentActionButton: FC = observer((props) => { +export const ProjectAttachmentActionButton = observer(function ProjectAttachmentActionButton(props: Props) { const { workspaceSlug, projectId, customButton, disabled = false } = props; // state const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/root.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/root.tsx index 8f1b534af6..957cd2ee8c 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/root.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/root.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useCallback, useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +20,7 @@ type Props = { disabled?: boolean; }; -export const ProjectAttachmentRoot: FC = observer((props) => { +export const ProjectAttachmentRoot = observer(function ProjectAttachmentRoot(props: Props) { const { workspaceSlug, projectId, disabled } = props; // states const [isLoading, setIsLoading] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/use-attachments.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/use-attachments.tsx index 27aae9d22b..803a4a0d55 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/use-attachments.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/attachment/use-attachments.tsx @@ -1,4 +1,3 @@ -"use client"; import { useMemo } from "react"; // plane ui import { PROJECT_OVERVIEW_TRACKER_EVENTS } from "@plane/constants"; diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/create-update-link-modal.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/create-update-link-modal.tsx index 7cec49d4be..08a7904505 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/create-update-link-modal.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/create-update-link-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect } from "react"; import { observer } from "mobx-react"; @@ -30,7 +28,9 @@ const defaultValues: TProjectLinkCreateFormFieldOptions = { url: "", }; -export const ProjectLinkCreateUpdateModal: FC = observer((props) => { +export const ProjectLinkCreateUpdateModal = observer(function ProjectLinkCreateUpdateModal( + props: TProjectLinkCreateEditModal +) { // props const { setLinkData, isModalOpen, handleOnClose, linkOperations, preloadedData } = props; // react hook form diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/link-detail.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/link-detail.tsx index b1666990e8..bf7dd3e535 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/link-detail.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/link-detail.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; // hooks import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ export type TProjectLinkDetail = { isNotAllowed: boolean; }; -export const ProjectLinkDetail: FC = observer((props) => { +export const ProjectLinkDetail = observer(function ProjectLinkDetail(props: TProjectLinkDetail) { // props const { linkId, linkOperations, isNotAllowed } = props; // hooks diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/links.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/links.tsx index f8a66be4fc..273601e3e6 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/links.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/links.tsx @@ -14,7 +14,7 @@ export type TProjectLinkList = { disabled?: boolean; }; -export const ProjectLinkList: FC = observer((props) => { +export const ProjectLinkList = observer(function ProjectLinkList(props: TProjectLinkList) { // props const { projectId, linkOperations, disabled = false } = props; // hooks diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/root.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/root.tsx index 01c4da7239..1db0339215 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/links/root.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/links/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // components @@ -15,7 +13,7 @@ export type TProjectLinkRoot = { setIsModalOpen: (isOpen: boolean) => void; }; -export const ProjectLinkRoot: FC = observer((props) => { +export const ProjectLinkRoot = observer(function ProjectLinkRoot(props: TProjectLinkRoot) { // props const { workspaceSlug, projectId, disabled = false } = props; // hooks diff --git a/apps/web/ee/components/project-overview/details/main/collaspible-section/quick-action-button.tsx b/apps/web/ee/components/project-overview/details/main/collaspible-section/quick-action-button.tsx index 3298288a74..36911e36c5 100644 --- a/apps/web/ee/components/project-overview/details/main/collaspible-section/quick-action-button.tsx +++ b/apps/web/ee/components/project-overview/details/main/collaspible-section/quick-action-button.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -10,7 +9,7 @@ type Props = { setIsModalOpen: (isOpen: boolean) => void; }; -export const ProjectActionButton: FC = observer((props) => { +export const ProjectActionButton = observer(function ProjectActionButton(props: Props) { const { customButton, setIsModalOpen, disabled = false } = props; // handlers diff --git a/apps/web/ee/components/project-overview/details/main/info-section-root.tsx b/apps/web/ee/components/project-overview/details/main/info-section-root.tsx index 5767ac9d24..cd7192ea26 100644 --- a/apps/web/ee/components/project-overview/details/main/info-section-root.tsx +++ b/apps/web/ee/components/project-overview/details/main/info-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ type Props = { projectId: string; }; -export const ProjectOverviewInfoSectionRoot: FC = observer((props) => { +export const ProjectOverviewInfoSectionRoot = observer(function ProjectOverviewInfoSectionRoot(props: Props) { const { workspaceSlug, projectId } = props; // store hooks const { getProjectById, updateProject } = useProject(); diff --git a/apps/web/ee/components/project-overview/details/main/info-section/actions.tsx b/apps/web/ee/components/project-overview/details/main/info-section/actions.tsx index 32b315816b..602696fe70 100644 --- a/apps/web/ee/components/project-overview/details/main/info-section/actions.tsx +++ b/apps/web/ee/components/project-overview/details/main/info-section/actions.tsx @@ -6,7 +6,7 @@ type TProps = { workspaceSlug: string; projectId: string; }; -export const Actions = (props: TProps) => { +export function Actions(props: TProps) { const { toggleLinkModalOpen, workspaceSlug, projectId } = props; return (
    @@ -26,4 +26,4 @@ export const Actions = (props: TProps) => { />
    ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/main/info-section/description-box.tsx b/apps/web/ee/components/project-overview/details/main/info-section/description-box.tsx index 7ff0006d81..02834a70e1 100644 --- a/apps/web/ee/components/project-overview/details/main/info-section/description-box.tsx +++ b/apps/web/ee/components/project-overview/details/main/info-section/description-box.tsx @@ -1,4 +1,3 @@ -"use client"; import { useState } from "react"; import { observer } from "mobx-react"; // plane imports @@ -19,7 +18,7 @@ type TProps = { toggleLinkModalOpen: (value: boolean) => void; disabled?: boolean; }; -export const DescriptionBox = observer((props: TProps) => { +export const DescriptionBox = observer(function DescriptionBox(props: TProps) { const { workspaceSlug, project, handleProjectUpdate, toggleLinkModalOpen, disabled = false } = props; // states const [_isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved"); diff --git a/apps/web/ee/components/project-overview/details/main/info-section/hero-section.tsx b/apps/web/ee/components/project-overview/details/main/info-section/hero-section.tsx index 666b3c74db..be521c9813 100644 --- a/apps/web/ee/components/project-overview/details/main/info-section/hero-section.tsx +++ b/apps/web/ee/components/project-overview/details/main/info-section/hero-section.tsx @@ -22,7 +22,7 @@ type THeroSection = { workspaceSlug: string; }; -export const HeroSection = observer((props: THeroSection) => { +export const HeroSection = observer(function HeroSection(props: THeroSection) { const { project, workspaceSlug } = props; const [isOpen, setIsOpen] = useState(false); const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/project-overview/details/main/info-section/update-reaction.tsx b/apps/web/ee/components/project-overview/details/main/info-section/update-reaction.tsx index 764da1dfdc..227cb73776 100644 --- a/apps/web/ee/components/project-overview/details/main/info-section/update-reaction.tsx +++ b/apps/web/ee/components/project-overview/details/main/info-section/update-reaction.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useMemo, useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ export type TProjectReaction = { disabled?: boolean; }; -export const ProjectReaction: FC = observer((props) => { +export const ProjectReaction = observer(function ProjectReaction(props: TProjectReaction) { const { workspaceSlug, projectId, currentUser, disabled = false } = props; // state diff --git a/apps/web/ee/components/project-overview/details/main/milestones/add-milestone-button.tsx b/apps/web/ee/components/project-overview/details/main/milestones/add-milestone-button.tsx index c347bb64a7..923484f93d 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/add-milestone-button.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/add-milestone-button.tsx @@ -5,7 +5,7 @@ type Props = { toggleModal: () => void; variant?: "default" | "compact"; }; -export const AddMilestoneButton = (props: Props) => { +export function AddMilestoneButton(props: Props) { const { toggleModal, variant = "default" } = props; const handleClick = (e: React.MouseEvent) => { @@ -28,4 +28,4 @@ export const AddMilestoneButton = (props: Props) => { )} ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/main/milestones/collapsible-root.tsx b/apps/web/ee/components/project-overview/details/main/milestones/collapsible-root.tsx index 650b55ee93..3f87338f3c 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/collapsible-root.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/collapsible-root.tsx @@ -14,7 +14,7 @@ type Props = { workspaceSlug: string; projectId: string; }; -export const ProjectMilestoneCollapsibleRoot = observer((props: Props) => { +export const ProjectMilestoneCollapsibleRoot = observer(function ProjectMilestoneCollapsibleRoot(props: Props) { const { workspaceSlug, projectId } = props; // state const [isCreateUpdateMilestoneModalOpen, setIsCreateUpdateMilestoneModalOpen] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/main/milestones/create-update-modal.tsx b/apps/web/ee/components/project-overview/details/main/milestones/create-update-modal.tsx index 95f0227c16..3116668998 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/create-update-modal.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/create-update-modal.tsx @@ -33,7 +33,7 @@ const defaultValues = { }, }; -export const CreateUpdateMilestoneModal = (props: Props) => { +export function CreateUpdateMilestoneModal(props: Props) { const { workspaceSlug, projectId, isOpen, handleClose, milestoneId } = props; const [isSubmitting, setIsSubmitting] = useState(false); @@ -96,7 +96,7 @@ export const CreateUpdateMilestoneModal = (props: Props) => { let payload: Partial = {}; if (milestoneId) { payload = getChangedFields>( - formData as Partial, + formData, dirtyFields as Partial, boolean | undefined>> ); } else payload = formData; @@ -308,4 +308,4 @@ export const CreateUpdateMilestoneModal = (props: Props) => {
    ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/main/milestones/helper.tsx b/apps/web/ee/components/project-overview/details/main/milestones/helper.tsx index 86a4a7fb8b..f735ba56ce 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/helper.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/helper.tsx @@ -1,4 +1,3 @@ -"use client"; import { useMemo, useState } from "react"; import { Pencil, Trash2 } from "lucide-react"; import { MILESTONE_TRACKER_EVENTS } from "@plane/constants"; @@ -110,7 +109,7 @@ type MilestoneQuickActionButtonProps = { projectId: string; }; -export const MilestoneQuickActionButton = (props: MilestoneQuickActionButtonProps) => { +export function MilestoneQuickActionButton(props: MilestoneQuickActionButtonProps) { const { milestoneId, workspaceSlug, projectId } = props; const [isCreateUpdateMilestoneModalOpen, setIsCreateUpdateMilestoneModalOpen] = useState(false); @@ -181,4 +180,4 @@ export const MilestoneQuickActionButton = (props: MilestoneQuickActionButtonProp ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/main/milestones/milestone-card.tsx b/apps/web/ee/components/project-overview/details/main/milestones/milestone-card.tsx index 0fdf9f07cb..affd6847a8 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/milestone-card.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/milestone-card.tsx @@ -22,7 +22,7 @@ type Props = { projectId: string; }; -export const MilestoneCard: FC = observer((props) => { +export const MilestoneCard = observer(function MilestoneCard(props: Props) { const { milestoneId, workspaceSlug, projectId } = props; // state const [isLinkedWorkItemsOpen, setIsLinkedWorkItemsOpen] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-item.tsx b/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-item.tsx index a68ebbaac6..34154948ad 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-item.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-item.tsx @@ -25,7 +25,7 @@ type TProps = { milestoneId: string; }; -export const MilestoneWorkItem: FC = observer((props) => { +export const MilestoneWorkItem = observer(function MilestoneWorkItem(props: TProps) { // props const { workspaceSlug, workItemId, projectId, milestoneId } = props; diff --git a/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-items.tsx b/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-items.tsx index c020edf7c4..fd5a0fb271 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-items.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/milestone-work-items.tsx @@ -10,7 +10,7 @@ type TProps = { projectId: string; }; -export const MilestoneWorkItemsList = observer((props: TProps) => { +export const MilestoneWorkItemsList = observer(function MilestoneWorkItemsList(props: TProps) { const { milestoneId, workspaceSlug, projectId } = props; const { fetchMilestoneWorkItems, getMilestoneById } = useMilestones(); diff --git a/apps/web/ee/components/project-overview/details/main/milestones/quick-action-button.tsx b/apps/web/ee/components/project-overview/details/main/milestones/quick-action-button.tsx index 52cd26e141..1ad57f8760 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/quick-action-button.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/quick-action-button.tsx @@ -13,7 +13,7 @@ type Props = { selectedWorkItemIds?: string[]; milestoneId?: string; }; -export const MilestoneWorkItemActionButton: FC = (props) => { +export function MilestoneWorkItemActionButton(props: Props) { const { projectId, workspaceSlug, customButton, handleSubmit, selectedWorkItemIds, milestoneId } = props; const [workItemsModal, setWorkItemsModal] = useState(false); @@ -45,4 +45,4 @@ export const MilestoneWorkItemActionButton: FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/main/milestones/root.tsx b/apps/web/ee/components/project-overview/details/main/milestones/root.tsx index ed6528377e..a5e559af11 100644 --- a/apps/web/ee/components/project-overview/details/main/milestones/root.tsx +++ b/apps/web/ee/components/project-overview/details/main/milestones/root.tsx @@ -14,7 +14,7 @@ type Props = { toggleCreateUpdateModal: () => void; }; -export const ProjectMilestoneRoot: FC = observer((props) => { +export const ProjectMilestoneRoot = observer(function ProjectMilestoneRoot(props: Props) { const { workspaceSlug, projectId, toggleCreateUpdateModal } = props; // store hooks const { getProjectMilestoneIds, milestoneLoader } = useMilestones(); diff --git a/apps/web/ee/components/project-overview/details/main/modal-root.tsx b/apps/web/ee/components/project-overview/details/main/modal-root.tsx index 2089e2bc27..0cfd1ef88e 100644 --- a/apps/web/ee/components/project-overview/details/main/modal-root.tsx +++ b/apps/web/ee/components/project-overview/details/main/modal-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -12,7 +10,7 @@ type Props = { projectId: string; }; -export const ProjectOverviewModalRoot: FC = observer((props) => { +export const ProjectOverviewModalRoot = observer(function ProjectOverviewModalRoot(props: Props) { const { workspaceSlug, projectId } = props; // helper hooks diff --git a/apps/web/ee/components/project-overview/details/main/progress-section-root.tsx b/apps/web/ee/components/project-overview/details/main/progress-section-root.tsx index 804af0d586..40320025e6 100644 --- a/apps/web/ee/components/project-overview/details/main/progress-section-root.tsx +++ b/apps/web/ee/components/project-overview/details/main/progress-section-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { projectId: string; }; -export const ProjectOverviewProgressSectionRoot: FC = observer((props) => { +export const ProjectOverviewProgressSectionRoot = observer(function ProjectOverviewProgressSectionRoot(props: Props) { const { workspaceSlug, projectId } = props; // store hooks const { getProjectById } = useProject(); @@ -54,5 +52,5 @@ export const ProjectOverviewProgressSectionRoot: FC = observer((props) => ); } - return ; + return ; }); diff --git a/apps/web/ee/components/project-overview/details/main/root.tsx b/apps/web/ee/components/project-overview/details/main/root.tsx index c1fc70a7ff..d8318cd744 100644 --- a/apps/web/ee/components/project-overview/details/main/root.tsx +++ b/apps/web/ee/components/project-overview/details/main/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import useSWR from "swr"; // helpers @@ -21,7 +19,7 @@ type Props = { disabled: boolean; }; -export const ProjectOverviewMainContentRoot: FC = (props) => { +export function ProjectOverviewMainContentRoot(props: Props) { const { workspaceSlug, projectId, disabled } = props; // store hooks const { fetchAttachments } = useProjectAttachments(); @@ -66,4 +64,4 @@ export const ProjectOverviewMainContentRoot: FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/root.tsx b/apps/web/ee/components/project-overview/details/root.tsx index 66f205f75c..e4325bae88 100644 --- a/apps/web/ee/components/project-overview/details/root.tsx +++ b/apps/web/ee/components/project-overview/details/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -18,7 +16,7 @@ type Props = { projectId: string; }; -export const ProjectOverviewRoot: FC = observer((props) => { +export const ProjectOverviewRoot = observer(function ProjectOverviewRoot(props: Props) { const { workspaceSlug, projectId } = props; // store hooks const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/project-overview/details/sidebar/activity-tab-root.tsx b/apps/web/ee/components/project-overview/details/sidebar/activity-tab-root.tsx index 66560748de..586d439a08 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/activity-tab-root.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/activity-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useMemo } from "react"; import { observer } from "mobx-react"; @@ -25,7 +23,7 @@ type Props = { const projectActivityService = new ProjectActivityService(); -export const ProjectOverviewSidebarActivityRoot: FC = observer((props) => { +export const ProjectOverviewSidebarActivityRoot = observer(function ProjectOverviewSidebarActivityRoot(props: Props) { const { workspaceSlug, projectId } = props; // states const { storedValue: sortOrder, setValue: setSortOrder } = useLocalStorage( diff --git a/apps/web/ee/components/project-overview/details/sidebar/properties-tab-root.tsx b/apps/web/ee/components/project-overview/details/sidebar/properties-tab-root.tsx index 766fb0c900..46558d3572 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/properties-tab-root.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/properties-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -46,7 +44,9 @@ type Props = { projectId: string; }; -export const ProjectOverviewSidebarPropertiesRoot: FC = observer((props) => { +export const ProjectOverviewSidebarPropertiesRoot = observer(function ProjectOverviewSidebarPropertiesRoot( + props: Props +) { const { workspaceSlug, projectId } = props; // store hooks const { getProjectById, updateProject } = useProject(); diff --git a/apps/web/ee/components/project-overview/details/sidebar/root.tsx b/apps/web/ee/components/project-overview/details/sidebar/root.tsx index 01c3147b3c..373956c08b 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/root.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { projectId: string; }; -export const ProjectOverviewSidebarRoot: FC = observer((props) => { +export const ProjectOverviewSidebarRoot = observer(function ProjectOverviewSidebarRoot(props: Props) { const { workspaceSlug, projectId } = props; // store hooks const { projectOverviewSidebarCollapsed } = useAppTheme(); diff --git a/apps/web/ee/components/project-overview/details/sidebar/update-upgrade.tsx b/apps/web/ee/components/project-overview/details/sidebar/update-upgrade.tsx index e00169b8c7..ea0233f486 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/update-upgrade.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/update-upgrade.tsx @@ -6,7 +6,7 @@ type TProps = { projectId: string; }; -export const UpgradeUpdates = (props: TProps) => { +export function UpgradeUpdates(props: TProps) { const { workspaceSlug, projectId } = props; const router = useRouter(); return ( @@ -26,4 +26,4 @@ export const UpgradeUpdates = (props: TProps) => { rootClassName="p-10" /> ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates-tab-root.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates-tab-root.tsx index deb4d1a813..0614d3fb9a 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates-tab-root.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates-tab-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { isEmpty } from "lodash-es"; import { observer } from "mobx-react"; @@ -18,7 +16,7 @@ type Props = { projectId: string; }; -export const ProjectOverviewSidebarUpdatesRoot: FC = observer((props) => { +export const ProjectOverviewSidebarUpdatesRoot = observer(function ProjectOverviewSidebarUpdatesRoot(props: Props) { const { workspaceSlug, projectId } = props; // store hooks const { getProjectById } = useProject(); diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/block.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/block.tsx index df50e913bc..09ec3726e2 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/block.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/block.tsx @@ -46,7 +46,7 @@ type TProps = { remove: (updateId: string) => Promise; }; }; -export const UpdateBlock = observer((props: TProps) => { +export const UpdateBlock = observer(function UpdateBlock(props: TProps) { const { updateId, workspaceSlug, projectId, handleUpdateOperations } = props; // state const [isEditing, setIsEditing] = useState(false); @@ -91,7 +91,7 @@ export const UpdateBlock = observer((props: TProps) => {
    {/* render icon here */} - +
    {/* Type and creator */}
    diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-block.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-block.tsx index cc903e70ff..7d4bcb4403 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-block.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-block.tsx @@ -17,7 +17,7 @@ type TProps = { projectId: string; operations: TActivityOperations; }; -export const CommentBlock = (props: TProps) => { +export function CommentBlock(props: TProps) { const { commentData, workspaceSlug, projectId, operations } = props; const [isEditing, setIsEditing] = useState(false); // hooks @@ -70,4 +70,4 @@ export const CommentBlock = (props: TProps) => { )}
    ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-list.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-list.tsx index 6861b0e9c4..20f88fca03 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-list.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/comments/comment-list.tsx @@ -21,7 +21,7 @@ export type TActivityOperations = { remove: (commentId: string) => Promise; }; -export const CommentList = observer((props: TProps) => { +export const CommentList = observer(function CommentList(props: TProps) { const { isCollapsed, updateId, workspaceSlug, projectId } = props; const [newComment, setNewComment] = useState(""); diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/comments/edit.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/comments/edit.tsx index c304a3a457..d963a5446d 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/comments/edit.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/comments/edit.tsx @@ -9,7 +9,7 @@ type TProps = { setIsEditing: (isEditing: boolean) => void; operations: TActivityOperations; }; -export const EditComment = (props: TProps) => { +export function EditComment(props: TProps) { const { commentData, operations, setIsEditing } = props; const [newComment, setNewComment] = useState(commentData.description); const handleSubmit = (e: React.FormEvent) => { @@ -40,4 +40,4 @@ export const EditComment = (props: TProps) => {
    ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/delete-update-modal.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/delete-update-modal.tsx index 3997971c93..d2451b962f 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/delete-update-modal.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/delete-update-modal.tsx @@ -13,7 +13,7 @@ type Props = { }; }; -export const ProjectUpdateDeleteModal: FC = observer((props) => { +export const ProjectUpdateDeleteModal = observer(function ProjectUpdateDeleteModal(props: Props) { const { isOpen, onClose, updateId, updateOperations } = props; // states const [loader, setLoader] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/empty.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/empty.tsx index e862478ae0..6cd63b27d6 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/empty.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/empty.tsx @@ -4,7 +4,7 @@ type TProps = { handleNewUpdate: () => void; }; -export const EmptyUpdates = (props: TProps) => { +export function EmptyUpdates(props: TProps) { const { handleNewUpdate } = props; return ( @@ -22,4 +22,4 @@ export const EmptyUpdates = (props: TProps) => { rootClassName="p-10" /> ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/loader.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/loader.tsx index 46b902897a..34a6ec771f 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/loader.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/loader.tsx @@ -1,9 +1,11 @@ import { Loader } from "@plane/ui"; -export const UpdatesLoader = () => ( - - - - - -); +export function UpdatesLoader() { + return ( + + + + + + ); +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/new-update.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/new-update.tsx index a9e6d823df..28b294721c 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/new-update.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/new-update.tsx @@ -13,7 +13,7 @@ type TProps = { handleClose: () => void; handleCreate: (data: Partial) => void; }; -export const NewUpdate = (props: TProps) => { +export function NewUpdate(props: TProps) { const { handleClose, handleCreate, initialValues } = props; const [input, setInput] = useState(initialValues?.description ?? ""); @@ -52,4 +52,4 @@ export const NewUpdate = (props: TProps) => { ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/properties.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/properties.tsx index 3f320fb6c3..1fb47cd028 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/properties.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/properties.tsx @@ -4,7 +4,7 @@ import { cn } from "@plane/utils"; type TProps = { isCollapsed: boolean; }; -export const Properties = (props: TProps) => { +export function Properties(props: TProps) { const { isCollapsed } = props; return (
    {
    ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/quick-actions.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/quick-actions.tsx index 07d2858370..a14fc697bf 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/quick-actions.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/quick-actions.tsx @@ -11,7 +11,7 @@ type TProps = { remove: (updateId: string) => Promise; }; }; -export const UpdateQuickActions = (props: TProps) => { +export function UpdateQuickActions(props: TProps) { const { operations, updateId } = props; const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); const [isMenuActive, setIsMenuActive] = useState(false); @@ -56,4 +56,4 @@ export const UpdateQuickActions = (props: TProps) => { ); -}; +} diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/root.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/root.tsx index 51edc785d7..fff2861146 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/root.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/root.tsx @@ -15,7 +15,7 @@ import { UpdatesLoader } from "./loader"; import { NewUpdate } from "./new-update"; import { useUpdates } from "./use-updates"; -export const ProjectUpdates = observer(() => { +export const ProjectUpdates = observer(function ProjectUpdates() { const { workspaceSlug, projectId } = useParams(); // state const [showInput, setShowInput] = useState(false); diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/status-dropdown.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/status-dropdown.tsx index 9b22e92e85..48352015c0 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/status-dropdown.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/status-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Rocket, TriangleAlert, CircleAlert } from "lucide-react"; @@ -28,11 +26,11 @@ export type TStatusDropdown = { setStatus: (status: EUpdateStatus) => void; }; -export const StatusDropdown: FC = observer((props) => { +export const StatusDropdown = observer(function StatusDropdown(props: TStatusDropdown) { const { className, setStatus, selectedStatus } = props; - const DropdownOptions = () => - StatusOptions?.map((status) => ( + function DropdownOptions() { + return StatusOptions?.map((status) => ( = observer((props) => {
    {status.key.replaceAll("-", " ").toLowerCase()}
     )); + } const selectedStatusObj = StatusOptions.find((status) => status.key === selectedStatus); diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/update-reaction.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/update-reaction.tsx index 7224814c64..ea86b0747d 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/update-reaction.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/update-reaction.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useMemo, useState } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ export type TUpdateReaction = { disabled?: boolean; }; -export const UpdateReaction: FC = observer((props) => { +export const UpdateReaction = observer(function UpdateReaction(props: TUpdateReaction) { const { workspaceSlug, projectId, commentId, currentUser, disabled = false } = props; // state diff --git a/apps/web/ee/components/project-overview/details/sidebar/updates/upgrade.tsx b/apps/web/ee/components/project-overview/details/sidebar/updates/upgrade.tsx index b0e67ad944..183c1d7c87 100644 --- a/apps/web/ee/components/project-overview/details/sidebar/updates/upgrade.tsx +++ b/apps/web/ee/components/project-overview/details/sidebar/updates/upgrade.tsx @@ -5,7 +5,7 @@ type TProps = { projectId: string; }; -export const UpgradeUpdates = (props: TProps) => { +export function UpgradeUpdates(props: TProps) { const { workspaceSlug, projectId } = props; const router = useRouter(); return ( @@ -25,4 +25,4 @@ export const UpgradeUpdates = (props: TProps) => { rootClassName="p-10" /> ); -}; +} diff --git a/apps/web/ee/components/project-overview/upgrade.tsx b/apps/web/ee/components/project-overview/upgrade.tsx index ad3e1abf93..538c9459e5 100644 --- a/apps/web/ee/components/project-overview/upgrade.tsx +++ b/apps/web/ee/components/project-overview/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { useTheme } from "next-themes"; @@ -16,7 +14,7 @@ import ProjectUpdatesUpgradeLight from "@/app/assets/empty-state/project-setting // plane web hooks import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const ProjectUpdatesUpgrade = observer(() => { +export const ProjectUpdatesUpgrade = observer(function ProjectUpdatesUpgrade() { // store hooks const { resolvedTheme } = useTheme(); const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail, togglePaidPlanModal } = useWorkspaceSubscription(); @@ -43,7 +41,12 @@ export const ProjectUpdatesUpgrade = observer(() => {
    {isSelfManagedUpgradeDisabled ? ( - + Get Pro diff --git a/apps/web/ee/components/projects/applied-filters/access.tsx b/apps/web/ee/components/projects/applied-filters/access.tsx index 879fb0f1df..b495c9f25b 100644 --- a/apps/web/ee/components/projects/applied-filters/access.tsx +++ b/apps/web/ee/components/projects/applied-filters/access.tsx @@ -12,7 +12,7 @@ type Props = { editable: boolean | undefined; }; -export const AppliedAccessFilters: React.FC = observer((props) => { +export const AppliedAccessFilters = observer(function AppliedAccessFilters(props: Props) { const { handleRemove, appliedFilters, editable } = props; // plane imports const { t } = useTranslation(); diff --git a/apps/web/ee/components/projects/applied-filters/date.tsx b/apps/web/ee/components/projects/applied-filters/date.tsx index 7967958d17..7acbc5c4a7 100644 --- a/apps/web/ee/components/projects/applied-filters/date.tsx +++ b/apps/web/ee/components/projects/applied-filters/date.tsx @@ -12,7 +12,7 @@ type Props = { values: string[]; }; -export const AppliedDateFilters: React.FC = observer((props) => { +export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) { const { editable, handleRemove, values } = props; const getDateLabel = (value: string): string => { diff --git a/apps/web/ee/components/projects/applied-filters/members.tsx b/apps/web/ee/components/projects/applied-filters/members.tsx index b4e1111226..3378d085d5 100644 --- a/apps/web/ee/components/projects/applied-filters/members.tsx +++ b/apps/web/ee/components/projects/applied-filters/members.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { CloseIcon } from "@plane/propel/icons"; // plane ui @@ -15,7 +13,7 @@ type Props = { editable: boolean | undefined; }; -export const AppliedMembersFilters: React.FC = observer((props) => { +export const AppliedMembersFilters = observer(function AppliedMembersFilters(props: Props) { const { handleRemove, appliedFilters, editable } = props; // store hooks const { diff --git a/apps/web/ee/components/projects/applied-filters/priority.tsx b/apps/web/ee/components/projects/applied-filters/priority.tsx index a9772d06e6..1d3d886d33 100644 --- a/apps/web/ee/components/projects/applied-filters/priority.tsx +++ b/apps/web/ee/components/projects/applied-filters/priority.tsx @@ -10,7 +10,7 @@ type Props = { editable: boolean | undefined; }; -export const AppliedPriorityFilters: React.FC = observer((props) => { +export const AppliedPriorityFilters = observer(function AppliedPriorityFilters(props: Props) { const { handleRemove, appliedFilters, editable } = props; return ( diff --git a/apps/web/ee/components/projects/applied-filters/project-display-filters.tsx b/apps/web/ee/components/projects/applied-filters/project-display-filters.tsx index daa0d9d47e..7a81690aa7 100644 --- a/apps/web/ee/components/projects/applied-filters/project-display-filters.tsx +++ b/apps/web/ee/components/projects/applied-filters/project-display-filters.tsx @@ -11,7 +11,7 @@ type Props = { editable: boolean | undefined; }; -export const AppliedProjectDisplayFilters: React.FC = observer((props) => { +export const AppliedProjectDisplayFilters = observer(function AppliedProjectDisplayFilters(props: Props) { const { handleRemove, values, editable } = props; // plane imports const { t } = useTranslation(); diff --git a/apps/web/ee/components/projects/applied-filters/root.tsx b/apps/web/ee/components/projects/applied-filters/root.tsx index 8e79c6af1a..0ba2564894 100644 --- a/apps/web/ee/components/projects/applied-filters/root.tsx +++ b/apps/web/ee/components/projects/applied-filters/root.tsx @@ -1,5 +1,3 @@ -"use client"; - // plane imports import { CloseIcon } from "@plane/propel/icons"; import { Tooltip } from "@plane/propel/tooltip"; @@ -23,7 +21,7 @@ type Props = { totalProjects: number; }; -export const ProjectAppliedFiltersList: React.FC = (props) => { +export function ProjectAppliedFiltersList(props: Props) { const { appliedFilters, handleClearAllFilters, @@ -124,4 +122,4 @@ export const ProjectAppliedFiltersList: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/projects/applied-filters/state.tsx b/apps/web/ee/components/projects/applied-filters/state.tsx index c7243be220..928a36654f 100644 --- a/apps/web/ee/components/projects/applied-filters/state.tsx +++ b/apps/web/ee/components/projects/applied-filters/state.tsx @@ -11,7 +11,7 @@ type Props = { editable: boolean | undefined; }; -export const AppliedStateFilters: React.FC = observer((props) => { +export const AppliedStateFilters = observer(function AppliedStateFilters(props: Props) { const { handleRemove, appliedFilters, editable } = props; const { getProjectStatesByWorkspaceId } = useWorkspaceProjectStates(); diff --git a/apps/web/ee/components/projects/common/join-button.tsx b/apps/web/ee/components/projects/common/join-button.tsx index a3711f9949..77d38db457 100644 --- a/apps/web/ee/components/projects/common/join-button.tsx +++ b/apps/web/ee/components/projects/common/join-button.tsx @@ -14,7 +14,7 @@ type Props = { className?: string; }; -export const JoinButton: React.FC = (props) => { +export function JoinButton(props: Props) { const { project, className } = props; // router const { workspaceSlug } = useParams(); @@ -78,4 +78,4 @@ export const JoinButton: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/projects/create/attributes.tsx b/apps/web/ee/components/projects/create/attributes.tsx index bb87720893..6601db0419 100644 --- a/apps/web/ee/components/projects/create/attributes.tsx +++ b/apps/web/ee/components/projects/create/attributes.tsx @@ -25,7 +25,8 @@ type Props = { data?: Partial; handleFormOnChange?: () => void; }; -const ProjectAttributes: React.FC = (props) => { + +function ProjectAttributes(props: Props) { const { workspaceSlug, currentWorkspace, isProjectGroupingEnabled, data, handleFormOnChange } = props; // plane imports const { t } = useTranslation(); @@ -198,5 +199,6 @@ const ProjectAttributes: React.FC = (props) => { )}
    ); -}; +} + export default ProjectAttributes; diff --git a/apps/web/ee/components/projects/create/loader.tsx b/apps/web/ee/components/projects/create/loader.tsx index 35fadd3d50..022217b1a0 100644 --- a/apps/web/ee/components/projects/create/loader.tsx +++ b/apps/web/ee/components/projects/create/loader.tsx @@ -7,7 +7,7 @@ const messages = [ "All set! Just a few seconds more", ]; -export const ProjectCreateLoader = () => { +export function ProjectCreateLoader() { const [loadingMessage, setLoadingMessage] = useState(messages[0]); const [isTransitioning, setIsTransitioning] = useState(false); @@ -44,4 +44,4 @@ export const ProjectCreateLoader = () => { ); -}; +} diff --git a/apps/web/ee/components/projects/create/provider.tsx b/apps/web/ee/components/projects/create/provider.tsx index d6f3c0bcb8..51c70a5b8e 100644 --- a/apps/web/ee/components/projects/create/provider.tsx +++ b/apps/web/ee/components/projects/create/provider.tsx @@ -15,7 +15,7 @@ export type TProjectCreationProviderProps = { children: React.ReactNode; }; -export const ProjectCreationProvider = observer((props: TProjectCreationProviderProps) => { +export const ProjectCreationProvider = observer(function ProjectCreationProvider(props: TProjectCreationProviderProps) { const { templateId, children } = props; // states const [projectTemplateId, setProjectTemplateId] = useState(templateId ?? null); diff --git a/apps/web/ee/components/projects/create/root.tsx b/apps/web/ee/components/projects/create/root.tsx index 3734ac4496..0cd6628f41 100644 --- a/apps/web/ee/components/projects/create/root.tsx +++ b/apps/web/ee/components/projects/create/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState, useEffect } from "react"; import { observer } from "mobx-react"; @@ -36,13 +34,15 @@ import ProjectAttributes from "./attributes"; import { ProjectCreateLoader } from "./loader"; import { ProjectCreationProvider } from "./provider"; -export const CreateProjectForm: FC = observer((props) => ( - - - -)); +export const CreateProjectForm = observer(function CreateProjectForm(props: TCreateProjectFormProps) { + return ( + + + + ); +}); -export const CreateProjectFormBase: FC = observer((props) => { +export const CreateProjectFormBase = observer(function CreateProjectFormBase(props: TCreateProjectFormProps) { const { setToFavorite, workspaceSlug, onClose, handleNextStep, data, updateCoverImageStatus } = props; // store const { addProjectToFavorites, createProject, updateProject } = useProject(); diff --git a/apps/web/ee/components/projects/create/template-select.tsx b/apps/web/ee/components/projects/create/template-select.tsx index 8fccc29ce7..3d2722bf5f 100644 --- a/apps/web/ee/components/projects/create/template-select.tsx +++ b/apps/web/ee/components/projects/create/template-select.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -20,7 +18,7 @@ import { useProjectCreation } from "@/plane-web/hooks/context/use-project-creati // plane web imports import { useFlag } from "@/plane-web/hooks/store"; -export const ProjectTemplateSelect = observer((props: TProjectTemplateSelect) => { +export const ProjectTemplateSelect = observer(function ProjectTemplateSelect(props: TProjectTemplateSelect) { const { disabled = false, size = "sm", placeholder, dropDownContainerClassName, handleModalClose } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/projects/dropdowns/members-dropdown.tsx b/apps/web/ee/components/projects/dropdowns/members-dropdown.tsx index 1d3fb701a0..261a9bddbe 100644 --- a/apps/web/ee/components/projects/dropdowns/members-dropdown.tsx +++ b/apps/web/ee/components/projects/dropdowns/members-dropdown.tsx @@ -12,19 +12,23 @@ type Props = { button?: React.ReactNode; }; -export const MembersDropdown: React.FC = (props) => { +export function MembersDropdown(props: Props) { const { value, onChange, disabled = false, buttonClassName = "", className = "", button } = props; - const DropdownLabel = () => ( -
    - - {value ? value.length : "Members"} -
    - ); + + function DropdownLabel() { + return ( +
    + + {value ? value.length : "Members"} +
    + ); + } + return ( = (props) => { multiple /> ); -}; +} diff --git a/apps/web/ee/components/projects/dropdowns/priority-dropdown.tsx b/apps/web/ee/components/projects/dropdowns/priority-dropdown.tsx index 8a2f898577..fbacb4bb51 100644 --- a/apps/web/ee/components/projects/dropdowns/priority-dropdown.tsx +++ b/apps/web/ee/components/projects/dropdowns/priority-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { ReactNode } from "react"; import { Fragment, useRef, useState } from "react"; import { useTheme } from "next-themes"; @@ -50,7 +48,7 @@ type ButtonProps = { showTooltip: boolean; }; -const BorderButton = (props: ButtonProps) => { +function BorderButton(props: ButtonProps) { const { className, dropdownArrow, @@ -128,9 +126,9 @@ const BorderButton = (props: ButtonProps) => { ); -}; +} -const BackgroundButton = (props: ButtonProps) => { +function BackgroundButton(props: ButtonProps) { const { className, dropdownArrow, @@ -208,9 +206,9 @@ const BackgroundButton = (props: ButtonProps) => { ); -}; +} -const TransparentButton = (props: ButtonProps) => { +function TransparentButton(props: ButtonProps) { const { className, dropdownArrow, @@ -290,9 +288,9 @@ const TransparentButton = (props: ButtonProps) => { ); -}; +} -export const PriorityDropdown: React.FC = (props) => { +export function PriorityDropdown(props: Props) { const { button, buttonClassName, @@ -479,4 +477,4 @@ export const PriorityDropdown: React.FC = (props) => { )} ); -}; +} diff --git a/apps/web/ee/components/projects/dropdowns/scope-dropdown.tsx b/apps/web/ee/components/projects/dropdowns/scope-dropdown.tsx index 6885f0c9aa..c280b31d0e 100644 --- a/apps/web/ee/components/projects/dropdowns/scope-dropdown.tsx +++ b/apps/web/ee/components/projects/dropdowns/scope-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { useRouter } from "next/navigation"; @@ -18,7 +16,7 @@ export type TProjectScopeDropdown = { className?: string; }; -export const ProjectScopeDropdown: FC = observer((props) => { +export const ProjectScopeDropdown = observer(function ProjectScopeDropdown(props: TProjectScopeDropdown) { const { workspaceSlug, className } = props; // hooks const { scopeProjectsCount, filters, updateScope, updateLayout } = useProjectFilter(); @@ -28,27 +26,30 @@ export const ProjectScopeDropdown: FC = observer((props) const selectedScope = filters?.scope; const selectedScopeCount = selectedScope && scopeProjectsCount?.[selectedScope]; - const DropdownLabel = () => ( - <> -
    -
    -
    - {(PROJECT_SCOPES || []).find((scope) => selectedScope === scope.key)?.label} -
    -
    - {selectedScopeCount} + function DropdownLabel() { + return ( + <> +
    +
    +
    + {(PROJECT_SCOPES || []).find((scope) => selectedScope === scope.key)?.label} +
    +
    + {selectedScopeCount} +
    +
    - -
    -
    - {(PROJECT_SCOPES || []).find((scope) => selectedScope === scope.key)?.label} - -
    - - ); - const DropdownOptions = () => - (PROJECT_SCOPES || []).map((scope) => ( +
    + {(PROJECT_SCOPES || []).find((scope) => selectedScope === scope.key)?.label} + +
    + + ); + } + + function DropdownOptions() { + return (PROJECT_SCOPES || []).map((scope) => ( = observer((props)
    )); + } return selectedScope ? ( = observer((props) => { +export const StateDropdown = observer(function StateDropdown(props: TStateDropdown) { const { workspaceId, onChange, diff --git a/apps/web/ee/components/projects/header/attributes-dropdown/access.tsx b/apps/web/ee/components/projects/header/attributes-dropdown/access.tsx index 06da23e65a..aa2085b219 100644 --- a/apps/web/ee/components/projects/header/attributes-dropdown/access.tsx +++ b/apps/web/ee/components/projects/header/attributes-dropdown/access.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; // hooks @@ -17,7 +15,7 @@ type TFilterAccess = { handleUpdate: (val: EProjectAccess[]) => void; }; -export const FilterAccess: React.FC = observer((props) => { +export const FilterAccess = observer(function FilterAccess(props: TFilterAccess) { const { searchQuery, appliedFilters, handleUpdate } = props; // states const [previewEnabled, setPreviewEnabled] = useState(true); @@ -25,7 +23,7 @@ export const FilterAccess: React.FC = observer((props) => { const sortedOptions = useMemo( () => PROJECT_ACCESS.filter((access) => access.key.includes(searchQuery.toLowerCase()) || searchQuery === ""), - // eslint-disable-next-line react-hooks/exhaustive-deps + [searchQuery] ); diff --git a/apps/web/ee/components/projects/header/attributes-dropdown/priority.tsx b/apps/web/ee/components/projects/header/attributes-dropdown/priority.tsx index e46e2d918c..bf0aa11daa 100644 --- a/apps/web/ee/components/projects/header/attributes-dropdown/priority.tsx +++ b/apps/web/ee/components/projects/header/attributes-dropdown/priority.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; import { PriorityIcon } from "@plane/propel/icons"; @@ -16,7 +14,7 @@ type TFilterPriority = { handleUpdate: (val: TProjectPriority[]) => void; }; -export const FilterPriority: React.FC = observer((props) => { +export const FilterPriority = observer(function FilterPriority(props: TFilterPriority) { const { searchQuery, appliedFilters, handleUpdate } = props; // states const [previewEnabled, setPreviewEnabled] = useState(true); @@ -25,7 +23,7 @@ export const FilterPriority: React.FC = observer((props) => { const sortedOptions = useMemo( () => PROJECT_PRIORITIES.filter((priority) => priority.key.includes(searchQuery.toLowerCase()) || searchQuery === ""), - // eslint-disable-next-line react-hooks/exhaustive-deps + [searchQuery] ); diff --git a/apps/web/ee/components/projects/header/attributes-dropdown/root.tsx b/apps/web/ee/components/projects/header/attributes-dropdown/root.tsx index a5a251867c..ed86cd1347 100644 --- a/apps/web/ee/components/projects/header/attributes-dropdown/root.tsx +++ b/apps/web/ee/components/projects/header/attributes-dropdown/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,9 @@ type TProjectAttributesDropdown = { isArchived?: boolean; }; -export const ProjectAttributesDropdown: FC = observer((props) => { +export const ProjectAttributesDropdown = observer(function ProjectAttributesDropdown( + props: TProjectAttributesDropdown +) { const { workspaceSlug, workspaceId, menuButton, isArchived = false } = props; // hooks const { appliedAttributesCount, filters, updateAttributes } = useProjectFilter(); diff --git a/apps/web/ee/components/projects/header/attributes-dropdown/state.tsx b/apps/web/ee/components/projects/header/attributes-dropdown/state.tsx index 7e625788eb..26bb0f8547 100644 --- a/apps/web/ee/components/projects/header/attributes-dropdown/state.tsx +++ b/apps/web/ee/components/projects/header/attributes-dropdown/state.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; // hooks @@ -16,7 +14,7 @@ type TFilterState = { handleUpdate: (val: string[]) => void; }; -export const FilterState: React.FC = observer((props) => { +export const FilterState = observer(function FilterState(props: TFilterState) { const { workspaceId, searchQuery, appliedFilters, handleUpdate } = props; // hooks const { getProjectStateById, getProjectStateIdsWithGroupingByWorkspaceId } = useWorkspaceProjectStates(); diff --git a/apps/web/ee/components/projects/header/attributes-dropdown/users.tsx b/apps/web/ee/components/projects/header/attributes-dropdown/users.tsx index 06626b23dd..9dcf94cc8e 100644 --- a/apps/web/ee/components/projects/header/attributes-dropdown/users.tsx +++ b/apps/web/ee/components/projects/header/attributes-dropdown/users.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; // plane ui @@ -18,7 +16,7 @@ type TFilterUser = { handleUpdate: (val: string[]) => void; }; -export const FilterUser: React.FC = observer((props) => { +export const FilterUser = observer(function FilterUser(props: TFilterUser) { const { filterTitle = "Users", searchQuery, appliedFilters, handleUpdate } = props; // hooks const { diff --git a/apps/web/ee/components/projects/header/create-project-button.tsx b/apps/web/ee/components/projects/header/create-project-button.tsx index e5f8d726d5..f4f07f9005 100644 --- a/apps/web/ee/components/projects/header/create-project-button.tsx +++ b/apps/web/ee/components/projects/header/create-project-button.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -10,8 +8,7 @@ import { EUserWorkspaceRoles } from "@plane/types"; import { useCommandPalette } from "@/hooks/store/use-command-palette"; import { useUserPermissions } from "@/hooks/store/user"; -export const ProjectCreateButton: FC = observer((props) => { - const {} = props; +export const ProjectCreateButton = observer(function ProjectCreateButton() { // hooks const { toggleCreateProjectModal } = useCommandPalette(); const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/projects/header/display-filters-dropdown/group-by.tsx b/apps/web/ee/components/projects/header/display-filters-dropdown/group-by.tsx index ad5d9c2cc2..5543be25bd 100644 --- a/apps/web/ee/components/projects/header/display-filters-dropdown/group-by.tsx +++ b/apps/web/ee/components/projects/header/display-filters-dropdown/group-by.tsx @@ -12,7 +12,7 @@ type TDisplayFilterGroupBy = { handleUpdate: (val: TProjectGroupBy) => void; }; -export const DisplayFilterGroupBy: React.FC = observer((props) => { +export const DisplayFilterGroupBy = observer(function DisplayFilterGroupBy(props: TDisplayFilterGroupBy) { const { filterValue, handleUpdate } = props; const [previewEnabled, setPreviewEnabled] = useState(true); diff --git a/apps/web/ee/components/projects/header/display-filters-dropdown/root.tsx b/apps/web/ee/components/projects/header/display-filters-dropdown/root.tsx index f5b35b822e..d2e707d2e4 100644 --- a/apps/web/ee/components/projects/header/display-filters-dropdown/root.tsx +++ b/apps/web/ee/components/projects/header/display-filters-dropdown/root.tsx @@ -18,7 +18,9 @@ type TProjectDisplayFiltersDropdown = { isArchived?: boolean; }; -export const ProjectDisplayFiltersDropdown: FC = observer((props) => { +export const ProjectDisplayFiltersDropdown = observer(function ProjectDisplayFiltersDropdown( + props: TProjectDisplayFiltersDropdown +) { const { workspaceSlug, menuButton, isArchived = false } = props; // hooks const { filters, updateDisplayFilters } = useProjectFilter(); diff --git a/apps/web/ee/components/projects/header/display-filters-dropdown/sort-by.tsx b/apps/web/ee/components/projects/header/display-filters-dropdown/sort-by.tsx index 7c08147de6..d20267b967 100644 --- a/apps/web/ee/components/projects/header/display-filters-dropdown/sort-by.tsx +++ b/apps/web/ee/components/projects/header/display-filters-dropdown/sort-by.tsx @@ -12,7 +12,7 @@ type TDisplayFilterSortBy = { handleUpdate: (val: TProjectSortBy) => void; }; -export const DisplayFilterSortBy: React.FC = observer((props) => { +export const DisplayFilterSortBy = observer(function DisplayFilterSortBy(props: TDisplayFilterSortBy) { const { filterValue, handleUpdate } = props; const [previewEnabled, setPreviewEnabled] = useState(true); diff --git a/apps/web/ee/components/projects/header/display-filters-dropdown/sort-order.tsx b/apps/web/ee/components/projects/header/display-filters-dropdown/sort-order.tsx index 154acbe12c..271a8ceab3 100644 --- a/apps/web/ee/components/projects/header/display-filters-dropdown/sort-order.tsx +++ b/apps/web/ee/components/projects/header/display-filters-dropdown/sort-order.tsx @@ -12,7 +12,7 @@ type TDisplayFilterSortOrder = { handleUpdate: (val: TProjectSortOrder) => void; }; -export const DisplayFilterSortOrder: React.FC = observer((props) => { +export const DisplayFilterSortOrder = observer(function DisplayFilterSortOrder(props: TDisplayFilterSortOrder) { const { filterValue, handleUpdate } = props; const [previewEnabled, setPreviewEnabled] = useState(true); diff --git a/apps/web/ee/components/projects/header/layout-selection.tsx b/apps/web/ee/components/projects/header/layout-selection.tsx index 419954270b..f40d9eb635 100644 --- a/apps/web/ee/components/projects/header/layout-selection.tsx +++ b/apps/web/ee/components/projects/header/layout-selection.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -18,7 +16,7 @@ type TProjectLayoutSelection = { workspaceSlug: string; }; -export const ProjectLayoutSelection: FC = observer((props) => { +export const ProjectLayoutSelection = observer(function ProjectLayoutSelection(props: TProjectLayoutSelection) { const { workspaceSlug } = props; // hooks const { filters, updateLayout } = useProjectFilter(); diff --git a/apps/web/ee/components/projects/header/root.tsx b/apps/web/ee/components/projects/header/root.tsx index c75211d977..2482de24ec 100644 --- a/apps/web/ee/components/projects/header/root.tsx +++ b/apps/web/ee/components/projects/header/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams, usePathname } from "next/navigation"; import { ProjectIcon } from "@plane/propel/icons"; @@ -20,7 +18,7 @@ import { ProjectDisplayFiltersDropdown } from "./display-filters-dropdown"; import { ProjectLayoutSelection } from "./layout-selection"; import { ProjectSearch } from "./search-projects"; -export const ProjectsListHeader = observer(() => { +export const ProjectsListHeader = observer(function ProjectsListHeader() { const { workspaceSlug } = useParams(); // hooks const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/projects/header/search-projects.tsx b/apps/web/ee/components/projects/header/search-projects.tsx index 5504552177..cd90bbe8fd 100644 --- a/apps/web/ee/components/projects/header/search-projects.tsx +++ b/apps/web/ee/components/projects/header/search-projects.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -10,7 +8,7 @@ import { cn } from "@plane/utils"; // plane web hooks import { useProjectFilter } from "@/plane-web/hooks/store"; -export const ProjectSearch: FC = observer(() => { +export const ProjectSearch = observer(function ProjectSearch() { // hooks const { searchQuery, updateSearchQuery } = useProjectFilter(); // refs diff --git a/apps/web/ee/components/projects/layouts/attributes.tsx b/apps/web/ee/components/projects/layouts/attributes.tsx index 32e42218dc..eda284d85a 100644 --- a/apps/web/ee/components/projects/layouts/attributes.tsx +++ b/apps/web/ee/components/projects/layouts/attributes.tsx @@ -35,7 +35,7 @@ type Props = { displayProperties: { [key: string]: boolean }; }; -export const Attributes: React.FC = observer((props) => { +export const Attributes = observer(function Attributes(props: Props) { const { project, isArchived, diff --git a/apps/web/ee/components/projects/layouts/board/group-drag-overlay.tsx b/apps/web/ee/components/projects/layouts/board/group-drag-overlay.tsx index a385e9d16a..cd3c31e30f 100644 --- a/apps/web/ee/components/projects/layouts/board/group-drag-overlay.tsx +++ b/apps/web/ee/components/projects/layouts/board/group-drag-overlay.tsx @@ -13,7 +13,7 @@ type Props = { isDraggingOverColumn: boolean; }; -export const GroupDragOverlay = (props: Props) => { +export function GroupDragOverlay(props: Props) { const { dragColumnOrientation, canOverlayBeVisible, @@ -68,4 +68,4 @@ export const GroupDragOverlay = (props: Props) => {
    ); -}; +} diff --git a/apps/web/ee/components/projects/layouts/board/group-item-header/root.tsx b/apps/web/ee/components/projects/layouts/board/group-item-header/root.tsx index 8c2bb68e9e..2f0ab95f72 100644 --- a/apps/web/ee/components/projects/layouts/board/group-item-header/root.tsx +++ b/apps/web/ee/components/projects/layouts/board/group-item-header/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,9 @@ type TProjectBoardGroupItemHeader = { ) => void; }; -export const ProjectBoardGroupItemHeader: FC = observer((props) => { +export const ProjectBoardGroupItemHeader = observer(function ProjectBoardGroupItemHeader( + props: TProjectBoardGroupItemHeader +) { const { groupByKey, projectIds, verticalAlign, setVerticalAlign } = props; //states const [open, setOpen] = useState(false); diff --git a/apps/web/ee/components/projects/layouts/board/group-item.tsx b/apps/web/ee/components/projects/layouts/board/group-item.tsx index 6fa74cbb0f..5084f7caf6 100644 --- a/apps/web/ee/components/projects/layouts/board/group-item.tsx +++ b/apps/web/ee/components/projects/layouts/board/group-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useRef, useState } from "react"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; @@ -31,7 +29,7 @@ type ProjectBoardGroupItem = { dropErrorMessage?: string; }; -export const ProjectBoardGroupItem: FC = observer((props) => { +export const ProjectBoardGroupItem = observer(function ProjectBoardGroupItem(props: ProjectBoardGroupItem) { const { groupByKey, projectIds, verticalAlign, setVerticalAlign, dropErrorMessage = "" } = props; const [isDraggingOverColumn, setIsDraggingOverColumn] = useState(false); const columnRef = useRef(null); diff --git a/apps/web/ee/components/projects/layouts/board/group.tsx b/apps/web/ee/components/projects/layouts/board/group.tsx index d39ed90a57..24a85a9435 100644 --- a/apps/web/ee/components/projects/layouts/board/group.tsx +++ b/apps/web/ee/components/projects/layouts/board/group.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -14,7 +12,7 @@ type ProjectBoardGroup = { groupByProjectIds: TProjectsBoardLayoutStructure; }; -export const ProjectBoardGroup: FC = observer((props) => { +export const ProjectBoardGroup = observer(function ProjectBoardGroup(props: ProjectBoardGroup) { const { groupByProjectIds } = props; const [verticalAlign, setVerticalAlign] = useState<{ [key: string]: boolean }>({}); diff --git a/apps/web/ee/components/projects/layouts/board/list-item.tsx b/apps/web/ee/components/projects/layouts/board/list-item.tsx index 36780a367b..9fc4c220c7 100644 --- a/apps/web/ee/components/projects/layouts/board/list-item.tsx +++ b/apps/web/ee/components/projects/layouts/board/list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useEffect, useRef } from "react"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; @@ -21,7 +19,7 @@ type ProjectBoardListItem = { projectId: string; }; -export const ProjectBoardListItem: FC = observer((props) => { +export const ProjectBoardListItem = observer(function ProjectBoardListItem(props: ProjectBoardListItem) { const { projectId } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/projects/layouts/board/list.tsx b/apps/web/ee/components/projects/layouts/board/list.tsx index bedffb1ae8..8962a08789 100644 --- a/apps/web/ee/components/projects/layouts/board/list.tsx +++ b/apps/web/ee/components/projects/layouts/board/list.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -7,7 +5,7 @@ import { ProjectBoardListItem } from "@/plane-web/components/projects/layouts/bo type ProjectBoardList = { groupByKey: string; projectIds: string[] }; -export const ProjectBoardList: FC = observer((props) => { +export const ProjectBoardList = observer(function ProjectBoardList(props: ProjectBoardList) { const { groupByKey, projectIds } = props; return ( diff --git a/apps/web/ee/components/projects/layouts/board/root.tsx b/apps/web/ee/components/projects/layouts/board/root.tsx index 893944bd04..acd84a52ec 100644 --- a/apps/web/ee/components/projects/layouts/board/root.tsx +++ b/apps/web/ee/components/projects/layouts/board/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane web components @@ -10,7 +8,7 @@ import { useProjectFilter } from "@/plane-web/hooks/store"; import { EProjectLayouts } from "@/plane-web/types/workspace-project-filters"; import { ProjectLayoutHOC } from "../project-layout-HOC"; -export const ProjectBoardLayout: FC = observer(() => { +export const ProjectBoardLayout = observer(function ProjectBoardLayout() { // hooks const { getFilteredProjectsByLayout } = useProjectFilter(); diff --git a/apps/web/ee/components/projects/layouts/gallery/base-gallery-root.tsx b/apps/web/ee/components/projects/layouts/gallery/base-gallery-root.tsx index 54c07e2c9e..a6bad39eeb 100644 --- a/apps/web/ee/components/projects/layouts/gallery/base-gallery-root.tsx +++ b/apps/web/ee/components/projects/layouts/gallery/base-gallery-root.tsx @@ -7,7 +7,7 @@ import { EProjectLayouts } from "@/plane-web/types/workspace-project-filters"; import { ProjectLayoutHOC } from "../project-layout-HOC"; import { ProjectCard } from "./card"; -export const BaseProjectRoot = observer(() => { +export const BaseProjectRoot = observer(function BaseProjectRoot() { // store hooks const { getProjectById } = useProject(); const { getFilteredProjectsByLayout } = useProjectFilter(); diff --git a/apps/web/ee/components/projects/layouts/gallery/card.tsx b/apps/web/ee/components/projects/layouts/gallery/card.tsx index 2eb9539732..dd75f629ce 100644 --- a/apps/web/ee/components/projects/layouts/gallery/card.tsx +++ b/apps/web/ee/components/projects/layouts/gallery/card.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -26,7 +24,7 @@ type Props = { project: TProject; }; -export const ProjectCard: React.FC = observer((props) => { +export const ProjectCard = observer(function ProjectCard(props: Props) { const { project } = props; // states const [deleteProjectModalOpen, setDeleteProjectModal] = useState(false); diff --git a/apps/web/ee/components/projects/layouts/gallery/details.tsx b/apps/web/ee/components/projects/layouts/gallery/details.tsx index bc03637a55..4948bdf42b 100644 --- a/apps/web/ee/components/projects/layouts/gallery/details.tsx +++ b/apps/web/ee/components/projects/layouts/gallery/details.tsx @@ -28,7 +28,7 @@ type Props = { setDeleteProjectModal: (value: boolean) => void; }; -export const Details: React.FC = observer((props) => { +export const Details = observer(function Details(props: Props) { const { project, workspaceSlug, setArchiveRestoreProject, setDeleteProjectModal } = props; // store hooks const { addProjectToFavorites, removeProjectFromFavorites } = useProject(); diff --git a/apps/web/ee/components/projects/layouts/gantt/base-gantt-root.tsx b/apps/web/ee/components/projects/layouts/gantt/base-gantt-root.tsx index 16a0ecb8af..1edef81f85 100644 --- a/apps/web/ee/components/projects/layouts/gantt/base-gantt-root.tsx +++ b/apps/web/ee/components/projects/layouts/gantt/base-gantt-root.tsx @@ -20,7 +20,7 @@ import { ProjectLayoutHOC } from "../project-layout-HOC"; import { ProjectGanttBlock } from "./blocks"; import { ProjectGanttSidebar } from "./sidebar"; -export const BaseGanttRoot: React.FC = observer(() => { +export const BaseGanttRoot = observer(function BaseGanttRoot() { // store hooks const { getFilteredProjectsByLayout } = useProjectFilter(); const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/projects/layouts/gantt/blocks.tsx b/apps/web/ee/components/projects/layouts/gantt/blocks.tsx index eabc768c77..8bcb332f70 100644 --- a/apps/web/ee/components/projects/layouts/gantt/blocks.tsx +++ b/apps/web/ee/components/projects/layouts/gantt/blocks.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import Link from "next/link"; import { useParams } from "next/navigation"; @@ -22,7 +20,7 @@ type SidebarProps = { block: IGanttBlock; }; -export const ProjectGanttBlock: React.FC = observer((props) => { +export const ProjectGanttBlock = observer(function ProjectGanttBlock(props: Props) { const { projectId } = props; // store hooks const { getProjectById } = useProject(); @@ -66,7 +64,7 @@ export const ProjectGanttBlock: React.FC = observer((props) => { }); // rendering projects on gantt sidebar -export const ProjectGanttSidebarBlock: React.FC = observer((props) => { +export const ProjectGanttSidebarBlock = observer(function ProjectGanttSidebarBlock(props: SidebarProps) { const { block } = props; const { filters } = useProjectFilter(); @@ -98,7 +96,7 @@ export const ProjectGanttSidebarBlock: React.FC = observer((props) )} ); - return !!projectDetails.member_role ? ( + return projectDetails.member_role ? ( = observer((props) => { +export const ProjectGanttSidebar = observer(function ProjectGanttSidebar(props: Props) { const { blockIds, canLoadMoreBlocks, showAllBlocks = false } = props; const { getBlockById } = useTimeLineChartStore(); diff --git a/apps/web/ee/components/projects/layouts/list/base-list-root.tsx b/apps/web/ee/components/projects/layouts/list/base-list-root.tsx index 647c6fc070..9bf50daaa7 100644 --- a/apps/web/ee/components/projects/layouts/list/base-list-root.tsx +++ b/apps/web/ee/components/projects/layouts/list/base-list-root.tsx @@ -6,7 +6,7 @@ import { EProjectLayouts } from "@/plane-web/types/workspace-project-filters"; import { ProjectLayoutHOC } from "../project-layout-HOC"; import { List } from "./default"; -export const BaseListRoot = observer(() => { +export const BaseListRoot = observer(function BaseListRoot() { // store hooks const { getFilteredProjectsByLayout } = useProjectFilter(); diff --git a/apps/web/ee/components/projects/layouts/list/block.tsx b/apps/web/ee/components/projects/layouts/list/block.tsx index cacf936e48..40b41b7a24 100644 --- a/apps/web/ee/components/projects/layouts/list/block.tsx +++ b/apps/web/ee/components/projects/layouts/list/block.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -29,7 +27,7 @@ interface ProjectBlockProps { canDrag?: boolean; } -export const ProjectBlock = observer((props: ProjectBlockProps) => { +export const ProjectBlock = observer(function ProjectBlock(props: ProjectBlockProps) { const { projectId, isCurrentBlockDragging, canDrag } = props; // ref const projectRef = useRef(null); diff --git a/apps/web/ee/components/projects/layouts/list/blocks-list.tsx b/apps/web/ee/components/projects/layouts/list/blocks-list.tsx index 3a021f4d4f..3b565a4485 100644 --- a/apps/web/ee/components/projects/layouts/list/blocks-list.tsx +++ b/apps/web/ee/components/projects/layouts/list/blocks-list.tsx @@ -6,7 +6,7 @@ interface Props { projectIds: string[] | undefined; } -export const ProjectBlocksList: FC = (props) => { +export function ProjectBlocksList(props: Props) { const { projectIds = [] } = props; return ( @@ -16,4 +16,4 @@ export const ProjectBlocksList: FC = (props) => { projectIds.map((projectId: string) => )} ); -}; +} diff --git a/apps/web/ee/components/projects/layouts/list/default.tsx b/apps/web/ee/components/projects/layouts/list/default.tsx index d7e272b503..eec1d52a13 100644 --- a/apps/web/ee/components/projects/layouts/list/default.tsx +++ b/apps/web/ee/components/projects/layouts/list/default.tsx @@ -13,7 +13,7 @@ export interface IList { showEmptyGroup?: boolean; } -export const List: React.FC = observer((props) => { +export const List = observer(function List(props: IList) { const { groupedProjectIds, groupBy, displayProperties, showEmptyGroup } = props; const containerRef = useRef(null); diff --git a/apps/web/ee/components/projects/layouts/list/headers/group-by-card.tsx b/apps/web/ee/components/projects/layouts/list/headers/group-by-card.tsx index e92e9daeda..8ea5d3b828 100644 --- a/apps/web/ee/components/projects/layouts/list/headers/group-by-card.tsx +++ b/apps/web/ee/components/projects/layouts/list/headers/group-by-card.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { CircleDashed } from "lucide-react"; @@ -11,7 +9,7 @@ interface IHeaderGroupByCard { toggleListGroup: (id: string) => void; } -export const HeaderGroupByCard = observer((props: IHeaderGroupByCard) => { +export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHeaderGroupByCard) { const { groupID, icon, title, count, toggleListGroup } = props; return ( diff --git a/apps/web/ee/components/projects/layouts/list/list-group.tsx b/apps/web/ee/components/projects/layouts/list/list-group.tsx index 9d18c2e813..eb8140eb9d 100644 --- a/apps/web/ee/components/projects/layouts/list/list-group.tsx +++ b/apps/web/ee/components/projects/layouts/list/list-group.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { MutableRefObject } from "react"; import { Fragment, forwardRef, useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -25,24 +23,29 @@ interface Props { } // List loader component -const ListLoaderItemRow = forwardRef((props, ref) => ( -
    -
    - - +const ListLoaderItemRow = forwardRef(function ListLoaderItemRow( + props: Record, + ref: React.ForwardedRef +) { + return ( +
    +
    + + +
    +
    + {[...Array(6)].map((_, index) => ( + + + + ))} +
    -
    - {[...Array(6)].map((_, index) => ( - - - - ))} -
    -
    -)); + ); +}); ListLoaderItemRow.displayName = "ListLoaderItemRow"; -export const ListGroup = observer((props: Props) => { +export const ListGroup = observer(function ListGroup(props: Props) { const { groupedProjectIds = [], group, groupBy } = props; const { getProjectStateById, getProjectStatedByStateGroupKey } = useWorkspaceProjectStates(); const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/projects/layouts/project-layout-HOC.tsx b/apps/web/ee/components/projects/layouts/project-layout-HOC.tsx index 8cd9768b8b..a2e63962a3 100644 --- a/apps/web/ee/components/projects/layouts/project-layout-HOC.tsx +++ b/apps/web/ee/components/projects/layouts/project-layout-HOC.tsx @@ -26,7 +26,7 @@ import { useUserPermissions } from "@/hooks/store/user"; import { useProjectFilter, useWorkspaceProjectStates } from "@/plane-web/hooks/store"; import { EProjectLayouts } from "@/plane-web/types/workspace-project-filters"; -const ActiveLoader = (props: { layout: EProjectLayouts }) => { +function ActiveLoader(props: { layout: EProjectLayouts }) { const { layout } = props; switch (layout) { case EProjectLayouts.TABLE: @@ -40,14 +40,14 @@ const ActiveLoader = (props: { layout: EProjectLayouts }) => { default: return null; } -}; +} interface Props { children: string | React.ReactNode | React.ReactNode[]; layout: EProjectLayouts; } -export const ProjectLayoutHOC = observer((props: Props) => { +export const ProjectLayoutHOC = observer(function ProjectLayoutHOC(props: Props) { const { layout } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/projects/layouts/root.tsx b/apps/web/ee/components/projects/layouts/root.tsx index efbc9aae73..1927927f7c 100644 --- a/apps/web/ee/components/projects/layouts/root.tsx +++ b/apps/web/ee/components/projects/layouts/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // plane web imports import { useProjectFilter } from "@/plane-web/hooks/store/workspace-project-states"; @@ -10,13 +8,13 @@ import { BaseProjectRoot } from "./gallery/base-gallery-root"; import { BaseGanttRoot } from "./gantt/base-gantt-root"; import { BaseListRoot } from "./list/base-list-root"; -export const ProjectLayoutRoot = observer(() => { +export const ProjectLayoutRoot = observer(function ProjectLayoutRoot() { const { filters } = useProjectFilter(); // derived values const currentLayout = filters?.layout; - const ProjectLayout = (props: { activeLayout: EProjectLayouts | undefined }) => { + function ProjectLayout(props: { activeLayout: EProjectLayouts | undefined }) { switch (props.activeLayout) { case EProjectLayouts.BOARD: return ; @@ -29,7 +27,7 @@ export const ProjectLayoutRoot = observer(() => { default: return <>; } - }; + } return ; }); diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/base-spreadsheet-root.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/base-spreadsheet-root.tsx index 1d915e028c..4b48143cd2 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/base-spreadsheet-root.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/base-spreadsheet-root.tsx @@ -9,7 +9,7 @@ import type { TProjectDisplayFilters } from "@/plane-web/types/workspace-project import { EProjectLayouts } from "@/plane-web/types/workspace-project-filters"; import { SpreadsheetView } from "./spreadsheet-view"; -export const BaseSpreadsheetRoot = observer(() => { +export const BaseSpreadsheetRoot = observer(function BaseSpreadsheetRoot() { // router const { workspaceSlug } = useParams(); // store hooks @@ -35,9 +35,7 @@ export const BaseSpreadsheetRoot = observer(() => { displayFilters={filters?.display_filters as TProjectDisplayFilters} handleDisplayFilterUpdate={handleDisplayFiltersUpdate} projectIds={filteredProjectIds} - updateProject={(projectId, data) => - updateProject(workspaceSlug.toString(), projectId || "", data) as Promise - } + updateProject={(projectId, data) => updateProject(workspaceSlug.toString(), projectId || "", data)} canEditProperties={() => true} /> ); diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/header-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/header-column.tsx index e53d7ae7a1..60da23a348 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/header-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/header-column.tsx @@ -1,5 +1,3 @@ -"use client"; - //ui import { ArrowDownWideNarrow, ArrowUpNarrowWide, CheckIcon, ChevronDownIcon, Eraser, MoveRight } from "lucide-react"; import { CustomMenu } from "@plane/ui"; @@ -18,7 +16,7 @@ interface Props { onClose: () => void; } -export const HeaderColumn = (props: Props) => { +export function HeaderColumn(props: Props) { const { handleDisplayFilterUpdate, property, onClose } = props; const { storedValue: selectedMenuItem } = useLocalStorage("projectSpreadsheetViewSorting", ""); @@ -108,4 +106,4 @@ export const HeaderColumn = (props: Props) => { )} ); -}; +} diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/issue-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/issue-column.tsx index 2925d1d631..9decb883ab 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/issue-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/issue-column.tsx @@ -14,7 +14,7 @@ type Props = { project: TProject; }; -export const SpreadsheetIssueColumn: React.FC = observer((props: Props) => { +export const SpreadsheetIssueColumn = observer(function SpreadsheetIssueColumn(props: Props) { const { project } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/lead-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/lead-column.tsx index 5a5095b9d8..9e39c5fdbe 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/lead-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/lead-column.tsx @@ -12,7 +12,7 @@ type Props = { project: TProject; }; -export const SpreadsheetLeadColumn: React.FC = observer((props: Props) => { +export const SpreadsheetLeadColumn = observer(function SpreadsheetLeadColumn(props: Props) { const { project } = props; // hooks diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/members-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/members-column.tsx index f94c45b1f0..140257f84e 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/members-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/members-column.tsx @@ -9,7 +9,7 @@ type Props = { project: TProject; }; -export const SpreadsheetMembersColumn: React.FC = observer((props: Props) => { +export const SpreadsheetMembersColumn = observer(function SpreadsheetMembersColumn(props: Props) { const { project } = props; // derived values diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/priority-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/priority-column.tsx index e69f1bd06d..498c442614 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/priority-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/priority-column.tsx @@ -11,7 +11,7 @@ type Props = { disabled: boolean; }; -export const SpreadsheetPriorityColumn: React.FC = observer((props: Props) => { +export const SpreadsheetPriorityColumn = observer(function SpreadsheetPriorityColumn(props: Props) { const { project, onChange, disabled, onClose } = props; return ( diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/state-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/state-column.tsx index c31c3166d9..4018b5cafe 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/state-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/state-column.tsx @@ -17,7 +17,7 @@ type Props = { disabled: boolean; }; -export const SpreadsheetStateColumn: React.FC = observer((props) => { +export const SpreadsheetStateColumn = observer(function SpreadsheetStateColumn(props: Props) { const { project, onChange, disabled } = props; const { workspaceSlug } = useParams(); const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/columns/updated-on-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/columns/updated-on-column.tsx index 78d2537f7d..6c7c438536 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/columns/updated-on-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/columns/updated-on-column.tsx @@ -12,7 +12,7 @@ type Props = { onChange: (project: TProject, data: Partial) => void; }; -export const SpreadsheetUpdatedOnColumn: React.FC = observer((props: Props) => { +export const SpreadsheetUpdatedOnColumn = observer(function SpreadsheetUpdatedOnColumn(props: Props) { const { project, onChange, disabled } = props; return ( diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/project-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/project-column.tsx index bc36d20e4b..e07fa10e12 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/project-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/project-column.tsx @@ -16,7 +16,7 @@ type Props = { updateProject: ((projectId: string | null, data: Partial) => Promise) | undefined; }; -export const ProjectColumn = observer((props: Props) => { +export const ProjectColumn = observer(function ProjectColumn(props: Props) { const { projectDetails, property, updateProject } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/project-row.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/project-row.tsx index d46eb56377..06d6da003f 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/project-row.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/project-row.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { MutableRefObject } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -33,7 +31,7 @@ interface Props { selectionHelpers: TSelectionHelper; } -export const SpreadsheetProjectRow = observer((props: Props) => { +export const SpreadsheetProjectRow = observer(function SpreadsheetProjectRow(props: Props) { const { projectId, portalElement, @@ -84,7 +82,7 @@ interface ProjectRowDetailsProps { selectionHelpers: TSelectionHelper; } -const ProjectRowDetails = observer((props: ProjectRowDetailsProps) => { +const ProjectRowDetails = observer(function ProjectRowDetails(props: ProjectRowDetailsProps) { const { projectId, updateProject, canEditProperties, isScrolled, spreadsheetColumnsList } = props; // refs const cellRef = useRef(null); diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header-column.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header-column.tsx index 9d1ebd738a..6a3f1d09f7 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header-column.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header-column.tsx @@ -12,7 +12,7 @@ interface Props { displayFilters: TProjectDisplayFilters; handleDisplayFilterUpdate: (data: Partial) => void; } -export const SpreadsheetHeaderColumn = observer((props: Props) => { +export const SpreadsheetHeaderColumn = observer(function SpreadsheetHeaderColumn(props: Props) { const { displayFilters, property, handleDisplayFilterUpdate } = props; //hooks diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header.tsx index 61a4820824..a516ca139a 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-header.tsx @@ -16,7 +16,7 @@ interface Props { selectionHelpers: TSelectionHelper; } -export const SpreadsheetHeader = observer((props: Props) => { +export const SpreadsheetHeader = observer(function SpreadsheetHeader(props: Props) { const { displayFilters, handleDisplayFilterUpdate, spreadsheetColumnsList } = props; return ( diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-table.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-table.tsx index 7705121b00..e8103bcfa2 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-table.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-table.tsx @@ -23,7 +23,7 @@ type Props = { selectionHelpers: TSelectionHelper; }; -export const SpreadsheetTable = observer((props: Props) => { +export const SpreadsheetTable = observer(function SpreadsheetTable(props: Props) { const { displayFilters, handleDisplayFilterUpdate, diff --git a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-view.tsx b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-view.tsx index 01a25a9e92..a605ac552a 100644 --- a/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-view.tsx +++ b/apps/web/ee/components/projects/layouts/spreadsheet/spreadsheet-view.tsx @@ -21,7 +21,7 @@ type Props = { canEditProperties: (projectId: string | undefined) => boolean; }; -export const SpreadsheetView: React.FC = observer((props) => { +export const SpreadsheetView = observer(function SpreadsheetView(props: Props) { const { displayFilters, handleDisplayFilterUpdate, projectIds, updateProject, canEditProperties } = props; // refs const containerRef = useRef(null); diff --git a/apps/web/ee/components/projects/mobile-header.tsx b/apps/web/ee/components/projects/mobile-header.tsx index 0d2e238f19..c8f7710af1 100644 --- a/apps/web/ee/components/projects/mobile-header.tsx +++ b/apps/web/ee/components/projects/mobile-header.tsx @@ -11,7 +11,7 @@ import { ProjectAttributesDropdown } from "./header/attributes-dropdown/root"; import { ProjectDisplayFiltersDropdown } from "./header/display-filters-dropdown/root"; import { ProjectLayoutSelection } from "./header/layout-selection"; -export const ProjectsListMobileHeader = observer(() => { +export const ProjectsListMobileHeader = observer(function ProjectsListMobileHeader() { // router const { workspaceSlug } = useParams(); const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/projects/page.tsx b/apps/web/ee/components/projects/page.tsx index 272fb77080..1ad320262b 100644 --- a/apps/web/ee/components/projects/page.tsx +++ b/apps/web/ee/components/projects/page.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect } from "react"; import { observer } from "mobx-react"; import { useParams, usePathname } from "next/navigation"; @@ -17,7 +15,7 @@ import { useFlag } from "@/plane-web/hooks/store/use-flag"; import { EWorkspaceFeatures } from "@/plane-web/types/workspace-feature"; import { EProjectLayouts } from "@/plane-web/types/workspace-project-filters"; -export const ProjectPageRoot = observer(() => { +export const ProjectPageRoot = observer(function ProjectPageRoot() { // router const { workspaceSlug } = useParams(); const pathname = usePathname(); diff --git a/apps/web/ee/components/projects/quick-actions.tsx b/apps/web/ee/components/projects/quick-actions.tsx index 88deba2668..f147b63766 100644 --- a/apps/web/ee/components/projects/quick-actions.tsx +++ b/apps/web/ee/components/projects/quick-actions.tsx @@ -21,7 +21,7 @@ type Props = { project: TProject; }; -export const QuickActions: React.FC = (props) => { +export function QuickActions(props: Props) { const { workspaceSlug, project } = props; //states const [deleteProjectModalOpen, setDeleteProjectModal] = useState(false); @@ -145,4 +145,4 @@ export const QuickActions: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/projects/root.tsx b/apps/web/ee/components/projects/root.tsx index bccab41ee1..cbfaef1f36 100644 --- a/apps/web/ee/components/projects/root.tsx +++ b/apps/web/ee/components/projects/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback, useEffect } from "react"; import { observer } from "mobx-react"; @@ -20,7 +18,7 @@ type TWorkspaceProjectsRoot = { filtersToInit?: EProjectFilters[]; }; -export const WorkspaceProjectsRoot: FC = observer((props) => { +export const WorkspaceProjectsRoot = observer(function WorkspaceProjectsRoot(props: TWorkspaceProjectsRoot) { const { workspaceSlug, isArchived = false, filtersToInit: filtersToInitFromProps = [] } = props; //pathname const pathname = usePathname(); diff --git a/apps/web/ee/components/projects/settings/features-list.tsx b/apps/web/ee/components/projects/settings/features-list.tsx index 05ade7e148..2d98b4fa88 100644 --- a/apps/web/ee/components/projects/settings/features-list.tsx +++ b/apps/web/ee/components/projects/settings/features-list.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -32,7 +30,7 @@ type Props = { isCreateModal?: boolean; }; -export const ProjectFeaturesList: FC = observer((props) => { +export const ProjectFeaturesList = observer(function ProjectFeaturesList(props: Props) { const { workspaceSlug, projectId, isAdmin, isCreateModal } = props; // router const navigate = useNavigate(); diff --git a/apps/web/ee/components/projects/settings/intake/feature-children.tsx b/apps/web/ee/components/projects/settings/intake/feature-children.tsx index 5c9228e9e7..9f1020269f 100644 --- a/apps/web/ee/components/projects/settings/intake/feature-children.tsx +++ b/apps/web/ee/components/projects/settings/intake/feature-children.tsx @@ -14,7 +14,10 @@ type Props = { currentProjectDetails: IProject; workspaceSlug: string; }; -export const IntakeFeatureChildren = observer(({ currentProjectDetails, workspaceSlug }: Props) => { +export const IntakeFeatureChildren = observer(function IntakeFeatureChildren({ + currentProjectDetails, + workspaceSlug, +}: Props) { const isEmailEnabled = useFlag(workspaceSlug?.toString(), E_FEATURE_FLAGS.INTAKE_EMAIL); const isFormEnabled = useFlag(workspaceSlug?.toString(), E_FEATURE_FLAGS.INTAKE_FORM); diff --git a/apps/web/ee/components/projects/settings/intake/forms-root.tsx b/apps/web/ee/components/projects/settings/intake/forms-root.tsx index 7e2439f7b5..e4a97948b8 100644 --- a/apps/web/ee/components/projects/settings/intake/forms-root.tsx +++ b/apps/web/ee/components/projects/settings/intake/forms-root.tsx @@ -21,7 +21,7 @@ type Props = { isToolTip?: boolean; }; -export const IntakeFormsRoot: React.FC = (props: Props) => { +export function IntakeFormsRoot(props: Props) { // props const { workspaceSlug, @@ -139,7 +139,7 @@ export const IntakeFormsRoot: React.FC = (props: Props) => { className="text-custom-text-400 w-[16px] cursor-pointer" onClick={() => copyToClipboard()} /> - +
    @@ -182,7 +182,10 @@ export const IntakeFormsRoot: React.FC = (props: Props) => { ) : ( - + )} @@ -198,4 +201,4 @@ export const IntakeFormsRoot: React.FC = (props: Props) => { ); -}; +} diff --git a/apps/web/ee/components/projects/settings/intake/header/quick-actions.tsx b/apps/web/ee/components/projects/settings/intake/header/quick-actions.tsx index c905a725ec..1f1ba9c6f9 100644 --- a/apps/web/ee/components/projects/settings/intake/header/quick-actions.tsx +++ b/apps/web/ee/components/projects/settings/intake/header/quick-actions.tsx @@ -7,7 +7,7 @@ type Props = { projectId: string; }; -export const IntakeHeaderQuickActions = (props: Props) => { +export function IntakeHeaderQuickActions(props: Props) { const { workspaceSlug, projectId } = props; const handleCopyLink = () => { @@ -45,4 +45,4 @@ export const IntakeHeaderQuickActions = (props: Props) => { {modals} ); -}; +} diff --git a/apps/web/ee/components/projects/settings/intake/header/root.tsx b/apps/web/ee/components/projects/settings/intake/header/root.tsx index 78d32445d9..852c49118b 100644 --- a/apps/web/ee/components/projects/settings/intake/header/root.tsx +++ b/apps/web/ee/components/projects/settings/intake/header/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -26,7 +24,7 @@ import { useFlag } from "@/plane-web/hooks/store"; import IntakeTooltip from "../intake-tooltip"; import { IntakeHeaderQuickActions } from "./quick-actions"; -export const ProjectInboxHeader: FC = observer(() => { +export const ProjectInboxHeader = observer(function ProjectInboxHeader() { // states const [createIssueModal, setCreateIssueModal] = useState(false); // router diff --git a/apps/web/ee/components/projects/settings/intake/intake-responsibility.tsx b/apps/web/ee/components/projects/settings/intake/intake-responsibility.tsx index 4cd8f9aca7..0147cc20a0 100644 --- a/apps/web/ee/components/projects/settings/intake/intake-responsibility.tsx +++ b/apps/web/ee/components/projects/settings/intake/intake-responsibility.tsx @@ -23,7 +23,7 @@ type Props = { featureList: TIntakeResponsibilityList; }; -const IntakeResponsibility = observer((props: Props) => { +const IntakeResponsibility = observer(function IntakeResponsibility(props: Props) { const { projectId, featureList } = props; const { workspaceSlug } = useParams(); // hooks diff --git a/apps/web/ee/components/projects/settings/intake/intake-sub-features-upgrade.tsx b/apps/web/ee/components/projects/settings/intake/intake-sub-features-upgrade.tsx index 88696b22cb..df562e9f46 100644 --- a/apps/web/ee/components/projects/settings/intake/intake-sub-features-upgrade.tsx +++ b/apps/web/ee/components/projects/settings/intake/intake-sub-features-upgrade.tsx @@ -27,7 +27,7 @@ type Props = { isTooltip?: boolean; className?: string; }; -const IntakeSubFeaturesUpgrade = observer((props: Props) => { +const IntakeSubFeaturesUpgrade = observer(function IntakeSubFeaturesUpgrade(props: Props) { const { projectId, showDefault = true, featureList, isTooltip = false, className = "" } = props; const { workspaceSlug } = useParams(); const { allowPermissions } = useUserPermissions(); diff --git a/apps/web/ee/components/projects/settings/intake/intake-sub-features.tsx b/apps/web/ee/components/projects/settings/intake/intake-sub-features.tsx index 56664db48d..72ff34d8b6 100644 --- a/apps/web/ee/components/projects/settings/intake/intake-sub-features.tsx +++ b/apps/web/ee/components/projects/settings/intake/intake-sub-features.tsx @@ -28,7 +28,7 @@ type Props = { featureList: TIntakeFeatureList; isTooltip?: boolean; }; -const IntakeSubFeatures = observer((props: Props) => { +const IntakeSubFeatures = observer(function IntakeSubFeatures(props: Props) { const { projectId, allowEdit = true, showDefault = true, featureList, isTooltip = false } = props; const { workspaceSlug } = useParams(); const [modalType, setModalType] = useState(""); @@ -194,7 +194,7 @@ const IntakeSubFeatures = observer((props: Props) => { onClick={() => copyToClipboard(publishLink)} /> {feature.hasHyperlink && ( - + )} diff --git a/apps/web/ee/components/projects/settings/intake/intake-tooltip.tsx b/apps/web/ee/components/projects/settings/intake/intake-tooltip.tsx index d17bc6e54c..b921dee0f4 100644 --- a/apps/web/ee/components/projects/settings/intake/intake-tooltip.tsx +++ b/apps/web/ee/components/projects/settings/intake/intake-tooltip.tsx @@ -12,7 +12,7 @@ import { useFlag } from "@/plane-web/hooks/store/use-flag"; import IntakeSubFeatures from "./intake-sub-features"; import IntakeSubFeaturesUpgrade from "./intake-sub-features-upgrade"; -const IntakeTooltip = observer(({ projectId }: { projectId: string }) => { +const IntakeTooltip = observer(function IntakeTooltip({ projectId }: { projectId: string }) { const { workspaceSlug } = useParams(); const isEmailEnabled = useFlag(workspaceSlug?.toString(), E_FEATURE_FLAGS.INTAKE_EMAIL); const isFormEnabled = useFlag(workspaceSlug?.toString(), E_FEATURE_FLAGS.INTAKE_FORM); diff --git a/apps/web/ee/components/projects/settings/intake/renew-modal.tsx b/apps/web/ee/components/projects/settings/intake/renew-modal.tsx index 6569190750..d2ab84b4ef 100644 --- a/apps/web/ee/components/projects/settings/intake/renew-modal.tsx +++ b/apps/web/ee/components/projects/settings/intake/renew-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState, Fragment } from "react"; import { Dialog, Transition } from "@headlessui/react"; import { Button } from "@plane/propel/button"; @@ -21,7 +19,7 @@ const displayProperties: { intake: "Form", }; -export const RenewModal: React.FC = (props) => { +export function RenewModal(props: Props) { const { workspaceSlug, projectId, isOpen, onClose, source, handleSubmit } = props; // states const [isLoading, setIsLoading] = useState(false); @@ -103,4 +101,4 @@ export const RenewModal: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/create-update-form.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/create-update-form.tsx index 85629e097a..b3ffdf89eb 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/create-update-form.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/create-update-form.tsx @@ -31,7 +31,7 @@ const sanitizeTypeFormData = (formData: Partial): Partial = observer((props: Props) => { +export const TypeFormCreateUpdateRoot = observer(function TypeFormCreateUpdateRoot(props: Props) { //router const { workspaceSlug, projectId } = useParams(); // props diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/form-link.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/form-link.tsx index 9f662bc677..6ed01cce3b 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/form-link.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/form-link.tsx @@ -10,7 +10,7 @@ type Props = { anchor: string; handleRenew: () => void; }; -export const IntakeFormLink: React.FC = observer((props: Props) => { +export const IntakeFormLink = observer(function IntakeFormLink(props: Props) { const { anchor, handleRenew } = props; const copyToClipboard = (text: string) => { @@ -35,7 +35,7 @@ export const IntakeFormLink: React.FC = observer((props: Props) => { > {publishLink} copyToClipboard(publishLink)} /> - + diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/form-list-item.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/form-list-item.tsx index d45fd6ce93..d6d42243e5 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/form-list-item.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/form-list-item.tsx @@ -18,7 +18,7 @@ type Props = { projectId: string; workspaceSlug: string; }; -export const TypeFormListItem: React.FC = observer((props: Props) => { +export const TypeFormListItem = observer(function TypeFormListItem(props: Props) { // props const { formId, projectId, workspaceSlug } = props; // states diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/form-preview-modal.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/form-preview-modal.tsx index 72d58fca27..b39ede75c9 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/form-preview-modal.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/form-preview-modal.tsx @@ -16,7 +16,7 @@ type Props = { selectedFields: string[]; }; -export const IntakeFormPreviewModal = observer((props: Props) => { +export const IntakeFormPreviewModal = observer(function IntakeFormPreviewModal(props: Props) { const { isOpen, onClose, projectId, typeId, formTitle, selectedFields } = props; // hooks diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/properties-dropdown.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/properties-dropdown.tsx index f31020a04e..18aee5b692 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/properties-dropdown.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/properties-dropdown.tsx @@ -14,7 +14,7 @@ type Props = { workItemType: IIssueType; selectedFields?: string[]; }; -export const TypePropertiesDropdown: React.FC = observer((props: Props) => { +export const TypePropertiesDropdown = observer(function TypePropertiesDropdown(props: Props) { const { workItemType, selectedFields = [], onSelect } = props; // Filter out RELATION type properties for intake forms diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/properties-list-item.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/properties-list-item.tsx index d0245eecac..d99dd2bade 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/properties-list-item.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/properties-list-item.tsx @@ -10,7 +10,7 @@ type Props = { propertyId: string; handleRemove: () => void; }; -export const TypeFormPropertiesListItem: React.FC = observer((props: Props) => { +export const TypeFormPropertiesListItem = observer(function TypeFormPropertiesListItem(props: Props) { const { typeId, propertyId, handleRemove } = props; const property = useIssueProperty(typeId, propertyId); diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/root.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/root.tsx index 47eb68fe91..05f4526945 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/root.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/root.tsx @@ -11,7 +11,7 @@ import { TypeFormCreateUpdateRoot } from "./create-update-form"; import { TypeFormListItem } from "./form-list-item"; import { SelectTypesModal } from "./select-types-modal"; -export const TypeFormsRoot = () => { +export function TypeFormsRoot() { // router const { workspaceSlug, projectId } = useParams(); @@ -103,4 +103,4 @@ export const TypeFormsRoot = () => { /> ); -}; +} diff --git a/apps/web/ee/components/projects/settings/intake/type-forms/select-types-modal.tsx b/apps/web/ee/components/projects/settings/intake/type-forms/select-types-modal.tsx index c6676e5271..c280141c38 100644 --- a/apps/web/ee/components/projects/settings/intake/type-forms/select-types-modal.tsx +++ b/apps/web/ee/components/projects/settings/intake/type-forms/select-types-modal.tsx @@ -15,7 +15,7 @@ type Props = { onSelect: (typeId: string) => void; }; -export const SelectTypesModal = observer((props: Props) => { +export const SelectTypesModal = observer(function SelectTypesModal(props: Props) { const { isOpen, onClose, onSelect } = props; // router const { projectId } = useParams(); diff --git a/apps/web/ee/components/projects/teamspaces/link-teamspace-modal.tsx b/apps/web/ee/components/projects/teamspaces/link-teamspace-modal.tsx index 86e1570164..7f6a0c09de 100644 --- a/apps/web/ee/components/projects/teamspaces/link-teamspace-modal.tsx +++ b/apps/web/ee/components/projects/teamspaces/link-teamspace-modal.tsx @@ -31,7 +31,7 @@ type EmptyStateProps = { }; // TODO: Need to remove this once the new empty state component is merged -const EmptyState = (props: EmptyStateProps) => { +function EmptyState(props: EmptyStateProps) { const { assetPath, title, description } = props; return (
    @@ -40,9 +40,9 @@ const EmptyState = (props: EmptyStateProps) => {

    {description}

    ); -}; +} -export const LinkTeamspaceToProjectModal: React.FC = observer((props) => { +export const LinkTeamspaceToProjectModal = observer(function LinkTeamspaceToProjectModal(props: Props) { const { isOpen, projectId, onClose, onSubmit } = props; // states const [searchTerm, setSearchTerm] = useState(""); diff --git a/apps/web/ee/components/projects/teamspaces/list-loader.tsx b/apps/web/ee/components/projects/teamspaces/list-loader.tsx index 808bb5b9bd..a6608cf8fb 100644 --- a/apps/web/ee/components/projects/teamspaces/list-loader.tsx +++ b/apps/web/ee/components/projects/teamspaces/list-loader.tsx @@ -1,20 +1,22 @@ import { range } from "lodash-es"; -export const ProjectTeamspaceListLoader = () => ( -
    - {range(3).map((i) => ( -
    -
    - - +export function ProjectTeamspaceListLoader() { + return ( +
    + {range(3).map((i) => ( +
    +
    + + +
    +
    + {range(3).map((j) => ( + + ))} +
    +
    -
    - {range(3).map((j) => ( - - ))} -
    - -
    - ))} -
    -); + ))} +
    + ); +} diff --git a/apps/web/ee/components/projects/teamspaces/teamspace-list-item.tsx b/apps/web/ee/components/projects/teamspaces/teamspace-list-item.tsx index 0d34c4d52e..83d242c008 100644 --- a/apps/web/ee/components/projects/teamspaces/teamspace-list-item.tsx +++ b/apps/web/ee/components/projects/teamspaces/teamspace-list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useMemo, useState } from "react"; import { observer } from "mobx-react"; import { CircleMinus } from "lucide-react"; @@ -26,7 +24,7 @@ type Props = { teamspaceIds: string[]; }; -export const ProjectTeamspaceListItem: React.FC = observer((props) => { +export const ProjectTeamspaceListItem = observer(function ProjectTeamspaceListItem(props: Props) { const { workspaceSlug, projectId, teamspaceIds } = props; // states const [selectedTeamspaceIdToRemove, setSelectedTeamspaceIdToRemove] = useState(null); diff --git a/apps/web/ee/components/projects/teamspaces/teamspace-list.tsx b/apps/web/ee/components/projects/teamspaces/teamspace-list.tsx index e5a61c2483..ac7d6f285a 100644 --- a/apps/web/ee/components/projects/teamspaces/teamspace-list.tsx +++ b/apps/web/ee/components/projects/teamspaces/teamspace-list.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { Search } from "lucide-react"; @@ -21,7 +19,7 @@ import { LinkTeamspaceToProjectModal } from "./link-teamspace-modal"; import { ProjectTeamspaceListLoader } from "./list-loader"; import { ProjectTeamspaceListItem } from "./teamspace-list-item"; -export const ProjectTeamspaceList: React.FC = observer((props) => { +export const ProjectTeamspaceList = observer(function ProjectTeamspaceList(props: TProjectTeamspaceList) { // props const { workspaceSlug, projectId } = props; // states diff --git a/apps/web/ee/components/recurring-work-items/settings/activity/activity-helpers.tsx b/apps/web/ee/components/recurring-work-items/settings/activity/activity-helpers.tsx index afe6cee482..87168be85c 100644 --- a/apps/web/ee/components/recurring-work-items/settings/activity/activity-helpers.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/activity/activity-helpers.tsx @@ -48,7 +48,7 @@ type TWorkItemTypeDetail = { className?: string; }; -const WorkItemTypeDetail: FC = observer((props) => { +const WorkItemTypeDetail = observer(function WorkItemTypeDetail(props: TWorkItemTypeDetail) { const { name, id, className = "" } = props; // store hooks const workItemTypeDetail = useIssueType(id); diff --git a/apps/web/ee/components/recurring-work-items/settings/activity/list-item.tsx b/apps/web/ee/components/recurring-work-items/settings/activity/list-item.tsx index ab0340cd81..4db5281c68 100644 --- a/apps/web/ee/components/recurring-work-items/settings/activity/list-item.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/activity/list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -15,7 +13,9 @@ type TRecurringWorkItemActivityItemProps = { ends: "top" | "bottom" | undefined; }; -export const RecurringWorkItemActivityItem = observer((props: TRecurringWorkItemActivityItemProps) => { +export const RecurringWorkItemActivityItem = observer(function RecurringWorkItemActivityItem( + props: TRecurringWorkItemActivityItemProps +) { const { activity, ends } = props; // return if activity details are not available if (!activity) return <>; diff --git a/apps/web/ee/components/recurring-work-items/settings/activity/root.tsx b/apps/web/ee/components/recurring-work-items/settings/activity/root.tsx index 04cc46b36a..a8dcfea485 100644 --- a/apps/web/ee/components/recurring-work-items/settings/activity/root.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/activity/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,9 @@ type TRecurringWorkItemActivityRootProps = { workspaceSlug: string; }; -export const RecurringWorkItemActivityRoot: FC = observer((props) => { +export const RecurringWorkItemActivityRoot = observer(function RecurringWorkItemActivityRoot( + props: TRecurringWorkItemActivityRootProps +) { const { projectId, recurringWorkItemId, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/recurring-work-items/settings/create-button.tsx b/apps/web/ee/components/recurring-work-items/settings/create-button.tsx index 93c3463849..c2393fae39 100644 --- a/apps/web/ee/components/recurring-work-items/settings/create-button.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/create-button.tsx @@ -18,7 +18,9 @@ type TCreateRecurringWorkItemsButtonProps = { buttonSize?: TButtonSizes; }; -export const CreateRecurringWorkItemsButton = observer((props: TCreateRecurringWorkItemsButtonProps) => { +export const CreateRecurringWorkItemsButton = observer(function CreateRecurringWorkItemsButton( + props: TCreateRecurringWorkItemsButtonProps +) { const { workspaceSlug, projectId, buttonI18nLabel, buttonSize } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/recurring-work-items/settings/create-update/form.tsx b/apps/web/ee/components/recurring-work-items/settings/create-update/form.tsx index 887af54a3b..e5a95d7527 100644 --- a/apps/web/ee/components/recurring-work-items/settings/create-update/form.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/create-update/form.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { merge } from "lodash-es"; import { observer } from "mobx-react"; @@ -63,248 +61,243 @@ const DEFAULT_RECURRING_WORK_ITEM_FORM_VALUES: Partial = workitem_blueprint: DEFAULT_WORK_ITEM_BLUEPRINT_FORM_VALUES, }; -export const RecurringWorkItemFormRoot: React.FC = observer( - (props: TRecurringWorkItemFormRootProps) => { - const { - handleFormCancel, - handleFormSubmit, - handleRecurringWorkItemInvalidIdsChange, - operation, - preloadedData, - recurringWorkItemInvalidIds, - workspaceSlug, - } = props; - const ref = useRef(null); - // router - const router = useAppRouter(); - // ref - const isDirtyRef = useRef(false); - // state - const [bubbledHref, setBubbledHref] = useState(null); - const [isDiscardModalOpen, setIsDiscardModalOpen] = useState(false); - // plane hooks - const { t } = useTranslation(); - // store hooks - const { allowPermissions } = useUserPermissions(); - const { getProjectDefaultStateId } = useProjectState(); - const { getProjectDefaultWorkItemTypeId } = useIssueTypes(); - const { getProjectById, joinedProjectIds } = useProject(); - // form state - const defaultValueForReset = useMemo( - () => - preloadedData - ? merge({}, DEFAULT_RECURRING_WORK_ITEM_FORM_VALUES, preloadedData) - : DEFAULT_RECURRING_WORK_ITEM_FORM_VALUES, - [preloadedData] - ); - const methods = useForm({ - defaultValues: defaultValueForReset, - }); - const { - control, - formState: { isSubmitting, isDirty, errors }, - handleSubmit, - reset, - watch, - } = methods; - // derived values - const projectId = watch("workitem_blueprint.project_id"); - const hasProjectAdminPermission = - !!projectId && - allowPermissions([EUserProjectRoles.ADMIN], EUserPermissionsLevel.PROJECT, workspaceSlug, projectId); - const allowLabelCreation = hasProjectAdminPermission; - const minDate = getDate(watch("start_at")); - minDate?.setDate(minDate.getDate()); - const maxDate = getDate(watch("end_at")); - maxDate?.setDate(maxDate.getDate()); +export const RecurringWorkItemFormRoot = observer(function RecurringWorkItemFormRoot( + props: TRecurringWorkItemFormRootProps +) { + const { + handleFormCancel, + handleFormSubmit, + handleRecurringWorkItemInvalidIdsChange, + operation, + preloadedData, + recurringWorkItemInvalidIds, + workspaceSlug, + } = props; + const ref = useRef(null); + // router + const router = useAppRouter(); + // ref + const isDirtyRef = useRef(false); + // state + const [bubbledHref, setBubbledHref] = useState(null); + const [isDiscardModalOpen, setIsDiscardModalOpen] = useState(false); + // plane hooks + const { t } = useTranslation(); + // store hooks + const { allowPermissions } = useUserPermissions(); + const { getProjectDefaultStateId } = useProjectState(); + const { getProjectDefaultWorkItemTypeId } = useIssueTypes(); + const { getProjectById, joinedProjectIds } = useProject(); + // form state + const defaultValueForReset = useMemo( + () => + preloadedData + ? merge({}, DEFAULT_RECURRING_WORK_ITEM_FORM_VALUES, preloadedData) + : DEFAULT_RECURRING_WORK_ITEM_FORM_VALUES, + [preloadedData] + ); + const methods = useForm({ + defaultValues: defaultValueForReset, + }); + const { + control, + formState: { isSubmitting, isDirty, errors }, + handleSubmit, + reset, + watch, + } = methods; + // derived values + const projectId = watch("workitem_blueprint.project_id"); + const hasProjectAdminPermission = + !!projectId && allowPermissions([EUserProjectRoles.ADMIN], EUserPermissionsLevel.PROJECT, workspaceSlug, projectId); + const allowLabelCreation = hasProjectAdminPermission; + const minDate = getDate(watch("start_at")); + minDate?.setDate(minDate.getDate()); + const maxDate = getDate(watch("end_at")); + maxDate?.setDate(maxDate.getDate()); - const onSubmit = async (data: TRecurringWorkItemForm) => { - await handleFormSubmit({ data }); - }; + const onSubmit = async (data: TRecurringWorkItemForm) => { + await handleFormSubmit({ data }); + }; - usePreventOutsideClick( - ref, - (anchorElement: HTMLAnchorElement | null) => { - if (!anchorElement || !anchorElement.href) return; + usePreventOutsideClick( + ref, + (anchorElement: HTMLAnchorElement | null) => { + if (!anchorElement || !anchorElement.href) return; - // Extract relative path instead of absolute URL - const relativePath = anchorElement.pathname + anchorElement.search + anchorElement.hash; + // Extract relative path instead of absolute URL + const relativePath = anchorElement.pathname + anchorElement.search + anchorElement.hash; - if (isDirtyRef.current) { - setIsDiscardModalOpen(true); - setBubbledHref(relativePath); - } else { - router.push(relativePath); - } - }, - ["discard-modal-button"] - ); + if (isDirtyRef.current) { + setIsDiscardModalOpen(true); + setBubbledHref(relativePath); + } else { + router.push(relativePath); + } + }, + ["discard-modal-button"] + ); - useEffect(() => { - if (isDirtyRef.current !== isDirty) isDirtyRef.current = isDirty; - }, [isDirty]); + useEffect(() => { + if (isDirtyRef.current !== isDirty) isDirtyRef.current = isDirty; + }, [isDirty]); - // Reset the form values when the projectId changes, apart from common fields - const handleProjectChange = useCallback( - (projectId: string) => { - const recurringWorkItemData = watch(); - // Get default state id and issue type id for the project - const defaultStateId = getProjectDefaultStateId(projectId); - const defaultIssueTypeId = getProjectDefaultWorkItemTypeId(projectId); + // Reset the form values when the projectId changes, apart from common fields + const handleProjectChange = useCallback( + (projectId: string) => { + const recurringWorkItemData = watch(); + // Get default state id and issue type id for the project + const defaultStateId = getProjectDefaultStateId(projectId); + const defaultIssueTypeId = getProjectDefaultWorkItemTypeId(projectId); - reset({ - ...recurringWorkItemData, - workitem_blueprint: { - ...defaultValueForReset.workitem_blueprint, - project_id: projectId, - name: recurringWorkItemData.workitem_blueprint.name, - description_html: recurringWorkItemData.workitem_blueprint.description_html, - state_id: defaultStateId, - type_id: defaultIssueTypeId, - }, - }); - }, - [watch, getProjectDefaultStateId, getProjectDefaultWorkItemTypeId, reset, defaultValueForReset] - ); + reset({ + ...recurringWorkItemData, + workitem_blueprint: { + ...defaultValueForReset.workitem_blueprint, + project_id: projectId, + name: recurringWorkItemData.workitem_blueprint.name, + description_html: recurringWorkItemData.workitem_blueprint.description_html, + state_id: defaultStateId, + type_id: defaultIssueTypeId, + }, + }); + }, + [watch, getProjectDefaultStateId, getProjectDefaultWorkItemTypeId, reset, defaultValueForReset] + ); - return ( - <> - setIsDiscardModalOpen(false)} - onDiscard={() => { - if (bubbledHref) { - router.push(bubbledHref); - } - }} - /> - -
    -
    -
    - {/* Work Item Properties Section */} -
    - {/* Work Item Properties */} - - allowProjectSelection={false} - allowLabelCreation={allowLabelCreation} - fieldPaths={{ - projectId: "workitem_blueprint.project_id", - issueTypeId: "workitem_blueprint.type_id", - name: "workitem_blueprint.name", - description: "workitem_blueprint.description_html", - state: "workitem_blueprint.state_id", - priority: "workitem_blueprint.priority", - assigneeIds: "workitem_blueprint.assignee_ids", - labelIds: "workitem_blueprint.label_ids", - moduleIds: "workitem_blueprint.module_ids", + return ( + <> + setIsDiscardModalOpen(false)} + onDiscard={() => { + if (bubbledHref) { + router.push(bubbledHref); + } + }} + /> + + +
    +
    + {/* Work Item Properties Section */} +
    + {/* Work Item Properties */} + + allowProjectSelection={false} + allowLabelCreation={allowLabelCreation} + fieldPaths={{ + projectId: "workitem_blueprint.project_id", + issueTypeId: "workitem_blueprint.type_id", + name: "workitem_blueprint.name", + description: "workitem_blueprint.description_html", + state: "workitem_blueprint.state_id", + priority: "workitem_blueprint.priority", + assigneeIds: "workitem_blueprint.assignee_ids", + labelIds: "workitem_blueprint.label_ids", + moduleIds: "workitem_blueprint.module_ids", + }} + getProjectById={getProjectById} + handleInvalidIdsChange={handleRecurringWorkItemInvalidIdsChange} + handleProjectChange={handleProjectChange} + inputTextSize="lg" + invalidIds={recurringWorkItemInvalidIds} + projectId={projectId} + projectIds={joinedProjectIds} + workspaceSlug={workspaceSlug} + usePropsForAdditionalData={false} + /> +
    + {/* Recurring Interval */} +
    +
    + {t("recurring_work_items.settings.form.interval.title")} +
    +
    + ( +
    + { + onChange(date ? renderFormattedPayloadDate(date) : null); + }} + buttonVariant="border-with-text" + minDate={new Date()} + maxDate={maxDate ?? undefined} + placeholder={t("start_date")} + buttonClassName={cn({ + [COMMON_ERROR_CLASS_NAME]: Boolean(errors.start_at), + })} + /> +
    + )} + /> + ( +
    + { + onChange(date ? renderFormattedPayloadDate(date) : null); + }} + buttonVariant="border-with-text" + minDate={minDate ?? undefined} + placeholder={t("end_date")} + /> +
    + )} + /> + ( +
    + +
    + )} />
    - {/* Recurring Interval */} -
    -
    - {t("recurring_work_items.settings.form.interval.title")} -
    -
    - ( -
    - { - onChange(date ? renderFormattedPayloadDate(date) : null); - }} - buttonVariant="border-with-text" - minDate={new Date()} - maxDate={maxDate ?? undefined} - placeholder={t("start_date")} - buttonClassName={cn({ - [COMMON_ERROR_CLASS_NAME]: Boolean(errors.start_at), - })} - /> -
    - )} - /> - ( -
    - { - onChange(date ? renderFormattedPayloadDate(date) : null); - }} - buttonVariant="border-with-text" - minDate={minDate ?? undefined} - placeholder={t("end_date")} - /> -
    - )} - /> - ( -
    - -
    - )} - /> -
    -
    - {/* Form Actions */} -
    - - -
    +
    + {/* Form Actions */} +
    + +
    - - - - ); - } -); +
    + +     + + ); +}); diff --git a/apps/web/ee/components/recurring-work-items/settings/create-update/interval-dropdown.tsx b/apps/web/ee/components/recurring-work-items/settings/create-update/interval-dropdown.tsx index 88bd314ae3..494c19a010 100644 --- a/apps/web/ee/components/recurring-work-items/settings/create-update/interval-dropdown.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/create-update/interval-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import { Fragment, useRef, useState } from "react"; import { usePopper } from "react-popper"; import { Check } from "lucide-react"; @@ -28,7 +26,7 @@ type TIntervalDropdownProps = { hasError?: boolean; }; -export const IntervalDropdown: React.FC = (props) => { +export function IntervalDropdown(props: TIntervalDropdownProps) { const { value, onChange, className = "", disabled = false, hasError = false } = props; // refs const dropdownRef = useRef(null); @@ -134,4 +132,4 @@ export const IntervalDropdown: React.FC = (props) => {
    ); -}; +} diff --git a/apps/web/ee/components/recurring-work-items/settings/create-update/loader.tsx b/apps/web/ee/components/recurring-work-items/settings/create-update/loader.tsx index 12cc51e152..812b8b9453 100644 --- a/apps/web/ee/components/recurring-work-items/settings/create-update/loader.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/create-update/loader.tsx @@ -1,32 +1,34 @@ import { Loader } from "@plane/ui"; -export const RecurringWorkItemLoader = () => ( - - -
    -
    -
    - - +export function RecurringWorkItemLoader() { + return ( + + +
    +
    +
    + + +
    + + + + + + + + + + + +
    - - - - - - - - - +
    - - - - -
    + - -); + ); +} diff --git a/apps/web/ee/components/recurring-work-items/settings/create-update/root.tsx b/apps/web/ee/components/recurring-work-items/settings/create-update/root.tsx index cdaacb2994..acc42042b8 100644 --- a/apps/web/ee/components/recurring-work-items/settings/create-update/root.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/create-update/root.tsx @@ -36,7 +36,9 @@ type TCreateUpdateRecurringWorkItemProps = { workspaceSlug: string; }; -export const CreateUpdateRecurringWorkItem = observer((props: TCreateUpdateRecurringWorkItemProps) => { +export const CreateUpdateRecurringWorkItem = observer(function CreateUpdateRecurringWorkItem( + props: TCreateUpdateRecurringWorkItemProps +) { const { projectId, recurringWorkItemId, workspaceSlug } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/recurring-work-items/settings/empty-state.tsx b/apps/web/ee/components/recurring-work-items/settings/empty-state.tsx index 1284f07dac..2b266149f0 100644 --- a/apps/web/ee/components/recurring-work-items/settings/empty-state.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/empty-state.tsx @@ -7,7 +7,9 @@ import { CreateRecurringWorkItemsButton } from "./create-button"; type TRecurringWorkItemsEmptyStateProps = { workspaceSlug: string; projectId: string }; -export const RecurringWorkItemsEmptyState = observer((props: TRecurringWorkItemsEmptyStateProps) => { +export const RecurringWorkItemsEmptyState = observer(function RecurringWorkItemsEmptyState( + props: TRecurringWorkItemsEmptyStateProps +) { // derived values const { t } = useTranslation(); diff --git a/apps/web/ee/components/recurring-work-items/settings/list/list-item.tsx b/apps/web/ee/components/recurring-work-items/settings/list/list-item.tsx index 68c3eefacf..2533e56371 100644 --- a/apps/web/ee/components/recurring-work-items/settings/list/list-item.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/list/list-item.tsx @@ -18,7 +18,9 @@ type RecurringWorkItemListItemProps = { workspaceSlug: string; }; -export const RecurringWorkItemListItem = observer((props: RecurringWorkItemListItemProps) => { +export const RecurringWorkItemListItem = observer(function RecurringWorkItemListItem( + props: RecurringWorkItemListItemProps +) { const { getRecurringWorkItemById, getRecurringWorkItemTypeById, recurringWorkItemId } = props; // refs const parentRef = useRef(null); diff --git a/apps/web/ee/components/recurring-work-items/settings/list/quick-actions.tsx b/apps/web/ee/components/recurring-work-items/settings/list/quick-actions.tsx index c722134ed0..ba1a4ad88b 100644 --- a/apps/web/ee/components/recurring-work-items/settings/list/quick-actions.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/list/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // icons @@ -24,7 +22,9 @@ type TRecurringWorkItemQuickActionsProps = { workspaceSlug: string; }; -export const RecurringWorkItemQuickActions = observer((props: TRecurringWorkItemQuickActionsProps) => { +export const RecurringWorkItemQuickActions = observer(function RecurringWorkItemQuickActions( + props: TRecurringWorkItemQuickActionsProps +) { const { deleteRecurringWorkItem, getRecurringWorkItemById, diff --git a/apps/web/ee/components/recurring-work-items/settings/list/root.tsx b/apps/web/ee/components/recurring-work-items/settings/list/root.tsx index e87738523c..9a2a0f6a72 100644 --- a/apps/web/ee/components/recurring-work-items/settings/list/root.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/list/root.tsx @@ -12,7 +12,9 @@ type TRecurringWorkItemsSettingsListProps = { workspaceSlug: string; }; -export const RecurringWorkItemsSettingsList = observer((props: TRecurringWorkItemsSettingsListProps) => { +export const RecurringWorkItemsSettingsList = observer(function RecurringWorkItemsSettingsList( + props: TRecurringWorkItemsSettingsListProps +) { const { projectId, workspaceSlug } = props; // store hooks const { diff --git a/apps/web/ee/components/recurring-work-items/settings/root.tsx b/apps/web/ee/components/recurring-work-items/settings/root.tsx index 3c9824c8b5..a8b043a0c8 100644 --- a/apps/web/ee/components/recurring-work-items/settings/root.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/root.tsx @@ -11,7 +11,9 @@ type TRecurringWorkItemsSettingsRootProps = { projectId: string; }; -export const RecurringWorkItemsSettingsRoot: FC = observer((props) => { +export const RecurringWorkItemsSettingsRoot = observer(function RecurringWorkItemsSettingsRoot( + props: TRecurringWorkItemsSettingsRootProps +) { const { workspaceSlug, projectId } = props; // store hooks const { isRecurringWorkItemsInitializing, isAnyRecurringWorkItemsAvailableForProject } = useRecurringWorkItems(); diff --git a/apps/web/ee/components/recurring-work-items/settings/upgrade.tsx b/apps/web/ee/components/recurring-work-items/settings/upgrade.tsx index 1f98b91105..9741e90df3 100644 --- a/apps/web/ee/components/recurring-work-items/settings/upgrade.tsx +++ b/apps/web/ee/components/recurring-work-items/settings/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -15,7 +13,7 @@ import RecurringWorkItemsUpgradeLight from "@/app/assets/empty-state/recurring-w // plane web imports import { UpgradeEmptyStateButton } from "@/plane-web/components/workspace/upgrade-empty-state-button"; -export const RecurringWorkItemsUpgrade: FC = observer(() => { +export const RecurringWorkItemsUpgrade = observer(function RecurringWorkItemsUpgrade() { // router const { workspaceSlug } = useParams(); // store hooks diff --git a/apps/web/ee/components/rich-filters/filter-value-input/boolean/root.tsx b/apps/web/ee/components/rich-filters/filter-value-input/boolean/root.tsx index d0616ce96e..b53f9dd3d7 100644 --- a/apps/web/ee/components/rich-filters/filter-value-input/boolean/root.tsx +++ b/apps/web/ee/components/rich-filters/filter-value-input/boolean/root.tsx @@ -35,33 +35,33 @@ const OPTIONS: IFilterOption[] = [ }, ]; -export const BooleanFilterValueInput = observer( -

    (props: TBooleanFilterValueInputProps

    ) => { - const { condition, onChange, isDisabled } = props; - // derived values - const formattedOptions = useMemo(() => getFormattedOptions(OPTIONS), []); +export const BooleanFilterValueInput = observer(function BooleanFilterValueInput

    ( + props: TBooleanFilterValueInputProps

    +) { + const { condition, onChange, isDisabled } = props; + // derived values + const formattedOptions = useMemo(() => getFormattedOptions(OPTIONS), []); - const handleSelectChange = (value: boolean) => { - if (value === condition.value) { - onChange(null); - } else { - onChange(value); + const handleSelectChange = (value: boolean) => { + if (value === condition.value) { + onChange(null); + } else { + onChange(value); + } + }; + + return ( + selectedValue={condition.value} options={OPTIONS} displayCount={1} /> } - }; - - return ( - selectedValue={condition.value} options={OPTIONS} displayCount={1} /> - } - defaultOpen={condition.value === null || condition.value === undefined} - /> - ); - } -); + defaultOpen={condition.value === null || condition.value === undefined} + /> + ); +}); diff --git a/apps/web/ee/components/rich-filters/filter-value-input/number/range.tsx b/apps/web/ee/components/rich-filters/filter-value-input/number/range.tsx index 23b99ea675..33854c8cbe 100644 --- a/apps/web/ee/components/rich-filters/filter-value-input/number/range.tsx +++ b/apps/web/ee/components/rich-filters/filter-value-input/number/range.tsx @@ -22,159 +22,159 @@ type TNumberRangeFilterValueInputProps

    = { onChange: (value: number[]) => void; }; -export const NumberRangeFilterValueInput = observer( -

    (props: TNumberRangeFilterValueInputProps

    ) => { - const { config, condition, onChange, isDisabled } = props; - // states - const [isOpen, setIsOpen] = useState(false); - const [fromValue, setFromValue] = useState(""); - const [toValue, setToValue] = useState(""); - // refs - const fromRef = useRef(null); - const toRef = useRef(null); - // derived values - const [fromRaw, toRaw] = toFilterArray(condition.value) ?? []; - const from = fromRaw !== null && fromRaw !== undefined && !isNaN(Number(fromRaw)) ? Number(fromRaw) : undefined; - const to = toRaw !== null && toRaw !== undefined && !isNaN(Number(toRaw)) ? Number(toRaw) : undefined; - const isIncomplete = from === undefined || to === undefined; +export const NumberRangeFilterValueInput = observer(function NumberRangeFilterValueInput

    ( + props: TNumberRangeFilterValueInputProps

    +) { + const { config, condition, onChange, isDisabled } = props; + // states + const [isOpen, setIsOpen] = useState(false); + const [fromValue, setFromValue] = useState(""); + const [toValue, setToValue] = useState(""); + // refs + const fromRef = useRef(null); + const toRef = useRef(null); + // derived values + const [fromRaw, toRaw] = toFilterArray(condition.value) ?? []; + const from = fromRaw !== null && fromRaw !== undefined && !isNaN(Number(fromRaw)) ? Number(fromRaw) : undefined; + const to = toRaw !== null && toRaw !== undefined && !isNaN(Number(toRaw)) ? Number(toRaw) : undefined; + const isIncomplete = from === undefined || to === undefined; - // Check if current input is valid for applying + // Check if current input is valid for applying + const fromNum = fromValue.trim() === "" ? undefined : parseFloat(fromValue.trim()); + const toNum = toValue.trim() === "" ? undefined : parseFloat(toValue.trim()); + const isApplyDisabled = + (fromNum === undefined && toNum === undefined) || + (fromNum !== undefined && isNaN(fromNum)) || + (toNum !== undefined && isNaN(toNum)) || + (fromNum !== undefined && toNum === undefined) || + (fromNum === undefined && toNum !== undefined); + + const displayText = from !== undefined && to !== undefined ? `${from} → ${to}` : undefined; + + useEffect(() => { + setFromValue(from !== undefined ? from.toString() : ""); + setToValue(to !== undefined ? to.toString() : ""); + }, [from, to]); + + useEffect(() => { + if (isIncomplete && !isDisabled) { + setIsOpen(true); + } + }, [isIncomplete, isDisabled]); + + useEffect(() => { + if (isOpen && fromRef.current) { + fromRef.current.focus(); + } + }, [isOpen]); + + const handleApply = () => { const fromNum = fromValue.trim() === "" ? undefined : parseFloat(fromValue.trim()); const toNum = toValue.trim() === "" ? undefined : parseFloat(toValue.trim()); - const isApplyDisabled = - (fromNum === undefined && toNum === undefined) || - (fromNum !== undefined && isNaN(fromNum)) || - (toNum !== undefined && isNaN(toNum)) || - (fromNum !== undefined && toNum === undefined) || - (fromNum === undefined && toNum !== undefined); - const displayText = from !== undefined && to !== undefined ? `${from} → ${to}` : undefined; + if (fromNum !== undefined && toNum !== undefined && !isNaN(fromNum) && !isNaN(toNum)) { + // Ensure from <= to + if (fromNum <= toNum) { + // Apply min/max constraints if configured + let finalFrom = fromNum; + let finalTo = toNum; - useEffect(() => { - setFromValue(from !== undefined ? from.toString() : ""); - setToValue(to !== undefined ? to.toString() : ""); - }, [from, to]); - - useEffect(() => { - if (isIncomplete && !isDisabled) { - setIsOpen(true); - } - }, [isIncomplete, isDisabled]); - - useEffect(() => { - if (isOpen && fromRef.current) { - fromRef.current.focus(); - } - }, [isOpen]); - - const handleApply = () => { - const fromNum = fromValue.trim() === "" ? undefined : parseFloat(fromValue.trim()); - const toNum = toValue.trim() === "" ? undefined : parseFloat(toValue.trim()); - - if (fromNum !== undefined && toNum !== undefined && !isNaN(fromNum) && !isNaN(toNum)) { - // Ensure from <= to - if (fromNum <= toNum) { - // Apply min/max constraints if configured - let finalFrom = fromNum; - let finalTo = toNum; - - if (config.min !== undefined) { - finalFrom = Math.max(finalFrom, config.min); - finalTo = Math.max(finalTo, config.min); - } - if (config.max !== undefined) { - finalFrom = Math.min(finalFrom, config.max); - finalTo = Math.min(finalTo, config.max); - } - - onChange([finalFrom, finalTo]); - setIsOpen(false); - } else { - // Swap values if from > to - const correctedFrom = Math.min(fromNum, toNum); - const correctedTo = Math.max(fromNum, toNum); - setFromValue(correctedFrom.toString()); - setToValue(correctedTo.toString()); + if (config.min !== undefined) { + finalFrom = Math.max(finalFrom, config.min); + finalTo = Math.max(finalTo, config.min); } - } else if (fromNum === undefined && toNum === undefined) { - onChange([]); + if (config.max !== undefined) { + finalFrom = Math.min(finalFrom, config.max); + finalTo = Math.min(finalTo, config.max); + } + + onChange([finalFrom, finalTo]); setIsOpen(false); + } else { + // Swap values if from > to + const correctedFrom = Math.min(fromNum, toNum); + const correctedTo = Math.max(fromNum, toNum); + setFromValue(correctedFrom.toString()); + setToValue(correctedTo.toString()); } - // If values are invalid or incomplete, don't close the popover - }; - - const handleCancel = () => { - setFromValue(from !== undefined ? from.toString() : ""); - setToValue(to !== undefined ? to.toString() : ""); + } else if (fromNum === undefined && toNum === undefined) { + onChange([]); setIsOpen(false); - }; + } + // If values are invalid or incomplete, don't close the popover + }; - const handleKeyDown = (e: React.KeyboardEvent, field: "from" | "to") => { - if (e.key === "Enter") { - e.preventDefault(); - if (field === "from" && toRef.current) { - toRef.current.focus(); - } else { - handleApply(); - } - } else if (e.key === "Escape") { - e.preventDefault(); - handleCancel(); - } else if (e.key === "Tab" && field === "from" && toRef.current) { - e.preventDefault(); + const handleCancel = () => { + setFromValue(from !== undefined ? from.toString() : ""); + setToValue(to !== undefined ? to.toString() : ""); + setIsOpen(false); + }; + + const handleKeyDown = (e: React.KeyboardEvent, field: "from" | "to") => { + if (e.key === "Enter") { + e.preventDefault(); + if (field === "from" && toRef.current) { toRef.current.focus(); + } else { + handleApply(); } - }; + } else if (e.key === "Escape") { + e.preventDefault(); + handleCancel(); + } else if (e.key === "Tab" && field === "from" && toRef.current) { + e.preventDefault(); + toRef.current.focus(); + } + }; - return ( - -

    - setFromValue(e.target.value)} - onKeyDown={(e) => handleKeyDown(e, "from")} - placeholder="From" - className="flex-1 min-w-0" - min={config.min} - max={config.max} - /> - → - setToValue(e.target.value)} - onKeyDown={(e) => handleKeyDown(e, "to")} - placeholder="To" - className="flex-1 min-w-0" - min={config.min} - max={config.max} - /> -
    - {(config.min !== undefined || config.max !== undefined) && ( - - {config.min !== undefined && config.max !== undefined - ? `Range: ${config.min} - ${config.max}` - : config.min !== undefined - ? `Minimum: ${config.min}` - : `Maximum: ${config.max}`} - - )} - - ); - } -); + return ( + +
    + setFromValue(e.target.value)} + onKeyDown={(e) => handleKeyDown(e, "from")} + placeholder="From" + className="flex-1 min-w-0" + min={config.min} + max={config.max} + /> + → + setToValue(e.target.value)} + onKeyDown={(e) => handleKeyDown(e, "to")} + placeholder="To" + className="flex-1 min-w-0" + min={config.min} + max={config.max} + /> +
    + {(config.min !== undefined || config.max !== undefined) && ( + + {config.min !== undefined && config.max !== undefined + ? `Range: ${config.min} - ${config.max}` + : config.min !== undefined + ? `Minimum: ${config.min}` + : `Maximum: ${config.max}`} + + )} +     + ); +}); diff --git a/apps/web/ee/components/rich-filters/filter-value-input/number/single.tsx b/apps/web/ee/components/rich-filters/filter-value-input/number/single.tsx index 7e376ff6bc..7923852a8b 100644 --- a/apps/web/ee/components/rich-filters/filter-value-input/number/single.tsx +++ b/apps/web/ee/components/rich-filters/filter-value-input/number/single.tsx @@ -25,7 +25,9 @@ type TNumberFilterValueInputProps

    = { onChange: (value: number | null) => void; }; -export const NumberFilterValueInput = observer(

    (props: TNumberFilterValueInputProps

    ) => { +export const NumberFilterValueInput = observer(function NumberFilterValueInput

    ( + props: TNumberFilterValueInputProps

    +) { const { config, condition, onChange, isDisabled } = props; // derived values const conditionValue = condition.value; diff --git a/apps/web/ee/components/rich-filters/filter-value-input/root.tsx b/apps/web/ee/components/rich-filters/filter-value-input/root.tsx index 04aa9432bd..4bb369e8ab 100644 --- a/apps/web/ee/components/rich-filters/filter-value-input/root.tsx +++ b/apps/web/ee/components/rich-filters/filter-value-input/root.tsx @@ -21,58 +21,59 @@ import { NumberRangeFilterValueInput } from "./number/range"; import { NumberFilterValueInput } from "./number/single"; import { TextFilterValueInput } from "./text/root"; -export const AdditionalFilterValueInput = observer( -

    (props: TFilterValueInputProps) => { - const { condition, filterFieldConfig, isDisabled = false, onChange } = props; +export const AdditionalFilterValueInput = observer(function AdditionalFilterValueInput< + P extends TFilterProperty, + V extends TFilterValue, +>(props: TFilterValueInputProps) { + const { condition, filterFieldConfig, isDisabled = false, onChange } = props; - // Boolean filter input - if (filterFieldConfig?.type === FILTER_FIELD_TYPE.BOOLEAN) { - return ( - - config={filterFieldConfig as TBooleanFilterFieldConfig} - condition={condition as TFilterConditionNodeForDisplay} - isDisabled={isDisabled} - onChange={(value) => onChange(value as SingleOrArray)} - /> - ); - } - - // Text filter input - if (filterFieldConfig?.type === FILTER_FIELD_TYPE.TEXT) { - return ( - - config={filterFieldConfig as TTextFilterFieldConfig} - condition={condition as TFilterConditionNodeForDisplay} - isDisabled={isDisabled} - onChange={(value) => onChange(value as SingleOrArray)} - /> - ); - } - - // Number filter input - if (filterFieldConfig?.type === FILTER_FIELD_TYPE.NUMBER) { - return ( - - config={filterFieldConfig as TNumberFilterFieldConfig} - condition={condition as TFilterConditionNodeForDisplay} - isDisabled={isDisabled} - onChange={(value) => onChange(value as SingleOrArray)} - /> - ); - } - - // Number range filter input - if (filterFieldConfig?.type === FILTER_FIELD_TYPE.NUMBER_RANGE) { - return ( - - config={filterFieldConfig as TNumberRangeFilterFieldConfig} - condition={condition as TFilterConditionNodeForDisplay} - isDisabled={isDisabled} - onChange={(value) => onChange(value as SingleOrArray)} - /> - ); - } - - return ; + // Boolean filter input + if (filterFieldConfig?.type === FILTER_FIELD_TYPE.BOOLEAN) { + return ( + + config={filterFieldConfig as TBooleanFilterFieldConfig} + condition={condition as TFilterConditionNodeForDisplay} + isDisabled={isDisabled} + onChange={(value) => onChange(value as SingleOrArray)} + /> + ); } -); + + // Text filter input + if (filterFieldConfig?.type === FILTER_FIELD_TYPE.TEXT) { + return ( + + config={filterFieldConfig as TTextFilterFieldConfig} + condition={condition as TFilterConditionNodeForDisplay} + isDisabled={isDisabled} + onChange={(value) => onChange(value as SingleOrArray)} + /> + ); + } + + // Number filter input + if (filterFieldConfig?.type === FILTER_FIELD_TYPE.NUMBER) { + return ( + + config={filterFieldConfig as TNumberFilterFieldConfig} + condition={condition as TFilterConditionNodeForDisplay} + isDisabled={isDisabled} + onChange={(value) => onChange(value as SingleOrArray)} + /> + ); + } + + // Number range filter input + if (filterFieldConfig?.type === FILTER_FIELD_TYPE.NUMBER_RANGE) { + return ( + + config={filterFieldConfig as TNumberRangeFilterFieldConfig} + condition={condition as TFilterConditionNodeForDisplay} + isDisabled={isDisabled} + onChange={(value) => onChange(value as SingleOrArray)} + /> + ); + } + + return ; +}); diff --git a/apps/web/ee/components/rich-filters/filter-value-input/shared/popover-filter-input.tsx b/apps/web/ee/components/rich-filters/filter-value-input/shared/popover-filter-input.tsx index 47ca88111a..e8af68e124 100644 --- a/apps/web/ee/components/rich-filters/filter-value-input/shared/popover-filter-input.tsx +++ b/apps/web/ee/components/rich-filters/filter-value-input/shared/popover-filter-input.tsx @@ -36,7 +36,7 @@ type TPopoverFilterInputProps = { placeholder?: string; }; -export const PopoverFilterInput = observer((props: TPopoverFilterInputProps) => { +export const PopoverFilterInput = observer(function PopoverFilterInput(props: TPopoverFilterInputProps) { const { buttonClassName, children, diff --git a/apps/web/ee/components/rich-filters/filter-value-input/text/root.tsx b/apps/web/ee/components/rich-filters/filter-value-input/text/root.tsx index 250ed4591b..08cd369cf7 100644 --- a/apps/web/ee/components/rich-filters/filter-value-input/text/root.tsx +++ b/apps/web/ee/components/rich-filters/filter-value-input/text/root.tsx @@ -24,7 +24,9 @@ type TTextFilterValueInputProps

    = { onChange: (value: string | null) => void; }; -export const TextFilterValueInput = observer(

    (props: TTextFilterValueInputProps

    ) => { +export const TextFilterValueInput = observer(function TextFilterValueInput

    ( + props: TTextFilterValueInputProps

    +) { const { config, condition, onChange, isDisabled } = props; // derived values const conditionValue = condition.value?.toString(); diff --git a/apps/web/ee/components/sidebar/app-switcher.tsx b/apps/web/ee/components/sidebar/app-switcher.tsx index 363a9ee338..e1cc9ab8bd 100644 --- a/apps/web/ee/components/sidebar/app-switcher.tsx +++ b/apps/web/ee/components/sidebar/app-switcher.tsx @@ -24,7 +24,7 @@ const APPS_LIST = [ }, ]; -export const SidebarAppSwitcher = observer(() => { +export const SidebarAppSwitcher = observer(function SidebarAppSwitcher() { // params const { workspaceSlug } = useParams(); const pathname = usePathname(); diff --git a/apps/web/ee/components/sidebar/project-navigation-root.tsx b/apps/web/ee/components/sidebar/project-navigation-root.tsx index 5e8fb1d7ed..2461d51b55 100644 --- a/apps/web/ee/components/sidebar/project-navigation-root.tsx +++ b/apps/web/ee/components/sidebar/project-navigation-root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ type TProjectItemsRootProps = { projectId: string; }; -export const ProjectNavigationRoot: FC = observer((props) => { +export const ProjectNavigationRoot = observer(function ProjectNavigationRoot(props: TProjectItemsRootProps) { const { workspaceSlug, projectId } = props; // store hooks const { getPartialProjectById } = useProject(); diff --git a/apps/web/ee/components/teamspaces/actions/delete-modal.tsx b/apps/web/ee/components/teamspaces/actions/delete-modal.tsx index 7b1242cee6..a898b3fda0 100644 --- a/apps/web/ee/components/teamspaces/actions/delete-modal.tsx +++ b/apps/web/ee/components/teamspaces/actions/delete-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useEffect, useState } from "react"; import { useParams } from "next/navigation"; import { AlertTriangle } from "lucide-react"; @@ -20,7 +18,7 @@ type DeleteTeamspaceModal = { onClose: () => void; }; -export const DeleteTeamspaceModal: React.FC = (props) => { +export function DeleteTeamspaceModal(props: DeleteTeamspaceModal) { const { isModalOpen, teamspaceId, onClose } = props; // router const router = useAppRouter(); @@ -147,4 +145,4 @@ export const DeleteTeamspaceModal: React.FC = (props) => { ); -}; +} diff --git a/apps/web/ee/components/teamspaces/actions/join-teamspace.tsx b/apps/web/ee/components/teamspaces/actions/join-teamspace.tsx index 7cab6c6f6a..ef38453e90 100644 --- a/apps/web/ee/components/teamspaces/actions/join-teamspace.tsx +++ b/apps/web/ee/components/teamspaces/actions/join-teamspace.tsx @@ -15,7 +15,7 @@ type TJoinTeamButtonProps = { trackerElement: string; }; -export const JoinTeamspaceButton = observer((props: TJoinTeamButtonProps) => { +export const JoinTeamspaceButton = observer(function JoinTeamspaceButton(props: TJoinTeamButtonProps) { const { teamspaceId, trackerElement } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/actions/members/button.tsx b/apps/web/ee/components/teamspaces/actions/members/button.tsx index 164002c43a..862f5ad9cb 100644 --- a/apps/web/ee/components/teamspaces/actions/members/button.tsx +++ b/apps/web/ee/components/teamspaces/actions/members/button.tsx @@ -13,37 +13,42 @@ type TAddTeamspaceMembersButtonProps = { isEditingAllowed: boolean; }; -const AddMembersIcon = observer( - (props: { containerSize: number; iconSize: number; containerClassName?: string; iconClassName?: string }) => { - const { containerSize, iconSize, containerClassName, iconClassName } = props; - return ( -

    + - -
    - ); - } -); + strokeWidth={2} + /> +
    + ); +}); -export const AddTeamspaceMembersButton = observer((props: TAddTeamspaceMembersButtonProps) => { +export const AddTeamspaceMembersButton = observer(function AddTeamspaceMembersButton( + props: TAddTeamspaceMembersButtonProps +) { const { teamspaceId, variant, isEditingAllowed } = props; // state const [isAddMembersModalOpen, setIsAddMembersModalOpen] = useState(false); diff --git a/apps/web/ee/components/teamspaces/actions/members/modal.tsx b/apps/web/ee/components/teamspaces/actions/members/modal.tsx index fc3576906d..11be61b60d 100644 --- a/apps/web/ee/components/teamspaces/actions/members/modal.tsx +++ b/apps/web/ee/components/teamspaces/actions/members/modal.tsx @@ -24,7 +24,7 @@ type Props = { handleModalClose: () => void; }; -export const AddTeamspaceMembersModal: FC = observer((props) => { +export const AddTeamspaceMembersModal = observer(function AddTeamspaceMembersModal(props: Props) { const { teamspaceId, isModalOpen, handleModalClose } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/actions/projects/button.tsx b/apps/web/ee/components/teamspaces/actions/projects/button.tsx index fd51fa5e3e..5d07b21915 100644 --- a/apps/web/ee/components/teamspaces/actions/projects/button.tsx +++ b/apps/web/ee/components/teamspaces/actions/projects/button.tsx @@ -33,7 +33,9 @@ type UpdateTeamspaceProjectsButtonProps = { const TOOLTIP_CONTENT = "Contact teamspace admin"; -export const UpdateTeamspaceProjectsButton = observer((props: UpdateTeamspaceProjectsButtonProps) => { +export const UpdateTeamspaceProjectsButton = observer(function UpdateTeamspaceProjectsButton( + props: UpdateTeamspaceProjectsButtonProps +) { const { variant = "default", teamspaceId, isEditingAllowed, trackerElement, renderButton } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/actions/projects/link-modal.tsx b/apps/web/ee/components/teamspaces/actions/projects/link-modal.tsx index 35141d2900..6474434c36 100644 --- a/apps/web/ee/components/teamspaces/actions/projects/link-modal.tsx +++ b/apps/web/ee/components/teamspaces/actions/projects/link-modal.tsx @@ -29,7 +29,7 @@ type Props = { onSubmit: (projectIds: string[]) => Promise; }; -export const LinkProjectModal: React.FC = observer((props) => { +export const LinkProjectModal = observer(function LinkProjectModal(props: Props) { const { isOpen, onClose, teamspaceId, selectedProjectIds: selectedProjectIdsProp, projectIds, onSubmit } = props; // states const [searchTerm, setSearchTerm] = useState(""); diff --git a/apps/web/ee/components/teamspaces/actions/properties.tsx b/apps/web/ee/components/teamspaces/actions/properties.tsx index 116ee7b42a..d26ef208a0 100644 --- a/apps/web/ee/components/teamspaces/actions/properties.tsx +++ b/apps/web/ee/components/teamspaces/actions/properties.tsx @@ -18,7 +18,7 @@ type TTeamPropertiesProps = { isEditingAllowed: boolean; }; -export const TeamProperties = observer((props: TTeamPropertiesProps) => { +export const TeamProperties = observer(function TeamProperties(props: TTeamPropertiesProps) { const { teamspaceId, isEditingAllowed } = props; // hooks const { getUserDetails } = useMember(); diff --git a/apps/web/ee/components/teamspaces/actions/quick-actions.tsx b/apps/web/ee/components/teamspaces/actions/quick-actions.tsx index 75f9a80998..35e3132c6e 100644 --- a/apps/web/ee/components/teamspaces/actions/quick-actions.tsx +++ b/apps/web/ee/components/teamspaces/actions/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { ExternalLink, Link2, Pencil, Trash2 } from "lucide-react"; @@ -25,7 +23,7 @@ type Props = { trackerElement: string; }; -export const TeamQuickActions: React.FC = observer((props) => { +export const TeamQuickActions = observer(function TeamQuickActions(props: Props) { const { teamspaceId, workspaceSlug, parentRef, isEditingAllowed, hideEdit, buttonClassName, trackerElement } = props; // states const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); diff --git a/apps/web/ee/components/teamspaces/create-update/form.tsx b/apps/web/ee/components/teamspaces/create-update/form.tsx index db0fd97bf8..a0c25116f6 100644 --- a/apps/web/ee/components/teamspaces/create-update/form.tsx +++ b/apps/web/ee/components/teamspaces/create-update/form.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FormEvent } from "react"; import { useMemo, useState } from "react"; import { observer } from "mobx-react"; @@ -33,7 +31,7 @@ type Props = { handleFormSubmit: () => Promise; }; -export const CreateOrUpdateTeamForm: React.FC = observer((props) => { +export const CreateOrUpdateTeamForm = observer(function CreateOrUpdateTeamForm(props: Props) { const { teamDetail, formData, isSubmitting, handleFormDataChange, handleModalClose, handleFormSubmit } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/create-update/modal.tsx b/apps/web/ee/components/teamspaces/create-update/modal.tsx index f7a2c62818..5132396c93 100644 --- a/apps/web/ee/components/teamspaces/create-update/modal.tsx +++ b/apps/web/ee/components/teamspaces/create-update/modal.tsx @@ -29,7 +29,9 @@ const defaultTeamData: Partial = { project_ids: [], }; -export const CreateOrUpdateTeamspaceModal: FC = observer((props) => { +export const CreateOrUpdateTeamspaceModal = observer(function CreateOrUpdateTeamspaceModal( + props: TCreateOrUpdateTeamspaceModalProps +) { const { teamspaceId, isModalOpen, handleModalClose } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/cycles/completed.tsx b/apps/web/ee/components/teamspaces/cycles/completed.tsx index d64283538d..52a3b8dedc 100644 --- a/apps/web/ee/components/teamspaces/cycles/completed.tsx +++ b/apps/web/ee/components/teamspaces/cycles/completed.tsx @@ -19,7 +19,7 @@ type TeamCompletedCyclesRootProps = { workspaceSlug: string; }; -export const TeamCompletedCyclesRoot = observer((props: TeamCompletedCyclesRootProps) => { +export const TeamCompletedCyclesRoot = observer(function TeamCompletedCyclesRoot(props: TeamCompletedCyclesRootProps) { const { teamspaceId, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/teamspaces/cycles/current.tsx b/apps/web/ee/components/teamspaces/cycles/current.tsx index 2449261889..8f80744cf8 100644 --- a/apps/web/ee/components/teamspaces/cycles/current.tsx +++ b/apps/web/ee/components/teamspaces/cycles/current.tsx @@ -20,7 +20,7 @@ type TTeamCurrentCyclesRoot = { workspaceSlug: string; }; -export const TeamCurrentCyclesRoot = observer((props: TTeamCurrentCyclesRoot) => { +export const TeamCurrentCyclesRoot = observer(function TeamCurrentCyclesRoot(props: TTeamCurrentCyclesRoot) { const { teamspaceId, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/teamspaces/cycles/upcoming.tsx b/apps/web/ee/components/teamspaces/cycles/upcoming.tsx index a8033fef58..67bb9d3d19 100644 --- a/apps/web/ee/components/teamspaces/cycles/upcoming.tsx +++ b/apps/web/ee/components/teamspaces/cycles/upcoming.tsx @@ -19,7 +19,7 @@ type TTeamUpcomingCyclesRoot = { workspaceSlug: string; }; -export const TeamUpcomingCyclesRoot = observer((props: TTeamUpcomingCyclesRoot) => { +export const TeamUpcomingCyclesRoot = observer(function TeamUpcomingCyclesRoot(props: TTeamUpcomingCyclesRoot) { const { teamspaceId, workspaceSlug } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/issues.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/issues.tsx index a73d31d8b8..f74a05c173 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/issues.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/issues.tsx @@ -16,7 +16,9 @@ type TeamspaceWorkItemListHeaderActionsProps = { isEditingAllowed: boolean; }; -export const TeamspaceWorkItemListHeaderActions = observer((props: TeamspaceWorkItemListHeaderActionsProps) => { +export const TeamspaceWorkItemListHeaderActions = observer(function TeamspaceWorkItemListHeaderActions( + props: TeamspaceWorkItemListHeaderActionsProps +) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/overview.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/overview.tsx index 009fb99581..7c51e98819 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/overview.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/overview.tsx @@ -16,7 +16,9 @@ type TeamOverviewHeaderActionsProps = { isEditingAllowed: boolean; }; -export const TeamOverviewHeaderActions = observer((props: TeamOverviewHeaderActionsProps) => { +export const TeamOverviewHeaderActions = observer(function TeamOverviewHeaderActions( + props: TeamOverviewHeaderActionsProps +) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/pages-list.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/pages-list.tsx index 1cb0ba4dd4..91c5c99d37 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/pages-list.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/pages-list.tsx @@ -17,7 +17,9 @@ type TeamspacePagesListHeaderActionsProps = { isEditingAllowed: boolean; }; -export const TeamspacePagesListHeaderActions = observer((props: TeamspacePagesListHeaderActionsProps) => { +export const TeamspacePagesListHeaderActions = observer(function TeamspacePagesListHeaderActions( + props: TeamspacePagesListHeaderActionsProps +) { const { teamspaceId, isEditingAllowed } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/projects-list.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/projects-list.tsx index b37705c230..2bb2258f11 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/projects-list.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/projects-list.tsx @@ -13,7 +13,9 @@ type TeamspaceProjectListHeaderActionsProps = { isEditingAllowed: boolean; }; -export const TeamspaceProjectListHeaderActions = observer((props: TeamspaceProjectListHeaderActionsProps) => { +export const TeamspaceProjectListHeaderActions = observer(function TeamspaceProjectListHeaderActions( + props: TeamspaceProjectListHeaderActionsProps +) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/root.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/root.tsx index 87283ea752..5595fa95d3 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/root.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -44,7 +42,7 @@ type TTeamspaceDetailHeaderProps = { selectedNavigationKey: ETeamspaceNavigationItem; }; -export const TeamspaceDetailHeader = observer((props: TTeamspaceDetailHeaderProps) => { +export const TeamspaceDetailHeader = observer(function TeamspaceDetailHeader(props: TTeamspaceDetailHeaderProps) { const { selectedNavigationKey } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/views-list.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/views-list.tsx index bd5ecd4010..0689377078 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/views-list.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/views-list.tsx @@ -15,7 +15,9 @@ type TeamspaceViewsListHeaderActionsProps = { isEditingAllowed: boolean; }; -export const TeamspaceViewsListHeaderActions = observer((props: TeamspaceViewsListHeaderActionsProps) => { +export const TeamspaceViewsListHeaderActions = observer(function TeamspaceViewsListHeaderActions( + props: TeamspaceViewsListHeaderActionsProps +) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/headers/detail-header/work-items.tsx b/apps/web/ee/components/teamspaces/headers/detail-header/work-items.tsx index 8d1cd0ee4b..4b8cc371c3 100644 --- a/apps/web/ee/components/teamspaces/headers/detail-header/work-items.tsx +++ b/apps/web/ee/components/teamspaces/headers/detail-header/work-items.tsx @@ -15,7 +15,9 @@ type TeamspaceProjectDetailHeaderActionsProps = { projectId: string; }; -export const TeamspaceProjectDetailHeaderActions = observer((props: TeamspaceProjectDetailHeaderActionsProps) => { +export const TeamspaceProjectDetailHeaderActions = observer(function TeamspaceProjectDetailHeaderActions( + props: TeamspaceProjectDetailHeaderActionsProps +) { const { teamspaceId, isEditingAllowed, projectId } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/headers/list-header/filters-dropdown/root.tsx b/apps/web/ee/components/teamspaces/headers/list-header/filters-dropdown/root.tsx index 62799d2b0a..e169f20076 100644 --- a/apps/web/ee/components/teamspaces/headers/list-header/filters-dropdown/root.tsx +++ b/apps/web/ee/components/teamspaces/headers/list-header/filters-dropdown/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState } from "react"; import { observer } from "mobx-react"; @@ -12,7 +10,7 @@ type TTeamListFiltersDropdown = { menuButton?: React.ReactNode; }; -export const TeamListFiltersDropdown: FC = observer((props) => { +export const TeamListFiltersDropdown = observer(function TeamListFiltersDropdown(props: TTeamListFiltersDropdown) { const { menuButton } = props; // states const [filtersSearchQuery, setFiltersSearchQuery] = useState(""); diff --git a/apps/web/ee/components/teamspaces/headers/list-header/root.tsx b/apps/web/ee/components/teamspaces/headers/list-header/root.tsx index 5bea4e25cb..62e9dbd7f0 100644 --- a/apps/web/ee/components/teamspaces/headers/list-header/root.tsx +++ b/apps/web/ee/components/teamspaces/headers/list-header/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; import { Plus } from "lucide-react"; @@ -20,7 +18,7 @@ import { useUserPermissions } from "@/hooks/store/user"; // plane web components import { TeamspacesListSearch } from "@/plane-web/components/teamspaces/headers/list-header/search-teamspaces"; -export const TeamspaceListItemHeader = observer(() => { +export const TeamspaceListItemHeader = observer(function TeamspaceListItemHeader() { const { workspaceSlug } = useParams(); // hooks const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/teamspaces/headers/list-header/search-teamspaces.tsx b/apps/web/ee/components/teamspaces/headers/list-header/search-teamspaces.tsx index 548742b462..aaa520558d 100644 --- a/apps/web/ee/components/teamspaces/headers/list-header/search-teamspaces.tsx +++ b/apps/web/ee/components/teamspaces/headers/list-header/search-teamspaces.tsx @@ -1,4 +1,3 @@ -"use client"; import type { FC } from "react"; import { useMemo, useRef, useState } from "react"; import { debounce } from "lodash-es"; @@ -10,7 +9,7 @@ import { cn } from "@plane/utils"; // plane web hooks import { useTeamspaceFilter } from "@/plane-web/hooks/store"; -export const TeamspacesListSearch: FC = observer(() => { +export const TeamspacesListSearch = observer(function TeamspacesListSearch() { // hooks const { searchQuery, updateSearchQuery } = useTeamspaceFilter(); // refs diff --git a/apps/web/ee/components/teamspaces/headers/list-header/teamspace-scope-dropdown.tsx b/apps/web/ee/components/teamspaces/headers/list-header/teamspace-scope-dropdown.tsx index d2ec00a3b6..f6ae3a8fce 100644 --- a/apps/web/ee/components/teamspaces/headers/list-header/teamspace-scope-dropdown.tsx +++ b/apps/web/ee/components/teamspaces/headers/list-header/teamspace-scope-dropdown.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { ChevronDownIcon } from "@plane/propel/icons"; @@ -10,7 +8,7 @@ import { TEAMSPACE_SCOPE_MAP } from "@/plane-web/constants/teamspace"; // plane web hooks import { useTeamspaceFilter, useTeamspaces } from "@/plane-web/hooks/store"; -export const TeamspaceScopeDropdown: FC = observer(() => { +export const TeamspaceScopeDropdown = observer(function TeamspaceScopeDropdown() { // hooks const { loader, currentScopeTeamSpaceIds, getScopeTeamSpaceIds } = useTeamspaces(); const { scope, updateScope } = useTeamspaceFilter(); @@ -18,26 +16,28 @@ export const TeamspaceScopeDropdown: FC = observer(() => { const selectedScopeCount = currentScopeTeamSpaceIds ? currentScopeTeamSpaceIds.length : null; const selectedScope = TEAMSPACE_SCOPE_MAP[scope] ?? undefined; - const DropdownLabel = () => ( - <> -
    -
    -
    {selectedScope.label}
    -
    - {selectedScopeCount} + function DropdownLabel() { + return ( + <> +
    +
    +
    {selectedScope.label}
    +
    + {selectedScopeCount} +
    +
    - -
    -
    - {selectedScope?.label} - -
    - - ); +
    + {selectedScope?.label} + +
    + + ); + } - const DropdownOptions = () => - (Object.values(TEAMSPACE_SCOPE_MAP) || []).map((scope) => ( + function DropdownOptions() { + return (Object.values(TEAMSPACE_SCOPE_MAP) || []).map((scope) => ( {
    )); + } return selectedScope && loader !== "init-loader" ? ( { +export const TeamHeaderFilters = observer(function TeamHeaderFilters(props: Props) { const { teamspaceId, workspaceSlug } = props; const { t } = useTranslation(); // store hooks diff --git a/apps/web/ee/components/teamspaces/list/loader.tsx b/apps/web/ee/components/teamspaces/list/loader.tsx index b76e6f7057..37584d5e97 100644 --- a/apps/web/ee/components/teamspaces/list/loader.tsx +++ b/apps/web/ee/components/teamspaces/list/loader.tsx @@ -1,31 +1,33 @@ -export const TeamsLoader = () => ( -
    -
    -
    - {[...Array(5)].map((i) => ( -
    -
    -
    -
    - - +export function TeamsLoader() { + return ( +
    +
    +
    + {[...Array(5)].map((i) => ( +
    +
    +
    +
    + + +
    +
    + +
    +
    +
    + + +
    -
    -
    -
    - - - -
    -
    -
    - ))} + ))} +
    -
    -); + ); +} diff --git a/apps/web/ee/components/teamspaces/list/root.tsx b/apps/web/ee/components/teamspaces/list/root.tsx index b071ef30d9..09646277f9 100644 --- a/apps/web/ee/components/teamspaces/list/root.tsx +++ b/apps/web/ee/components/teamspaces/list/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // plane imports @@ -10,7 +8,7 @@ import { useUserPermissions } from "@/hooks/store/user"; // plane web components import { TeamspacesList } from "@/plane-web/components/teamspaces/list/teamspaces-list"; -const TeamspaceListItemRoot = observer(() => { +const TeamspaceListItemRoot = observer(function TeamspaceListItemRoot() { // router const { workspaceSlug } = useParams(); // plane web hooks diff --git a/apps/web/ee/components/teamspaces/list/teamspace-list-item.tsx b/apps/web/ee/components/teamspaces/list/teamspace-list-item.tsx index 8e6c7e64ba..6fd7708877 100644 --- a/apps/web/ee/components/teamspaces/list/teamspace-list-item.tsx +++ b/apps/web/ee/components/teamspaces/list/teamspace-list-item.tsx @@ -21,7 +21,7 @@ type TeamspaceListItemProps = { isEditingAllowed: boolean; }; -export const TeamspaceListItem = observer((props: TeamspaceListItemProps) => { +export const TeamspaceListItem = observer(function TeamspaceListItem(props: TeamspaceListItemProps) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/list/teamspaces-list.tsx b/apps/web/ee/components/teamspaces/list/teamspaces-list.tsx index 8d23d22200..c2666bfafc 100644 --- a/apps/web/ee/components/teamspaces/list/teamspaces-list.tsx +++ b/apps/web/ee/components/teamspaces/list/teamspaces-list.tsx @@ -26,7 +26,7 @@ type TTeamspacesListProps = { isEditingAllowed: boolean; }; -export const TeamspacesList = observer((props: TTeamspacesListProps) => { +export const TeamspacesList = observer(function TeamspacesList(props: TTeamspacesListProps) { const { isEditingAllowed } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/teamspaces/overview/add-projects.tsx b/apps/web/ee/components/teamspaces/overview/add-projects.tsx index 57150911a7..aacf3a39db 100644 --- a/apps/web/ee/components/teamspaces/overview/add-projects.tsx +++ b/apps/web/ee/components/teamspaces/overview/add-projects.tsx @@ -9,7 +9,7 @@ type TAddProjectsToTeamProps = { isEditingAllowed: boolean; }; -export const AddProjectsToTeam = observer((props: TAddProjectsToTeamProps) => { +export const AddProjectsToTeam = observer(function AddProjectsToTeam(props: TAddProjectsToTeamProps) { const { isEditingAllowed } = props; // router const { teamspaceId } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/content.tsx b/apps/web/ee/components/teamspaces/overview/content.tsx index 8e58afd7c3..648d52a73f 100644 --- a/apps/web/ee/components/teamspaces/overview/content.tsx +++ b/apps/web/ee/components/teamspaces/overview/content.tsx @@ -16,7 +16,7 @@ type TTeamsOverviewContentProps = { isEditingAllowed: boolean; }; -export const TeamsOverviewContent = observer((props: TTeamsOverviewContentProps) => { +export const TeamsOverviewContent = observer(function TeamsOverviewContent(props: TTeamsOverviewContentProps) { const { teamspaceId, isEditingAllowed } = props; // hooks const { getTeamspaceById, isCurrentUserMemberOfTeamspace } = useTeamspaces(); diff --git a/apps/web/ee/components/teamspaces/overview/description-input.tsx b/apps/web/ee/components/teamspaces/overview/description-input.tsx index 43f430c9e5..db1e82f1e2 100644 --- a/apps/web/ee/components/teamspaces/overview/description-input.tsx +++ b/apps/web/ee/components/teamspaces/overview/description-input.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useCallback, useEffect, useRef, useState } from "react"; import { debounce } from "lodash-es"; @@ -29,7 +27,9 @@ export type TeamspaceDescriptionInputProps = { containerClassName?: string; }; -export const TeamspaceDescriptionInput: FC = observer((props) => { +export const TeamspaceDescriptionInput = observer(function TeamspaceDescriptionInput( + props: TeamspaceDescriptionInputProps +) { const { workspaceSlug, teamspaceId, disabled, initialValue, placeholder, containerClassName } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/teamspaces/overview/name-input.tsx b/apps/web/ee/components/teamspaces/overview/name-input.tsx index 55866ed995..9c3825dc7a 100644 --- a/apps/web/ee/components/teamspaces/overview/name-input.tsx +++ b/apps/web/ee/components/teamspaces/overview/name-input.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useState, useEffect, useCallback } from "react"; import { observer } from "mobx-react"; @@ -22,7 +20,7 @@ export type TeamNameInputProps = { containerClassName?: string; }; -export const TeamNameInput: FC = observer((props) => { +export const TeamNameInput = observer(function TeamNameInput(props: TeamNameInputProps) { const { disabled, value, workspaceSlug, teamspaceId, className, containerClassName } = props; // states const [name, setName] = useState(""); diff --git a/apps/web/ee/components/teamspaces/overview/progress/banner.tsx b/apps/web/ee/components/teamspaces/overview/progress/banner.tsx index 3adea69c78..814883077c 100644 --- a/apps/web/ee/components/teamspaces/overview/progress/banner.tsx +++ b/apps/web/ee/components/teamspaces/overview/progress/banner.tsx @@ -13,7 +13,7 @@ type TTeamspaceProgressBannerProps = { teamspaceId: string; }; -export const TeamspaceProgressBanner: React.FC = observer((props) => { +export const TeamspaceProgressBanner = observer(function TeamspaceProgressBanner(props: TTeamspaceProgressBannerProps) { const { teamspaceId } = props; // store hooks const { getTeamspaceEntitiesLoaderById } = useTeamspaces(); diff --git a/apps/web/ee/components/teamspaces/overview/progress/chart.tsx b/apps/web/ee/components/teamspaces/overview/progress/chart.tsx index 3b7888e072..087c1e9807 100644 --- a/apps/web/ee/components/teamspaces/overview/progress/chart.tsx +++ b/apps/web/ee/components/teamspaces/overview/progress/chart.tsx @@ -51,7 +51,7 @@ const progressXAxisOptions = Object.entries(TEAM_WORKLOAD_X_AXIS_LABEL_MAP).map( value, })); -export const TeamspaceProgressChart: React.FC = observer((props) => { +export const TeamspaceProgressChart = observer(function TeamspaceProgressChart(props: TTeamspaceProgressChartProps) { const { teamspaceId, data, xAxisKey, yAxisKey, handleXAxisKeyChange } = props; // store hooks const { getTeamspaceEntitiesLoaderById } = useTeamspaces(); @@ -67,7 +67,7 @@ export const TeamspaceProgressChart: React.FC = ob ...item, [xAxisKey]: item[xAxisKey] && typeof item[xAxisKey] === "string" - ? renderFormattedDateWithoutYear(item[xAxisKey] as string) + ? renderFormattedDateWithoutYear(item[xAxisKey]) : item[xAxisKey], })); } diff --git a/apps/web/ee/components/teamspaces/overview/progress/root.tsx b/apps/web/ee/components/teamspaces/overview/progress/root.tsx index 3494c67cdc..7772790ee9 100644 --- a/apps/web/ee/components/teamspaces/overview/progress/root.tsx +++ b/apps/web/ee/components/teamspaces/overview/progress/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -27,7 +25,7 @@ type Props = { teamspaceId: string; }; -export const TeamspaceProgressRoot: FC = observer((props) => { +export const TeamspaceProgressRoot = observer(function TeamspaceProgressRoot(props: Props) { const { teamspaceId } = props; // router const { workspaceSlug } = useParams(); @@ -64,7 +62,7 @@ export const TeamspaceProgressRoot: FC = observer((props) => { useSWR( workspaceSlug && teamspaceId ? ["teamspaceProgressChart", workspaceSlug, teamspaceId] : null, workspaceSlug && teamspaceId - ? () => fetchTeamspaceProgressChartDetails(workspaceSlug!.toString(), teamspaceId) + ? () => fetchTeamspaceProgressChartDetails(workspaceSlug.toString(), teamspaceId) : null, { revalidateIfStale: false, @@ -73,7 +71,7 @@ export const TeamspaceProgressRoot: FC = observer((props) => { ); useSWR( workspaceSlug && teamspaceId ? ["teamspaceProgressSummary", workspaceSlug, teamspaceId] : null, - workspaceSlug && teamspaceId ? () => fetchTeamspaceProgressSummary(workspaceSlug!.toString(), teamspaceId) : null, + workspaceSlug && teamspaceId ? () => fetchTeamspaceProgressSummary(workspaceSlug.toString(), teamspaceId) : null, { revalidateIfStale: false, revalidateOnFocus: false, @@ -100,7 +98,7 @@ export const TeamspaceProgressRoot: FC = observer((props) => { }; const handleTeamspaceProgressFilterChange = async (payload: Partial) => { - await updateTeamspaceProgressFilter(workspaceSlug!.toString(), teamspaceId, payload) + await updateTeamspaceProgressFilter(workspaceSlug.toString(), teamspaceId, payload) .then(() => { captureSuccess({ eventName: TEAMSPACE_ANALYTICS_TRACKER_EVENTS.PROGRESS_FILTER_UPDATED, diff --git a/apps/web/ee/components/teamspaces/overview/progress/summary.tsx b/apps/web/ee/components/teamspaces/overview/progress/summary.tsx index 440fff8c6b..28ce6d53d3 100644 --- a/apps/web/ee/components/teamspaces/overview/progress/summary.tsx +++ b/apps/web/ee/components/teamspaces/overview/progress/summary.tsx @@ -21,7 +21,7 @@ type TWorkloadDetailItemProps = { isLoading?: boolean; }; -const WorkloadDetailItem = (props: TWorkloadDetailItemProps) => { +function WorkloadDetailItem(props: TWorkloadDetailItemProps) { const { title, icon, value, containerClassName, titleClassName, valueClassName, isLoading } = props; return ( @@ -39,13 +39,15 @@ const WorkloadDetailItem = (props: TWorkloadDetailItemProps) => { )}
    ); -}; +} type TTeamspaceProgressSummaryProps = { teamspaceId: string; }; -export const TeamspaceProgressSummary: React.FC = observer((props) => { +export const TeamspaceProgressSummary = observer(function TeamspaceProgressSummary( + props: TTeamspaceProgressSummaryProps +) { const { teamspaceId } = props; // store hooks const { getTeamspaceEntitiesLoaderById } = useTeamspaces(); diff --git a/apps/web/ee/components/teamspaces/overview/properties.tsx b/apps/web/ee/components/teamspaces/overview/properties.tsx index 6ea3a56b9f..9e23ab0153 100644 --- a/apps/web/ee/components/teamspaces/overview/properties.tsx +++ b/apps/web/ee/components/teamspaces/overview/properties.tsx @@ -26,7 +26,7 @@ type TTeamsOverviewPropertiesProps = { isEditingAllowed: boolean; }; -export const TeamsOverviewProperties = observer((props: TTeamsOverviewPropertiesProps) => { +export const TeamsOverviewProperties = observer(function TeamsOverviewProperties(props: TTeamsOverviewPropertiesProps) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/quick-links.tsx b/apps/web/ee/components/teamspaces/overview/quick-links.tsx index e7a01bf0dd..323abe26d7 100644 --- a/apps/web/ee/components/teamspaces/overview/quick-links.tsx +++ b/apps/web/ee/components/teamspaces/overview/quick-links.tsx @@ -12,7 +12,7 @@ type TTeamQuickLink = { href: string; }; -export const TeamsOverviewQuickLinks = observer(() => { +export const TeamsOverviewQuickLinks = observer(function TeamsOverviewQuickLinks() { const { teamspaceId } = useParams(); // router const { workspaceSlug: routerWorkspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/relations/list-item.tsx b/apps/web/ee/components/teamspaces/overview/relations/list-item.tsx index 79c4058d04..1faa94fc83 100644 --- a/apps/web/ee/components/teamspaces/overview/relations/list-item.tsx +++ b/apps/web/ee/components/teamspaces/overview/relations/list-item.tsx @@ -24,7 +24,9 @@ type TTeamspaceRelationIssueListItemProps = { issue: TTeamspaceDependencyWorkItem; }; -export const TeamspaceRelationIssueListItem = observer((props: TTeamspaceRelationIssueListItemProps) => { +export const TeamspaceRelationIssueListItem = observer(function TeamspaceRelationIssueListItem( + props: TTeamspaceRelationIssueListItemProps +) { const { type, issue } = props; // router const { workspaceSlug: routerWorkspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/relations/list.tsx b/apps/web/ee/components/teamspaces/overview/relations/list.tsx index f8d61f899b..e4cbd95550 100644 --- a/apps/web/ee/components/teamspaces/overview/relations/list.tsx +++ b/apps/web/ee/components/teamspaces/overview/relations/list.tsx @@ -17,7 +17,9 @@ type TTeamspaceRelationIssueListProps = { type: ERelationType; }; -export const TeamspaceRelationIssueList = observer((props: TTeamspaceRelationIssueListProps) => { +export const TeamspaceRelationIssueList = observer(function TeamspaceRelationIssueList( + props: TTeamspaceRelationIssueListProps +) { const { teamspaceId, type } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/teamspaces/overview/relations/root.tsx b/apps/web/ee/components/teamspaces/overview/relations/root.tsx index b5857cc16c..cf1d63550f 100644 --- a/apps/web/ee/components/teamspaces/overview/relations/root.tsx +++ b/apps/web/ee/components/teamspaces/overview/relations/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { lazy, Suspense, useMemo, useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -14,15 +12,15 @@ import { useTeamspaceAnalytics } from "@/plane-web/hooks/store/teamspaces/use-te // local imports import { TeamspaceRelationIssueList } from "./list"; // dynamic imports -const IssuePeekOverview = lazy(() => - import("@/components/issues/peek-overview/root").then((module) => ({ default: module.IssuePeekOverview })) -); +const IssuePeekOverview = lazy(function IssuePeekOverview() { + return import("@/components/issues/peek-overview/root").then((module) => ({ default: module.IssuePeekOverview })); +}); type Props = { teamspaceId: string; }; -export const TeamspaceRelationsRoot: FC = observer((props) => { +export const TeamspaceRelationsRoot = observer(function TeamspaceRelationsRoot(props: Props) { const { teamspaceId } = props; // router const { workspaceSlug: routerWorkspaceSlug } = useParams(); @@ -38,7 +36,7 @@ export const TeamspaceRelationsRoot: FC = observer((props) => { // fetching teamspace relations useSWR( workspaceSlug && teamspaceId ? ["teamspaceRelations", workspaceSlug, teamspaceId] : null, - workspaceSlug && teamspaceId ? () => fetchTeamspaceRelations(workspaceSlug!.toString(), teamspaceId) : null, + workspaceSlug && teamspaceId ? () => fetchTeamspaceRelations(workspaceSlug.toString(), teamspaceId) : null, { revalidateIfStale: false, revalidateOnFocus: false, diff --git a/apps/web/ee/components/teamspaces/overview/root.tsx b/apps/web/ee/components/teamspaces/overview/root.tsx index 82b0c376bf..b1575faa49 100644 --- a/apps/web/ee/components/teamspaces/overview/root.tsx +++ b/apps/web/ee/components/teamspaces/overview/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // plane imports @@ -18,7 +16,7 @@ type TTeamsOverviewRootProps = { teamspaceId: string; }; -export const TeamsOverviewRoot = observer((props: TTeamsOverviewRootProps) => { +export const TeamsOverviewRoot = observer(function TeamsOverviewRoot(props: TTeamsOverviewRootProps) { const { teamspaceId } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/activity.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/activity.tsx index 635aa8c952..e64fb7cf10 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/activity.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/activity.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import { Loader as Spinner } from "lucide-react"; @@ -27,7 +25,7 @@ type TTeamspaceActivityItemProps = { ends: "top" | "bottom" | undefined; }; -export const TeamspaceActivityItem = observer((props: TTeamspaceActivityItemProps) => { +export const TeamspaceActivityItem = observer(function TeamspaceActivityItem(props: TTeamspaceActivityItemProps) { const { activity, ends } = props; // return if activity details are not available if (!activity) return <>; @@ -47,7 +45,9 @@ export const TeamspaceActivityItem = observer((props: TTeamspaceActivityItemProp return <>; }); -export const TeamsOverviewSidebarActivity: FC = observer((props) => { +export const TeamsOverviewSidebarActivity = observer(function TeamsOverviewSidebarActivity( + props: TTeamspaceActivityProps +) { const { teamspaceId } = props; // store hooks const { diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/comments.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/comments.tsx index 1a0a2118d9..bf16317a36 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/comments.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/comments.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -19,7 +17,9 @@ type TTeamSidebarCommentsRootProps = { isEditingAllowed?: boolean; }; -export const TeamsOverviewSidebarComments: FC = observer((props) => { +export const TeamsOverviewSidebarComments = observer(function TeamsOverviewSidebarComments( + props: TTeamSidebarCommentsRootProps +) { const { teamspaceId, isEditingAllowed = true } = props; // router const { workspaceSlug: routerWorkspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/members.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/members.tsx index 5c9a0d2a97..93e1afc36c 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/members.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/members.tsx @@ -24,7 +24,9 @@ export type TTeamsOverviewSidebarMembersProps = { isEditingAllowed: boolean; }; -export const TeamsOverviewSidebarMembers = observer((props: TTeamsOverviewSidebarMembersProps) => { +export const TeamsOverviewSidebarMembers = observer(function TeamsOverviewSidebarMembers( + props: TTeamsOverviewSidebarMembersProps +) { const { teamspaceId, isEditingAllowed } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/properties/list.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/properties/list.tsx index 65bfe16e9d..f306b9fe22 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/properties/list.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/properties/list.tsx @@ -3,11 +3,11 @@ import { ChevronRightIcon } from "@plane/propel/icons"; // types import type { TPropertyListItem } from "./root"; -export const TeamsPropertiesList = ({ children }: { children: React.ReactNode }) => ( -
    {children}
    -); +export function TeamsPropertiesList({ children }: { children: React.ReactNode }) { + return
    {children}
    ; +} -export const TeamsPropertiesListItem = (props: Omit) => { +export function TeamsPropertiesListItem(props: Omit) { const { label, icon: Icon, value, href } = props; return (
    @@ -28,6 +28,6 @@ export const TeamsPropertiesListItem = (props: Omit) = )}
    ); -}; +} TeamsPropertiesList.Item = TeamsPropertiesListItem; diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/properties/loader.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/properties/loader.tsx index 8aa1dc0b29..0e24aea923 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/properties/loader.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/properties/loader.tsx @@ -1,12 +1,14 @@ // ui import { Loader } from "@plane/ui"; -export const TeamspaceEntitiesLoader = ({ count }: { count: number }) => ( -
    - - {Array.from({ length: count }).map((_, index) => ( - - ))} - -
    -); +export function TeamspaceEntitiesLoader({ count }: { count: number }) { + return ( +
    + + {Array.from({ length: count }).map((_, index) => ( + + ))} + +
    + ); +} diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/properties/root.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/properties/root.tsx index 6b597b18e8..876419391e 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/properties/root.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/properties/root.tsx @@ -32,7 +32,9 @@ export type TPropertyListItem = { href?: string; }; -export const TeamsOverviewSidebarProperties = observer((props: TTeamsOverviewSidebarPropertiesProps) => { +export const TeamsOverviewSidebarProperties = observer(function TeamsOverviewSidebarProperties( + props: TTeamsOverviewSidebarPropertiesProps +) { const { teamspaceId, isEditingAllowed } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/sidebar/root.tsx b/apps/web/ee/components/teamspaces/overview/sidebar/root.tsx index 6d3c96023e..00dbbf0211 100644 --- a/apps/web/ee/components/teamspaces/overview/sidebar/root.tsx +++ b/apps/web/ee/components/teamspaces/overview/sidebar/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React from "react"; import { observer } from "mobx-react"; @@ -27,7 +25,7 @@ type TTeamsOverviewSidebarProps = { teamspaceId: string; }; -export const TeamsOverviewSidebar: FC = observer((props) => { +export const TeamsOverviewSidebar = observer(function TeamsOverviewSidebar(props: TTeamsOverviewSidebarProps) { const { teamspaceId } = props; // router const { workspaceSlug } = useParams(); @@ -50,7 +48,7 @@ export const TeamsOverviewSidebar: FC = observer((pr // fetch teamspace entities useSWR( workspaceSlug && teamspaceId ? ["teamspaceEntities", workspaceSlug, teamspaceId] : null, - () => fetchTeamspaceEntities(workspaceSlug!.toString(), teamspaceId), + () => fetchTeamspaceEntities(workspaceSlug.toString(), teamspaceId), { revalidateOnFocus: false, revalidateIfStale: false, @@ -59,7 +57,7 @@ export const TeamsOverviewSidebar: FC = observer((pr // fetching teamspace activity useSWR( workspaceSlug && teamspaceId ? ["teamspaceActivity", workspaceSlug, teamspaceId] : null, - workspaceSlug && teamspaceId ? () => fetchTeamActivities(workspaceSlug!.toString(), teamspaceId) : null, + workspaceSlug && teamspaceId ? () => fetchTeamActivities(workspaceSlug.toString(), teamspaceId) : null, { revalidateIfStale: false, revalidateOnFocus: false, @@ -68,7 +66,7 @@ export const TeamsOverviewSidebar: FC = observer((pr // fetching teamspace comments useSWR( workspaceSlug && teamspaceId ? ["teamspaceComments", workspaceSlug, teamspaceId] : null, - workspaceSlug && teamspaceId ? () => fetchTeamspaceComments(workspaceSlug!.toString(), teamspaceId) : null, + workspaceSlug && teamspaceId ? () => fetchTeamspaceComments(workspaceSlug.toString(), teamspaceId) : null, { revalidateIfStale: false, revalidateOnFocus: false, diff --git a/apps/web/ee/components/teamspaces/overview/statistics/chart.tsx b/apps/web/ee/components/teamspaces/overview/statistics/chart.tsx index 17ba3c7f27..8d2b4d070c 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/chart.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/chart.tsx @@ -28,7 +28,7 @@ type TTeamspaceStatisticsMapProps = { teamspaceId: string; }; -export const TeamspaceStatisticsMap: React.FC = observer((props) => { +export const TeamspaceStatisticsMap = observer(function TeamspaceStatisticsMap(props: TTeamspaceStatisticsMapProps) { const { teamspaceId } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/overview/statistics/filters/data-key.tsx b/apps/web/ee/components/teamspaces/overview/statistics/filters/data-key.tsx index 5b05047a52..e9afff5815 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/filters/data-key.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/filters/data-key.tsx @@ -8,7 +8,9 @@ import { cn } from "@plane/utils"; import { TEAM_STATISTICS_DATA_KEY_MAP } from "@/plane-web/constants/teamspace"; import type { TStatisticsFilterProps } from "@/plane-web/types/teamspace"; -export const StatisticsDataKeyFilter: React.FC> = observer((props) => { +export const StatisticsDataKeyFilter = observer(function StatisticsDataKeyFilter( + props: TStatisticsFilterProps<"data_key"> +) { const { value, isLoading, buttonContainerClassName, chevronClassName, handleFilterChange } = props; // derived values const options = Object.entries(TEAM_STATISTICS_DATA_KEY_MAP).map(([data, value]) => ({ diff --git a/apps/web/ee/components/teamspaces/overview/statistics/filters/dependency.tsx b/apps/web/ee/components/teamspaces/overview/statistics/filters/dependency.tsx index d2ed1aae83..bad136e87d 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/filters/dependency.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/filters/dependency.tsx @@ -8,7 +8,9 @@ import { cn } from "@plane/utils"; import { TEAM_STATISTICS_DEPENDENCY_MAP } from "@/plane-web/constants/teamspace"; import type { TStatisticsFilterProps } from "@/plane-web/types/teamspace"; -export const StatisticsDependencyFilter: React.FC> = observer((props) => { +export const StatisticsDependencyFilter = observer(function StatisticsDependencyFilter( + props: TStatisticsFilterProps<"dependency_type"> +) { const { value, isLoading, buttonContainerClassName, chevronClassName, handleFilterChange } = props; // derived values const options = Object.entries(TEAM_STATISTICS_DEPENDENCY_MAP).map(([data, value]) => ({ diff --git a/apps/web/ee/components/teamspaces/overview/statistics/filters/due-by.tsx b/apps/web/ee/components/teamspaces/overview/statistics/filters/due-by.tsx index 1e40335e1c..f52ed2cb1c 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/filters/due-by.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/filters/due-by.tsx @@ -8,7 +8,9 @@ import { cn } from "@plane/utils"; // plane web imports import type { TStatisticsFilterProps } from "@/plane-web/types/teamspace"; -export const StatisticsDueByFilter: React.FC> = observer((props) => { +export const StatisticsDueByFilter = observer(function StatisticsDueByFilter( + props: TStatisticsFilterProps<"target_date"> +) { const { value, isLoading, buttonContainerClassName, chevronClassName, handleFilterChange } = props; // derived values const options = DATE_AFTER_FILTER_OPTIONS.map((filterOption) => ({ diff --git a/apps/web/ee/components/teamspaces/overview/statistics/filters/legend.tsx b/apps/web/ee/components/teamspaces/overview/statistics/filters/legend.tsx index 9393f52118..b1238a0f12 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/filters/legend.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/filters/legend.tsx @@ -12,7 +12,7 @@ import { } from "@/plane-web/constants/workspace-project-states"; import type { TStatisticsFilterProps } from "@/plane-web/types/teamspace"; -export const StatisticsLegend: React.FC> = observer((props) => { +export const StatisticsLegend = observer(function StatisticsLegend(props: TStatisticsFilterProps<"legend">) { const { value, isLoading, buttonContainerClassName, chevronClassName, handleFilterChange } = props; // derived values const options = Object.entries(TEAM_STATISTICS_LEGEND_MAP).map(([data, value]) => ({ diff --git a/apps/web/ee/components/teamspaces/overview/statistics/filters/state-group.tsx b/apps/web/ee/components/teamspaces/overview/statistics/filters/state-group.tsx index a7b2e2b4e7..7da3b1604c 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/filters/state-group.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/filters/state-group.tsx @@ -8,7 +8,9 @@ import { cn } from "@plane/utils"; // plane web imports import type { TStatisticsFilterProps } from "@/plane-web/types/teamspace"; -export const StatisticsStateGroupFilter: React.FC> = observer((props) => { +export const StatisticsStateGroupFilter = observer(function StatisticsStateGroupFilter( + props: TStatisticsFilterProps<"state_group"> +) { const { value, isLoading, buttonContainerClassName, chevronClassName, handleFilterChange } = props; // derived values const options = Object.values(STATE_GROUPS).map((stateGroup) => ({ diff --git a/apps/web/ee/components/teamspaces/overview/statistics/filters/value-key.tsx b/apps/web/ee/components/teamspaces/overview/statistics/filters/value-key.tsx index cd642c1af0..9ecda2a3e9 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/filters/value-key.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/filters/value-key.tsx @@ -8,7 +8,9 @@ import { cn } from "@plane/utils"; import { TEAM_STATISTICS_VALUE_KEY_MAP } from "@/plane-web/constants/teamspace"; import type { TStatisticsFilterProps } from "@/plane-web/types"; -export const StatisticsValueKeyFilter: React.FC> = observer((props) => { +export const StatisticsValueKeyFilter = observer(function StatisticsValueKeyFilter( + props: TStatisticsFilterProps<"value_key"> +) { const { value, isLoading, buttonContainerClassName, chevronClassName, handleFilterChange } = props; // derived values const options = Object.entries(TEAM_STATISTICS_VALUE_KEY_MAP).map(([data, value]) => ({ diff --git a/apps/web/ee/components/teamspaces/overview/statistics/root.tsx b/apps/web/ee/components/teamspaces/overview/statistics/root.tsx index ddeb6e08d6..50e6e6fdd0 100644 --- a/apps/web/ee/components/teamspaces/overview/statistics/root.tsx +++ b/apps/web/ee/components/teamspaces/overview/statistics/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import React, { useRef, useState } from "react"; import { observer } from "mobx-react"; @@ -36,7 +34,7 @@ type Props = { teamspaceId: string; }; -export const TeamspaceStatisticsRoot: FC = observer((props) => { +export const TeamspaceStatisticsRoot = observer(function TeamspaceStatisticsRoot(props: Props) { const { teamspaceId } = props; // router const { workspaceSlug } = useParams(); @@ -68,7 +66,7 @@ export const TeamspaceStatisticsRoot: FC = observer((props) => { // fetching teamspace statistics useSWR( workspaceSlug && teamspaceId ? ["teamspaceStatistics", workspaceSlug, teamspaceId] : null, - workspaceSlug && teamspaceId ? () => fetchTeamspaceStatistics(workspaceSlug!.toString(), teamspaceId) : null, + workspaceSlug && teamspaceId ? () => fetchTeamspaceStatistics(workspaceSlug.toString(), teamspaceId) : null, { revalidateIfStale: false, revalidateOnFocus: false, @@ -101,7 +99,7 @@ export const TeamspaceStatisticsRoot: FC = observer((props) => { captureClick({ elementName: TEAMSPACE_ANALYTICS_TRACKER_ELEMENTS.STATISTICS_FILTER_DROPDOWN, }); - await updateTeamspaceStatisticsFilter(workspaceSlug!.toString(), teamspaceId, key, value) + await updateTeamspaceStatisticsFilter(workspaceSlug.toString(), teamspaceId, key, value) .then(() => { captureSuccess({ eventName: TEAMSPACE_ANALYTICS_TRACKER_EVENTS.STATISTICS_FILTER_UPDATED, diff --git a/apps/web/ee/components/teamspaces/pages/header/index.tsx b/apps/web/ee/components/teamspaces/pages/header/index.tsx index 729b4a1e18..22349a2bc9 100644 --- a/apps/web/ee/components/teamspaces/pages/header/index.tsx +++ b/apps/web/ee/components/teamspaces/pages/header/index.tsx @@ -13,7 +13,7 @@ type Props = { workspaceSlug: string; }; -export const TeamspacePagesListHeaderRoot: React.FC = observer((props) => { +export const TeamspacePagesListHeaderRoot = observer(function TeamspacePagesListHeaderRoot(props: Props) { const { pageType, teamspaceId, workspaceSlug } = props; return ( diff --git a/apps/web/ee/components/teamspaces/pages/header/tab-navigation.tsx b/apps/web/ee/components/teamspaces/pages/header/tab-navigation.tsx index 7afe39279c..95609aa52c 100644 --- a/apps/web/ee/components/teamspaces/pages/header/tab-navigation.tsx +++ b/apps/web/ee/components/teamspaces/pages/header/tab-navigation.tsx @@ -22,7 +22,7 @@ const teamspacePageTabs: { key: TPageNavigationTabs; label: string }[] = [ }, ]; -export const TeamspacePageTabNavigation: FC = (props) => { +export function TeamspacePageTabNavigation(props: TTeamspacePageTabNavigation) { const { workspaceSlug, teamspaceId, pageType } = props; const handleTabClick = (e: React.MouseEvent, tabKey: TPageNavigationTabs) => { @@ -53,4 +53,4 @@ export const TeamspacePageTabNavigation: FC = (prop ))}
    ); -}; +} diff --git a/apps/web/ee/components/teamspaces/pages/list/index.tsx b/apps/web/ee/components/teamspaces/pages/list/index.tsx index 396f07d2a3..b29a8afc7f 100644 --- a/apps/web/ee/components/teamspaces/pages/list/index.tsx +++ b/apps/web/ee/components/teamspaces/pages/list/index.tsx @@ -36,7 +36,7 @@ type Props = { teamspaceId: string; }; -export const TeamspacePagesListRoot: React.FC = observer((props) => { +export const TeamspacePagesListRoot = observer(function TeamspacePagesListRoot(props: Props) { const { pageType, workspaceSlug, teamspaceId } = props; // states diff --git a/apps/web/ee/components/teamspaces/pages/pages-list-view.tsx b/apps/web/ee/components/teamspaces/pages/pages-list-view.tsx index 641262b0b5..2bb2b43445 100644 --- a/apps/web/ee/components/teamspaces/pages/pages-list-view.tsx +++ b/apps/web/ee/components/teamspaces/pages/pages-list-view.tsx @@ -1,5 +1,3 @@ -"use client"; - import { observer } from "mobx-react"; // types import type { TPageNavigationTabs } from "@plane/types"; @@ -17,7 +15,7 @@ type TPageView = { workspaceSlug: string; }; -export const TeamspacePagesListView: React.FC = observer((props) => { +export const TeamspacePagesListView = observer(function TeamspacePagesListView(props: TPageView) { const { pageType, workspaceSlug, teamspaceId } = props; // store hooks const { isAnyPageAvailable } = usePageStore(storeType); diff --git a/apps/web/ee/components/teamspaces/pages/pages-list.tsx b/apps/web/ee/components/teamspaces/pages/pages-list.tsx index e7ae94f557..4c56772021 100644 --- a/apps/web/ee/components/teamspaces/pages/pages-list.tsx +++ b/apps/web/ee/components/teamspaces/pages/pages-list.tsx @@ -38,7 +38,7 @@ type Props = { teamspaceId: string; }; -export const TeamspacePagesList = observer((props: Props) => { +export const TeamspacePagesList = observer(function TeamspacePagesList(props: Props) { const { teamspaceId } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/teamspaces/projects/block-list.tsx b/apps/web/ee/components/teamspaces/projects/block-list.tsx index c7a6fc718e..f498670a19 100644 --- a/apps/web/ee/components/teamspaces/projects/block-list.tsx +++ b/apps/web/ee/components/teamspaces/projects/block-list.tsx @@ -7,7 +7,7 @@ interface Props { teamspaceId: string; } -export const TeamspaceProjectBlocksList: FC = (props) => { +export function TeamspaceProjectBlocksList(props: Props) { const { projectIds = [], teamspaceId } = props; return ( @@ -19,4 +19,4 @@ export const TeamspaceProjectBlocksList: FC = (props) => { ))}
    ); -}; +} diff --git a/apps/web/ee/components/teamspaces/projects/block.tsx b/apps/web/ee/components/teamspaces/projects/block.tsx index e28cfe25be..aa7157fb81 100644 --- a/apps/web/ee/components/teamspaces/projects/block.tsx +++ b/apps/web/ee/components/teamspaces/projects/block.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useRef } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -33,7 +31,7 @@ interface TeamspaceProjectBlockProps { teamspaceId: string; } -export const TeamspaceProjectBlock = observer((props: TeamspaceProjectBlockProps) => { +export const TeamspaceProjectBlock = observer(function TeamspaceProjectBlock(props: TeamspaceProjectBlockProps) { const { projectId, isCurrentBlockDragging, canDrag, teamspaceId } = props; // ref const projectRef = useRef(null); @@ -80,7 +78,7 @@ export const TeamspaceProjectBlock = observer((props: TeamspaceProjectBlockProps
    - {!!projectDetails.member_role ? ( + {projectDetails.member_role ? ( { +export const TeamspaceProjectWorkItemFilters = observer(function TeamspaceProjectWorkItemFilters(props: Props) { const { teamspaceId, workspaceSlug, projectId } = props; const { t } = useTranslation(); // store hooks diff --git a/apps/web/ee/components/teamspaces/projects/grouping-root.tsx b/apps/web/ee/components/teamspaces/projects/grouping-root.tsx index 8513e51432..3b053a7188 100644 --- a/apps/web/ee/components/teamspaces/projects/grouping-root.tsx +++ b/apps/web/ee/components/teamspaces/projects/grouping-root.tsx @@ -13,7 +13,9 @@ export type TTeamspaceProjectsWithGroupingRootProps = { workspaceSlug: string; }; -export const TeamspaceProjectsWithGroupingRoot = observer((props: TTeamspaceProjectsWithGroupingRootProps) => { +export const TeamspaceProjectsWithGroupingRoot = observer(function TeamspaceProjectsWithGroupingRoot( + props: TTeamspaceProjectsWithGroupingRootProps +) { const { workspaceSlug } = props; // hooks const { currentWorkspace } = useWorkspace(); diff --git a/apps/web/ee/components/teamspaces/projects/non-grouping-root.tsx b/apps/web/ee/components/teamspaces/projects/non-grouping-root.tsx index 4a4d486def..e7719e5d74 100644 --- a/apps/web/ee/components/teamspaces/projects/non-grouping-root.tsx +++ b/apps/web/ee/components/teamspaces/projects/non-grouping-root.tsx @@ -16,7 +16,9 @@ export type TTeamspaceProjectsWithoutGroupingRootProps = { teamspace: TTeamspace; }; -export const TeamspaceProjectsWithoutGroupingRoot = observer((props: TTeamspaceProjectsWithoutGroupingRootProps) => { +export const TeamspaceProjectsWithoutGroupingRoot = observer(function TeamspaceProjectsWithoutGroupingRoot( + props: TTeamspaceProjectsWithoutGroupingRootProps +) { const { workspaceSlug, teamspace } = props; // hooks const { totalProjectIds: storeTotalProjectIds, filteredProjectIds: storeFilteredProjectIds } = useProject(); diff --git a/apps/web/ee/components/teamspaces/upgrade.tsx b/apps/web/ee/components/teamspaces/upgrade.tsx index b7c6050c0b..e7a0993f80 100644 --- a/apps/web/ee/components/teamspaces/upgrade.tsx +++ b/apps/web/ee/components/teamspaces/upgrade.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; @@ -16,7 +14,7 @@ import TeamsUpgradeLight from "@/app/assets/empty-state/teams/light-upgrade.webp // plane web hooks import { useWorkspaceSubscription } from "@/plane-web/hooks/store"; -export const TeamspaceUpgrade: FC = observer(() => { +export const TeamspaceUpgrade = observer(function TeamspaceUpgrade() { const { resolvedTheme } = useTheme(); const { currentWorkspaceSubscribedPlanDetail: subscriptionDetail, togglePaidPlanModal } = useWorkspaceSubscription(); // derived values @@ -31,6 +29,7 @@ export const TeamspaceUpgrade: FC = observer(() => { href="https://prime.plane.so/" target="_blank" className={getButtonStyling("primary", "md")} + rel="noreferrer" > Upgrade to higher subscription diff --git a/apps/web/ee/components/teamspaces/views/filters/list.tsx b/apps/web/ee/components/teamspaces/views/filters/list.tsx index 4328d3ab70..99adf4a7ad 100644 --- a/apps/web/ee/components/teamspaces/views/filters/list.tsx +++ b/apps/web/ee/components/teamspaces/views/filters/list.tsx @@ -21,7 +21,7 @@ type TeamspaceViewListHeaderProps = { teamspaceId: string; }; -export const TeamspaceViewListHeader = observer((props: TeamspaceViewListHeaderProps) => { +export const TeamspaceViewListHeader = observer(function TeamspaceViewListHeader(props: TeamspaceViewListHeaderProps) { const { teamspaceId } = props; // states const [isSearchOpen, setIsSearchOpen] = useState(false); diff --git a/apps/web/ee/components/teamspaces/views/modals/create-update/form.tsx b/apps/web/ee/components/teamspaces/views/modals/create-update/form.tsx index 08814dbb07..6d8b52a336 100644 --- a/apps/web/ee/components/teamspaces/views/modals/create-update/form.tsx +++ b/apps/web/ee/components/teamspaces/views/modals/create-update/form.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { Controller, useForm } from "react-hook-form"; @@ -38,7 +36,7 @@ const DEFAULT_VALUES: Partial = { }), }; -export const TeamspaceViewForm: React.FC = observer((props) => { +export const TeamspaceViewForm = observer(function TeamspaceViewForm(props: Props) { const { handleFormSubmit, handleClose, data, preLoadedData, teamspaceId, workspaceSlug } = props; // state const [isOpen, setIsOpen] = useState(false); diff --git a/apps/web/ee/components/teamspaces/views/modals/create-update/modal.tsx b/apps/web/ee/components/teamspaces/views/modals/create-update/modal.tsx index 3ce76a381a..bfa882b6ff 100644 --- a/apps/web/ee/components/teamspaces/views/modals/create-update/modal.tsx +++ b/apps/web/ee/components/teamspaces/views/modals/create-update/modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { observer } from "mobx-react"; // plane imports @@ -29,7 +27,7 @@ type Props = { teamspaceId: string; }; -export const CreateUpdateTeamspaceViewModal: FC = observer((props) => { +export const CreateUpdateTeamspaceViewModal = observer(function CreateUpdateTeamspaceViewModal(props: Props) { const { data, isOpen, onClose, preLoadedData, workspaceSlug, teamspaceId } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/teamspaces/views/modals/delete.tsx b/apps/web/ee/components/teamspaces/views/modals/delete.tsx index f08bb97d6b..4dcc0920b4 100644 --- a/apps/web/ee/components/teamspaces/views/modals/delete.tsx +++ b/apps/web/ee/components/teamspaces/views/modals/delete.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -20,7 +18,7 @@ type Props = { onClose: () => void; }; -export const DeleteTeamspaceViewModal: React.FC = observer((props) => { +export const DeleteTeamspaceViewModal = observer(function DeleteTeamspaceViewModal(props: Props) { const { data, isOpen, onClose, teamspaceId } = props; // states const [isDeleteLoading, setIsDeleteLoading] = useState(false); diff --git a/apps/web/ee/components/teamspaces/views/modals/publish.tsx b/apps/web/ee/components/teamspaces/views/modals/publish.tsx index fa555ad2bb..785b52a3c7 100644 --- a/apps/web/ee/components/teamspaces/views/modals/publish.tsx +++ b/apps/web/ee/components/teamspaces/views/modals/publish.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { useParams } from "next/navigation"; @@ -31,7 +29,7 @@ const defaultValues: TPublishViewSettings = { is_votes_enabled: false, }; -export const PublishTeamspaceViewModal: React.FC = observer((props) => { +export const PublishTeamspaceViewModal = observer(function PublishTeamspaceViewModal(props: Props) { const { isOpen, view, teamspaceId, onClose } = props; // states const [isUnPublishing, setIsUnPublishing] = useState(false); diff --git a/apps/web/ee/components/teamspaces/views/quick-actions.tsx b/apps/web/ee/components/teamspaces/views/quick-actions.tsx index 5fedc7ec7c..cc149c827d 100644 --- a/apps/web/ee/components/teamspaces/views/quick-actions.tsx +++ b/apps/web/ee/components/teamspaces/views/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; import { ExternalLink, Link, Pencil, Trash2 } from "lucide-react"; @@ -27,7 +25,7 @@ type Props = { workspaceSlug: string; }; -export const TeamspaceViewQuickActions: React.FC = observer((props) => { +export const TeamspaceViewQuickActions = observer(function TeamspaceViewQuickActions(props: Props) { const { parentRef, teamspaceId, view, workspaceSlug } = props; // states const [createUpdateViewModal, setCreateUpdateViewModal] = useState(false); diff --git a/apps/web/ee/components/teamspaces/views/view-list-item-action.tsx b/apps/web/ee/components/teamspaces/views/view-list-item-action.tsx index 4e37ecb063..43eaadab86 100644 --- a/apps/web/ee/components/teamspaces/views/view-list-item-action.tsx +++ b/apps/web/ee/components/teamspaces/views/view-list-item-action.tsx @@ -30,7 +30,7 @@ type Props = { view: TTeamspaceView; }; -export const TeamspaceViewListItemAction: FC = observer((props) => { +export const TeamspaceViewListItemAction = observer(function TeamspaceViewListItemAction(props: Props) { const { parentRef, teamspaceId, view } = props; // router const { workspaceSlug } = useParams(); diff --git a/apps/web/ee/components/teamspaces/views/view-list-item.tsx b/apps/web/ee/components/teamspaces/views/view-list-item.tsx index 5027229d35..aa02b93a2d 100644 --- a/apps/web/ee/components/teamspaces/views/view-list-item.tsx +++ b/apps/web/ee/components/teamspaces/views/view-list-item.tsx @@ -1,5 +1,3 @@ -"use client"; - import type { FC } from "react"; import { useRef } from "react"; import { observer } from "mobx-react"; @@ -21,7 +19,7 @@ type Props = { view: TTeamspaceView; }; -export const TeamspaceViewListItem: FC = observer((props) => { +export const TeamspaceViewListItem = observer(function TeamspaceViewListItem(props: Props) { const { teamspaceId, view } = props; // refs const parentRef = useRef(null); diff --git a/apps/web/ee/components/teamspaces/views/views-list.tsx b/apps/web/ee/components/teamspaces/views/views-list.tsx index eb47d4b54c..6f75ba64af 100644 --- a/apps/web/ee/components/teamspaces/views/views-list.tsx +++ b/apps/web/ee/components/teamspaces/views/views-list.tsx @@ -26,7 +26,7 @@ type Props = { teamspaceId: string; }; -export const TeamspaceViewsList = observer((props: Props) => { +export const TeamspaceViewsList = observer(function TeamspaceViewsList(props: Props) { const { teamspaceId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/dropdowns/project.tsx b/apps/web/ee/components/templates/dropdowns/project.tsx index b022c519f9..df8d5e43c4 100644 --- a/apps/web/ee/components/templates/dropdowns/project.tsx +++ b/apps/web/ee/components/templates/dropdowns/project.tsx @@ -33,7 +33,7 @@ type TProjectTemplateDropdownProps = { handleRedirection?: () => void; }; -export const ProjectTemplateDropdown = observer((props: TProjectTemplateDropdownProps) => { +export const ProjectTemplateDropdown = observer(function ProjectTemplateDropdown(props: TProjectTemplateDropdownProps) { const { workspaceSlug, templateId, diff --git a/apps/web/ee/components/templates/dropdowns/work-item.tsx b/apps/web/ee/components/templates/dropdowns/work-item.tsx index 7376847fc3..10461f8274 100644 --- a/apps/web/ee/components/templates/dropdowns/work-item.tsx +++ b/apps/web/ee/components/templates/dropdowns/work-item.tsx @@ -46,7 +46,9 @@ type TWorkItemTemplateDropdownProps = { } ); -export const WorkItemTemplateDropdown = observer((props: TWorkItemTemplateDropdownProps) => { +export const WorkItemTemplateDropdown = observer(function WorkItemTemplateDropdown( + props: TWorkItemTemplateDropdownProps +) { const { workspaceSlug, templateId, diff --git a/apps/web/ee/components/templates/settings/common/collapsible-wrapper.tsx b/apps/web/ee/components/templates/settings/common/collapsible-wrapper.tsx index b9a368d295..f35368b840 100644 --- a/apps/web/ee/components/templates/settings/common/collapsible-wrapper.tsx +++ b/apps/web/ee/components/templates/settings/common/collapsible-wrapper.tsx @@ -22,7 +22,9 @@ type TTemplateCollapsibleWrapper = { title: string; }; -export const TemplateCollapsibleWrapper = observer((props: TTemplateCollapsibleWrapper) => { +export const TemplateCollapsibleWrapper = observer(function TemplateCollapsibleWrapper( + props: TTemplateCollapsibleWrapper +) { const { title, children, diff --git a/apps/web/ee/components/templates/settings/common/form/template-details.tsx b/apps/web/ee/components/templates/settings/common/form/template-details.tsx index 8ded4ca0e6..443fb1a76c 100644 --- a/apps/web/ee/components/templates/settings/common/form/template-details.tsx +++ b/apps/web/ee/components/templates/settings/common/form/template-details.tsx @@ -26,7 +26,9 @@ type TTemplateDetailsProps = { }; }; -export const TemplateDetails = observer((props: TTemplateDetailsProps) => { +export const TemplateDetails = observer(function TemplateDetails( + props: TTemplateDetailsProps +) { const { fieldPaths, validation, placeholders } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/create-button.tsx b/apps/web/ee/components/templates/settings/create-button.tsx index e59fbc01e2..a5d32c5ba2 100644 --- a/apps/web/ee/components/templates/settings/create-button.tsx +++ b/apps/web/ee/components/templates/settings/create-button.tsx @@ -47,7 +47,7 @@ type TCreateTemplateOption = { featureFlagKey: E_FEATURE_FLAGS; }; -export const CreateTemplatesButton = observer((props: TCreateTemplatesButtonProps) => { +export const CreateTemplatesButton = observer(function CreateTemplatesButton(props: TCreateTemplatesButtonProps) { // router const router = useAppRouter(); // plane hooks diff --git a/apps/web/ee/components/templates/settings/discard-modal.tsx b/apps/web/ee/components/templates/settings/discard-modal.tsx index ca6eb2fbdc..cf51b9ad71 100644 --- a/apps/web/ee/components/templates/settings/discard-modal.tsx +++ b/apps/web/ee/components/templates/settings/discard-modal.tsx @@ -1,5 +1,3 @@ -"use client"; - import React from "react"; import { observer } from "mobx-react"; // plane imports @@ -14,7 +12,7 @@ type Props = { onDiscard: () => void; }; -export const DiscardModal: React.FC = observer((props) => { +export const DiscardModal = observer(function DiscardModal(props: Props) { const { isOpen, onClose, onDiscard } = props; return ( diff --git a/apps/web/ee/components/templates/settings/list/action-wrapper.tsx b/apps/web/ee/components/templates/settings/list/action-wrapper.tsx index 270e0f125f..4c6674bc6f 100644 --- a/apps/web/ee/components/templates/settings/list/action-wrapper.tsx +++ b/apps/web/ee/components/templates/settings/list/action-wrapper.tsx @@ -44,7 +44,9 @@ type TTemplateListActionWrapperProps = { children: (props: TChildProps) => React.ReactElement; } & (TWorkspaceTemplateListActionWrapperProps | TProjectTemplateListActionWrapperProps); -export const TemplateListActionWrapper = observer((props: TTemplateListActionWrapperProps) => { +export const TemplateListActionWrapper = observer(function TemplateListActionWrapper( + props: TTemplateListActionWrapperProps +) { const { workspaceSlug, level, children } = props; // states const [isCreateProjectModalOpen, setIsCreateProjectModalOpen] = useState(false); diff --git a/apps/web/ee/components/templates/settings/list/list-item.tsx b/apps/web/ee/components/templates/settings/list/list-item.tsx index 25a513d972..657b0488e3 100644 --- a/apps/web/ee/components/templates/settings/list/list-item.tsx +++ b/apps/web/ee/components/templates/settings/list/list-item.tsx @@ -22,7 +22,9 @@ type TemplateListItemProps = { handleUseTemplateAction: () => void; }; -export const TemplateListItem = observer((props: TemplateListItemProps) => { +export const TemplateListItem = observer(function TemplateListItem( + props: TemplateListItemProps +) { const { templateId, workspaceSlug, diff --git a/apps/web/ee/components/templates/settings/list/list-wrapper.tsx b/apps/web/ee/components/templates/settings/list/list-wrapper.tsx index 1e6e9fcbab..8b7b0fd73f 100644 --- a/apps/web/ee/components/templates/settings/list/list-wrapper.tsx +++ b/apps/web/ee/components/templates/settings/list/list-wrapper.tsx @@ -12,7 +12,7 @@ type TemplateListWrapperProps = { children: React.ReactNode; }; -export const TemplateListWrapper = observer((props: TemplateListWrapperProps) => { +export const TemplateListWrapper = observer(function TemplateListWrapper(props: TemplateListWrapperProps) { const { type, isInitializing, templateIds, children } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/list/project-root.tsx b/apps/web/ee/components/templates/settings/list/project-root.tsx index 7c2b61ce36..285e07b4bd 100644 --- a/apps/web/ee/components/templates/settings/list/project-root.tsx +++ b/apps/web/ee/components/templates/settings/list/project-root.tsx @@ -14,7 +14,9 @@ type TProjectSettingsTemplatesListRootProps = { projectId: string; }; -export const ProjectSettingsTemplatesListRoot = observer((props: TProjectSettingsTemplatesListRootProps) => { +export const ProjectSettingsTemplatesListRoot = observer(function ProjectSettingsTemplatesListRoot( + props: TProjectSettingsTemplatesListRootProps +) { const { workspaceSlug, projectId } = props; // store hooks const { diff --git a/apps/web/ee/components/templates/settings/list/quick-actions.tsx b/apps/web/ee/components/templates/settings/list/quick-actions.tsx index 25121eb1fd..31073adbdd 100644 --- a/apps/web/ee/components/templates/settings/list/quick-actions.tsx +++ b/apps/web/ee/components/templates/settings/list/quick-actions.tsx @@ -1,5 +1,3 @@ -"use client"; - import { useState } from "react"; import { observer } from "mobx-react"; // icons @@ -41,300 +39,300 @@ type TTemplateQuickActionsProps = { deleteTemplate: (templateId: string) => Promise; }; -export const TemplateQuickActions = observer( - (props: TTemplateQuickActionsProps) => { - const { templateId, workspaceSlug, parentRef, getTemplateById, deleteTemplate } = props; - // router - const router = useAppRouter(); - // states - const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); - const [isDeleteLoading, setIsDeleteLoading] = useState(false); - const [isUnpublishModalOpen, setIsUnpublishModalOpen] = useState(false); - const [isUnpublishLoading, setIsUnpublishLoading] = useState(false); - // plane hooks - const { t } = useTranslation(); - // derived values - const template = getTemplateById(templateId); - const isAnyActionAllowed = template?.canCurrentUserEditTemplate || template?.canCurrentUserDeleteTemplate; - if (!template || !isAnyActionAllowed) return null; +export const TemplateQuickActions = observer(function TemplateQuickActions( + props: TTemplateQuickActionsProps +) { + const { templateId, workspaceSlug, parentRef, getTemplateById, deleteTemplate } = props; + // router + const router = useAppRouter(); + // states + const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); + const [isDeleteLoading, setIsDeleteLoading] = useState(false); + const [isUnpublishModalOpen, setIsUnpublishModalOpen] = useState(false); + const [isUnpublishLoading, setIsUnpublishLoading] = useState(false); + // plane hooks + const { t } = useTranslation(); + // derived values + const template = getTemplateById(templateId); + const isAnyActionAllowed = template?.canCurrentUserEditTemplate || template?.canCurrentUserDeleteTemplate; + if (!template || !isAnyActionAllowed) return null; - const getTrackerElement = (type: ETemplateType) => { - if (type === ETemplateType.PROJECT) { - return PROJECT_TEMPLATE_TRACKER_ELEMENTS; - } - if (type === ETemplateType.WORK_ITEM) { - return WORKITEM_TEMPLATE_TRACKER_ELEMENTS; - } - if (type === ETemplateType.PAGE) { - return PAGE_TEMPLATE_TRACKER_ELEMENTS; - } - }; + const getTrackerElement = (type: ETemplateType) => { + if (type === ETemplateType.PROJECT) { + return PROJECT_TEMPLATE_TRACKER_ELEMENTS; + } + if (type === ETemplateType.WORK_ITEM) { + return WORKITEM_TEMPLATE_TRACKER_ELEMENTS; + } + if (type === ETemplateType.PAGE) { + return PAGE_TEMPLATE_TRACKER_ELEMENTS; + } + }; - const getTrackerEvent = (type: ETemplateType) => { - if (type === ETemplateType.PROJECT) { - return PROJECT_TEMPLATE_TRACKER_EVENTS; - } - if (type === ETemplateType.WORK_ITEM) { - return WORKITEM_TEMPLATE_TRACKER_EVENTS; - } - if (type === ETemplateType.PAGE) { - return PAGE_TEMPLATE_TRACKER_EVENTS; - } - }; + const getTrackerEvent = (type: ETemplateType) => { + if (type === ETemplateType.PROJECT) { + return PROJECT_TEMPLATE_TRACKER_EVENTS; + } + if (type === ETemplateType.WORK_ITEM) { + return WORKITEM_TEMPLATE_TRACKER_EVENTS; + } + if (type === ETemplateType.PAGE) { + return PAGE_TEMPLATE_TRACKER_EVENTS; + } + }; - const handleEditTemplate = () => { - const updateTemplatePath = - getCreateUpdateTemplateSettingsPath({ - type: template.template_type, - workspaceSlug, - ...(template.project - ? { level: ETemplateLevel.PROJECT, projectId: template.project } - : { level: ETemplateLevel.WORKSPACE }), - }) + - "?templateId=" + - templateId; - router.push(updateTemplatePath); - const trackerElement = getTrackerElement(template.template_type); - if (trackerElement) { - captureClick({ - elementName: trackerElement.LIST_ITEM_EDIT_BUTTON, - }); - } - }; - - const handlePublishTemplate = () => { - const publishTemplatePath = getPublishTemplateSettingsPath({ + const handleEditTemplate = () => { + const updateTemplatePath = + getCreateUpdateTemplateSettingsPath({ type: template.template_type, workspaceSlug, ...(template.project ? { level: ETemplateLevel.PROJECT, projectId: template.project } : { level: ETemplateLevel.WORKSPACE }), - templateId, + }) + + "?templateId=" + + templateId; + router.push(updateTemplatePath); + const trackerElement = getTrackerElement(template.template_type); + if (trackerElement) { + captureClick({ + elementName: trackerElement.LIST_ITEM_EDIT_BUTTON, }); - router.push(publishTemplatePath); - const trackerElement = getTrackerElement(template.template_type); - if (trackerElement) { - captureClick({ - elementName: trackerElement.LIST_ITEM_PUBLISH_BUTTON, + } + }; + + const handlePublishTemplate = () => { + const publishTemplatePath = getPublishTemplateSettingsPath({ + type: template.template_type, + workspaceSlug, + ...(template.project + ? { level: ETemplateLevel.PROJECT, projectId: template.project } + : { level: ETemplateLevel.WORKSPACE }), + templateId, + }); + router.push(publishTemplatePath); + const trackerElement = getTrackerElement(template.template_type); + if (trackerElement) { + captureClick({ + elementName: trackerElement.LIST_ITEM_PUBLISH_BUTTON, + }); + } + }; + + const handleUnpublishTemplate = async () => { + if (!template.id) return; + setIsUnpublishLoading(true); + const trackerEvent = getTrackerEvent(template.template_type); + await template + .update({ + is_published: false, + } as Partial) + .then(() => { + setToast({ + type: TOAST_TYPE.SUCCESS, + title: t("templates.toasts.unpublish.success.title"), + message: t("templates.toasts.unpublish.success.message", { + templateName: template.name, + templateType: t(getTemplateTypeI18nName(template.template_type))?.toLowerCase(), + }), }); - } - }; - - const handleUnpublishTemplate = async () => { - if (!template.id) return; - setIsUnpublishLoading(true); - const trackerEvent = getTrackerEvent(template.template_type); - await template - .update({ - is_published: false, - } as Partial) - .then(() => { - setToast({ - type: TOAST_TYPE.SUCCESS, - title: t("templates.toasts.unpublish.success.title"), - message: t("templates.toasts.unpublish.success.message", { - templateName: template.name, - templateType: t(getTemplateTypeI18nName(template.template_type))?.toLowerCase(), - }), + if (trackerEvent) { + captureSuccess({ + eventName: trackerEvent.UNPUBLISH, + payload: { + id: template.id, + }, }); - if (trackerEvent) { - captureSuccess({ - eventName: trackerEvent.UNPUBLISH, - payload: { - id: template.id, - }, - }); - } - }) - .catch(() => { - setToast({ - type: TOAST_TYPE.ERROR, - title: t("templates.toasts.unpublish.error.title"), - message: t("templates.toasts.unpublish.error.message", { - templateName: template.name, - templateType: t(getTemplateTypeI18nName(template.template_type))?.toLowerCase(), - }), - }); - if (trackerEvent) { - captureError({ - eventName: trackerEvent.UNPUBLISH, - payload: { - id: template.id, - }, - }); - } - }) - .finally(() => { - setIsUnpublishModalOpen(false); - setIsUnpublishLoading(false); + } + }) + .catch(() => { + setToast({ + type: TOAST_TYPE.ERROR, + title: t("templates.toasts.unpublish.error.title"), + message: t("templates.toasts.unpublish.error.message", { + templateName: template.name, + templateType: t(getTemplateTypeI18nName(template.template_type))?.toLowerCase(), + }), }); - }; + if (trackerEvent) { + captureError({ + eventName: trackerEvent.UNPUBLISH, + payload: { + id: template.id, + }, + }); + } + }) + .finally(() => { + setIsUnpublishModalOpen(false); + setIsUnpublishLoading(false); + }); + }; - const handleTemplateDeletion = async () => { - if (!workspaceSlug || !template.id) return; - setIsDeleteLoading(true); - const trackerEvent = getTrackerEvent(template.template_type); - await deleteTemplate(template.id) - .then(() => { - setToast({ - type: TOAST_TYPE.SUCCESS, - title: t("templates.toasts.delete.success.title"), - message: t("templates.toasts.delete.success.message", { - templateName: template.name, - templateType: t(getTemplateTypeI18nName(template.template_type))?.toLowerCase(), - }), - }); - if (trackerEvent) { - captureSuccess({ - eventName: trackerEvent.DELETE, - payload: { - id: template.id, - }, - }); - } - }) - .catch(() => { - setToast({ - type: TOAST_TYPE.ERROR, - title: t("templates.toasts.delete.error.title"), - message: t("templates.toasts.delete.error.message"), - }); - if (trackerEvent) { - captureError({ - eventName: trackerEvent.DELETE, - payload: { - id: template.id, - }, - }); - } - }) - .finally(() => { - setIsDeleteLoading(false); + const handleTemplateDeletion = async () => { + if (!workspaceSlug || !template.id) return; + setIsDeleteLoading(true); + const trackerEvent = getTrackerEvent(template.template_type); + await deleteTemplate(template.id) + .then(() => { + setToast({ + type: TOAST_TYPE.SUCCESS, + title: t("templates.toasts.delete.success.title"), + message: t("templates.toasts.delete.success.message", { + templateName: template.name, + templateType: t(getTemplateTypeI18nName(template.template_type))?.toLowerCase(), + }), }); - }; + if (trackerEvent) { + captureSuccess({ + eventName: trackerEvent.DELETE, + payload: { + id: template.id, + }, + }); + } + }) + .catch(() => { + setToast({ + type: TOAST_TYPE.ERROR, + title: t("templates.toasts.delete.error.title"), + message: t("templates.toasts.delete.error.message"), + }); + if (trackerEvent) { + captureError({ + eventName: trackerEvent.DELETE, + payload: { + id: template.id, + }, + }); + } + }) + .finally(() => { + setIsDeleteLoading(false); + }); + }; - const MENU_ITEMS: TContextMenuItem[] = [ - { - key: "edit", - title: t("common.actions.edit"), - icon: Pencil, - action: handleEditTemplate, - shouldRender: template.canCurrentUserEditTemplate, + const MENU_ITEMS: TContextMenuItem[] = [ + { + key: "edit", + title: t("common.actions.edit"), + icon: Pencil, + action: handleEditTemplate, + shouldRender: template.canCurrentUserEditTemplate, + }, + { + key: "publish", + title: t("templates.settings.form.publish.action", { + isPublished: template.is_published, + }), + icon: Earth, + action: handlePublishTemplate, + shouldRender: template.canCurrentUserPublishTemplate, + }, + { + key: "unpublish", + title: t("templates.settings.form.publish.unpublish_action"), + icon: EarthLock, + action: () => { + setIsUnpublishModalOpen(true); + const trackerElement = getTrackerElement(template.template_type); + if (trackerElement) { + captureClick({ + elementName: trackerElement.LIST_ITEM_UNPUBLISH_BUTTON, + }); + } }, - { - key: "publish", - title: t("templates.settings.form.publish.action", { - isPublished: template.is_published, - }), - icon: Earth, - action: handlePublishTemplate, - shouldRender: template.canCurrentUserPublishTemplate, + shouldRender: template.canCurrentUserUnpublishTemplate, + className: "text-red-500", + }, + { + key: "delete", + action: () => { + setIsDeleteModalOpen(true); + const trackerElement = getTrackerElement(template.template_type); + if (trackerElement) { + captureClick({ + elementName: trackerElement.LIST_ITEM_DELETE_BUTTON, + }); + } }, - { - key: "unpublish", - title: t("templates.settings.form.publish.unpublish_action"), - icon: EarthLock, - action: () => { - setIsUnpublishModalOpen(true); - const trackerElement = getTrackerElement(template.template_type); - if (trackerElement) { - captureClick({ - elementName: trackerElement.LIST_ITEM_UNPUBLISH_BUTTON, - }); - } - }, - shouldRender: template.canCurrentUserUnpublishTemplate, - className: "text-red-500", - }, - { - key: "delete", - action: () => { - setIsDeleteModalOpen(true); - const trackerElement = getTrackerElement(template.template_type); - if (trackerElement) { - captureClick({ - elementName: trackerElement.LIST_ITEM_DELETE_BUTTON, - }); - } - }, - title: t("common.actions.delete"), - icon: Trash2, - shouldRender: template.canCurrentUserDeleteTemplate, - className: "text-red-500", - }, - ]; + title: t("common.actions.delete"), + icon: Trash2, + shouldRender: template.canCurrentUserDeleteTemplate, + className: "text-red-500", + }, + ]; - return ( - <> - setIsDeleteModalOpen(false)} - handleSubmit={handleTemplateDeletion} - isSubmitting={isDeleteLoading} - isOpen={isDeleteModalOpen} - title={t("templates.delete_confirmation.title")} - content={ - <> - {t("templates.delete_confirmation.description.prefix")} - {template.name} - {t("templates.delete_confirmation.description.suffix")} - - } - /> - setIsUnpublishModalOpen(false)} - handleSubmit={handleUnpublishTemplate} - isSubmitting={isUnpublishLoading} - isOpen={isUnpublishModalOpen} - title={t("templates.unpublish_confirmation.title")} - content={ - <> - {t("templates.unpublish_confirmation.description.prefix")} - {template.name} - {t("templates.unpublish_confirmation.description.suffix")} - - } - primaryButtonText={{ - default: t("common.confirm"), - loading: t("common.confirming"), - }} - /> - {parentRef && } - - {MENU_ITEMS.map((item) => { - if (item.shouldRender === false) return null; - return ( - { - item.action(); - }} - className={cn( - "flex items-center gap-2", - { - "text-custom-text-400": item.disabled, - }, - item.className + return ( + <> + setIsDeleteModalOpen(false)} + handleSubmit={handleTemplateDeletion} + isSubmitting={isDeleteLoading} + isOpen={isDeleteModalOpen} + title={t("templates.delete_confirmation.title")} + content={ + <> + {t("templates.delete_confirmation.description.prefix")} + {template.name} + {t("templates.delete_confirmation.description.suffix")} + + } + /> + setIsUnpublishModalOpen(false)} + handleSubmit={handleUnpublishTemplate} + isSubmitting={isUnpublishLoading} + isOpen={isUnpublishModalOpen} + title={t("templates.unpublish_confirmation.title")} + content={ + <> + {t("templates.unpublish_confirmation.description.prefix")} + {template.name} + {t("templates.unpublish_confirmation.description.suffix")} + + } + primaryButtonText={{ + default: t("common.confirm"), + loading: t("common.confirming"), + }} + /> + {parentRef && } + + {MENU_ITEMS.map((item) => { + if (item.shouldRender === false) return null; + return ( + { + item.action(); + }} + className={cn( + "flex items-center gap-2", + { + "text-custom-text-400": item.disabled, + }, + item.className + )} + disabled={item.disabled} + > + {item.icon && } +
    +
    {item.title}
    + {item.description && ( +

    + {item.description} +

    )} - disabled={item.disabled} - > - {item.icon && } -
    -
    {item.title}
    - {item.description && ( -

    - {item.description} -

    - )} -
    - - ); - })} - - - ); - } -); +
    +     + ); + })} +     + + ); +}); diff --git a/apps/web/ee/components/templates/settings/list/workspace-root.tsx b/apps/web/ee/components/templates/settings/list/workspace-root.tsx index 149f0c853a..d599399b89 100644 --- a/apps/web/ee/components/templates/settings/list/workspace-root.tsx +++ b/apps/web/ee/components/templates/settings/list/workspace-root.tsx @@ -13,7 +13,9 @@ type TWorkspaceSettingsTemplatesListRoot = { workspaceSlug: string; }; -export const WorkspaceSettingsTemplatesListRoot = observer((props: TWorkspaceSettingsTemplatesListRoot) => { +export const WorkspaceSettingsTemplatesListRoot = observer(function WorkspaceSettingsTemplatesListRoot( + props: TWorkspaceSettingsTemplatesListRoot +) { const { workspaceSlug } = props; // store hooks const { diff --git a/apps/web/ee/components/templates/settings/no-templates.tsx b/apps/web/ee/components/templates/settings/no-templates.tsx index 1d5af807ab..913929e965 100644 --- a/apps/web/ee/components/templates/settings/no-templates.tsx +++ b/apps/web/ee/components/templates/settings/no-templates.tsx @@ -17,7 +17,7 @@ type TNoTemplatesEmptyStateProps = { workspaceSlug: string } & ( } ); -export const NoTemplatesEmptyState = observer((props: TNoTemplatesEmptyStateProps) => { +export const NoTemplatesEmptyState = observer(function NoTemplatesEmptyState(props: TNoTemplatesEmptyStateProps) { // derived values const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/page/create-update.tsx b/apps/web/ee/components/templates/settings/page/create-update.tsx index 0ea58e19b7..210ff976fd 100644 --- a/apps/web/ee/components/templates/settings/page/create-update.tsx +++ b/apps/web/ee/components/templates/settings/page/create-update.tsx @@ -43,7 +43,7 @@ type Props = { } ); -export const CreateUpdatePageTemplate: React.FC = observer((props) => { +export const CreateUpdatePageTemplate = observer(function CreateUpdatePageTemplate(props: Props) { const { workspaceSlug, templateId, currentLevel } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/templates/settings/page/form/editor.tsx b/apps/web/ee/components/templates/settings/page/form/editor.tsx index 159ae0b507..6924b6026b 100644 --- a/apps/web/ee/components/templates/settings/page/form/editor.tsx +++ b/apps/web/ee/components/templates/settings/page/form/editor.tsx @@ -20,7 +20,7 @@ type Props = { onChange: (json: object, html: string) => void; }; -export const PageTemplateEditor = observer((props: Props) => { +export const PageTemplateEditor = observer(function PageTemplateEditor(props: Props) { const { workspaceSlug, projectId, templateId, initialValue, onChange } = props; const { getWorkspaceBySlug } = useWorkspace(); const { uploadEditorAsset, duplicateEditorAsset } = useEditorAsset(); diff --git a/apps/web/ee/components/templates/settings/page/form/page-details.tsx b/apps/web/ee/components/templates/settings/page/form/page-details.tsx index 9b4c41a128..67fe0ea934 100644 --- a/apps/web/ee/components/templates/settings/page/form/page-details.tsx +++ b/apps/web/ee/components/templates/settings/page/form/page-details.tsx @@ -18,7 +18,7 @@ type Props = { templateId: string | undefined; }; -export const PageTemplatePageDetails: React.FC = observer((props) => { +export const PageTemplatePageDetails = observer(function PageTemplatePageDetails(props: Props) { const { workspaceSlug, templateId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/page/form/root.tsx b/apps/web/ee/components/templates/settings/page/form/root.tsx index 4a134503ca..8eb586bd1d 100644 --- a/apps/web/ee/components/templates/settings/page/form/root.tsx +++ b/apps/web/ee/components/templates/settings/page/form/root.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo } from "react"; import { merge } from "lodash-es"; import { observer } from "mobx-react"; @@ -49,7 +47,7 @@ const DEFAULT_PAGE_TEMPLATE_FORM_VALUES: TPageTemplateForm = { }, }; -export const PageTemplateFormRoot: React.FC = observer((props) => { +export const PageTemplateFormRoot = observer(function PageTemplateFormRoot(props: Props) { const { workspaceSlug, operation, preloadedData, handleFormCancel, handleFormSubmit } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/page/form/template-details.tsx b/apps/web/ee/components/templates/settings/page/form/template-details.tsx index 8ded4ca0e6..443fb1a76c 100644 --- a/apps/web/ee/components/templates/settings/page/form/template-details.tsx +++ b/apps/web/ee/components/templates/settings/page/form/template-details.tsx @@ -26,7 +26,9 @@ type TTemplateDetailsProps = { }; }; -export const TemplateDetails = observer((props: TTemplateDetailsProps) => { +export const TemplateDetails = observer(function TemplateDetails( + props: TTemplateDetailsProps +) { const { fieldPaths, validation, placeholders } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/page/loader.tsx b/apps/web/ee/components/templates/settings/page/loader.tsx index 713bfc28c0..e2ab97ee5c 100644 --- a/apps/web/ee/components/templates/settings/page/loader.tsx +++ b/apps/web/ee/components/templates/settings/page/loader.tsx @@ -1,26 +1,28 @@ import { Loader } from "@plane/ui"; -export const PageTemplateLoader = () => ( - - - - - - -
    -
    - - - - +export function PageTemplateLoader() { + return ( + + + + + + +
    +
    + + + + +
    +
    + + + + +
    -
    - - - - -
    -
    + - -); + ); +} diff --git a/apps/web/ee/components/templates/settings/project-root.tsx b/apps/web/ee/components/templates/settings/project-root.tsx index ee2abd5cbb..5513378baa 100644 --- a/apps/web/ee/components/templates/settings/project-root.tsx +++ b/apps/web/ee/components/templates/settings/project-root.tsx @@ -12,7 +12,9 @@ type TProjectTemplatesSettingsRootProps = { projectId: string; }; -export const ProjectTemplatesSettingsRoot: FC = observer((props) => { +export const ProjectTemplatesSettingsRoot = observer(function ProjectTemplatesSettingsRoot( + props: TProjectTemplatesSettingsRootProps +) { const { workspaceSlug, projectId } = props; // store hooks const { isInitializingTemplates: isInitializingWorkItemTemplates, isAnyWorkItemTemplatesAvailableForProject } = diff --git a/apps/web/ee/components/templates/settings/project/create-update.tsx b/apps/web/ee/components/templates/settings/project/create-update.tsx index 7deba6d604..9acb6ade4e 100644 --- a/apps/web/ee/components/templates/settings/project/create-update.tsx +++ b/apps/web/ee/components/templates/settings/project/create-update.tsx @@ -22,7 +22,9 @@ type TCreateUpdateProjectTemplateProps = { templateId?: string; }; -export const CreateUpdateProjectTemplate = observer((props: TCreateUpdateProjectTemplateProps) => { +export const CreateUpdateProjectTemplate = observer(function CreateUpdateProjectTemplate( + props: TCreateUpdateProjectTemplateProps +) { const { workspaceSlug, templateId } = props; // router const router = useAppRouter(); diff --git a/apps/web/ee/components/templates/settings/project/form/attributes/root.tsx b/apps/web/ee/components/templates/settings/project/form/attributes/root.tsx index ba58a21470..57913b1063 100644 --- a/apps/web/ee/components/templates/settings/project/form/attributes/root.tsx +++ b/apps/web/ee/components/templates/settings/project/form/attributes/root.tsx @@ -30,7 +30,7 @@ type TProjectAttributesProps = { ) => void; }; -export const ProjectAttributes = observer((props: TProjectAttributesProps) => { +export const ProjectAttributes = observer(function ProjectAttributes(props: TProjectAttributesProps) { const { workspaceSlug, templateInvalidIds, handleTemplateInvalidIdsChange } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/project/form/base.tsx b/apps/web/ee/components/templates/settings/project/form/base.tsx index 6e1e070d4e..9f58337993 100644 --- a/apps/web/ee/components/templates/settings/project/form/base.tsx +++ b/apps/web/ee/components/templates/settings/project/form/base.tsx @@ -123,7 +123,7 @@ export const DEFAULT_PROJECT_TEMPLATE_FORM_DATA: TProjectTemplateForm = { }, }; -export const ProjectTemplateFormRoot = observer((props: TProjectTemplateFormRootProps) => { +export const ProjectTemplateFormRoot = observer(function ProjectTemplateFormRoot(props: TProjectTemplateFormRootProps) { const { workspaceSlug, templateId, operation, handleFormCancel, handleFormSubmit } = props; const formRef = useRef(null); // router diff --git a/apps/web/ee/components/templates/settings/project/form/epics/root.tsx b/apps/web/ee/components/templates/settings/project/form/epics/root.tsx index 4d45e0bdc9..a048381245 100644 --- a/apps/web/ee/components/templates/settings/project/form/epics/root.tsx +++ b/apps/web/ee/components/templates/settings/project/form/epics/root.tsx @@ -9,7 +9,7 @@ import { cn } from "@plane/utils"; import { EpicPropertiesRoot } from "@/plane-web/components/epics/settings/epics-properties"; import { TemplateCollapsibleWrapper } from "@/plane-web/components/templates/settings/common"; -export const ProjectEpicWorkItemType = observer(() => { +export const ProjectEpicWorkItemType = observer(function ProjectEpicWorkItemType() { // plane hooks const { t } = useTranslation(); // form context diff --git a/apps/web/ee/components/templates/settings/project/form/features/children.tsx b/apps/web/ee/components/templates/settings/project/form/features/children.tsx index 48a1076af3..08b3304535 100644 --- a/apps/web/ee/components/templates/settings/project/form/features/children.tsx +++ b/apps/web/ee/components/templates/settings/project/form/features/children.tsx @@ -13,7 +13,7 @@ type TProjectFeatureChildrenProps = { feature: TProjectFeatureForTemplateKeys; }; -const IntakeFeatureChildren = observer(() => { +const IntakeFeatureChildren = observer(function IntakeFeatureChildren() { // form context const { watch, setValue } = useFormContext(); // derived state @@ -85,7 +85,7 @@ const IntakeFeatureChildren = observer(() => { ); }); -export const ProjectFeatureChildren = observer((props: TProjectFeatureChildrenProps) => { +export const ProjectFeatureChildren = observer(function ProjectFeatureChildren(props: TProjectFeatureChildrenProps) { const { feature } = props; const getFeatureChildren = useCallback(() => { diff --git a/apps/web/ee/components/templates/settings/project/form/features/root.tsx b/apps/web/ee/components/templates/settings/project/form/features/root.tsx index fb661e3455..94aa622b50 100644 --- a/apps/web/ee/components/templates/settings/project/form/features/root.tsx +++ b/apps/web/ee/components/templates/settings/project/form/features/root.tsx @@ -11,7 +11,7 @@ import { PROJECT_FEATURES_LIST_FOR_TEMPLATE } from "@/plane-web/constants"; // local imports import { ProjectFeatureChildren } from "./children"; -export const ProjectFeatures = observer(() => { +export const ProjectFeatures = observer(function ProjectFeatures() { // plane hooks const { t } = useTranslation(); // form context diff --git a/apps/web/ee/components/templates/settings/project/form/labels/root.tsx b/apps/web/ee/components/templates/settings/project/form/labels/root.tsx index 006d8eabcb..580224c815 100644 --- a/apps/web/ee/components/templates/settings/project/form/labels/root.tsx +++ b/apps/web/ee/components/templates/settings/project/form/labels/root.tsx @@ -20,7 +20,7 @@ type TProjectLabelsProps = { projectId: string; }; -export const ProjectLabels = observer((props: TProjectLabelsProps) => { +export const ProjectLabels = observer(function ProjectLabels(props: TProjectLabelsProps) { const { workspaceSlug, projectId } = props; // refs const dragHandleRef = useRef(null); diff --git a/apps/web/ee/components/templates/settings/project/form/loader.tsx b/apps/web/ee/components/templates/settings/project/form/loader.tsx index a29bfe0b4a..f4097a9a2b 100644 --- a/apps/web/ee/components/templates/settings/project/form/loader.tsx +++ b/apps/web/ee/components/templates/settings/project/form/loader.tsx @@ -1,36 +1,38 @@ import { Loader } from "@plane/ui"; -export const ProjectTemplateLoader = () => ( - - - - - - -
    -
    - - - - - - +export function ProjectTemplateLoader() { + return ( + + + + + + +
    +
    + + + + + + + + + + + + + + + + +
    + - - - - - - -
    - - - - -
    + - -); + ); +} diff --git a/apps/web/ee/components/templates/settings/project/form/project-details.tsx b/apps/web/ee/components/templates/settings/project/form/project-details.tsx index db9c64eccd..b5d560cb7c 100644 --- a/apps/web/ee/components/templates/settings/project/form/project-details.tsx +++ b/apps/web/ee/components/templates/settings/project/form/project-details.tsx @@ -12,7 +12,7 @@ import { ImagePickerPopover } from "@/components/core/image-picker-popover"; import { DEFAULT_COVER_IMAGE_URL, getCoverImageDisplayURL } from "@/helpers/cover-image.helper"; import { validateWhitespaceI18n } from "@/plane-web/components/templates/settings/common"; -export const ProjectDetails = observer(() => { +export const ProjectDetails = observer(function ProjectDetails() { // states const [isOpen, setIsOpen] = useState(false); // plane hooks diff --git a/apps/web/ee/components/templates/settings/project/form/states/root.tsx b/apps/web/ee/components/templates/settings/project/form/states/root.tsx index 7615139968..661839944b 100644 --- a/apps/web/ee/components/templates/settings/project/form/states/root.tsx +++ b/apps/web/ee/components/templates/settings/project/form/states/root.tsx @@ -17,7 +17,7 @@ type TProjectStatesProps = { projectId: string; }; -export const ProjectStates = observer((props: TProjectStatesProps) => { +export const ProjectStates = observer(function ProjectStates(props: TProjectStatesProps) { const { workspaceSlug, projectId } = props; // plane hooks const { t } = useTranslation(); diff --git a/apps/web/ee/components/templates/settings/project/form/work-item-types/create-update-modal.tsx b/apps/web/ee/components/templates/settings/project/form/work-item-types/create-update-modal.tsx index ddf77e7fdc..8677f46551 100644 --- a/apps/web/ee/components/templates/settings/project/form/work-item-types/create-update-modal.tsx +++ b/apps/web/ee/components/templates/settings/project/form/work-item-types/create-update-modal.tsx @@ -41,7 +41,7 @@ const defaultIssueTypeData: Partial = { is_epic: false, }; -export const ProjectTemplateWorkItemTypeModal: FC = observer((props) => { +export const ProjectTemplateWorkItemTypeModal = observer(function ProjectTemplateWorkItemTypeModal(props: Props) { const { workspaceSlug, projectTemplateId, diff --git a/apps/web/ee/components/templates/settings/project/form/work-item-types/delete-modal.tsx b/apps/web/ee/components/templates/settings/project/form/work-item-types/delete-modal.tsx index 1bd67c2434..385f4a3632 100644 --- a/apps/web/ee/components/templates/settings/project/form/work-item-types/delete-modal.tsx +++ b/apps/web/ee/components/templates/settings/project/form/work-item-types/delete-modal.tsx @@ -19,7 +19,7 @@ type TProps = { getWorkItemTypeById: (workItemTypeId: string) => IIssueType | undefined; }; -export const DeleteWorkItemTypeModal: FC = observer((props) => { +export const DeleteWorkItemTypeModal = observer(function DeleteWorkItemTypeModal(props: TProps) { const { issueTypeId, isModalOpen, handleModalClose, handleEnableDisable, handleDelete, getWorkItemTypeById } = props; const [isDeleting, setIsDeleting] = useState(false); // plane hooks diff --git a/apps/web/ee/components/templates/settings/project/form/work-item-types/root.tsx b/apps/web/ee/components/templates/settings/project/form/work-item-types/root.tsx index 7d1d1be2c5..8b80d92ba7 100644 --- a/apps/web/ee/components/templates/settings/project/form/work-item-types/root.tsx +++ b/apps/web/ee/components/templates/settings/project/form/work-item-types/root.tsx @@ -23,7 +23,7 @@ type TProjectWorkItemTypesProps = { getCustomPropertyById: (customPropertyId: string) => IIssueProperty | undefined; }; -export const ProjectWorkItemTypes = observer((props: TProjectWorkItemTypesProps) => { +export const ProjectWorkItemTypes = observer(function ProjectWorkItemTypes(props: TProjectWorkItemTypesProps) { const { workspaceSlug, projectTemplateId, getWorkItemTypeById, getCustomPropertyById } = props; // states const [isModalOpen, setIsModalOpen] = useState(false); diff --git a/apps/web/ee/components/templates/settings/publish/form/additional-details.tsx b/apps/web/ee/components/templates/settings/publish/form/additional-details.tsx index e1bd03582e..4f852ac82e 100644 --- a/apps/web/ee/components/templates/settings/publish/form/additional-details.tsx +++ b/apps/web/ee/components/templates/settings/publish/form/additional-details.tsx @@ -19,7 +19,7 @@ import { TemplateCoverImageUpload } from "./template-cover-image-upload"; const COMMON_DROPDOWN_CONTAINER_CLASSNAME = "bg-custom-background-100 border-[0.5px] border-custom-border-200 rounded-md px-2 py-1 h-8 w-full"; -export const TemplateAdditionalDetails = observer(() => { +export const TemplateAdditionalDetails = observer(function TemplateAdditionalDetails() { // plane hooks const { t } = useTranslation(); // form context diff --git a/apps/web/ee/components/templates/settings/publish/form/base.tsx b/apps/web/ee/components/templates/settings/publish/form/base.tsx index 2b79527ea1..98a806da31 100644 --- a/apps/web/ee/components/templates/settings/publish/form/base.tsx +++ b/apps/web/ee/components/templates/settings/publish/form/base.tsx @@ -1,5 +1,3 @@ -"use client"; - import React, { useMemo } from "react"; import { merge } from "lodash-es"; import { observer } from "mobx-react"; @@ -41,57 +39,57 @@ const DEFAULT_PUBLISH_TEMPLATE_FORM_VALUES: TPublishTemplateFormWithData = { website: "", }; -export const PublishTemplateFormRoot = observer( - (props: TPublishTemplateFormRootProps) => { - const { templateInstance, handleFormCancel, handleFormSubmit } = props; - // plane hooks - const { t } = useTranslation(); - // form state - const defaultValueForReset = useMemo( - () => merge({}, DEFAULT_PUBLISH_TEMPLATE_FORM_VALUES, templateInstance.asPublishableJSON), - [templateInstance.asPublishableJSON] - ); - const methods = useForm({ - defaultValues: defaultValueForReset, - }); - const { - handleSubmit, - formState: { isSubmitting }, - } = methods; +export const PublishTemplateFormRoot = observer(function PublishTemplateFormRoot( + props: TPublishTemplateFormRootProps +) { + const { templateInstance, handleFormCancel, handleFormSubmit } = props; + // plane hooks + const { t } = useTranslation(); + // form state + const defaultValueForReset = useMemo( + () => merge({}, DEFAULT_PUBLISH_TEMPLATE_FORM_VALUES, templateInstance.asPublishableJSON), + [templateInstance.asPublishableJSON] + ); + const methods = useForm({ + defaultValues: defaultValueForReset, + }); + const { + handleSubmit, + formState: { isSubmitting }, + } = methods; - return ( - -
    - {/* Template Basic Details */} - - {/* Template Additional Details */} - - {/* Form Actions */} -
    -
    - - -
    + return ( + + + {/* Template Basic Details */} + + {/* Template Additional Details */} + + {/* Form Actions */} +
    +
    + +
    - - - ); - } -); +
    + +     + ); +}); diff --git a/apps/web/ee/components/templates/settings/publish/form/basic-details.tsx b/apps/web/ee/components/templates/settings/publish/form/basic-details.tsx index 376bbd8dae..e0c7375c80 100644 --- a/apps/web/ee/components/templates/settings/publish/form/basic-details.tsx +++ b/apps/web/ee/components/templates/settings/publish/form/basic-details.tsx @@ -23,142 +23,140 @@ type TTemplateBasicDetailsProps = { templateInstance: IBaseTemplateInstance; }; -export const TemplateBasicDetails = observer( - (props: TTemplateBasicDetailsProps) => { - const { templateInstance } = props; - // refs - const editorRef = useRef(null); - // plane hooks - const { t } = useTranslation(); - // use editor mention search - const { searchEntity } = useEditorMentionSearch({ - memberIds: [], - }); - // form context - const { - control, - formState: { errors }, - } = useFormContext(); - // derived values - const workspaceSlug = templateInstance.getWorkspaceSlugForTemplateInstance; - const workspaceId = templateInstance.workspace; - const projectId = templateInstance.project; +export const TemplateBasicDetails = observer(function TemplateBasicDetails( + props: TTemplateBasicDetailsProps +) { + const { templateInstance } = props; + // refs + const editorRef = useRef(null); + // plane hooks + const { t } = useTranslation(); + // use editor mention search + const { searchEntity } = useEditorMentionSearch({ + memberIds: [], + }); + // form context + const { + control, + formState: { errors }, + } = useFormContext(); + // derived values + const workspaceSlug = templateInstance.getWorkspaceSlugForTemplateInstance; + const workspaceId = templateInstance.workspace; + const projectId = templateInstance.project; - if (!workspaceSlug) return null; - return ( - <> - {/* Template Name */} -
    -

    {t("templates.settings.form.publish.name.label")}

    - { - const result = validateWhitespaceI18n(value); - if (result) { - return t(result); - } - return undefined; - }, - required: t("templates.settings.form.publish.name.validation.required"), - maxLength: { - value: 255, - message: t("templates.settings.form.publish.name.validation.maxLength"), - }, - }} - render={({ field: { value, onChange, ref } }) => ( - - )} - /> - {errors?.name && typeof errors.name.message === "string" && ( - {errors.name.message} + if (!workspaceSlug) return null; + return ( + <> + {/* Template Name */} +
    +

    {t("templates.settings.form.publish.name.label")}

    + { + const result = validateWhitespaceI18n(value); + if (result) { + return t(result); + } + return undefined; + }, + required: t("templates.settings.form.publish.name.validation.required"), + maxLength: { + value: 255, + message: t("templates.settings.form.publish.name.validation.maxLength"), + }, + }} + render={({ field: { value, onChange, ref } }) => ( + )} -
    - {/* Template Short Description */} -
    -

    - {t("templates.settings.form.publish.short_description.label")} -

    - ( -