Repository: toeverything/AFFiNE
File: packages/frontend/core/src/modules/share-menu/view/share-menu/share-menu.tsx (TypeScript)

Code before:
  Share = 'share',
  Export = 'export',
  Invite = 'invite',
  Members = 'members',
}

export const ShareMenuContent = (props: ShareMenuProps) => {
  const t = useI18n();
  const [currentTab, setCurrentTab] = useState(ShareMenuTab.Share);

  const serverService = useService(ServerService);
  const isSelfhosted = useLiveData(
    serverService.server.config$.selector(
      c => c.type === ServerDeploymentType.Selfhosted
    )
  );

  const workspaceSubscriptionService = useService(WorkspaceSubscriptionService);
  const subscription = useLiveData(
    workspaceSubscriptionService.subscription.subscription$
  );
  const workspaceQuotaService = useService(WorkspaceQuotaService);
  const quota = useLiveData(workspaceQuotaService.quota.quota$);
  const hittingPaywall = useMemo(() => {
    if (isSelfhosted) {
      return false;
    }
    if (subscription) {
      return subscription.plan === SubscriptionPlan.Free;
    }
    if (quota) {
      const { name } = quota;
      return name.toLowerCase() === SubscriptionPlan.Free.toLowerCase();
    }
    return true;
  }, [isSelfhosted, subscription, quota]);

  const permissionService = useService(WorkspacePermissionService);
  const isOwner = useLiveData(permissionService.permission.isOwner$);

  const workspaceDialogService = useService(WorkspaceDialogService);

  const onValueChange = useCallback((value: string) => {
    setCurrentTab(value as ShareMenuTab);
  }, []);

  useEffect(() => {
    workspaceSubscriptionService.subscription.revalidate();
  }, [workspaceSubscriptionService]);

  const { openConfirmModal } = useConfirmModal();

Review comment (suggestion):
`workspaceQuotaService` needs explicit revalidate

```suggestion
useEffect(() => {
    workspaceQuotaService.quota.revalidate();
  }, [
    workspaceQuotaService
  ]);
```

Code after:
  Members = 'members',
}

export const ShareMenuContent = (props: ShareMenuProps) => {
  const t = useI18n();
  const [currentTab, setCurrentTab] = useState(ShareMenuTab.Share);

  const serverService = useService(ServerService);
  const isSelfhosted = useLiveData(
    serverService.server.config$.selector(
      c => c.type === ServerDeploymentType.Selfhosted
    )
  );
  const workspaceQuotaService = useService(WorkspaceQuotaService);
  const quota = useLiveData(workspaceQuotaService.quota.quota$);
  const hittingPaywall = useMemo(() => {
    if (isSelfhosted) {
      return false;
    }
    if (quota) {
      const { name } = quota;
      return name.toLowerCase() === SubscriptionPlan.Free.toLowerCase();
    }
    return true;
  }, [isSelfhosted, quota]);

  const permissionService = useService(WorkspacePermissionService);
  const isOwner = useLiveData(permissionService.permission.isOwner$);

  const workspaceDialogService = useService(WorkspaceDialogService);

  const onValueChange = useCallback((value: string) => {
    setCurrentTab(value as ShareMenuTab);
  }, []);

  useEffect(() => {
    workspaceQuotaService.quota.revalidate();
  }, [workspaceQuotaService]);

  const { openConfirmModal } = useConfirmModal();

  const onConfirm = useCallback(() => {
    if (!isOwner) {
      return;
    }
    workspaceDialogService.open('setting', {
      activeTab: 'plans',
      scrollAnchor: 'cloudPricingPlan',
    });
    return;
  }, [isOwner, workspaceDialogService]);