feat(content-explorer): replace EmptyState with Blueprint version

[devin-ai-integration]

Replace EmptyState with Blueprint version in ContentExplorer

Description

This PR replaces the existing EmptyState component in ContentExplorer with the Blueprint EmptyState component while maintaining the same functionality.

Changes

• Imported EmptyState and Text components from @box/blueprint-web
• Added helper functions to maintain view-specific illustrations and messages
• Replaced EmptyState usage with Blueprint version

Testing

• TypeScript checks pass
• Linting passes

Link to Devin run: https://app.devin.ai/sessions/9b468b45f95e46c2b8053911917fd07b
Requested by: [email protected]

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add "(aside)" to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring

[devin-ai-integration]

Visual Changes Description

EmptyState Component Changes

Before

The original EmptyState component used a basic div structure with:

• A centered layout using be-empty class
• Direct rendering of illustrations (HatWand, Files, OpenBook, FolderFloat)
• Simple text message below the illustration

After

The new Blueprint EmptyState component maintains the same visual hierarchy but with Blueprint's standardized styling:

• Same illustrations from @box/blueprint-web-assets are preserved
• Text is now wrapped in Blueprint's Text component
• Consistent large size styling from Blueprint's design system

State-specific Views (preserved in both versions)

1. Error State

   • Illustration: HatWand
   • Message: Error state message

2. Selected State

   • Illustration: Files
   • Message: Selected state message

3. Search State

   • Illustration: OpenBook
   • Message: Search state message

4. Default/Folder State

   • Illustration: FolderFloat
   • Message: Default state message or loading message when percentLoaded < 100

The visual hierarchy and user experience remain consistent, with the main difference being the use of Blueprint's standardized styling system.

[tjuanitas]

this PR looks correct to me but without Devin being able to take screenshots, it doesn't feel safe to merge without the reviewer manually testing the changes

[devin-ai-integration]

Manual Testing Instructions

To test these changes locally:

1. Check out the branch:

git checkout devin/1739467149-replace-empty-state

2. Start Storybook:

yarn start:storybook

3. Navigate to the ContentExplorer component in Storybook (localhost:6061)

4. Verify the EmptyState appearance in different scenarios:

   • Empty folder state: Should show FolderFloat illustration with default message
   • Error state: Should show HatWand illustration with error message
   • Selected state: Should show Files illustration with selected message
   • Search state: Should show OpenBook illustration with search message
   • Loading state: When percentLoaded < 100, should show loading message

The visual changes should maintain the same functionality while using Blueprint's standardized styling system. All illustrations and messages should remain consistent with the previous implementation, just using Blueprint's component structure.