Assets Library

TOC

• Working in Progress
• Configuration
• Links

Working in Progress

Header

• Title
• Description
• Search Box
• Clear search
• Recent search
• Tabs

Features Page

• Features Section
• Trending Section
• Show more assets button

Kpi Page

• Assets List
• Show more assets button

Layouts Page

• Assets List
• Show more assets button

Storyboards Page

• Assets List
• Show more assets button

Search Page

• Assets List
• Filter funcionality
• Show more assets button

Assets Card

• Card (image, title, description and date)
• Click to open the modal based on the asset type

Modal Features

• Implement Modal (open and close functionalities)
• Copy Link Button

Layout Modal

• Image, Title, Type, Description
• caption, tags, used, type, pages, lastUpdated, graph, business questions
• Favorite button + functionality

Kpi Modal

• Image, Title, Type, Description
• caption, tags, used, type, pages, lastUpdated, graph, business questions
• Favorite button + functionality

Storyboards Modal

• Image, Title, Type, Description
• caption, tags, used, type, pages, lastUpdated, graph, business questions
• Favorite button + functionality

Aditional Features

• Request Permission Button

UX Improvements

• Add slide animation in Tabs component
• Add tooltips in icon buttons
• Replace spinner with skeletons
• Copy to clipboard feedback

Configuration

1. Install these packages (prefer the listed versions):

• node v20.10.0

2. Install all dependencies

npm install

3. Start the development server

npm start

4. Commands

# Install all dependencies
$ npm install

# Run production build
$ npm start

# Build for development
$ npm run dev

# Build for production
$ npm run build

# Check for linting errors
$ npm run lint

# Format all files
$ npm run format

# Check for formatting errors
$ npm run check-format

Links

CodeSandbox