infinitered / ignite

Infinite Red's battle-tested React Native project boilerplate, along with a CLI, component/model generators, and more! 9 years of continuous development and counting.
MIT License
17.74k stars 1.4k forks source link

`Button` Component `disabledStyle`, `LoadingComponent` + `isLoading`, and `throttleTimeMs` #2804

Open ChristopherGabba opened 1 month ago

ChristopherGabba commented 1 month ago

I've been working with Ignite now for a while and both projects I've worked in I've ended up modifying the default Button component to include the above-mentioned properties.

<Button 
   ...
   disabledStyle={$disabled} // defined as a 5th preset in the style presets of the button component. We gray out buttons in both the apps I am building when they are disabled
   disabledTextStyle={$disabledText} // defined as a 6th preset in the style presets
   LoadingComponent={<Loader />} // the component that will show after the button is pressed to show its in a loading state (this can also put the button in a temporary disabled state)
   isLoading={true}  // shows the loading component in the center of the button
   throttleTimeMS={2000} // set how long you want to prevent a user from spamming an API call
/>

Its a feature request so not necessary to fix or anything. These are just things that I've ended up having to repeat with Ignite on more than one occasion.