---
# System prepended metadata

title: Untitled

---

## Opening layer-bound panels on startup 

### Background

The main question here is how do current layer-bound fixtures decide which layer to "choose".

* Metadata: The metadata panel has a `payload` prop that has a `layer: LayerInstance` property. The metadata fixture's API has a `toggleMetadata` that simply passes the layer (and all other props) into the panel.
* Settings: Does more or less the same thing as metadata.
* Grid: The grid fixture's API sets the current layer's ID in the Vue store, and the grid panel retrieves the ID from the store and does its thing.
* Details
    * Layers panel: The details fixture's API sets the payload, which is an array of `IdentifyResult`s in the Vue store, and the layers panel retrieves this from the store. Each `IdentifyResult` has a `uid` property indicating the `uid` of the layer.
    * Item and results panel: These panels take in a `result` prop of type `IdentifyResult` and use that to display the result on the screen.

So TLDR: We have a mix of the panel handling all the layer stuff and the fixture API setting stuff on the store and the panel retrieving stuff from the store.

### The goal

We want to be able to open layer-bound panels on startup via the config. We also want to do this without having to make a ton of changes to the fixtures code and potentially starting more fires.

### The proposal

Make the panels handle all the layer stuff. So wherever we have layer stuff stored in the Vue store, attempt to make it as a prop in a panel and then make the panel handle layer magic. Additionally, make this layer prop accept either of the layer's `id`, `uid`, or `LayerInstance` object. This will allow us to do something like this in the config:

```JS
panels: {
    open: [
        { id: 'settings', 
          props: { layer: 'myLayerID' }
        },
        { 
          id: 'details-item',
          screen: 'item-screen',
          pin: true
          props: { 
              result: [
                  { 
                      items: <Identify Results go here>, 
                      layer: 'myLayerID', 
                      loaded: true, 
                      loading: Promise.resolve, 
                      requestTime: 03284032
                  },
                  ...other results
              ]
          }
        }
    ]
}
```

I believe this is the simplest option as it allows someone to work with panels without also having to learn about fixture stuff. Additionally, we can keep all the "open on startup" stuff for panels instead of having an auto-open for fixtures and an auto-open for panels. Inside the fixture's API, we would just call open on the panel and pass in the required props. 

So in short, the proposed solution is to make the panels do all the work.

#### Main Issue

The main challenge is potentially around the timing of when layers are added. We'd have to add logic to each panel to handle the case of "layer is not there now, but will be added by the sneaky dev in 20 seconds". Also, we'd also need error handling logic for if the desired layer errors. Some of the panels have this logic, but others don't.

There's also the whole challenge of when you add a layer, it doesn't exist in the store until its initiated. So another annoyance would be having to watch for the layer registered event if the layer is not there at the time of panel mount.

We could also just open an empty panel on startup if the layer is not there, but this sort of defeats the purpose of opening layer-bound panels.
