[Request] atomFamily with param and optional value

[devnode]

#330 touched on this subject but the solution there doesn't really work if you have multiple data sources.

For example, what I'm working on right now, has state for Quotes and Orders. Both have Products and all the logic associated with Products is identical between them.

It would be convenient if atomFamily (or a new util) accepted an optional, non-memoized, value to be used for initialization:

export const products = atomFamily({
  key: 'products',
  default: (key, value) => {
    let out = []
    value.forEach((v, i) => {
      const rkey = `${key}/product/${i}`
      
      // create individual atoms for the mutable fields
      productQuantity(rkey, v.quantity)
      productPrice(rkey, v.price)

      // add rkey to each product for later reference
      out.push({ ...v, rkey })
    })
    return out
  }
})

Here's a simplified overview of what I'm doing now:

export const products = memoize(
  (rkey: string, value?: Array<Product>) => {
    return atom({
      key: `${rkey}/products`,
      default: value || [],
    })
  },
  { length: 1 }
)

export const quoteData = atomFamily<Quote, number>({
  key: 'quoteData',
  default: selectorFamily<Quote, number>({
    key: 'quoteData/Default',
    get: (id) => async () => {
      const resp = await fetch(`/api/quotes/${id}`)
      if (!resp.ok) {
        throw `${resp.status} - ${resp.statusText}`
      }
      let data: Quote = await resp.json()

      const rkey = `quote/${id}`
      data.rkey = rkey
      products(rkey, data.products)

      return data
    },
  }),
})

export const orderData = atomFamily<Order, number>({
  key: 'orderData',
  default: selectorFamily<Order, number>({
    key: 'orderData/Default',
    get: (id) => async () => {
      const resp = await fetch(`/api/orders/${id}`)
      if (!resp.ok) {
        throw `${resp.status} - ${resp.statusText}`
      }
      let data: Order = await resp.json()

      const rkey = `order/${id}`
      data.rkey = rkey
      products(rkey, data.products)

      return data
    },
  }),
})

function ListProducts({ rkey }) {
  const results = useRecoilValue(products(rkey))
  ...
}

[drarmstr]

@devnode - Please see the discussion in #231