chore: assign todos (#7297)

2026-07-18 10:36:22 +08:00 · 2024-06-21 07:54:14 +00:00
parent e085b927f6
commit 7b3673ae82
121 changed files with 137 additions and 157 deletions
@@ -19,7 +19,7 @@ export const renderInput = (
          <Input type="number" value={value} onChange={onChange} />
        </div>
      );
-    //TODO: add more types
+    // TODO(@JimmFly): add more types
    default:
      return null;
  }
@@ -30,21 +30,21 @@ const imageMap = new Map([
  [
    ErrorStatus.NotFound,
    {
-      light: imageUrlFor404, // TODO: Ask designer for dark/light mode image.
+      light: imageUrlFor404, // TODO(@catsjuice): Ask designer for dark/light mode image.
      dark: imageUrlFor404,
    },
  ],
  [
    ErrorStatus.Unexpected,
    {
-      light: imageUrlForLight500, // TODO: Split assets lib and use image hook to handle light and dark.
+      light: imageUrlForLight500, // TODO(@catsjuice): Split assets lib and use image hook to handle light and dark.
      dark: imageUrlForDark500,
    },
  ],
 ]);

 /**
- * TODO: Unify with NotFoundPage.
+ * TODO(@eyhn): Unify with NotFoundPage.
 */
 export const ErrorDetail: FC<ErrorDetailProps> = props => {
  const {
@@ -6,7 +6,7 @@ import { ErrorDetail } from '../error-basic/error-detail';
 import type { FallbackProps } from '../error-basic/fallback-creator';

 /**
- * TODO: Support reload and retry two reset actions in page error and area error.
+ * TODO(@eyhn): Support reload and retry two reset actions in page error and area error.
 */
 export const AnyErrorFallback: FC<FallbackProps> = props => {
  const { error } = props;
@@ -11,7 +11,7 @@ export interface AffineErrorBoundaryProps extends PropsWithChildren {
 }

 /**
- * TODO: Unify with SWRErrorBoundary
+ * TODO(@eyhn): Unify with SWRErrorBoundary
 */
 export const AffineErrorBoundary: FC<AffineErrorBoundaryProps> = props => {
  const fallbackRender: FallbackRender = useCallback(
@@ -18,7 +18,7 @@ export interface SliderProps<T> extends HTMLAttributes<HTMLDivElement> {
 }

 /**
- * TODO: extract to @affine/ui
+ * TODO(@catsjuice): extract to @affine/ui
 * @returns
 */
 export const Slider = <T,>({
@@ -25,7 +25,7 @@ const OAuthProviderMap: Record<
  },

  [OAuthProviderType.OIDC]: {
-    // TODO: Add OIDC icon
+    // TODO(@catsjuice): Add OIDC icon
    icon: <GoogleDuotoneIcon />,
  },
 };
@@ -114,7 +114,7 @@ const useSendEmail = (emailType: AuthPanelProps['emailType']) => {
            callbackUrl = 'verify-email';
            break;
        }
-        // TODO: add error handler
+        // TODO(@eyhn): add error handler
        return trigger({
          email,
          callbackUrl: `/auth/${callbackUrl}?isClient=${
@@ -152,7 +152,7 @@ export const SendEmail = ({
  const { loading, sendEmail } = useSendEmail(emailType);

  const onSendEmail = useAsyncCallback(async () => {
-    // TODO: add error handler
+    // TODO(@eyhn): add error handler
    await sendEmail(email);

    notify.success({ title: hint });
@@ -164,7 +164,7 @@ export const SendEmail = ({
  }, [setAuthState]);

  if (!passwordLimits) {
-    // TODO: loading & error UI
+    // TODO(@eyhn): loading & error UI
    return null;
  }

@@ -62,7 +62,7 @@ export const SignInWithPassword: FC<AuthPanelProps> = ({
      notify.error({
        title: 'Failed to send email, please try again.',
      });
-      // TODO: handle error better
+      // TODO(@eyhn): handle error better
    }
    setSendingEmail(false);
  }, [sendingEmail, verifyToken, authService, email, challenge, setAuthState]);
@@ -98,7 +98,7 @@ export const SignIn: FC<AuthPanelProps> = ({
    } catch (err) {
      console.error(err);

-      // TODO: better error handling
+      // TODO(@eyhn): better error handling
      notify.error({
        title: 'Failed to send email. Please try again.',
      });
@@ -14,7 +14,7 @@ const SyncAwarenessInnerLoggedIn = () => {
        'user',
        {
          name: account.label,
-          // todo: add avatar?
+          // TODO(@eyhn): add avatar?
        }
      );

@@ -42,7 +42,7 @@ const SyncAwarenessInner = () => {
  return null;
 };

-// todo: we could do something more interesting here, e.g., show where the current user is
+// TODO(@eyhn): we could do something more interesting here, e.g., show where the current user is
 export const SyncAwareness = () => {
  return (
    <Suspense>
@@ -101,7 +101,7 @@ const NameWorkspaceContent = ({
    },
    [handleCreateWorkspace, workspaceName]
  );
-  // TODO: Support uploading avatars.
+
  // Currently, when we create a new workspace and upload an avatar at the same time,
  // an error occurs after the creation is successful: get blob 404 not found
  return (
@@ -186,7 +186,7 @@ export const CreateWorkspaceModal = ({
  const workspacesService = useService(WorkspacesService);
  const [loading, setLoading] = useState(false);

-  // todo: maybe refactor using xstate?
+  // TODO(@Peng): maybe refactor using xstate?
  useLayoutEffect(() => {
    let canceled = false;
    // if mode changed, reset step
@@ -21,7 +21,7 @@ globalStyle(`${block} p`, {
  lineHeight: '23px',
 });
 globalStyle(`${block} b`, {
-  // TODO: 500's effect not matching the design, use 600 for now
+  // TODO(@catsjuice): 500's effect not matching the design, use 600 for now
  fontWeight: '600',
 });
 globalStyle(`${block} ol`, {
@@ -1,6 +1,6 @@
 import { article, articleWrapper, text, title } from '../curve-paper/paper.css';
 import type { ArticleId, ArticleOption, EdgelessSwitchState } from '../types';
-// TODO: lazy load
+// TODO(@catsjuice): lazy load
 import { article0 } from './article-0';
 import { article1 } from './article-1';
 import { article2 } from './article-2';
@@ -113,7 +113,7 @@ export const EdgelessSwitch = ({
      turnOffScalingRef.current?.();
    };

-    // TODO: mobile support
+    // TODO(@catsjuice): mobile support
    const onMouseDown = (e: MouseEvent) => {
      const target = e.target as HTMLElement;
      if (target.closest('[data-no-drag]')) return;
@@ -94,7 +94,7 @@ const snapshotFetcher = async (

 // attach the Page shown in the modal to a temporary workspace
 // so that we do not need to worry about providers etc
-// todo: fix references to the page (the referenced page will shown as deleted)
+// TODO(@Peng): fix references to the page (the referenced page will shown as deleted)
 // if we simply clone the current workspace, it maybe time consuming right?
 const docCollectionMap = new Map<string, DocCollection>();

@@ -247,7 +247,7 @@ const PlanPrompt = () => {
              : t[
                  'com.affine.history.confirm-restore-modal.plan-prompt.title'
                ]()
-            : '' /* TODO: loading UI */
+            : '' /* TODO(@catsjuice): loading UI */
        }

        <IconButton
@@ -35,7 +35,7 @@ export const newPropertyTypes: PagePropertyType[] = [
  PagePropertyType.Number,
  PagePropertyType.Checkbox,
  PagePropertyType.Date,
-  // todo: add more
+  // TODO(@Peng): add more
 ];

 export class PagePropertiesMetaManager {
@@ -188,7 +188,7 @@ export const propertyValueRenderers: Record<
  checkbox: CheckboxValue,
  text: TextValue,
  number: NumberValue,
-  // todo: fix following
+  // TODO(@Peng): fix following
  tags: TagsValue,
  progress: TextValue,
 };
@@ -682,7 +682,7 @@ export const PagePropertiesTableHeader = ({

  return (
    <div className={clsx(styles.tableHeader, className)} style={style}>
-      {/* todo: add click handler to backlinks */}
+      {/* TODO(@Peng): add click handler to backlinks */}
      <div className={styles.tableHeaderInfoRow}>
        {backlinks.length > 0 ? (
          <PageBacklinksPopup backlinks={backlinks}>
@@ -63,7 +63,7 @@ export const AIUsagePanel = () => {
          desc={''}
          spreadCol={false}
        >
-          {/* TODO: i18n */}
+          {/* TODO(@catsjuice): i18n */}
          <ErrorMessage>Load error</ErrorMessage>
        </SettingRow>
      );
@@ -44,7 +44,7 @@ export const UserAvatar = () => {
        await session.uploadAvatar(file);
        notify.success({ title: 'Update user avatar success' });
      } catch (e) {
-        // TODO: i18n
+        // TODO(@catsjuice): i18n
        notify.error({
          title: 'Update user avatar failed',
          message: String(e),
@@ -63,10 +63,9 @@ export const StorageProgress = ({ onUpgrade }: StorageProgressProgress) => {

  if (loading) {
    if (loadError) {
-      // TODO: i18n
+      // TODO(@catsjuice): i18n
      return <ErrorMessage>Load error</ErrorMessage>;
    }
-    // TODO: loading UI
    return <Skeleton height={42} />;
  }

@@ -349,7 +349,6 @@ const PlanAction = ({
 };

 const PaymentMethodUpdater = () => {
-  // TODO: open stripe customer portal
  const { isMutating, trigger } = useMutation({
    mutation: createCustomerPortalMutation,
  });
@@ -475,7 +474,6 @@ const InvoiceLine = ({
    <SettingRow
      key={invoice.id}
      name={new Date(invoice.createdAt).toLocaleDateString()}
-      // TODO: currency to format: usd => $, cny => ¥
      desc={`${
        invoice.status === InvoiceStatus.Paid
          ? t['com.affine.payment.billing-setting.paid']()
@@ -181,7 +181,7 @@ const ExperimentalFeaturesMain = () => {
  );
 };

-// todo: save to workspace meta instead?
+// TODO(@Peng): save to workspace meta instead?
 const experimentalFeaturesDisclaimerAtom = atomWithStorage(
  'affine:experimental-features-disclaimer',
  false
@@ -63,7 +63,7 @@ export const AISubscribe = ({ ...btnProps }: AISubscribeProps) => {
  }, [idempotencyKey, subscriptionService]);

  if (!price || !price.yearlyAmount) {
-    // TODO: loading UI
+    // TODO(@catsjuice): loading UI
    return null;
  }

@@ -41,7 +41,7 @@ const benefitsGetter = (t: ReturnType<typeof useI18n>) => [
 export const AIBenefits = () => {
  const t = useI18n();
  const benefits = useMemo(() => benefitsGetter(t), [t]);
-  // TODO: responsive
+  // TODO(@catsjuice): responsive
  return (
    <div className={styles.benefits}>
      {benefits.map(({ name, icon, items }) => {
@@ -1,5 +1,3 @@
-// TODO: we don't handle i18n for now
-// it's better to manage all equity at server side
 import { SubscriptionPlan, SubscriptionRecurring } from '@affine/graphql';
 import type { useI18n } from '@affine/i18n';
 import { AfFiNeIcon } from '@blocksuite/icons/rc';
@@ -105,7 +105,7 @@ export const PlanLayout = ({ cloud, ai, aiTip }: PlanLayoutProps) => {
    }
  }, [aiTip, settingModalScrollContainer]);

-  // TODO: Need a better solution to handle this situation
+  // TODO(@catsjuice): Need a better solution to handle this situation
  useLayoutEffect(() => {
    if (!scrollAnchor) return;
    setTimeout(() => {
@@ -135,7 +135,7 @@ export const PlanLayout = ({ cloud, ai, aiTip }: PlanLayoutProps) => {

  return (
    <div className={styles.plansLayoutRoot}>
-      {/* TODO: SettingHeader component shouldn't have margin itself  */}
+      {/* TODO(@catsjuice): SettingHeader component shouldn't have margin itself  */}
      <SettingHeader
        style={{ marginBottom: '0px' }}
        title={t['com.affine.payment.title']()}
@@ -18,7 +18,7 @@ const RoundedSkeleton = ({
 );

 const TabsSkeleton = () => (
-  // TODO: height should be `32px` by design
+  // TODO(@catsjuice): height should be `32px` by design
  // but the RadioGroup component is not matching with the design currently
  // set to `24px` for now to avoid blinking
  <Skeleton variant="rounded" width="256px" height="24px" />
@@ -84,7 +84,7 @@ export const planCardBorderMock = style({
    bottom: 0,
    borderRadius: 'inherit',
    border: `2px solid transparent`,
-    // TODO: brandColor with opacity, dark mode compatibility needed
+    // TODO(@catsjuice): brandColor with opacity, dark mode compatibility needed
    background: `linear-gradient(180deg, ${cssVar('brandColor')}, #1E96EB33) border-box`,
    ['WebkitMask']: `linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0)`,
    [`WebkitMaskComposite`]: `destination-out`,
@@ -38,7 +38,7 @@ export type UserInfoProps = {
 export const UserInfo = ({ onAccountSettingClick, active }: UserInfoProps) => {
  const account = useLiveData(useService(AuthService).session.account$);
  if (!account) {
-    // TODO: loading ui
+    // TODO(@eyhn): loading ui
    return;
  }
  return (
@@ -70,7 +70,7 @@ export const DeleteLeaveWorkspace = () => {
      const backWorkspace = workspaceList.find(
        ws => ws.id !== currentWorkspaceId
      );
-      // TODO: if there is no workspace, jump to a new page(wait for design)
+      // TODO(@eyhn): if there is no workspace, jump to a new page(wait for design)
      if (backWorkspace) {
        jumpToSubPath(
          backWorkspace?.id || '',
@@ -81,7 +81,7 @@ export const LabelsPanel = () => {
      condition: workspace.flavour === 'affine-cloud',
      label: 'syncCloud',
    },
-    //TODO: add these labels
+    //TODO(@JimmFly): add these labels
    // { status==="synced", label: 'availableOffline' }
    // { workspace.flavour === 'affine-Docker', label: 'syncDocker' }
    // { workspace.flavour === 'self-hosted', label: 'selfHosted' }
@@ -197,7 +197,7 @@ export const CloudWorkspaceMembersPanel = () => {
  }, [handleUpgradeConfirm, hasPaymentFeature, t, workspaceQuota]);

  if (workspaceQuota === null) {
-    // TODO: loading ui
+    // TODO(@eyhn): loading ui
    return null;
  }

@@ -29,7 +29,7 @@ export const descriptionStyle = style({
 });
 export const buttonStyle = style({
  marginTop: '18px',
-  // todo: new color scheme should be used
+  // todo(@JimmFly): new color scheme should be used
 });
 export const actionsStyle = style({
  display: 'flex',
@@ -211,7 +211,7 @@ export const AffineSharePage = (props: ShareMenuProps) => {
  );

  if (isLoading) {
-    // TODO: loading and error UI
+    // TODO(@eyhn): loading and error UI
    return (
      <>
        <Skeleton height={100} />
@@ -341,7 +341,7 @@ export const SharePage = (props: ShareMenuProps) => {
    props.workspaceMetadata.flavour === WorkspaceFlavour.AFFINE_CLOUD
  ) {
    return (
-      // TODO: refactor this part
+      // TODO(@eyhn): refactor this part
      <ErrorBoundary fallback={null}>
        <Suspense>
          <AffineSharePage {...props} />
@@ -19,7 +19,7 @@ export function AppDownloadButton({
    setShow(false);
  }, []);

-  // TODO: unify this type of literal value.
+  // TODO(@JimmFly): unify this type of literal value.
  const handleClick = useCallback(() => {
    mixpanel.track('Button', {
      resolve: 'GoToDownloadAppPage',
@@ -16,7 +16,7 @@ type toTextStreamOptions = {
  signal?: AbortSignal;
 };

-// todo: may need to extend the error type
+// todo(@Peng): may need to extend the error type
 const safeParseError = (data: string): { status: number } => {
  try {
    return JSON.parse(data);
@@ -1,5 +1,5 @@
 // manually synced with packages/backend/server/src/data/migrations/utils/prompts.ts
-// todo: automate this
+// TODO(@Peng): automate this
 export const promptKeys = [
  'debug:chat:gpt4',
  'debug:action:gpt4',
@@ -9,7 +9,7 @@ export const BlocksuiteEditorJournalDocTitle = ({ page }: { page: Doc }) => {
    useJournalInfoHelper(page.collection, page.id);
  const t = useI18n();

-  // TODO: i18n
+  // TODO(catsjuice): i18n
  const day = journalDate?.format('dddd') ?? null;

  return (
@@ -2,7 +2,7 @@ import type { Doc } from '@blocksuite/store';
 import type { Map as YMap } from 'yjs';

 /**
- * TODO: Define error to unexpected state together in the future.
+ * TODO(@eyhn): Define error to unexpected state together in the future.
 */
 export class NoPageRootError extends Error {
  constructor(public page: Doc) {
@@ -223,7 +223,7 @@ export const PageHeaderMenuButton = ({
          ? t['com.affine.favoritePageOperation.remove']()
          : t['com.affine.favoritePageOperation.add']()}
      </MenuItem>
-      {/* {TODO: add tag function support} */}
+      {/* {TODO(@Peng): add tag function support} */}
      {/* <MenuItem
        icon={<TagsIcon />}
        data-testid="editor-option-menu-add-tag"
@@ -12,7 +12,7 @@ export const usePresent = () => {
      const editorHost = editor?.host;
      if (!editorHost) return;

-      // TODO: use surfaceService subAtom
+      // TODO(@catsjuice): use surfaceService subAtom
      const enterOrLeavePresentationMode = () => {
        const edgelessRootService = editorHost.spec.getService(
          'affine:page'
@@ -18,7 +18,7 @@ const ShareHeaderRightItem = ({ ...props }: ShareHeaderRightItemProps) => {
  const { publishMode } = props;
  const [isMember, setIsMember] = useState(false);

-  // TODO: Add TOC
+  // TODO(@JimmFly): Add TOC
  return (
    <div className={styles.rightItemContainer}>
      {loginStatus === 'authenticated' ? (
@@ -24,7 +24,7 @@ const UserInfo = () => {
  const plan = useLiveData(subscription.pro$)?.plan;

  if (!user) {
-    // TODO: loading UI
+    // TODO(@eyhn): loading UI
    return null;
  }
  return (
@@ -66,7 +66,7 @@ globalStyle(`[data-draggable=true][data-dragging=true] ${dndCell}:before`, {
  opacity: 1,
 });

-// todo: remove global style
+// TODO(@JimmFly): remove global style
 globalStyle(`${root} > :first-child`, {
  paddingLeft: '16px',
 });
@@ -109,7 +109,7 @@ export const CollectionListItem = (props: CollectionListItemProps) => {
    props.title,
  ]);

-  // TODO: use getDropItemId
+  // TODO(@JimmFly): use getDropItemId
  const { setNodeRef, attributes, listeners, isDragging } = useDraggable({
    id: getDNDId('collection-list', 'collection', props.collectionId),
    data: {
@@ -66,7 +66,7 @@ globalStyle(`[data-draggable=true][data-dragging=true] ${dndCell}:before`, {
  opacity: 1,
 });

-// todo: remove global style
+// TODO(@JimmFly): remove global style
 globalStyle(`${root} > :first-child`, {
  paddingLeft: '16px',
 });
@@ -167,7 +167,7 @@ export const PageListItem = (props: PageListItemProps) => {
    props.title,
  ]);

-  // TODO: use getDropItemId
+  // TODO(@JimmFly): use getDropItemId
  const { setNodeRef, attributes, listeners, isDragging } = useDraggable({
    id: getDNDId('doc-list', 'doc', props.pageId),
    data: {
@@ -35,7 +35,7 @@ const GroupLabel = ({
  </div>
 );

-// todo: optimize date matchers
+// TODO(@JimmFly): optimize date matchers
 export const useDateGroupDefinitions = <T extends ListItem>(
  key: DateKey
 ): ItemGroupDefinition<T>[] => {
@@ -223,7 +223,7 @@ export const usePageItemGroupDefinitions = () => {
      none: undefined,

      // add more here later
-      // todo: some page group definitions maybe dynamic
+      // todo(@JimmFly): some page group definitions maybe dynamic
    };
    return itemGroupDefinitions[workspaceProperties.groupBy];
  }, [
@@ -43,7 +43,7 @@ export const List = forwardRef<ItemListHandle, ListProps<ListItem>>(
 );

 // when pressing ESC or double clicking outside of the page list, close the selection mode
-// todo: use jotai-effect instead but it seems it does not work with jotai-scope?
+// TODO(@Peng): use jotai-effect instead but it seems it does not work with jotai-scope?
 const useItemSelectionStateEffect = () => {
  const [selectionState, setSelectionActive] = useAtom(selectionStateAtom);
  useEffect(() => {
@@ -194,7 +194,7 @@ export const ItemGroup = <T extends ListItem>({
  );
 };

-// todo: optimize how to render page meta list item
+// TODO(@Peng): optimize how to render page meta list item
 const requiredPropNames = [
  'docCollection',
  'rowAsLink',
@@ -65,7 +65,7 @@ globalStyle(`[data-draggable=true][data-dragging=true] ${dndCell}:before`, {
  opacity: 1,
 });

-// todo: remove global style
+// TODO(@JimmFly): remove global style
 globalStyle(`${root} > :first-child`, {
  paddingLeft: '16px',
 });
@@ -98,7 +98,7 @@ export const TagListItem = (props: TagListItemProps) => {
    );
  }, [props.color, props.onSelectedChange, props.selectable, props.selected]);

-  // TODO: use getDropItemId
+  // TODO(@JimmFly): use getDropItemId
  const { setNodeRef, attributes, listeners, isDragging } = useDraggable({
    id: getDNDId('tag-list', 'tag', props.tagId),
    data: {
@@ -19,7 +19,7 @@ export type TagMeta = {
  createDate?: Date | number;
  updatedDate?: Date | number;
 };
-// TODO: consider reducing the number of props here
+// TODO(@JimmFly): consider reducing the number of props here
 // using type instead of interface to make it Record compatible
 export type PageListItemProps = {
  pageId: string;
@@ -73,10 +73,10 @@ export type TagListItemProps = {

 export interface ItemListHeaderProps {}

-// todo: a temporary solution. may need to be refactored later
-export type ItemGroupByType = 'createDate' | 'updatedDate'; // todo: can add more later
+// TODO(@JimmFly): a temporary solution. may need to be refactored later
+export type ItemGroupByType = 'createDate' | 'updatedDate'; // TODO(@JimmFly): can add more later

-// todo: a temporary solution. may need to be refactored later
+// TODO(@JimmFly): a temporary solution. may need to be refactored later
 export interface SortBy {
  key: 'createDate' | 'updatedDate';
  order: 'asc' | 'desc';
@@ -32,7 +32,7 @@ export const useFilteredPageMetas = (
  );

  useEffect(() => {
-    // TODO: loading & error UI
+    // TODO(@eyhn): loading & error UI
    shareDocsService.shareDocs?.revalidate();
  }, [shareDocsService]);

@@ -206,7 +206,7 @@ const ListInner = ({
      totalCount={virtuosoItems.length}
      itemContent={itemContentRenderer}
      className={clsx(props.className, styles.root)}
-      // todo: set a reasonable overscan value to avoid blank space?
+      // TODO(@Peng): set a reasonable overscan value to avoid blank space?
      // overscan={100}
    />
  );
@@ -135,7 +135,7 @@ const useSyncEngineSyncProgress = () => {
  }, [currentWorkspace, isOwner, jumpToPricePlan, t]);

  const content = useMemo(() => {
-    // TODO: add i18n
+    // TODO(@eyhn): add i18n
    if (currentWorkspace.flavour === WorkspaceFlavour.LOCAL) {
      if (!environment.isDesktop) {
        return 'This is a local demo workspace.';
@@ -22,7 +22,7 @@ export const userInfoWrapper = style({
  padding: '4px 0',
 });

-// TODO:
+// TODO(@catsjuice):
 globalStyle(`button.${userInfoWrapper} > span`, {
  lineHeight: 0,
 });
@@ -1,7 +1,7 @@
 import type React from 'react';

 /**
- * TODO: Define a place to manage all icons and svg images.
+ * TODO(@eyhn): move to icons package
 */
 export const ArrowCircleIcon = (props: React.SVGProps<SVGSVGElement>) => {
  return (
@@ -1,5 +1,5 @@
 import { Button } from '@affine/component/ui/button';
-import { AffineShapeIcon } from '@affine/core/components/page-list'; // TODO: import from page-list temporarily, need to defined common svg icon/images management.
+import { AffineShapeIcon } from '@affine/core/components/page-list'; // TODO(@eyhn): import from page-list temporarily, need to defined common svg icon/images management.
 import { useAsyncCallback } from '@affine/core/hooks/affine-async-hooks';
 import { useNavigateHelper } from '@affine/core/hooks/use-navigate-helper';
 import { WorkspaceSubPath } from '@affine/core/shared';
@@ -12,7 +12,7 @@ import * as styles from './upgrade.css';
 import { ArrowCircleIcon, HeartBreakIcon } from './upgrade-icon';

 /**
- * TODO: Help info is not implemented yet.
+ * TODO(@eyhn): Help info is not implemented yet.
 */
 export const WorkspaceUpgrade = function WorkspaceUpgrade() {
  const [error, setError] = useState<string | null>(null);
@@ -22,7 +22,7 @@ export const appStyle = style({
      opacity: `var(--affine-noise-opacity, 0)`,
      backgroundRepeat: 'repeat',
      backgroundSize: '50px',
-      // todo: figure out how to use vanilla-extract webpack plugin to inject img url
+      // TODO(@Peng): figure out how to use vanilla-extract webpack plugin to inject img url
      backgroundImage: `var(--noise-background)`,
    },
  },
@@ -57,8 +57,8 @@ export const mainContainerStyle = style({
      borderRadius: 6,
      margin: '8px',
      overflow: 'hidden',
-      // todo: is this performance intensive?
-      // TODO: not match with design's shadow, theme missing
+      // TODO(@Peng): is this performance intensive?
+      // TODO(@catsjuice): not match with design's shadow, theme missing
      filter: 'drop-shadow(0px 0px 4px rgba(66,65,73,.14))',
      '@media': {
        print: {