Component with Generic Type that has Generics Itself

[fabianboesiger]

Hi All,

I'm trying to construct something like this:

<Component<Vec<SomeType>> />

It seems that Leptos is unable to parse this. Is there any way to support this? A type alias appears to work, it is however not ideal.

[gbj]

You are correct that this does not parse in the view macro, and it is a limitation of the rstml crate we use for parsing the view macro.

There are definitely ways to support it; whether you like them or not are another question.

1. A type alias
2. Using a function, rather than a component, and calling it as a function (anywhere you can call a function, or in braces in the view)

#[component]
pub fn App() -> impl IntoView {
  view! {
    <p>"Some other content"</p>
    {Component::<Vec<String>>()}
  }
}

fn Component<T>() -> impl IntoView {}

3. Using a phantom type. Unless I'm mistaken, you can't have a generic component without using the prop anyway, for example as a PhantomData marker, so you can use that to provide the generic

#[component]
pub fn App() -> impl IntoView {
    view! {
      <Component marker={PhantomData::<Vec<String>>}/>
    }
}

#[component]
fn Component<T>(#[prop(optional)] marker: PhantomData<T>) -> impl IntoView {}

4. Making a PR to rstml to try to support the nested generic parsing (or a PR to leptos if it turns out the problem is here!)

[fabianboesiger]

Thanks for the reply, appreciate it!

The problem with the first and second approaches is that it isn't very ergonomic to do. The component will be in a crate provided to users who don't expect to require a type alias or use a function.

The problem with the third suggestion is that I use the type in a prop, but the prop is optional, so the type must be annotated in some cases.

I'll check out the rstml crate and see what I can do there.

[kodecraft-herald]

Hi, I found that I am facing somewhat the same issue as this one. What would be the solution if I had two generics instead? Something like this:

#[component(transparent)]
pub fn GenericSeries<T, O>(
    #[prop(optional)] options: Option<Signal<O>>,
    data: Signal<Vec<T>>,
    markers: Signal<Vec<Marker>>,
    series_type: String,
) -> impl IntoView
where
    T: Serialize + Clone + Send + Sync + 'static,
    O: Serialize + Clone + Send + Sync + 'static,
{}

[gbj]

Which of the three solutions above did you try, and what didn't work?

[kodecraft-herald]

I tried using a function and using a phantom type. How would I supply the function parameters?

view! {
  {GenericSeries::<Candlestick, CandlestickOptions>(data.read_only(),markers=markers.read_only().into() series_type="candlestick".to_string())}
}

I'm probably doing it wrong, but this doesn't work.

The problem with the phantom type is that I am using Signal<O> if I make it into a phantom type, I can't do .get() to it.

[gbj]

I'm probably doing it wrong, but this doesn't work.

Well, a component is a function that takes a single GenericSeriesProp struct as its argument -- So you can't call it as a function like this if you have marked it as a #[component], which transforms the arguments into that struct (so they can be used as names argument.)

I am using Signal<O> if I make it into a phantom type, I can't do .get() to it.

You don't need to use a phantom type if you're passing a value of the actual type.

Here's a compiling version of your example above, without knowing what any of the missing data types are

pub struct Marker;
#[derive(Serialize, Clone)]
pub struct Candlestick;
#[derive(Serialize, Clone)]
pub struct CandlestickOptions;

#[component(transparent)]
pub fn GenericSeries<T, O>(
    #[prop(optional)] options: Option<Signal<O>>,
    data: Signal<Vec<T>>,
    markers: Signal<Vec<Marker>>,
    series_type: String,
) -> impl IntoView
where
    T: Serialize + Clone + Send + Sync + 'static,
    O: Serialize + Clone + Send + Sync + 'static,
{
}

#[component]
fn App() -> impl IntoView {
    view! {
        <GenericSeries<Candlestick, CandlestickOptions>
            data={Signal::derive(Vec::new)}
            markers={Signal::derive(Vec::new)}
            series_type={"foo".into()}
        />
    }
}