Documentation Index
Fetch the complete documentation index at: https://docs.ollie.shop/llms.txt
Use this file to discover all available pages before exploring further.
Ollie Custom Components can receive properties configured directly in the Admin.
This is useful when you have a custom component but would like to abe able to change some of it’s behaviour without needing to make code changes.
Example - Free Shipping Progress Bar
Instead of hard-coding the Free Shipping Tier directly in the code, use props to define the component behavior.
In this example the Free Shipping custom component has a default value of $99.00 and let’s assume that we need to change the Free Tier to $350.00.
In the custom component code you can define a variable and via the admin you can assign a value that will override the hard-coded value in your code.
The snippet below is part of a Free Shipping Progress Bar (custom) component. The developer declared a variable named target and assgined a value of 99, however it also declared that this component can receive props.
// piece of component with the target prop
const FreeShippingProgress: React.FC<FreeShippingProgressProps> = ({
target = 99,
...props
}) => {
When you configure props in the admin, you can name them and if there is a matching variable then the configured value will override the hard-coded one.
The result is the component will now use the configured prop target=350 instead of the original (default) value of 99.