Repository: twentyhq/twenty
File: packages/twenty-front/src/modules/settings/accounts/utils/computeSyncStatus.ts (TypeScript)

Code before:
import { CalendarChannelSyncStatus } from '@/accounts/types/CalendarChannel';
import { MessageChannelSyncStatus } from '@/accounts/types/MessageChannel';
import { SyncStatus } from '@/settings/accounts/constants/SyncStatus';

export const computeSyncStatus = (
  messageChannelSyncStatus: MessageChannelSyncStatus,
  calendarChannelSyncStatus: CalendarChannelSyncStatus,
) => {
  if (
    messageChannelSyncStatus === MessageChannelSyncStatus.FAILED_UNKNOWN ||
    messageChannelSyncStatus ===
      MessageChannelSyncStatus.FAILED_INSUFFICIENT_PERMISSIONS ||
    calendarChannelSyncStatus === CalendarChannelSyncStatus.FAILED_UNKNOWN ||
    calendarChannelSyncStatus ===
      CalendarChannelSyncStatus.FAILED_INSUFFICIENT_PERMISSIONS
  ) {
    return SyncStatus.FAILED;
  }

  if (
    messageChannelSyncStatus === MessageChannelSyncStatus.ONGOING ||
    calendarChannelSyncStatus === CalendarChannelSyncStatus.ONGOING
  ) {
    return SyncStatus.IMPORTING;
  }

  if (
    messageChannelSyncStatus === MessageChannelSyncStatus.NOT_SYNCED &&
    calendarChannelSyncStatus === CalendarChannelSyncStatus.NOT_SYNCED
  ) {
    return SyncStatus.NOT_SYNCED;
  }

  if (
    messageChannelSyncStatus === MessageChannelSyncStatus.ACTIVE ||
    calendarChannelSyncStatus === CalendarChannelSyncStatus.ACTIVE
  ) {
    return SyncStatus.SYNCED;
  }

Review comment (suggestion):
I don't want to over engineer so I'm fine with this but the whole idea of syncStatus was to be UI facing whereas syncStage was technical.

Now we are mixing them both again
Out of curiosity, what is the syncStatus of channels in MessageChannelSyncStage.PENDING_CONFIGURATION when they are created?

If we want to the things cleanly, we should also add a PENDING_CONFIGURATION syncStatus in the enum (upgrade command). Later we can put the channel in this syncStatus at creation and use it in the UI

Code after:
import {
  type CalendarChannel,
  CalendarChannelSyncStage,
  CalendarChannelSyncStatus,
} from '@/accounts/types/CalendarChannel';
import {
  type MessageChannel,
  MessageChannelSyncStage,
  MessageChannelSyncStatus,
} from '@/accounts/types/MessageChannel';
import { SyncStatus } from '@/settings/accounts/constants/SyncStatus';

export const computeSyncStatus = (
  messageChannel?: Pick<MessageChannel, 'syncStatus' | 'syncStage'>,
  calendarChannel?: Pick<CalendarChannel, 'syncStatus' | 'syncStage'>,
): SyncStatus => {
  const {
    syncStatus: messageChannelSyncStatus,
    syncStage: messageChannelSyncStage,
  } = messageChannel ?? {};

  const {
    syncStatus: calendarChannelSyncStatus,
    syncStage: calendarChannelSyncStage,
  } = calendarChannel ?? {};

  if (
    messageChannelSyncStage === MessageChannelSyncStage.PENDING_CONFIGURATION ||
    calendarChannelSyncStage === CalendarChannelSyncStage.PENDING_CONFIGURATION
  ) {
    return SyncStatus.PENDING_CONFIGURATION;
  }

  if (
    messageChannelSyncStatus === MessageChannelSyncStatus.FAILED_UNKNOWN ||
    messageChannelSyncStatus ===
      MessageChannelSyncStatus.FAILED_INSUFFICIENT_PERMISSIONS ||
    calendarChannelSyncStatus === CalendarChannelSyncStatus.FAILED_UNKNOWN ||
    calendarChannelSyncStatus ===