Merge branch 'master' into live

app/assets/stylesheets/components/dashboard_services.css

@@ -1,5 +1,5 @@
 @layer components {
   .services > div > a {
-    background-image: linear-gradient(110deg, rgba(255,255,255,0.99) 0, rgba(255,255,255,0.88) 100%);
+    background-image: linear-gradient(110deg, rgba(255,255,255,0.99) 20%, rgba(255,255,255,0.88) 100%);
   }
 }

app/controllers/services/remotestorage_controller.rb

@@ -8,8 +8,7 @@ class Services::RemotestorageController < Services::BaseController
     # unless current_user.service_enabled?(:remotestorage)
     #   redirect_to service_remotestorage_info_path
     # end
-    @rs_auths = current_user.remote_storage_authorizations
-    # TODO sort by app name
+    # @rs_apps_connected = current_user.remote_storage_authorizations.any?
   end
 
   private

app/controllers/services/rs_auths_controller.rb

@@ -3,7 +3,12 @@ class Services::RsAuthsController < Services::BaseController
   before_action :require_feature_enabled
   before_action :require_service_available
   # before_action :require_service_enabled
-  before_action :find_rs_auth
+  before_action :find_rs_auth, only: [:destroy, :launch_app]
+
+  def index
+    @rs_auths = current_user.remote_storage_authorizations
+    # TODO sort by app name?
+  end
 
   def destroy
     @auth.destroy!

app/controllers/well_known_controller.rb

@@ -4,7 +4,7 @@ class WellKnownController < ApplicationController
   def nostr
     http_status :unprocessable_entity and return if params[:name].blank?
     domain = request.headers["X-Forwarded-Host"].presence || Setting.primary_domain
-    relay_url = Setting.nostr_relay_url
+    relay_url = Setting.nostr_relay_url.presence
 
     if params[:name] == "_"
       # pubkey for the primary domain without a username (e.g. kosmos.org)

app/views/contributions/projects/index.html.erb

@@ -43,7 +43,7 @@
     </p>
     <p>
       We have run two 6-month trials so far, with the next trial period
-      starting sometime in Q2 2024. Watch your email for notifications about it!
+      starting sometime soon. Watch your email for notifications about it!
     </p>
   </section>
 <% end %>

app/views/dashboard/index.html.erb

@@ -5,7 +5,7 @@
     <div class="services grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6">
       <% if Setting.ejabberd_enabled? %>
         <div class="border border-gray-300 rounded-md hover:border-gray-400
-                    bg-cover bg-[center_top_-50px] bg-no-repeat
+                    bg-[length:86%] bg-[center_top_-40px] bg-no-repeat
                     bg-[url(/img/logos/icon_xmpp.svg)]">
           <%= link_to services_chat_path,
                 class: "block h-full px-6 py-6 rounded-md" do %>
@@ -18,7 +18,7 @@
       <% end %>
       <% if Setting.mastodon_enabled? %>
         <div class="border border-gray-300 rounded-md hover:border-gray-400
-                    bg-[length:80%] bg-[right_top_-30px] bg-no-repeat
+                    bg-[length:88%] bg-[center_top_-40px] bg-no-repeat
                     bg-[url(/img/logos/icon_mastodon.svg)]">
           <%= link_to services_mastodon_path, class: "block h-full px-6 py-6 rounded-md" do %>
             <h3 class="mb-3.5">Mastodon</h3>
@@ -30,7 +30,9 @@
       <% end %>
       <% if Setting.email_enabled? &&
             Flipper.enabled?(:email, current_user) %>
-        <div class="border border-gray-300 rounded-md hover:border-gray-400">
+        <div class="border border-gray-300 rounded-md hover:border-gray-400
+                    bg-[length:90%] bg-[center_top_-160px] bg-no-repeat
+                    bg-[url(/img/logos/icon_mail.svg)]">
           <%= link_to services_email_path, class: "block h-full px-6 py-6 rounded-md" do %>
             <h3 class="mb-3.5">E-Mail</h3>
             <p class="text-gray-600">
@@ -39,15 +41,16 @@
           <% end %>
         </div>
       <% end %>
-      <% if Setting.discourse_enabled? %>
+      <% if Setting.remotestorage_enabled? &&
+            Flipper.enabled?(:remotestorage, current_user) %>
         <div class="border border-gray-300 rounded-md hover:border-gray-400
-                    bg-[length:95%] bg-center bg-no-repeat
-                    bg-[url(/img/logos/icon_discourse.svg)]">
-          <%= link_to "#{Setting.discourse_public_url}/session/sso?return_path=/",
+                    bg-[length:80%] bg-[center_top_-156px] bg-no-repeat
+                    bg-[url(/img/logos/icon_remotestorage.svg)]">
+          <%= link_to services_storage_path,
                 class: "block h-full px-6 py-6 rounded-md" do %>
-            <h3 class="mb-3.5">Discourse</h3>
+            <h3 class="mb-3.5">Storage</h3>
             <p class="text-gray-600">
-              Kosmos community forums and user support/help site
+              Sync your data between apps and devices
             </p>
           <% end %>
         </div>
@@ -65,21 +68,22 @@
           <% end %>
         </div>
       <% end %>
-      <% if Setting.remotestorage_enabled? &&
-            Flipper.enabled?(:remotestorage, current_user) %>
-        <div class="border border-gray-300 rounded-md hover:border-gray-400">
-          <%= link_to services_storage_path,
+      <% if Setting.discourse_enabled? %>
+        <div class="border border-gray-300 rounded-md hover:border-gray-400
+                    bg-[length:80%] bg-center bg-no-repeat
+                    bg-[url(/img/logos/icon_discourse.svg)]">
+          <%= link_to "#{Setting.discourse_public_url}/session/sso?return_path=/",
                 class: "block h-full px-6 py-6 rounded-md" do %>
-            <h3 class="mb-3.5">Storage</h3>
+            <h3 class="mb-3.5">Discourse</h3>
             <p class="text-gray-600">
-              Sync your data between apps and devices
+              Community forums and support/help site
             </p>
           <% end %>
         </div>
       <% end %>
       <% if Setting.gitea_enabled? %>
         <div class="border border-gray-300 rounded-md hover:border-gray-400
-                    bg-cover bg-center bg-no-repeat
+                    bg-[length:92%] bg-center bg-no-repeat
                     bg-[url(/img/logos/icon_gitea.png)]">
           <%= link_to Setting.gitea_public_url,
                 class: "block h-full px-6 py-6 rounded-md" do %>
@@ -92,7 +96,7 @@
       <% end %>
       <% if Setting.droneci_enabled? %>
         <div class="border border-gray-300 rounded-md hover:border-gray-400
-                    bg-cover bg-[center_top_-70px] bg-no-repeat
+                    bg-[length:86%] bg-[center_top_-60px] bg-no-repeat
                     bg-[url(/img/logos/icon_droneci.svg)]">
           <%= link_to Setting.droneci_public_url,
                 class: "block h-full px-6 py-6 rounded-md" do %>

app/views/services/email/show.html.erb

@@ -100,6 +100,14 @@
             ["Website", "https://www.thunderbird.net"]
           ]
         ) %>
+        <%= render AppInfoComponent.new(
+          name: "Geary",
+          description: "Built around conversations, for the GNOME desktop",
+          icon_path: "/img/logos/icon_geary.png",
+          links: [
+            ["Website", "https://wiki.gnome.org/Apps/Geary"]
+          ]
+        ) %>
       </div>
       <div id="apps-windows" class="hidden grid grid-cols-1 gap-6"
            data-tabs-target="panel">

app/views/services/remotestorage/show.html.erb

@@ -2,15 +2,143 @@
 
 <%= render MainSimpleComponent.new do %>
   <section>
-    <h3 class="mb-10">Connected Apps</h3>
-    <% if @rs_auths.any? %>
-    <div class="w-full grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-y-10 gap-x-12">
-    <% @rs_auths.each do |auth| %>
-      <%= render RsAuthComponent.new(auth: auth) %>
-    <% end %>
+    <p class="mb-6">
+      Store and synchronize your app data across different devices.
+    </p>
+  </section>
+
+  <%= render partial: "shared/tabnav_remotestorage" %>
+
+  <section>
+    <h3>Your Storage Address</h3>
+    <p class="mb-6">
+      In order to connect an app to your storage account, give it your address:
+    </p>
+    <p data-controller="clipboard" class="flex gap-1 sm:w-2/5">
+      <input type="text" id="user_address" class="grow"
+             value=<%= current_user.address %> disabled="disabled"
+             data-clipboard-target="source" />
+      <button id="copy-user-address" class="btn-md btn-icon btn-outline shrink-0"
+              data-clipboard-target="trigger" data-action="clipboard#copy"
+              title="Copy to clipboard">
+        <span class="content-initial">
+          <%= render partial: "icons/copy", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
+        </span>
+        <span class="content-active hidden">
+          <%= render partial: "icons/check", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
+        </span>
+      </button>
+    </p>
+  </section>
+
+  <section>
+    <h3>Recommended Apps</h3>
+    <div data-controller="tabs"
+         data-tabs-active-tab-class="-mb-px border-gray-200 border-l border-t border-r rounded-t text-indigo-600 hover:text-indigo-600"
+         data-tabs-inactive-tab-class="text-gray-500 hover:text-gray-700"
+         class="mb-12">
+      <select data-action="tabs#change" data-tabs-target="select"
+              class="block w-full mb-8 sm:hidden">
+        <option>Productivity</option>
+        <option>Bookmarks</option>
+        <option>Reading</option>
+        <option>File sharing</option>
+        <option>Learning</option>
+      </select>
+      <ul class="hidden sm:flex list-reset mb-8 border-gray-200 border-b">
+        <li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change:prevent">
+          <a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
+            Productivity
+          </a>
+        </li>
+        <li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change:prevent">
+          <a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
+            Bookmarks
+          </a>
+        </li>
+        <li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change:prevent">
+          <a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
+            Reading
+          </a>
+        </li>
+        <li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change:prevent">
+          <a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
+            File sharing
+          </a>
+        </li>
+        <li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change:prevent">
+          <a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
+            Learning
+          </a>
+        </li>
+      </ul>
+
+      <div class="hidden grid grid-cols-1 gap-6" data-tabs-target="panel">
+        <%= render AppInfoComponent.new(
+          name: "Hyperdraft",
+          description: "Create text notes and (optionally) turn them into a website",
+          icon_path: "/img/app_icons/hyperdraft.png",
+          links: [
+            ["Web App", "https://hyperdraft.rosano.ca"],
+          ]
+        ) %>
+        <%= render AppInfoComponent.new(
+          name: "Notes Together",
+          description: "A powerful note-taking app, with support for attaching images and other files",
+          icon_path: "/img/app_icons/notes-together.png",
+          links: [
+            ["Web App", "https://notestogether.hominidsoftware.com"],
+          ]
+        ) %>
+        <%= render AppInfoComponent.new(
+          name: "Papiers",
+          description: "A simple note-taking app",
+          icon_path: "/img/app_icons/papiers.png",
+          links: [
+            ["Web App", "https://papiers.gitlab.io"],
+          ]
+        ) %>
+      </div>
+      <div class="hidden grid grid-cols-1 gap-6" data-tabs-target="panel">
+        <%= render AppInfoComponent.new(
+          name: "Webmarks",
+          description: "Archive your bookmarks in your remote storage",
+          icon_path: "/img/app_icons/webmarks.png",
+          links: [
+            ["Web App", "https://webmarks.5apps.com"],
+          ]
+        ) %>
+      </div>
+      <div class="hidden grid grid-cols-1 gap-6" data-tabs-target="panel">
+        <%= render AppInfoComponent.new(
+          name: "Pétrolette",
+          description: "A news aggregator that syncs with your remote storage",
+          icon_path: "/img/app_icons/petrolette.png",
+          links: [
+            ["Web App", "https://petrolette.space"],
+          ]
+        ) %>
+      </div>
+      <div class="hidden grid grid-cols-1 gap-6" data-tabs-target="panel">
+        <%= render AppInfoComponent.new(
+          name: "Sharesome",
+          description: "Quickly and easily share files from your remote storage",
+          icon_path: "/img/app_icons/sharesome.png",
+          links: [
+            ["Web App", "https://sharesome.5apps.com"],
+          ]
+        ) %>
+      </div>
+      <div class="hidden grid grid-cols-1 gap-6" data-tabs-target="panel">
+        <%= render AppInfoComponent.new(
+          name: "Kommit",
+          description: "Create flashcards and learn them with spaced-repetition",
+          icon_path: "/img/app_icons/kommit.png",
+          links: [
+            ["Web App", "https://kommit.rosano.ca"],
+          ]
+        ) %>
+      </div>
     </div>
-    <% else %>
-    <p>No apps connected yet.</p>
-    <% end %>
   </section>
 <% end %>

app/views/services/rs_auths/index.html.erb

@@ -0,0 +1,33 @@
+<%= render HeaderComponent.new(title: "Storage") %>
+
+<%= render MainSimpleComponent.new do %>
+  <section>
+    <p class="mb-6">
+      Store and synchronize your app data across different devices.
+    </p>
+  </section>
+
+  <%= render partial: "shared/tabnav_remotestorage" %>
+
+  <section>
+    <% if @rs_auths.any? %>
+      <div class="w-full grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-y-10 gap-x-12 mt-4">
+      <% @rs_auths.each do |auth| %>
+        <%= render RsAuthComponent.new(auth: auth) %>
+      <% end %>
+    </div>
+    <% else %>
+      <div class="text-center">
+        <p class="mt-4 mb-12 inline-flex align-center items-center">
+          <%= image_tag("/img/illustrations/undraw_friends_r511.svg", class: 'h-48') %>
+        </p>
+        <h3>
+          No apps connected
+        </h3>
+        <p class="text-gray-500">
+          When connected, your apps will show up here.
+        </p>
+      </div>
+    <% end %>
+  </section>
+<% end %>

app/views/shared/_tabnav_remotestorage.html.erb

@@ -0,0 +1,14 @@
+<section>
+  <div class="border-b border-gray-200">
+    <nav class="-mb-px flex" aria-label="Tabs">
+      <%= render TabnavLinkComponent.new(
+        name: "Info", path: services_storage_path,
+        active: current_page?(services_storage_path)
+      ) %>
+      <%= render TabnavLinkComponent.new(
+        name: "Connected Apps", path: apps_services_storage_path,
+        active: current_page?(apps_services_storage_path)
+      ) %>
+    </nav>
+  </div>
+</section>