Resource Picker not liking my array - React shopify app-bridge

Question

So, i'm getting the selected items from the resource picker and trying to use it for initialSelectionIds.

However i'm getting this error when using it as in the beginning it is empty: I'm also not sure how to get selectedValue into the correct format. error:

appBridgeError: APP::ERROR::INVALID_OPTIONS: `type_error_expected_object` thrown for path: ['initialSelectionIds']['0'] and value: `[]

const handleSelection = (resources) => {
      const idsFromResources = resources.selection.map(v => "id:'" + v.id +'\'');
      const namesFromResources = resources.selection.map(p => p.title);

      selectedValue = JSON.parse(idsFromResources); <Page
    title='Allergen Selector'
    primaryAction={{
      content: 'Select Allergens',
      onAction: () => opend(),
      
    }}>
      <ResourcePicker
        resourceType="Product"
        showVariants={true}
        open={active}
        onSelection={(resources) => handleSelection(resources)}
        onCancel={handleToggle}


      initialSelectionIds={[selectedValue ]   }
     />
  </Page>

But it works when i use this:

const productWithAllVariantsSelected = {
    id: 'gid://shopify/Product/6337793261759',
  };
<ResourcePicker
            resourceType="Product"
            showVariants={true}
            open={active}
            onSelection={(resources) => handleSelection(resources)}
            onCancel={handleToggle}
            initialSelectionIds={[productWithAllVariantsSelected] }
         />