feat: add TemplateGrid and TitleBar components with tests

- Implemented TemplateGrid component for displaying templates in a grid layout.
- Added calculateCardWidth helper function for dynamic card sizing.
- Created TitleBar component for displaying the title and points with interaction.
- Added unit tests for TemplateGrid and TitleBar components to ensure proper functionality.
- Introduced useStickyTabs and useTabNavigation hooks with tests for managing sticky tab behavior and navigation logic.
- Implemented useTemplateFilter hook for filtering templates based on video content.
- Added comprehensive tests for all new hooks and components to validate behavior and edge cases.

components/blocks/home/HeroSlider.test.tsx

@@ -0,0 +1,101 @@
+import { HeroSlider } from './HeroSlider'
+
+const mockActivities = [
+  {
+    id: '1',
+    title: '活动标题1',
+    titleEn: 'Activity Title 1',
+    desc: '活动描述1',
+    descEn: 'Activity Description 1',
+    coverUrl: 'https://example.com/image1.jpg',
+    link: '/activity/1',
+  },
+  {
+    id: '2',
+    title: '活动标题2',
+    desc: '活动描述2',
+    coverUrl: 'https://example.com/image2.jpg',
+    link: '/activity/2',
+  },
+]
+
+describe('HeroSlider Component', () => {
+  describe('Component Export', () => {
+    it('should be defined', () => {
+      expect(HeroSlider).toBeDefined()
+    })
+
+    it('should be a function component', () => {
+      expect(typeof HeroSlider).toBe('function')
+    })
+  })
+
+  describe('Props Interface', () => {
+    it('should accept activities prop', () => {
+      const props = { activities: mockActivities }
+      expect(props.activities).toEqual(mockActivities)
+      expect(props.activities.length).toBe(2)
+    })
+
+    it('should accept onActivityPress callback', () => {
+      const onActivityPress = jest.fn()
+      expect(typeof onActivityPress).toBe('function')
+    })
+
+    it('should have activity with required fields', () => {
+      const activity = mockActivities[0]
+      expect(activity.id).toBeDefined()
+      expect(activity.title).toBeDefined()
+      expect(activity.desc).toBeDefined()
+      expect(activity.coverUrl).toBeDefined()
+      expect(activity.link).toBeDefined()
+    })
+
+    it('should have activity with optional fields', () => {
+      const activity = mockActivities[0]
+      expect(activity.titleEn).toBeDefined()
+      expect(activity.descEn).toBeDefined()
+    })
+  })
+
+  describe('Empty State', () => {
+    it('should return null when activities is empty array', () => {
+      const result = HeroSlider({ activities: [] })
+      expect(result).toBeNull()
+    })
+
+    it('should return null when activities is undefined', () => {
+      const result = HeroSlider({ activities: undefined as any })
+      expect(result).toBeNull()
+    })
+  })
+
+  describe('Render Behavior', () => {
+    it('should return JSX element when activities has items', () => {
+      const result = HeroSlider({ activities: mockActivities })
+      expect(result).not.toBeNull()
+    })
+  })
+
+  describe('Callback Behavior', () => {
+    it('should call onActivityPress with link when activity is pressed', () => {
+      const onActivityPress = jest.fn()
+      const props = {
+        activities: mockActivities,
+        onActivityPress,
+      }
+      // Verify callback can be invoked with link
+      props.onActivityPress(mockActivities[0].link)
+      expect(onActivityPress).toHaveBeenCalledWith('/activity/1')
+    })
+
+    it('should not throw when onActivityPress is not provided', () => {
+      const props = { activities: mockActivities }
+      expect(() => {
+        if (props.onActivityPress) {
+          props.onActivityPress(mockActivities[0].link)
+        }
+      }).not.toThrow()
+    })
+  })
+})