refactor: shared component and layout

[JohnsonMao]

Why need this change? / Root cause:

• 有觀察到 Image 每次畫面 render 都會一直反覆拿取圖片的 source，所以重構成使用原生 img 並自行處理優化方案
• 有觀察到 AppLayout 在換頁時，都會讓 header 的 logo 閃爍，修正閃爍的問題
• 修正在 Safari 瀏覽器的 checkbox 顯示與其他瀏覽器不一致

Changes made:

• 改成自行實作圖片優化 Image，並參考官方提供的解決方案： https://nextjs.org/docs/pages/api-reference/components/image#theme-detection-picture
• 將 AppLayout memo 起來，避免每次多餘的 rerender
• 修正 checkbox 樣式

Test Scope / Change impact:

• 手動測試
• component test

Issue

• none

[sonarqubecloud]

Quality Gate passed

Issues
2 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[GaaSBot]

✅ Knip Scan Result for 4519192

Unused files (8)

Unused files (8)
.bundlewatch.config.js
components/shared/Footer.tsx
configs/i18nConfigs.ts
lighthouserc.js
reset.d.ts
scripts/iconConverter/IconTemplate.tsx
scripts/knipScanReporter.js
scripts/lhciScanReporter.js

Unused dependencies (2)

Unused dependencies (2)
@svgr/webpack package.json
sharp package.json

Unused devDependencies (5)

Unused devDependencies (5)
@actions/github package.json
@octokit/core package.json
@storybook/blocks package.json
@storybook/testing-library package.json
@total-typescript/ts-reset package.json

Unused exports (2)

Unused exports (2)
createMockFriendMessages components/shared/Chat/mocks/mock.tsx
playerCancelReady requests/rooms/index.ts

Unused exports in namespaces (1)

Unused exports in namespaces (1)
BreadcrumbItem components/shared/Breadcrumb/Breadcrumb.tsx

Unused exported types (2)

Unused exported types (2)
ChatHeaderProps type components/shared/Chat/ChatHeader.tsx
RoomEntryError type requests/rooms/index.ts

Unused exported types in namespaces (2)

Unused exported types in namespaces (2)
BaseBoxFancyProp interface components/shared/BoxFancy/BoxFancy.tsx
BreadcrumbItemProps interface components/shared/Breadcrumb/Breadcrumb.tsx

Unused exported enum members (1)

Unused exported enum members (1)
PRIMARY_TRANSPARENT ButtonVariant components/shared/Button/v2/Button.tsx

Configuration issues (1)

Configuration issues (1)
Unused item in ignoreDependencies: @next/bundle-analyzer

[GaaSBot]

🤖 Lighthouse Scan Result for 4519192

/rooms

Metric	Value
Performance	72
Seo	90
Accessibility	84
HTML Report for LHCI Scan	Report Link

/rooms/abc

Metric	Value
Performance	76
Seo	90
Accessibility	84
HTML Report for LHCI Scan	Report Link

/login

Metric	Value
Performance	69
Seo	90
Accessibility	97
HTML Report for LHCI Scan	Report Link