More blabla (#154)

* WIP * updates * Apply suggestions from code review Co-authored-by: Martin Stone <[email protected]> --------- Co-authored-by: Martin Stone <[email protected]>
LycheeOrg · Oct 14, 2024 · d95a6e8 · d95a6e8
1 parent 28f61a9
commit d95a6e8
Show file tree

Hide file tree

Showing 4 changed files with 267 additions and 7 deletions.
diff --git a/src/components/ui/Tick.astro b/src/components/ui/Tick.astro
@@ -0,0 +1,8 @@
+---
+import { Icon } from 'astro-icon/components';
+
+const { icon = '', classes = {} } = Astro.props;
+---
+<div class={`inline-block rounded-full mt-1 w-5 h-5 ${classes?.icon_bg ?? 'bg-sky-100 dark:bg-sky-800'}`}>
+    <Icon name={icon ? icon : 'tabler:check'} class={`w-5 h-5 font-bold p-1 ${classes?.icon ?? 'text-primary dark:text-neutral-300'}`} />
+</div>
diff --git a/src/content/post/2024-10-07-v6-beta2.mdx b/src/content/post/2024-10-07-v6-beta2.mdx
@@ -0,0 +1,33 @@
+---
+publishDate: 2024-10-13T21:46:00Z
+author: ildyria
+title: 'Bite-size v6: Updates and timelines'
+excerpt: Bite-size v6 is a series of small post showing the progress made on the development of the future version of Lychee.
+image: https://images.unsplash.com/photo-1495020689067-958852a7765e?q=80&w=3538&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D
+category: Active Development
+tags:
+  - lychee
+  - vuejs
+  - v6
+---
+
+It has been a week since the release of the beta and I do get questions such as "*when will we see a production build?*""
+
+This an hard to answer question. One one hand, we could merge the changes and ship 6.0.0 today.
+Why don't we do it? Because there has not been a thorough review process on it the [Pull Request #2504](https://github.com/LycheeOrg/Lychee/pull/2504) yet.
+
+At LycheeOrg we strive for quality, and while I am confident in my abilities, everyone has a blind spot.
+For this reason, I am waiting for the feedback of our Beta users, in order to fix their findings.
+
+Over the past week, I got a lot of feedback from Tino Hager (big thanks), so I still have a few things to work on, namely:
+
+- [ ] : Rotation - refresh visual.
+- [ ] : Album selection when only one album exists => edge case list is empty.
+- [ ] : Drag & drop photo.
+- [ ] : Ctrl + V pasting photos to upload.
+- [ ] : Upload button when album is empty.
+
+I already solved a lot of his previous notes, and will happily continue doing it again in the future.
+
+Now to the question, can I already use the docker `alpha` branch in production?
+I am doing it, but I know lychee like the palm of my hand, YMMV. :)
diff --git a/src/pages/get-supporter-edition.astro b/src/pages/get-supporter-edition.astro
@@ -1,10 +1,13 @@
 ---
 import Layout from '~/layouts/PageLayout.astro';
 
+import Tick from '~/components/ui/Tick.astro';
 import Hero from '~/components/widgets/Hero.astro';
 // import CallToAction from '~/components/widgets/CallToAction.astro';
 import Prices from '~/components/widgets/Pricing.astro';
 import FAQs from '~/components/widgets/FAQs.astro';
+import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
+import Headline from '~/components/ui/Headline.astro';
 
 const metadata = {
   title: 'Pre-Launch Landing Page',
@@ -46,10 +49,10 @@ const metadata = {
         period: 'per month',
         items: [
           {
-            description: 'Unlimited albums.',
+            description: 'Unlimited users.',
           },
           {
-            description: 'Unlimited users.',
+            description: 'Unlimited albums.',
           },
           {
             description: 'Unlimited photos upload.',
@@ -70,15 +73,18 @@ const metadata = {
         price: 5,
         period: 'Per Month',
         items: [
-        {
-            description: 'Unlimited albums.',
-          },
           {
             description: 'Unlimited users.',
           },
+          {
+            description: 'Unlimited albums.',
+          },
           {
             description: 'Unlimited photos upload.',
           },
+          {
+            description: 'Statistics on your library.',
+          },
           {
             description: 'more to come...',
             icon: 'tabler:question-mark',
@@ -91,14 +97,216 @@ const metadata = {
         ],
         callToAction: {
           target: '_blank',
-          text: 'Get started',
-          href: '#',
+          text: 'Support us!',
+          href: 'https://github.com/sponsors/LycheeOrg',
         },
         hasRibbon: true,
         ribbonTitle: 'popular',
       }
     ]}
   />
+<!-- TODO : add table with all the functionalities of Lychee detailed. -->
+  <WidgetWrapper id={"fullDetails"} isDark={false} containerClass={`max-w-3xl mx-auto`}>
+    <Headline title={"Full comparison"} 
+    tagline={"the essentials and a few more"}
+     />
+     <!-- subtitle={subtitle}  -->
+     <div>
+      <table class="w-full border-collapse border border-neutral-200 dark:border-neutral-800">
+        <thead>
+          <tr class="bg-neutral-100 dark:bg-neutral-700">
+            <th class="p-2 text-xl font-bold text-left">Features</th>
+            <th class="p-2 text-xl font-bold">Free</th>
+            <th class="p-2 text-xl font-bold">Lychee <span class="text-sky-600">SE</span></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr class="bg-neutral-50 dark:bg-neutral-800">
+            <td class="p-2 font-semibold">Global</td>
+            <td class="p-2 text-center"></td>
+            <td class="p-2 text-center"></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted"><span class="text-black dark:text-neutral-400/50 font-bold">Dark</span> and <span class="text-neutral-500 dark:text-neutral-100  font-bold">Light</span> themes</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Unlimited photos upload</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Unlimited number of albums</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Unlimited number of users</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Multiple language supported</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+
+          <tr class="bg-neutral-50 dark:bg-neutral-800">
+            <td class="p-2 font-semibold">Photo management</td>
+            <td class="p-2 text-center"></td>
+            <td class="p-2 text-center"></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Full sizes and other variants</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Auto rotation on import</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Exif Data decoding</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Localization data reverse search</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Upload by chunks</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Zip & download</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+
+
+          <tr class="bg-neutral-50 dark:bg-neutral-800">
+            <td class="p-2 font-bold">Album management</td>
+            <td class="px-2 text-center"></td>
+            <td class="px-2 text-center"></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Smart albums</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Unlimited photos per album</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Possibility to create an album within another album</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Zip & download</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Custom sorting per album</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Justified/Masonry/Square photo layout</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Photo layout customizable per album</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Selectable hero header photo per album</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Slideshow with previous & next</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+
+
+          <tr class="bg-neutral-50 dark:bg-neutral-800">
+            <td class="p-2 font-bold">User management</td>
+            <td class="px-2 text-center"></td>
+            <td class="px-2 text-center"></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Login with WebAuthn and Oauth</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Access rights management</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Cross-user Album sharing</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Space usage per user</td>
+            <td class="px-2 text-center"></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr class="">
+            <td class="px-2 text-muted">Upload Quota per user</td>
+            <td class="px-2 text-center"></td>
+            <td class="px-2 text-center"><Tick classes={{icon_bg:'bg-neutral-100 dark:bg-neutral-800', icon: 'text-neutral-800 dark:text-neutral-400'}}/></td>
+          </tr>
+
+
+          <tr class="bg-neutral-50 dark:bg-neutral-800">
+            <td class="p-2 font-bold">Administration</td>
+            <td class="px-2 text-center"></td>
+            <td class="px-2 text-center"></td>
+          </tr>
+          <tr>
+            <td class="px-2 text-muted">Logs</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr>
+            <td class="px-2 text-muted">Maintenance page</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr>
+            <td class="px-2 text-muted">Diagnostics tools</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr>
+            <td class="px-2 text-muted">Full Manual settings control</td>
+            <td class="px-2 text-center"><Tick/></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          <tr>
+            <td class="px-2 text-muted">Statistics on your installation</td>
+            <td class="px-2 text-center"></td>
+            <td class="px-2 text-center"><Tick/></td>
+          </tr>
+          </tbody>
+      </table>
+    </div>
+  </WidgetWrapper>
 
   <FAQs
   title="FAQs"

diff --git a/src/types.d.ts b/src/types.d.ts
@@ -297,3 +297,14 @@ export interface Content3 extends Omit<Headline, 'classes'>, Widget {
 }
 
 export interface Contact extends Omit<Headline, 'classes'>, Form, Widget {}
+
+export interface Spec {
+  type: string;
+  values?: string[];
+  available?: boolean[];
+}
+
+export interface Products { 
+  products: string[];
+}
+