Coffee journaling on ATProto (alpha) alpha.arabica.social
coffee

feat: port over original terms page

pdewey.com 0ca2f1f5 a66f67af

verified
+261 -110
+1 -1
AGENTS.md
··· 4 4 5 5 ## Tech Stack 6 6 7 - - **Language:** Go 1.21+ 7 + - **Language:** Go 1.25+ 8 8 - **HTTP:** stdlib `net/http` with Go 1.22 routing 9 9 - **Storage:** AT Protocol PDS (user data), BoltDB (sessions/feed registry) 10 10 - **Frontend:** Svelte SPA with client-side routing
+3
BACKLOG.md
··· 84 84 - The "back" button behaves kind of strangely 85 85 - Goes back to brews list after clicking on view bean in feed, 86 86 takes to profile for other users' brews. 87 + 88 + - Update terms page to be more clear about the public nature of all data 89 + - Link to about page and terms at the top of the unauthed feed
+43 -60
frontend/src/components/Footer.svelte
··· 2 2 import { navigate } from "../lib/router.js"; 3 3 </script> 4 4 5 - <footer class="bg-brown-800 text-brown-100 mt-12"> 5 + <footer class="mt-auto border-t border-brown-200 bg-brown-50"> 6 6 <div class="container mx-auto px-4 py-8"> 7 - <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> 8 - <div> 9 - <h3 class="text-lg font-bold mb-3 flex items-center gap-2"> 10 - <span>☕</span> 11 - <span>Arabica</span> 12 - </h3> 13 - <p class="text-sm text-brown-300"> 14 - Track your coffee brewing journey with decentralized data storage 15 - powered by AT Protocol. 16 - </p> 7 + <div 8 + class="flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0" 9 + > 10 + <div class="text-sm text-brown-700"> 11 + <span class="font-semibold text-brown-900">Arabica</span> - Your brew, your 12 + data 17 13 </div> 18 - 19 - <div> 20 - <h4 class="font-semibold mb-3">Links</h4> 21 - <ul class="space-y-2 text-sm"> 22 - <li> 23 - <a 24 - href="/about" 25 - on:click|preventDefault={() => navigate("/about")} 26 - class="text-brown-300 hover:text-white transition-colors" 27 - > 28 - About 29 - </a> 30 - </li> 31 - <li> 32 - <a 33 - href="/terms" 34 - on:click|preventDefault={() => navigate("/terms")} 35 - class="text-brown-300 hover:text-white transition-colors" 36 - > 37 - Terms of Service 38 - </a> 39 - </li> 40 - <li> 41 - <a 42 - href="https://tangled.org/arabica.social/arabica" 43 - target="_blank" 44 - rel="noopener noreferrer" 45 - class="text-brown-300 hover:text-white transition-colors" 46 - > 47 - Source 48 - </a> 49 - </li> 50 - </ul> 51 - </div> 52 - 53 - <div> 54 - <h4 class="font-semibold mb-3">AT Protocol</h4> 55 - <p class="text-sm text-brown-300"> 56 - Your data lives in your Personal Data Server (PDS), giving you full 57 - ownership and portability. 58 - </p> 59 - </div> 14 + <nav class="flex flex-wrap justify-center gap-6 text-sm"> 15 + <a 16 + href="/about" 17 + on:click|preventDefault={() => navigate("/about")} 18 + class="text-brown-700 hover:text-brown-900 transition-colors" 19 + > 20 + About 21 + </a> 22 + <a 23 + href="/terms" 24 + on:click|preventDefault={() => navigate("/terms")} 25 + class="text-brown-700 hover:text-brown-900 transition-colors" 26 + > 27 + Terms of Service 28 + </a> 29 + <a 30 + href="https://tangled.org/arabica.social/arabica" 31 + target="_blank" 32 + rel="noopener noreferrer" 33 + class="text-brown-700 hover:text-brown-900 transition-colors" 34 + > 35 + Source Code 36 + </a> 37 + <a 38 + href="https://atproto.com" 39 + target="_blank" 40 + rel="noopener noreferrer" 41 + class="text-brown-700 hover:text-brown-900 transition-colors" 42 + > 43 + AT Protocol 44 + </a> 45 + </nav> 60 46 </div> 61 - 62 - <div 63 - class="border-t border-brown-700 mt-8 pt-6 text-center text-sm text-brown-400" 64 - > 65 - <p> 66 - &copy; {new Date().getFullYear()} Arabica Social. All rights reserved. 67 - </p> 47 + <!-- 48 + <div class="mt-4 text-center text-xs text-brown-600"> 49 + Built on the AT Protocol - Your data lives in your Personal Data Server 68 50 </div> 51 + --> 69 52 </div> 70 53 </footer>
+3 -8
frontend/src/routes/About.svelte
··· 117 117 comments!) 118 118 </p> 119 119 </div> 120 - <div 121 - class="bg-gradient-to-br from-brown-50 to-brown-100 border border-brown-200 p-4 rounded-lg shadow-md" 122 - > 123 - <h4 class="font-semibold text-brown-900 mb-2">Export Your Data</h4> 124 - <p class="text-brown-700 text-sm"> 125 - Export all your brews anytime in JSON format 126 - </p> 127 - </div> 120 + <!-- <div --> 121 + <!-- class="bg-gradient-to-br from-brown-50 to-brown-100 border border-brown-200 p-4 rounded-lg shadow-md" --> 122 + <!-- ></div> --> 128 123 </div> 129 124 </section> 130 125
+204 -39
frontend/src/routes/Terms.svelte
··· 1 - <div class="max-w-4xl mx-auto"> 2 - <div class="bg-white rounded-xl p-8 shadow-lg"> 3 - <h1 class="text-3xl font-bold text-brown-900 mb-6">Terms of Service</h1> 1 + <script> 2 + function goBack() { 3 + if (window.history.length > 1) { 4 + window.history.back(); 5 + } else { 6 + window.location.href = "/"; 7 + } 8 + } 9 + </script> 10 + 11 + <div class="max-w-3xl mx-auto"> 12 + <div class="flex items-center gap-3 mb-8"> 13 + <button 14 + on:click={goBack} 15 + class="inline-flex items-center text-brown-700 hover:text-brown-900 font-medium transition-colors cursor-pointer" 16 + > 17 + <svg 18 + class="w-5 h-5" 19 + fill="none" 20 + stroke="currentColor" 21 + viewBox="0 0 24 24" 22 + xmlns="http://www.w3.org/2000/svg" 23 + > 24 + <path 25 + stroke-linecap="round" 26 + stroke-linejoin="round" 27 + stroke-width="2" 28 + d="M10 19l-7-7m0 0l7-7m-7 7h18" 29 + ></path> 30 + </svg> 31 + </button> 32 + <h1 class="text-4xl font-bold text-brown-800">Terms of Service</h1> 33 + </div> 4 34 5 - <div class="prose prose-brown max-w-none text-brown-800 space-y-4"> 6 - <p class="text-sm text-brown-600 italic"> 7 - Last updated: {new Date().toLocaleDateString()} 35 + <div class="prose prose-lg max-w-none space-y-6"> 36 + <section class="bg-green-50 border border-green-200 p-6 rounded-lg mb-8"> 37 + <h2 class="text-2xl font-semibold text-green-900 mb-4"> 38 + The Simple Truth 39 + </h2> 40 + <p class="text-gray-800 text-lg leading-relaxed"> 41 + <strong>You own all of your data.</strong> Period. Your brew logs, coffee 42 + beans, equipment information, and any other data you create in Arabica belongs 43 + to you and is stored in your Personal Data Server (PDS), not on our servers. 8 44 </p> 45 + </section> 9 46 10 - <h2 class="text-2xl font-bold text-brown-900 mt-8"> 11 - 1. Acceptance of Terms 47 + <section> 48 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 49 + 1. Your Data Ownership 12 50 </h2> 13 - <p> 14 - By accessing and using Arabica, you accept and agree to be bound by the 15 - terms and provision of this agreement. 51 + <!-- TODO: ensure this is correct, we may keep a witness cache of records --> 52 + <p class="text-gray-700 leading-relaxed"> 53 + All data you create through Arabica is stored in your AT Protocol 54 + Personal Data Server (PDS). Arabica acts as an interface to your PDS but 55 + does not own, claim rights to, or permanently store your data. 16 56 </p> 57 + <ul class="list-disc list-inside space-y-2 text-gray-700 mt-3"> 58 + <li>You retain full ownership and control of your data</li> 59 + <li>You can delete your data at any time</li> 60 + <li>You can switch PDS providers without losing your data</li> 61 + <li>You can stop using Arabica and your data remains in your PDS</li> 62 + </ul> 63 + </section> 17 64 18 - <h2 class="text-2xl font-bold text-brown-900 mt-8"> 19 - 2. Alpha Software Notice 65 + <section> 66 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 67 + 2. What We Store 68 + </h2> 69 + <p class="text-gray-700 leading-relaxed mb-3"> 70 + Arabica's servers store minimal data necessary for the application to 71 + function: 72 + </p> 73 + <ul class="list-disc list-inside space-y-2 text-gray-700"> 74 + <li> 75 + <strong>Session information</strong> - Temporary authentication tokens 76 + to keep you logged in 77 + </li> 78 + <li> 79 + <strong>Feed registry</strong> - List of users who've opted into the community 80 + feed 81 + </li> 82 + <li> 83 + <strong>Temporary cache</strong> - Short-lived cache of your data to improve 84 + performance 85 + </li> 86 + </ul> 87 + <!-- TODO: This may not end up being true, for performance and validation purposes, commenting for now --> 88 + <!-- If we do keep data, we will respect delete requests from PDS's --> 89 + <!-- <p class="text-gray-700 leading-relaxed mt-3"> --> 90 + <!-- We do <strong>not</strong> store your brew logs, beans, equipment, or any --> 91 + <!-- other user-generated content on our servers. That data lives exclusively --> 92 + <!-- in your PDS. --> 93 + <!-- </p> --> 94 + </section> 95 + 96 + <section> 97 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 98 + 3. Authentication 20 99 </h2> 21 - <p> 22 - Arabica is currently in alpha testing. Features, data structures, and 23 - functionality may change without notice. We recommend backing up your 24 - data regularly. 100 + <p class="text-gray-700 leading-relaxed"> 101 + Arabica uses OAuth to authenticate with your PDS. We never see or store 102 + your PDS password. Authentication is handled between your browser and 103 + your PDS, with Arabica receiving only temporary access tokens to read 104 + and write data on your behalf. 25 105 </p> 106 + </section> 26 107 27 - <h2 class="text-2xl font-bold text-brown-900 mt-8">3. Data Storage</h2> 28 - <p> 29 - Your brewing data is stored in your Personal Data Server (PDS) via the 30 - AT Protocol. Arabica does not store your brewing records on its servers. 31 - You are responsible for the security and backup of your PDS. 108 + <section> 109 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 110 + 4. Community Feed 111 + </h2> 112 + <p class="text-gray-700 leading-relaxed"> 113 + If you opt into the community feed, Arabica will periodically read your 114 + public brew records from your PDS to display them to other users. This 115 + is done by: 32 116 </p> 117 + <ul class="list-disc list-inside space-y-2 text-gray-700 mt-3"> 118 + <li>Making public API calls to your PDS</li> 119 + <li>Temporarily caching brew data for feed display</li> 120 + <li>Not storing your data permanently on our servers</li> 121 + </ul> 122 + <p class="text-gray-700 leading-relaxed mt-3"> 123 + You can opt out of the community feed at any time, and we'll stop 124 + reading your brews. 125 + </p> 126 + </section> 33 127 34 - <h2 class="text-2xl font-bold text-brown-900 mt-8"> 35 - 4. User Responsibilities 128 + <section> 129 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 130 + 5. Service Availability 36 131 </h2> 37 - <p> 38 - You are responsible for maintaining the confidentiality of your account 39 - credentials and for all activities that occur under your account. 132 + <p class="text-gray-700 leading-relaxed"> 133 + Arabica is provided "as is" without warranties of any kind. We make 134 + reasonable efforts to keep the service running but do not guarantee 135 + uptime or availability. Since your data is stored in your PDS (not our 136 + servers), you won't lose your data if Arabica goes offline. 137 + </p> 138 + </section> 139 + 140 + <section> 141 + <h2 class="text-2xl font-semibold text-brown-800 mb-4">6. Privacy</h2> 142 + <p class="text-gray-700 leading-relaxed"> 143 + We respect your privacy and follow these principles: 40 144 </p> 145 + <ul class="list-disc list-inside space-y-2 text-gray-700 mt-3"> 146 + <li>We don't sell your data</li> 147 + <li>We don't track you across websites</li> 148 + <li>We use minimal analytics to understand service usage</li> 149 + <li>We don't share your data with third parties</li> 150 + </ul> 151 + </section> 41 152 42 - <h2 class="text-2xl font-bold text-brown-900 mt-8"> 43 - 5. Limitation of Liability 153 + <section> 154 + <h2 class="text-2xl font-semibold text-brown-800 mb-4">7. Open Source</h2> 155 + <p class="text-gray-700 leading-relaxed"> 156 + Arabica is open source software. You can review the <a 157 + href="https://tangled.org/arabica.social/arabica" 158 + class="text-brown-700 hover:underline font-medium" 159 + target="_blank">code</a 160 + >, run your own instance, or contribute improvements. The transparency 161 + of open source means you can verify that we're handling your data as 162 + described in these terms. 163 + </p> 164 + </section> 165 + 166 + <section> 167 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 168 + 8. Changes to Terms 44 169 </h2> 45 - <p> 46 - Arabica is provided "as is" without warranty of any kind. We are not 47 - liable for any data loss, service interruptions, or other damages 48 - arising from your use of the application. 170 + <p class="text-gray-700 leading-relaxed"> 171 + We may update these terms occasionally. If we make significant changes, 172 + we'll notify users through the application. Continued use of Arabica 173 + after changes constitutes acceptance of the new terms. 49 174 </p> 175 + </section> 50 176 51 - <h2 class="text-2xl font-bold text-brown-900 mt-8"> 52 - 6. Changes to Terms 177 + <section> 178 + <h2 class="text-2xl font-semibold text-brown-800 mb-4"> 179 + 9. Acceptable Use 53 180 </h2> 54 - <p> 55 - We reserve the right to modify these terms at any time. Continued use of 56 - Arabica after changes constitutes acceptance of the modified terms. 181 + <p class="text-gray-700 leading-relaxed"> 182 + Please use Arabica responsibly: 57 183 </p> 58 - </div> 184 + <ul class="list-disc list-inside space-y-2 text-gray-700 mt-3"> 185 + <li>Don't attempt to access other users' data without permission</li> 186 + <li>Don't abuse the service with excessive API requests</li> 187 + <li>Don't use Arabica for illegal purposes</li> 188 + <li>Be respectful in community interactions</li> 189 + </ul> 190 + </section> 191 + 192 + <section> 193 + <h2 class="text-2xl font-semibold text-brown-800 mb-4">10. Contact</h2> 194 + <p class="text-gray-700 leading-relaxed"> 195 + Questions about these terms? You can reach us through our <a 196 + href="https://tangled.org/arabica.social/arabica" 197 + class="text-brown-700 hover:underline font-medium" 198 + target="_blank">Tangled repository</a 199 + > 200 + or by email at 201 + <a 202 + href="mailto:mail@arabica.systems" 203 + class="text-brown-700 hover:underline font-medium" 204 + >mail@arabica.systems</a 205 + >. 206 + </p> 207 + </section> 208 + 209 + <section class="bg-gray-100 p-6 rounded-lg mt-8"> 210 + <p class="text-sm text-gray-600"> 211 + <strong>Last Updated:</strong> January 2026<br /> 212 + <strong>Effective Date:</strong> January 2026 213 + </p> 214 + </section> 215 + </div> 216 + 217 + <div class="mt-12 text-center"> 218 + <a 219 + href="/brews/new" 220 + class="inline-block bg-gradient-to-r from-brown-700 to-brown-800 text-white px-8 py-3 rounded-lg hover:from-brown-800 hover:to-brown-900 transition-all font-semibold shadow-lg hover:shadow-xl" 221 + > 222 + Back to Home</a 223 + > 59 224 </div> 60 225 </div>
+5
frontend/src/styles.css
··· 11 11 min-width: 44px; 12 12 } 13 13 14 + /* TODO: figure this out, @apply may not work with tailwind v4 */ 15 + /* a { */ 16 + /* @apply text-blue-600 hover:text-blue-800 underline; */ 17 + /* } */ 18 + 14 19 /* Prevent iOS zoom on input focus */ 15 20 @media (max-width: 768px) { 16 21 input,
+2 -2
static/app/index.html
··· 22 22 23 23 <!-- Web Manifest for PWA --> 24 24 <link rel="manifest" href="/static/manifest.json" /> 25 - <script type="module" crossorigin src="/static/app/assets/index-qNP6okvG.js"></script> 26 - <link rel="stylesheet" crossorigin href="/static/app/assets/index-Dnf8PWVW.css"> 25 + <script type="module" crossorigin src="/static/app/assets/index-9kgGhE93.js"></script> 26 + <link rel="stylesheet" crossorigin href="/static/app/assets/index-5VjFKppK.css"> 27 27 </head> 28 28 <body class="bg-brown-50 text-brown-900 min-h-screen"> 29 29 <div id="app"></div>