is there any standard practice for conditional modifiers inside a composable? Something like this: `...

# compose

[myanmarking]

is there any standard practice for conditional modifiers inside a composable? Something like this:

modifier.run { 
    if(featureA){
        modifierX()
    } else{
        this
    }
}

[mattinger]

That seems reasonable to me to be honest. You could certainly simplify it with an extension function:

fun Modifier.conditionalModifier(condition: Boolean, factory: Modifier.() -> Modifier): Modifier =
    if (condition) {
        factory()
    } else {
        this
    }

Modifier.conditionalModifier(true) { height(4.dp) }

[Job Guldemeester]

I believe there is also a Modifier.then as seen in the Surface composable:

modifier                .shadow(elevation, shape, clip = false)
.then(
if (border != null) Modifier.border(border, shape)
else Modifier
)
.background(
color = backgroundColor,
shape = shape
)

[myanmarking]

oh .. so we can use than, an pass Modifier when condition not met. makes sense!

[mattinger]

yeah. it’s just some nice syntactic sugar instead of the .run block

[mattinger]

but the .then works as well, but again, you’re baking in the if statement, which at times can get ugly looking.

[mattinger]

i would have named it “when”, but that’s a reserved keyword

[myanmarking]

yes. thanks!

[Zach Klippenstein (he/him) [MOD]]

If your modifier chain is getting too messy you can factor vals out:

val border = if() Modifier.border(…) else Modifier
…
modifier
  .shadow(…)
  .then(border)
  .background…

[myanmarking]

thats quite clever. ya

[myanmarking]

compose is so well build. The team is awesome

[Casey Brooks]

I've made myself a helpful extension function for cases like this.

inline fun Modifier.thenIf(
    condition: Boolean, 
    block: ()->Modifier
) = this.then(if(condition) block() else Modifier)

Besides that, using the .then(if...) syntax seems to be the most common from the Compose sources

[Tiago Nunes]

@Casey Brooks Really nice one!

[Waqas Tahir]

Modifier.then(
    if(condition){
       Modifier.firstModifier()
    }else{
       Modifier
    }
)

I saw this being used inside compose libraries