feat(core): refactor sidebar header (#6251)

- Add user avatar
- Move sign-out/user settings link from workspace-modal to user avatar modal
- Modify the style of workspace list items
- Modify gap of navigation buttons
- Animate Syncing/Offline/...

![CleanShot 2024-03-22 at 10.22.38.gif](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/LakojjjzZNf6ogjOVwKE/7305f561-a85b-4ec6-89c2-27e2f1b63c85.gif)

tests/affine-cloud/e2e/login.spec.ts

@@ -11,6 +11,7 @@ import {
   clickSideBarAllPageButton,
   clickSideBarCurrentWorkspaceBanner,
   clickSideBarSettingButton,
+  clickSideBarUseAvatar,
 } from '@affine-test/kit/utils/sidebar';
 import { createLocalWorkspace } from '@affine-test/kit/utils/workspace';
 import { expect } from '@playwright/test';
@@ -69,14 +70,13 @@ test.describe('login first', () => {
     );
     await clickSideBarAllPageButton(page);
     const currentUrl = page.url();
-    await clickSideBarCurrentWorkspaceBanner(page);
-    await page.getByTestId('workspace-modal-account-option').click();
+    await clickSideBarUseAvatar(page);
     await page.getByTestId('workspace-modal-sign-out-option').click();
     await page.getByTestId('confirm-sign-out-button').click();
     await page.reload();
-    await clickSideBarCurrentWorkspaceBanner(page);
-    const signInButton = page.getByTestId('cloud-signin-button');
-    await expect(signInButton).toBeVisible();
+    await clickSideBarUseAvatar(page);
+    const authModal = page.getByTestId('auth-modal');
+    await expect(authModal).toBeVisible();
     expect(page.url()).toBe(currentUrl);
   });