Save the date! Join us on October 16 for our Product Ops launch event. Register here.
Mar 10, 2020 09:51 AM
Hey,
Noticed that in the latest block sdk version you export useSynced (great feature). There is no documentation for it in the docs.
Cheers,
Ronen Babayoff
Superblocks.at
Mar 10, 2020 01:25 PM
Hi Ronen,
Thanks for the callout! Documentation will be added for the useSynced
hook soon.
In the meantime, here’s an example of what the returned values for useSynced
look like:
import {useBase, useSynced} from '@airtable/blocks/ui';
function CustomInputSynced() {
const [value, setValue, canSetValue] = useSynced('myGlobalConfigKey');
return (
<input
type="text"
value={value}
onChange={e => setValue(e.target.value)}
disabled={!canSetValue}
/>
);
}
Similar to React.useState
, the first two values in the returned array are the current value and the setter function. The third value is a boolean that indicates whether the user has permission to update globalConfig
.
Cheers,
Billy
Mar 10, 2020 02:56 PM
Thanks, and can I also use an array for global config key, same as in globalConfig.setAsync
?
Mar 10, 2020 03:12 PM
Yes, the globalConfigKey
can be an array path.
Mar 11, 2020 03:56 AM
I’m getting a runtime error trying to use in a typescript block (I’m on v0.0.43):
TypeError: (0 , _ui.useSynced) is not a function or its return value is not iterable
Mar 11, 2020 03:58 AM
Can you provide a code snippet for the component you’re using this hook in?
Mar 11, 2020 05:09 AM
I’m using visual studio code and the typescript compiler doesn’t recognize useSynced - it’s underlined in red, and this is the error message:
Module '"../node_modules/@airtable/blocks/ui"' has no exported member 'useSynced'.ts(2305)
This is the code:
import {
useGlobalConfig,
useSynced,
Text,
TextButton
} from '@airtable/blocks/ui'
export default function Editor() {
const [content, setContent, canSetContent] = useSynced(['editor', 'content'])
....
}
Mar 11, 2020 05:16 AM
Ah, it appears we don’t properly export useSynced
in 0.0.43. We’ll fix this in the next SDK version — apologies for the confusion!
Mar 27, 2020 02:13 AM
useSynced
is now properly exported in 0.0.44. You can find the documentation here: Airtable Blocks SDK