This diff introduces the loading logic to RelationshipPrompt component
Depends on D12596
Details
Details
Confirmed that the relationship prompt buttons in the relationship prompt show a loading spinner when the action is in progress
Not loading:
Loading:
Diff Detail
Diff Detail
- Repository
- rCOMM Comm
- Lint
No Lint Coverage - Unit
No Test Coverage
Event Timeline
Comment Actions
update
| native/chat/relationship-prompt.react.js | ||
|---|---|---|
| 169 ↗ | (On Diff #41776) | Hardcoded the height here so that we guarantee that when the button state goes to loading then the height of the button never changes; however, recently got some feedback about hardcoding the height in CSS being a no-no. Looks like visibility: hidden is not supported in react native, but if we still don't want this, I can explore other ways of doing this This height was determined by using the element inspector in my simulator |
Comment Actions
forgot to hit save
| native/chat/relationship-prompt.react.js | ||
|---|---|---|
| 169 | Hardcoded the height here so that we guarantee that when the button state goes to loading then the height of the button never changes; however, recently got some feedback about hardcoding the height in CSS being a no-no. Looks like visibility: hidden is not supported in react native, but if we still don't want this, I can explore other ways of doing this This height was determined by using the element inspector in my simulator | |
Comment Actions
Passing back for the same reasons as D12596. Using RelationshipButton everywhere seems like a good idea, but we should be thoughtful about the complexity if we end up having to render different things in different surfaces
Comment Actions
Using RelationshipButton everywhere seems like a good idea, but we should be thoughtful about the complexity if we end up having to render different things in different surfaces
I went ahead and abandoned this idea since the "Accept friend request" + "Reject friend request" text was too scrunched up in the button and in general it felt like this idea was creating a lot more added complexity
| native/chat/relationship-prompt.react.js | ||
|---|---|---|
| 22 ↗ | (On Diff #41924) | How would you feel about naming this LoadableContent and factoring it out into native/components? You could even combine it with Button to avoid having to pass isLoadingBlockUser twice. Imagine a "HOC" of Button: type Props = { ...React.ElementConfig<typeof Button>, +isLoading: boolean, }; function LoadableButton(props: Props): React.Node { const { isLoading, children, ...rest } = props; return ( <Button disabled={isLoading} {...rest} > <ButtonContentContainer isLoading={isLoading}> {children} </ButtonContentContainer> </Button> ); } |
| 105 ↗ | (On Diff #41924) | I know this issue wasn't introduced in this diff, but any chance you could memoize this array? (Can be reused below) |
| 127 ↗ | (On Diff #41924) | And this one? (Can be reused below) |
| native/chat/relationship-prompt.react.js | ||
|---|---|---|
| 105 ↗ | (On Diff #41924) | Forgot to address this, doing that rn |