components/ConditionalRender.tsx

rustacean · site/quartz/components/ConditionalRender.tsx · typescript · MIT
ui, tag:embed-classified

Higher-order component that renders a child component conditionally based on props.

// Source: https://github.com/AgriciDaniel/rustacean | License: MIT | Copyright 2026 Agrici Daniel
// Provided via justclaw.it.com; keep this notice with the code.
import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"

type ConditionalRenderConfig = {
  component: QuartzComponent
  condition: (props: QuartzComponentProps) => boolean
}

export default ((config: ConditionalRenderConfig) => {
  const ConditionalRender: QuartzComponent = (props: QuartzComponentProps) => {
    if (config.condition(props)) {
      return <config.component {...props} />
    }

    return null
  }

  ConditionalRender.afterDOMLoaded = config.component.afterDOMLoaded
  ConditionalRender.beforeDOMLoaded = config.component.beforeDOMLoaded
  ConditionalRender.css = config.componen

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search for more like it.

Get a free API key