diff --git a/routes/_components/Status.html b/routes/_components/Status.html index 87c0cc40..8e77ac7c 100644 --- a/routes/_components/Status.html +++ b/routes/_components/Status.html @@ -38,7 +38,7 @@ max-width: 600px; margin: 0 auto; padding: 10px 0; - border-bottom: 1px solid var(--border-color); + border-bottom: 1px solid var(--main-border); display: grid; width: 100%; grid-template-areas: diff --git a/routes/_utils/store.js b/routes/_utils/store.js index 2a4c6d06..c11961c4 100644 --- a/routes/_utils/store.js +++ b/routes/_utils/store.js @@ -52,6 +52,19 @@ store.compute( (currentInstance, loggedInInstances) => !!(currentInstance && Object.keys(loggedInInstances).includes(currentInstance)) ) +store.compute( + 'loggedInInstancesAsList', + ['currentInstance', 'loggedInInstances', 'loggedInInstancesInOrder'], + (currentInstance, loggedInInstances, loggedInInstancesInOrder) => { + return loggedInInstancesInOrder.map(instanceName => { + return Object.assign({ + current: currentInstance === instanceName, + name: instanceName + }, loggedInInstances[instanceName]) + }) + } +) + if (process.browser && process.env.NODE_ENV !== 'production') { window.store = store // for debugging } diff --git a/routes/settings/instances.html b/routes/settings/instances.html index 812abb55..87dd7389 100644 --- a/routes/settings/instances.html +++ b/routes/settings/instances.html @@ -6,15 +6,29 @@ Instances + {{#if $isUserLoggedIn}} + + {{#each $loggedInInstancesAsList as instance}} + + {{instance.name}} + + {{/each}} + + {{else}} Connect to an instance to start using Pinafore. + {{/if}} - - Instance name: - - Add instance - + {{#if !$isUserLoggedIn}} + + Instance name: + + Add instance + + {{/if}} - Don't have an instance? Join Mastodon! + {{#if !$isUserLoggedIn}} + Don't have an instance? Join Mastodon! + {{/if}}
Connect to an instance to start using Pinafore.
Don't have an instance? Join Mastodon!