Skip to content

fix: theme for MessageList and SendMessageDisallowedIndicator#2470

Merged
khushal87 merged 1 commit intodevelopfrom
fix-message-list-and-input-theme
Apr 2, 2024
Merged

fix: theme for MessageList and SendMessageDisallowedIndicator#2470
khushal87 merged 1 commit intodevelopfrom
fix-message-list-and-input-theme

Conversation

@khushal87
Copy link
Copy Markdown
Contributor

@khushal87 khushal87 commented Apr 1, 2024

🎯 Goal

This PR fixes the theme for the MessageList and the SendMessageDisallowedIndicator components. The background colour is especially fixed, which was white for most cases if no external colour is applied.

The empty state spinner was also not rendering. That is also fixed in the PR.

Before:

RPReplay_Final1711957583.MP4

After:

RPReplay_Final1711959352.MP4

🛠 Implementation details

🎨 UI Changes

🧪 Testing

☑️ Checklist

  • I have signed the Stream CLA (required)
  • PR targets the develop branch
  • Documentation is updated
  • New code is tested in main example apps, including all possible scenarios
    • SampleApp iOS and Android
    • Expo iOS and Android

theme={{
colors: {
...(colorScheme === 'dark' ? DarkTheme : DefaultTheme).colors,
background: theme.colors?.white_snow || '#FCFCFC',
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not needed in TSMessagingApp. Since removing it will give us a fair idea about the component's default theme.

@khushal87
Copy link
Copy Markdown
Contributor Author

Merging after self review ✅

@khushal87 khushal87 merged commit a2119af into develop Apr 2, 2024
@khushal87 khushal87 deleted the fix-message-list-and-input-theme branch April 2, 2024 05:31
@github-actions github-actions Bot mentioned this pull request Apr 2, 2024
<View style={[styles.container, container]}>
<Spinner />
<View style={[styles.container, { backgroundColor: white_snow }, container]}>
<Spinner height={20} width={20} />
Copy link
Copy Markdown
Member

@santhoshvai santhoshvai Apr 2, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<Spinner height={20} width={20} /> is better as <Spinner />

Looking at this, it seems like the spinner component itself is bad to me.. the style by default has height and width of 16, but the icon doesnt have.. so its easier if we pass a default of 16 to the icon when no prop is passed and as a long term view, better

@stream-ci-bot
Copy link
Copy Markdown
Contributor

🎉 This PR is included in version 5.27.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants