HiveSuite & HiveReactKit Development Update: Tip Modal, UI Branding & WordGrid Mobile Improvements

sagarkothari88(77)

Published in

HiveDevs

Words

871

Reading

4 min

15h

Listen to this post

~6 min

HiveSuite & HiveReactKit

HiveSuite — Interactive Tip Modal & Tipping Experience

Interactive Tip Modal

Added a new interactive Tip Modal for sending HIVE and HBD tips.
Users can select from preset tipping amounts for faster transactions.
Added support for entering a custom tipping amount when the available presets do not match the user's preference.
Added an optional message field so users can include a personal note along with their tip.
Improved the overall interaction flow to make tipping more accessible directly from HiveSuite.

This provides a more convenient way for community members to support creators and other Hive users without leaving the current application flow.

Tip Modal & Custom Tipping

PeakD-Compatible Memo Format

Implemented the standardized !tip memo payload format for tipping transactions.
Tip messages are now prepared using a consistent memo structure.
This improves compatibility with existing Hive tipping conventions and helps maintain consistency with established ecosystem workflows.

Using a familiar memo format also makes the tipping implementation easier to understand and integrate with other Hive ecosystem tools.

Global Tip Integration

Integrated the Tip Modal across multiple HiveSuite content areas.
Added tipping support to:
- Feeds
- Videos
- Polls
- Communities
- Post Details
Users can now access the same tipping experience from different types of content throughout HiveSuite.
Maintained a consistent interaction pattern regardless of the content type being viewed.

This global integration makes tipping a reusable platform-level feature rather than a feature limited to a single content section.

Global Tip Integration Across HiveSuite

HiveSuite — UI Consistency & Branding Updates

HiveSuite Design System Integration

Styled the new Tip Modal using HiveSuite's existing design-system tokens.
Maintained consistency with the application's existing spacing, typography, colors, borders, and component styling.
Ensured the modal feels like a native part of HiveSuite instead of an isolated feature.

The goal is to continue building a consistent visual language throughout the platform as more features are added.

Tip Modal UI & Design System

Hive Branding & Content Labels

Updated several existing labels across relevant composer and feed interfaces to provide a more consistent product identity:

Renamed Ecency → Waves
Renamed LikeTu → Moments
Applied the updated terminology across relevant composer and feed UI areas.
Updated shared labels in HiveReactKit to ensure the naming remains consistent across applications.

These changes help HiveSuite maintain its own recognizable product terminology while keeping the underlying content and functionality unchanged.

Waves & Moments Branding Updates

Image Upload Icon Improvements

Replaced the previous upload-arrow icon with the standard Image icon.
Updated image upload interactions to use a clearer and more recognizable visual indicator.
Improved consistency between different image upload components.
The updated icon makes the purpose of the control more immediately understandable to users.

Image Upload Icon Update

Snaps Branding Updates

Updated the default Snaps-related labels in HiveReactKit.
Applied the new Waves and Moments terminology.
Ensured shared components use the same naming conventions as the updated HiveSuite interface.

Waves & Moments in HiveReactKit

Composer Icon Updates

Replaced previous upload icons with Image/ImageIcon in shared image uploaders.
Updated the meme picker to use the new image-focused iconography.
Improved visual consistency across composer and media-upload experiences.
These shared changes can now be reused across applications that depend on HiveReactKit.

Composer & Image Uploader Icons

HiveSuite — WordGrid Mobile Keyboard Improvements

Dedicated Mobile Submit Button

Added a dedicated ✓ ENTER (GUESS_WORD) button above the mobile keyboard.
This provides a clear and easily accessible way for mobile players to submit their current word.
Players no longer need to rely only on the keyboard's native controls to complete a guess.
The dedicated submit control improves the overall gameplay flow on smaller screens.

Responsive Keyboard Layout

Replaced fixed-width keyboard keys with flexible sizing.
Improved the keyboard layout to adapt to different mobile screen widths.
Prevented the ENTER key from being clipped on smaller devices.
Improved spacing and overall keyboard usability across different mobile resolutions.

Responsive WordGrid Keyboard

Improved Mobile Touch Experience

Added touchAction: "manipulation" to improve touch interaction behavior.
Reduced unnecessary tap delays during gameplay.
Made keyboard interactions feel more responsive on supported mobile devices.
Improved the overall experience for users playing WordGrid through touch-based devices.

WordGrid Touch Interaction Improvements

Visual Feedback for Valid Words

Added visual feedback to the ENTER key and dedicated submit button.
When a valid 6-letter word is ready, the submit controls are highlighted in green.
This gives players an immediate visual indication that their word can be submitted.
The feedback helps make the gameplay flow clearer and reduces uncertainty before submitting a guess.

WordGrid Valid Word Feedback

🚀 Powering the Hive Ecosystem

Continuously improving HiveReactKit with reusable components that make Hive applications richer and more responsive.
Building shared infrastructure for media rendering, translations, and smoother community navigation across the Hive ecosystem.
Contributing open-source enhancements that improve usability, consistency, and long-term maintainability for Hive frontends using HiveReactKit.