Get help on Discord

How to Pass Props to the Desk Structure ICON

8 replies
Last updated: Feb 4, 2022
Wondering if there is a trick to pass props to the desk-structure ICON?

import {
  File
} from "phosphor-react";

S.listItem()
    .title("Pages")
    .id("pages")
    .child(S.documentTypeList("page").title("Pages overview"))
    .schemaType("page")
    .icon(File),
Want something like this:


S.listItem()
    .title("Pages")
    .id("pages")
    .child(S.documentTypeList("page").title("Pages overview"))
    .schemaType("page")
    .icon(<File color="#FF0000"/>),
Is there a trick to do this
😄?
Feb 4, 2022, 10:15 PM
We do this pretty regularly in our internal tool Hyperdrive. For example:
S.listItem()
 .title('My Community Tracker Filters')
 .icon(() => <Tile color='#d0f4dc'><FilterIcon /></Tile>)
 .child(...)
Feb 4, 2022, 10:18 PM
user M
You are the bomb 😄
Feb 4, 2022, 10:18 PM
no you
Feb 4, 2022, 10:18 PM
We do this pretty regularly in our internal tool Hyperdrive. For example:
S.listItem()
 .title('My Community Tracker Filters')
 .icon(() => <Tile color='#d0f4dc'><FilterIcon /></Tile>)
 .child(...)
Feb 4, 2022, 10:18 PM
user M
Works good 😄
Feb 4, 2022, 10:30 PM
user M
Works good 😄
Feb 4, 2022, 10:30 PM
Fun colors! I was about to say "I didn't know you could return components" but of course that's what the React icons are 😃
Feb 4, 2022, 11:49 PM
user S
Yeah for our company I am using the same colors for the front and back end 😊👍🙌
Feb 4, 2022, 11:54 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Get started for freeExplore the demo

Was this answer helpful?