Open
Conversation
* feat: implemented layout components * chore: cleanup app layout * fix: typography * fix: connect wallet btn border * chore: moved components dir to dapp dir
* feat: swap page * feat: token select dropdown * fix: build error * chore: add dummy connection comment * fix: cta colors * feat: swap success modal
* feat: add burn/claim page this first commit is a draft for the ongoing work on this page. for starters, i've updated the useTheme hook to be type-safe. i also went on to create a global store to sync the wallet state, although this is just a PoC for the entire implementation, using local state proved inefficient, as the click of "connect wallet" on the main card did not update the button state in the TopBar component. i believe that this sets up a ground work for how we can manage reactivity and sync UI state accorss the application with zustand. the UI still needs to match what's on the design, which i'll work on, and also finalize the process of adding new design tokens (color codes, basically) from figma, so i can properly implement the dark/light theme styles. * feat(ui): a complete refactor of the page to match what's on Figma i've also included more components to proper reflect these changes. the "connect wallet" button is now extensible with a new Gradient component to mimick the gradient border we have on most of the UI components on Figma. i also included new design tokens for the dark mode. moving on to the "light mode" implementation now. * feat: add light theme styles and refactor the theme hook to use a context provider the previous approach of enabling theming in the UI was buggy as there were stale values, and the body of the page doesn't recieve the correct theme value when it is switched. each component tries to call it on its own, which led to race conditions. when you switch to dark mode, some components' style would still retain light mode style (and vice versa, unless you do a "hard-reload"), which is problematic. the solution here was to move the logic into a global store with React context, so all components, irrespective of where they are in the tree have access to the same theme context.
…novations#128) i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it.
* feat: made updates to lock tokens page * feat: made updates to lock tokens page * feat: added themeprovider * feat: completed lock tokens page * feat: fixing bug and adding connect wallet functionality * feat: made updates to lock tokens page * feat: merging branch to local * feat: merging branch to local * feat: merging branch to local * feat: updated theme styling * feat: updated lock tokens ui * feat: made updates to lock tokens page * feat: merging branch to local * feat: merging branch to local * feat: merging branch to local * feat: updated lock tokens files
* feat: Coming soon page * changes done * made responsive
* fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * feat: add dashboard UI this is a work-in-progress for the dashboard UI. for now, i have teh cards and the charts hooked-up onto dummy data. next stop is refactoring to match the designs acurately and fixing the modal UI for connecting a new wallet. * feat: add "connect wallet" modal. a tabbed-chart UI and realtime asset data this commit included a refactor of the dashboard to macth the UI design on figma, the connected wallet state, "connect wallet" modal, ensuring that the dashbaord content doesn't stretch on extra-large screens, and pulling asset data from a live DEX API * feat: add ability to connect to a real wallet this commit introduces the feature that lets people connect their real wallet accoun from the Ethereum or Starknet network with support for various wallets * feat: add dynamic wallet provider detection to the wallet-connection flow we still need to circle back on the idea of listing the available starknet providers when people have more than one starknet wallet installed. should be a rare case. but we shall consider it. * fix: show a list of starknet wallet providers when people have more than one extension installed * render modal in the app layout
* feat/add analytics page * adjust the chartcard * implemented coderabbit changes * fix: fixed mismatched imports due to the recent PR (Explore-Beyond-Innovations#128) i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * made the analytics page in sync with existing repo --------- Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com>
* feat/add analytics page * adjust the chartcard * implemented coderabbit changes * fix: fixed mismatched imports due to the recent PR (Explore-Beyond-Innovations#128) i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * made the analytics page in sync with existing repo * minor tweaks --------- Co-authored-by: icedoutskay <somkeneodikpo@gmail.com> Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com>
…re-Beyond-Innovations#160) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * fix: make mobile sidebar responsive across missing breakpoints
…ations#161) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout
…re-Beyond-Innovations#165) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * chore: get sidebar updates into local and fix the layout issue
…ns#163) * fix: style inconsistencies on the dashboard * refactor coming soon page to match Figma layout (Explore-Beyond-Innovations#161) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * Revert "refactor coming soon page to match Figma layout (Explore-Beyond-Innovations#161)" (Explore-Beyond-Innovations#164) This reverts commit d5fcd3a. * chore: get sidebar updates into local and fix the layout issue (Explore-Beyond-Innovations#165) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * chore: get sidebar updates into local and fix the layout issue * chore: reduced the padding of the dashboard on mobile screens --------- Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com> Co-authored-by: Ugonna Paul Dike <ugonnadike001@gmail.com>
* fix: improves the organization and visual structure to better match the Figma design specifications * fix: fixed scroll issue
* Lock tokens page responsive * Changes done
* added the proloader to the dapp * little fix
…plore-Beyond-Innovations#196) * feat: add skeleton loading states to swap page components * removed skeleton for button
…nnovations#198) * feat: Implement internationalization support with i18next integration * updates * fix resposniveness * updates --------- Co-authored-by: martinvibes <martinmachiebe21@gmail>
… (Explore-Beyond-Innovations#210) * feat: Add Mock Loading Skeletons Explore-Beyond-Innovations#187 * feat: Lock Tokens loading skeleton Explore-Beyond-Innovations#187 * Update lock-tokens.tsx
* fix * fix
* feat: implement custom 404 error page with animations - Add animated 404 page with Framer Motion effects - Include ZeroXBridge branding with purple gradients - Add Back to Home and Go Back buttons - Include helpful links to About and Dashboard - Responsive design for all screen sizes - Accessibility features with proper semantic structure Fixes Explore-Beyond-Innovations#176 * feat: implement custom 500 error page with retry functionality - Add animated 500 page with rotating icon and pulsing effects - Include Try Again button with reset capability - Add Back to Home navigation button - Show error details in development mode - Include support contact information - Consistent design matching 404 page with ZeroXBridge branding Part of Explore-Beyond-Innovations#176 * assets: add error icon for custom error pages - Add custom error-404-500.png icon for both error pages - High-quality image with consistent branding - Used by both 404 and 500 error pages Part of Explore-Beyond-Innovations#176 * test: configure Jest testing environment for Next.js - Add Jest configuration with Next.js integration - Set up testing environment with jsdom - Add module name mapping for path aliases - Configure transform ignore patterns for node_modules - Set up mocks for Next.js navigation, Image, and framer-motion - Configure ResizeObserver and matchMedia mocks Part of Explore-Beyond-Innovations#176 * test: add comprehensive error page test suite - Test 404 and 500 error page rendering and functionality - Verify error icons display correctly - Test button functionality (Back to Home, Go Back, Try Again) - Validate helpful links and support information - Check error details display in development mode - Test accessibility with semantic structure - Verify responsive design classes - All 18 tests passing with proper mocks Part of Explore-Beyond-Innovations#176 * chore: add testing dependencies and scripts - Add Jest and React Testing Library dependencies - Include @testing-library/jest-dom for custom matchers - Add test scripts: test, test:watch, test:coverage - Update @types/jest to latest version Part of Explore-Beyond-Innovations#176 * docs: add manual testing script for error pages - Add comprehensive manual testing checklist - Include tests for animations, responsiveness, and accessibility - Verify error page files and icon existence - Provide testing instructions for both 404 and 500 pages - Mark issue Explore-Beyond-Innovations#176 as complete with summary Completes Explore-Beyond-Innovations#176 * fix: resolve dependency issues in error pages - Replace Button component import with inline implementation - Remove problematic @/lib/utils dependency chain - Fix 'Cannot read properties of undefined' runtime error - Error pages now load correctly without console errors - Animations and functionality preserved Fixes runtime errors in Explore-Beyond-Innovations#176 * refactor: use proper Button component in error pages - Replace temporary button implementation with official Button component - Create clean Button component in app/components/ui/button.tsx - Add clean cn utility function without problematic dependencies - Fix error pages to use consistent design system - Resolve all dependency chain issues that caused runtime errors Improves Explore-Beyond-Innovations#176 * fix: resolve Next.js metadata and dependency issues - Update Next.js from 15.1.7 to 15.5.0 - Fix next.config.ts configuration for proper metadata handling - Remove class-variance-authority and @radix-ui/react-slot dependencies from Button - Create simplified Button component without problematic dependencies - Clean reinstall all dependencies to resolve icon-mark.js errors - Remove temporary test-500 page that was causing errors - Ensure both 404 and 500 error pages work as Next.js error views Resolves metadata generation issues and improves stability Fixes Explore-Beyond-Innovations#176 * fix: resolve React type compatibility and simplify error pages - Downgrade @types/react from 19.1.11 to 18.3.24 (compatible with React 18.3.1) - Downgrade @types/react-dom from 19.1.7 to 18.3.7 - Simplify error pages to eliminate complex dependencies causing 'call' errors - Remove Framer Motion, complex Button components, and other problematic dependencies - Create clean, functional 404 and 500 pages with minimal dependencies - Maintain design consistency with purple theme and proper styling Resolves 'Cannot read properties of undefined (reading "call")' errors Fixes Explore-Beyond-Innovations#176 * fix: add 'use client' directive and fix Next.js config warnings - Add 'use client' directive to Button component for client-side interactivity - Remove deprecated 'swcMinify' option from next.config.ts - Ensure all interactive components have proper client directives - Clear cache to apply configuration changes Resolves Next.js warnings and ensures proper client/server component boundaries Fixes Explore-Beyond-Innovations#176 * fix: add empty service worker to prevent sw.js 404 errors - Add minimal service worker to handle browser requests for sw.js - Prevents 'Failed to load resource' errors in browser console - Improves error page debugging experience Fixes service worker related console errors * feat: restore complete error page design with icon and visual effects - Add error-404-500.png icon to both 404 and 500 pages - Restore background gradient effects and floating elements - Include full descriptive text and help links - Maintain all previous error fixes (React types, use client, etc.) - Use CSS transforms instead of Framer Motion to avoid dependencies - Preserve purple theme (#a26dff) and responsive design - Add hover effects and transitions using pure CSS Completes Explore-Beyond-Innovations#176 with full visual design as requested
…plore-Beyond-Innovations#181) * feat: add NextAuth integration with Ethereum credentials provider * Updated package.json to include next-auth dependency * Implemented authentication route for Ethereum address verification * Extended next-auth types to include user address in session and JWT Signed-off-by: Pushkar Mishra <pushkarmishra029@gmail.com> * feat: enhance NextAuth Ethereum provider with SIWE support * Added SIWE (Sign-In with Ethereum) message handling to the authentication flow * Introduced nonce validation to prevent replay attacks * Improved input validation for address and signature formats * Updated package.json to include the 'siwe' library Signed-off-by: Pushkar Mishra <pushkarmishra029@gmail.com> --------- Signed-off-by: Pushkar Mishra <pushkarmishra029@gmail.com>
* fear: support page guildescard created * fix: addressed PR review comments
* Fix issue 189 (Explore-Beyond-Innovations#228) * cleanup/initial * tailwind config cleanup * file changes * feat: implemented layout components (Explore-Beyond-Innovations#121) * feat: implemented layout components * chore: cleanup app layout * fix: typography * fix: connect wallet btn border * chore: moved components dir to dapp dir * feat: swap page (Explore-Beyond-Innovations#123) * feat: swap page * feat: token select dropdown * fix: build error * chore: add dummy connection comment * fix: cta colors * feat: swap success modal * feat: add burn/claim page (Explore-Beyond-Innovations#122) * feat: add burn/claim page this first commit is a draft for the ongoing work on this page. for starters, i've updated the useTheme hook to be type-safe. i also went on to create a global store to sync the wallet state, although this is just a PoC for the entire implementation, using local state proved inefficient, as the click of "connect wallet" on the main card did not update the button state in the TopBar component. i believe that this sets up a ground work for how we can manage reactivity and sync UI state accorss the application with zustand. the UI still needs to match what's on the design, which i'll work on, and also finalize the process of adding new design tokens (color codes, basically) from figma, so i can properly implement the dark/light theme styles. * feat(ui): a complete refactor of the page to match what's on Figma i've also included more components to proper reflect these changes. the "connect wallet" button is now extensible with a new Gradient component to mimick the gradient border we have on most of the UI components on Figma. i also included new design tokens for the dark mode. moving on to the "light mode" implementation now. * feat: add light theme styles and refactor the theme hook to use a context provider the previous approach of enabling theming in the UI was buggy as there were stale values, and the body of the page doesn't recieve the correct theme value when it is switched. each component tries to call it on its own, which led to race conditions. when you switch to dark mode, some components' style would still retain light mode style (and vice versa, unless you do a "hard-reload"), which is problematic. the solution here was to move the logic into a global store with React context, so all components, irrespective of where they are in the tree have access to the same theme context. * fix: fixed mismatched imports due to the recent PR (Explore-Beyond-Innovations#128) i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * Feat/lock tokens (Explore-Beyond-Innovations#124) * feat: made updates to lock tokens page * feat: made updates to lock tokens page * feat: added themeprovider * feat: completed lock tokens page * feat: fixing bug and adding connect wallet functionality * feat: made updates to lock tokens page * feat: merging branch to local * feat: merging branch to local * feat: merging branch to local * feat: updated theme styling * feat: updated lock tokens ui * feat: made updates to lock tokens page * feat: merging branch to local * feat: merging branch to local * feat: merging branch to local * feat: updated lock tokens files * feat: Coming soon page (Explore-Beyond-Innovations#127) * feat: Coming soon page * changes done * made responsive * coming-soon little fix * ui fixes * fixed build error * feat: add dashboard UI (Explore-Beyond-Innovations#129) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * feat: add dashboard UI this is a work-in-progress for the dashboard UI. for now, i have teh cards and the charts hooked-up onto dummy data. next stop is refactoring to match the designs acurately and fixing the modal UI for connecting a new wallet. * feat: add "connect wallet" modal. a tabbed-chart UI and realtime asset data this commit included a refactor of the dashboard to macth the UI design on figma, the connected wallet state, "connect wallet" modal, ensuring that the dashbaord content doesn't stretch on extra-large screens, and pulling asset data from a live DEX API * feat: add ability to connect to a real wallet this commit introduces the feature that lets people connect their real wallet accoun from the Ethereum or Starknet network with support for various wallets * feat: add dynamic wallet provider detection to the wallet-connection flow we still need to circle back on the idea of listing the available starknet providers when people have more than one starknet wallet installed. should be a rare case. but we shall consider it. * fix: show a list of starknet wallet providers when people have more than one extension installed * render modal in the app layout * Style fixes * Feat/analytics page (Explore-Beyond-Innovations#125) * feat/add analytics page * adjust the chartcard * implemented coderabbit changes * fix: fixed mismatched imports due to the recent PR (Explore-Beyond-Innovations#128) i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * made the analytics page in sync with existing repo --------- Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com> * Icedoutskay feat/analytics page (Explore-Beyond-Innovations#132) * feat/add analytics page * adjust the chartcard * implemented coderabbit changes * fix: fixed mismatched imports due to the recent PR (Explore-Beyond-Innovations#128) i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * made the analytics page in sync with existing repo * minor tweaks --------- Co-authored-by: icedoutskay <somkeneodikpo@gmail.com> Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com> * fix: build errors (Explore-Beyond-Innovations#133) * fix: make mobile sidebar responsive across missing breakpoints (Explore-Beyond-Innovations#160) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * fix: make mobile sidebar responsive across missing breakpoints * refactor coming soon page to match Figma layout (Explore-Beyond-Innovations#161) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * Revert "refactor coming soon page to match Figma layout (Explore-Beyond-Innovations#161)" (Explore-Beyond-Innovations#164) This reverts commit d5fcd3a. * chore: get sidebar updates into local and fix the layout issue (Explore-Beyond-Innovations#165) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * chore: get sidebar updates into local and fix the layout issue * fix: style inconsistencies on the dashboard (Explore-Beyond-Innovations#163) * fix: style inconsistencies on the dashboard * refactor coming soon page to match Figma layout (Explore-Beyond-Innovations#161) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * Revert "refactor coming soon page to match Figma layout (Explore-Beyond-Innovations#161)" (Explore-Beyond-Innovations#164) This reverts commit d5fcd3a. * chore: get sidebar updates into local and fix the layout issue (Explore-Beyond-Innovations#165) * fix: fixed mismatched imports due to the recent PR i've also updated the ThemeProvider to expose a isDark value so it is not computed everytime in components needing it. * refactor coming soon page to match Figma layout * chore: get sidebar updates into local and fix the layout issue * chore: reduced the padding of the dashboard on mobile screens --------- Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com> Co-authored-by: Ugonna Paul Dike <ugonnadike001@gmail.com> * feat: fix the swap page (Explore-Beyond-Innovations#167) * Fix/analytics page (Explore-Beyond-Innovations#169) * fix: improves the organization and visual structure to better match the Figma design specifications * fix: fixed scroll issue * Lock tokens page responsive (Explore-Beyond-Innovations#162) * Lock tokens page responsive * Changes done * added the proloader to the dapp (Explore-Beyond-Innovations#179) * added the proloader to the dapp * little fix * governance * Add skeleton/shimmer states to the Swap page using mocked loading (Explore-Beyond-Innovations#196) * feat: add skeleton loading states to swap page components * removed skeleton for button * Fix-185 Add Mock Loading Skeletons – Claim/Burn (Explore-Beyond-Innovations#207) * fix conflict error (Explore-Beyond-Innovations#203) * Fix-184: Add Mock Loading Skeletons – Dashboard (Explore-Beyond-Innovations#208) * feat: add internationalization support with i18next (Explore-Beyond-Innovations#198) * feat: Implement internationalization support with i18next integration * updates * fix resposniveness * updates --------- Co-authored-by: martinvibes <martinmachiebe21@gmail> * add Mock Loading Skeletons – Lock Tokens Explore-Beyond-Innovations#187 (Explore-Beyond-Innovations#210) * feat: Add Mock Loading Skeletons Explore-Beyond-Innovations#187 * feat: Lock Tokens loading skeleton Explore-Beyond-Innovations#187 * Update lock-tokens.tsx * support * fix (Explore-Beyond-Innovations#221) * fix * fix * fixed-issue --------- Co-authored-by: Ugo-X <ugonnadike001@gmail.com> Co-authored-by: Isaac Onyemaechi <amaechiisaac450@gmail.com> Co-authored-by: Oshioke Salaki <salaki1902@gmail.com> Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com> Co-authored-by: Abdulhakeem Abdulazeez Ayodeji <44169294+Ayoazeez26@users.noreply.github.com> Co-authored-by: Yakshit Agarwal <153830716+YakshitAgarwal@users.noreply.github.com> Co-authored-by: Odikpo Somkenechukwu <somkeneodikpo@gmail.com> Co-authored-by: wheval <whevalmezeegbe@gmail.com> Co-authored-by: Ugochukwu Nebolisa <nebolisaugochukwu@gmail.com> Co-authored-by: James Victor <112592627+JamesVictor-O@users.noreply.github.com> Co-authored-by: Jay <111138366+Jayrodri088@users.noreply.github.com> Co-authored-by: Ochulor Freedom <154595610+FreddyJ23@users.noreply.github.com> Co-authored-by: Raymond Joseph <162983930+raymondjoseph02@users.noreply.github.com> Co-authored-by: Atunwa Vincent <125933139+Sirvincee@users.noreply.github.com> Co-authored-by: martin machiebe <127976766+martinvibes@users.noreply.github.com> Co-authored-by: martinvibes <martinmachiebe21@gmail> Co-authored-by: Emmanuel Nweke <69096827+CodexpathCommunity@users.noreply.github.com> Co-authored-by: Damigurl <damigurldox@gmail.com> * unknown --------- Co-authored-by: Angel Mba <70325824+Michelle031@users.noreply.github.com> Co-authored-by: Ugo-X <ugonnadike001@gmail.com> Co-authored-by: Isaac Onyemaechi <amaechiisaac450@gmail.com> Co-authored-by: Oshioke Salaki <salaki1902@gmail.com> Co-authored-by: Caleb! <48127194+kaf-lamed-beyt@users.noreply.github.com> Co-authored-by: Abdulhakeem Abdulazeez Ayodeji <44169294+Ayoazeez26@users.noreply.github.com> Co-authored-by: Yakshit Agarwal <153830716+YakshitAgarwal@users.noreply.github.com> Co-authored-by: Odikpo Somkenechukwu <somkeneodikpo@gmail.com> Co-authored-by: wheval <whevalmezeegbe@gmail.com> Co-authored-by: Ugochukwu Nebolisa <nebolisaugochukwu@gmail.com> Co-authored-by: James Victor <112592627+JamesVictor-O@users.noreply.github.com> Co-authored-by: Jay <111138366+Jayrodri088@users.noreply.github.com> Co-authored-by: Ochulor Freedom <154595610+FreddyJ23@users.noreply.github.com> Co-authored-by: Raymond Joseph <162983930+raymondjoseph02@users.noreply.github.com> Co-authored-by: Atunwa Vincent <125933139+Sirvincee@users.noreply.github.com> Co-authored-by: martin machiebe <127976766+martinvibes@users.noreply.github.com> Co-authored-by: martinvibes <martinmachiebe21@gmail> Co-authored-by: Emmanuel Nweke <69096827+CodexpathCommunity@users.noreply.github.com> Co-authored-by: Damigurl <damigurldox@gmail.com>
* feat: create helper for message signing * fix: coderabbit suggestions
…ons#230 (Explore-Beyond-Innovations#239) - Add ContactForm.tsx component with form validation - Create contact/page.tsx with proper layout structure - Import existing Navbar, OnlyDust banner, and Footer components - Implement form fields: Name, Email, Subject, Message textarea - Add inline privacy policy link - Include client-side form validation - Style for desktop (PC) baseline layout - Add supporting UI components and assets
…reum signature (Explore-Beyond-Innovations#240) Co-authored-by: tusharshah21 <tusahrkumarshah14394@gmail.com>
- Add support page route exclusion from AppLayout - Ensure support and contact pages render without sidebar - Maintain consistent layout behavior across dapp pages
- Remove fixed width causing horizontal overflow - Replace fixed padding with responsive clamp() values - Maintain consistent styling with design system - Improve mobile and desktop layout compatibility
- Add PageHeader with title and description - Implement responsive grid layout for support cards - Add SearchBar and CTASection components - Include Footer component for complete page structure
- Create SearchBar with placeholder functionality - Implement CTASection with contact support call-to-action - Add responsive design and hover effects - Follow consistent styling patterns
- Remove width: '610px' style from FAQsCard and StatusCard - Allow grid layout to manage card dimensions - Improve responsive behavior across screen sizes
- Add onClick handler and keyboard navigation support - Implement consistent card styling with other support cards - Enhance image colors with brightness, contrast, and saturation - Add proper TypeScript props and accessibility features
|
Important Review skippedMore than 25% of the files skipped due to max files limit. The review is being skipped to prevent a low-quality review. 53 files out of 189 files are above the max files limit of 100. Please upgrade to Pro plan to get higher limits. You can disable this status message by setting the ✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
20 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
🎯 Feature Summary: Support Page Implementation
Issue Resolution
This implementation addresses Issue #216: Assemble Support Page by creating a comprehensive support center that provides users with multiple pathways to get help and information.
🚀 What Was Built
Complete Support Page Structure:
5 Reusable Support Cards:
Video and images
https://www.loom.com/share/683a4704b4514ada885216fe04f1fb1f?sid=5fb161db-bc37-40d1-8ea4-2e30dfae4af2
🎨 Design & UX Features
Visual Consistency:
Accessibility & Interaction:
Technical Implementation:
🔧 Technical Improvements
Configuration Fixes:
Layout Enhancements:
✅ Acceptance Criteria Met
📁 Files Created/Modified
New Components:
app/dapp/support/components/SearchBar.tsxapp/dapp/support/components/CTASection.tsxapp/dapp/support/components/SubmitTicketCard.tsxUpdated Components:
app/dapp/support/page.tsx- Complete page restructureapp/dapp/support/components/CommunityCard.tsx- Enhanced stylingapp/dapp/support/components/FAQsCard.tsx- Layout improvementsapp/dapp/support/components/StatusCard.tsx- Layout improvementsConfiguration Files:
postcss.config.mjs- Tailwind v3 compatibilityapp/globals.css- CSS import fixesapp/dapp/layout.tsx- Sidebar exclusion logicAssets:
public/image.png- Custom ticket illustrationpublic/ticket.png- Additional ticket asset🎯 Business Impact
This support page implementation provides users with:
The implementation successfully transforms the support experience from a basic contact form into a comprehensive help center that guides users to the most appropriate support channel for their needs.