<Show when={move || !is_dem_res_error() && !dem_res.loading().get()}
                    fallback={move || {
                        view! {<Show when={move || dem_res_error().is_some()}>
                            <div class="text-error">
                                {move || format!("ERROR: {}", dem_res_error().unwrap())}
                            </div>
                        </Show>}
                    }}>
                    <div>
                        {move || dem_res_data().unwrap().join(", ")}
                    </div>
                </Show>

                <div class="flex w-1/2 items-center">
                    <Show when={move || !is_dem_res_error() && !dem_res.loading().get()}
                        fallback={move || {
                            view! {<Show when={move || dem_res_error().is_some()}>
                                <div class="text-error grow">
                                    {move || format!("ERROR: {}", dem_res_error().unwrap())}
                                </div>
                            </Show>}
                        }}>
                        <div class="grow">
                            {move || dem_res_data().unwrap().join(", ")}
                        </div>
                    </Show>
                    <button class="btn join-item" on:click=move |_| dem_res.refetch()>
                        "Reload"
                    </button>
                </div>