Also show connect button on article page

src/frontend/components/connect.rs

@@ -0,0 +1,25 @@
+use crate::frontend::app::GlobalState;
+use leptos::{component, *};
+use url::Url;
+
+#[component]
+pub fn ConnectView<T: Clone + 'static, R: 'static>(res: Resource<T, R>) -> impl IntoView {
+    let connect_ibis_wiki = create_action(move |_: &()| async move {
+        GlobalState::api_client()
+            .resolve_instance(Url::parse("https://ibis.wiki").unwrap())
+            .await
+            .unwrap();
+        res.refetch();
+    });
+
+    view! {
+        <div class="flex justify-center h-screen">
+            <button
+                class="btn btn-primary place-self-center"
+                on:click=move |_| connect_ibis_wiki.dispatch(())
+            >
+                Connect with ibis.wiki
+            </button>
+        </div>
+    }
+}

src/frontend/components/mod.rs

@@ -1,4 +1,5 @@
 pub mod article_nav;
+pub mod connect;
 pub mod credentials;
 pub mod editor;
 pub mod instance_follow_button;

src/frontend/pages/article/list.rs

@@ -1,6 +1,6 @@
 use crate::{
     common::ListArticlesForm,
-    frontend::{app::GlobalState, article_link, article_title},
+    frontend::{app::GlobalState, article_link, article_title, components::connect::ConnectView},
 };
 use html::Input;
 use leptos::*;
@@ -50,26 +50,31 @@ pub fn ListArticles() -> impl IntoView {
                     }
                 />
             </div>
-            <ul class="list-none my-4">
+            <Show
-                {move || {
+                when=move || { articles.get().unwrap_or_default().len() > 1 || only_local.get() }
-                    articles
+                fallback=move || view! { <ConnectView res=articles /> }
-                        .get()
+            >
-                        .map(|a| {
+                <ul class="list-none my-4">
-                            a.into_iter()
+                    {move || {
-                                .map(|a| {
+                        articles
-                                    view! {
+                            .get()
-                                        <li>
+                            .map(|a| {
-                                            <a class="link text-lg" href=article_link(&a)>
+                                a.into_iter()
-                                                {article_title(&a)}
+                                    .map(|a| {
-                                            </a>
+                                        view! {
-                                        </li>
+                                            <li>
-                                    }
+                                                <a class="link text-lg" href=article_link(&a)>
-                                })
+                                                    {article_title(&a)}
-                                .collect::<Vec<_>>()
+                                                </a>
-                        })
+                                            </li>
-                }}
+                                        }
+                                    })
+                                    .collect::<Vec<_>>()
+                            })
+                    }}
 
-            </ul>
+                </ul>
+            </Show>
         </Suspense>
     }
 }

src/frontend/pages/instance/list.rs

@@ -1,6 +1,5 @@
-use crate::frontend::app::GlobalState;
+use crate::frontend::{app::GlobalState, components::connect::ConnectView};
 use leptos::*;
-use url::Url;
 
 #[component]
 pub fn ListInstances() -> impl IntoView {
@@ -9,32 +8,12 @@ pub fn ListInstances() -> impl IntoView {
         |_| async move { GlobalState::api_client().list_instances().await.unwrap() },
     );
 
-    let connect_ibis_wiki = create_action(move |_: &()| async move {
-        GlobalState::api_client()
-            .resolve_instance(Url::parse("https://ibis.wiki").unwrap())
-            .await
-            .unwrap();
-        instances.refetch();
-    });
-    let fallback = move || {
-        view! {
-            <div class="flex justify-center h-screen">
-                <button
-                    class="btn btn-primary place-self-center"
-                    on:click=move |_| connect_ibis_wiki.dispatch(())
-                >
-                    Connect with ibis.wiki
-                </button>
-            </div>
-        }
-    };
-
     view! {
         <h1 class="text-4xl font-bold font-serif my-4">Instances</h1>
         <Suspense fallback=|| view! { "Loading..." }>
             <Show
                 when=move || { !instances.get().unwrap_or_default().is_empty() }
-                fallback=fallback
+                fallback=move || view! { <ConnectView res=instances /> }
             >
                 <ul class="list-none my-4">
                     {move || {