How to add data in the about track of @jbrowse/react-linear-genome-view

[emilievillar]

Hi,
We are using @jbrowse/react-linear-genome-view (currently in 2.7.2) as a genome browser on our website.
We have multiple tracks available, and the reviewers of our paper ask to add the reference of the tracks inside the UI, typically in the "about track" menu button.
Here is an exemple of the tracks configuration we are giving to react-linear-genome-view:

 {
            "type": "FeatureTrack",
            "trackId": "ASM15095v2-Transposable-Elements",
            "name": "Phaeodactylum tricornutum Transposable Elements",
            "category": [" Transposable Elements"],
            "assemblyNames": ["ASM15095v2"],
            "reference": "https://doi.org/10.1038/s41598-018-23106-x",
            "adapter": {
                "type": "Gff3TabixAdapter",
                "gffGzLocation": {
                    "uri": "{SERVER_DATA_URL}/phaeodactylum_tricornutum/Tracks/phatr3_repetitive_sequences.gff3.gz",
                },
                "index": {
                    "location": {
                        "uri": "{SERVER_DATA_URL}/phaeodactylum_tricornutum/Tracks/phatr3_repetitive_sequences.gff3.gz.tbi",
                    },
                    "indexType": "TBI",
                },
            },
            "renderer": {
                "type": "SvgFeatureRenderer",
            },
        }

As the majority of the config was visible inside the about track, we tried naively to put the reference field inside the config, without success.

Do you have an idea of how I could add a custom field inside the about track menu ?
Thank you for the help.

[cmdcolin]

you can add it in a "metadata" object on the track e.g.

 {
            "type": "FeatureTrack",
            "trackId": "ASM15095v2-Transposable-Elements",
            "name": "Phaeodactylum tricornutum Transposable Elements",
            "category": [" Transposable Elements"],
            "assemblyNames": ["ASM15095v2"],
            "metadata": { "reference": "https://doi.org/10.1038/s41598-018-23106-x" },
            "adapter": {
                "type": "Gff3TabixAdapter",
                "gffGzLocation": {
                    "uri": "{SERVER_DATA_URL}/phaeodactylum_tricornutum/Tracks/phatr3_repetitive_sequences.gff3.gz",
                },
                "index": {
                    "location": {
                        "uri": "{SERVER_DATA_URL}/phaeodactylum_tricornutum/Tracks/phatr3_repetitive_sequences.gff3.gz.tbi",
                    },
                    "indexType": "TBI",
                },
            }
        }

The "config" is (perhaps unfortunately) a bit strict about what they allow so it discards any fields that are not predefined in our "config schema" (can elaborate if interested but hopefully that helps)

also, as you can see, the file "header" is shown in the "About track" dialog, so metadata about the file can also be put in there (for GFF3 that includes lines starting with "#")

just to mention other options for completeness sake, there are some additional options like using the "formatAbout" to programmatically add, change, or remove fields from the "About track" dialog (https://jbrowse.org/jb2/docs/config/basetrack/#slot-formataboutconfig) which is analogous to "formatDetails" for the feature details.

[cmdcolin]

(note that i also removed the renderer part of your config. that would be unused now, that was only used in very early like 0.0.x versions of jbrowse 2)

[emilievillar]

It works perfectly!
Many thanks for your quick answer!