Merge pull request #2 from cheeaun/main

Update from main

README.md

@@ -11,6 +11,9 @@ Phanpy
 
 This is an alternative web client for [Mastodon](https://joinmastodon.org/).
 
+🔗 **Production**: https://phanpy.social <br>
+🔗 **Development**: https://dev.phanpy.social
+
 Everything is designed and engineered for my own use case, following my taste and vision. This is a personal side project for me to learn about Mastodon and experiment with new UI/UX ideas.
 
 🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧🚧
@@ -21,9 +24,10 @@ Everything is designed and engineered for my own use case, following my taste an
 
 ## Features
 
-- Minimalistic UI
-- Accounts switching
-- Theme switching (light, dark, auto)
+- 👪 Multiple accounts
+- 🪟 Compose window pop-out/in
+- 🌗 Light/dark/auto theme
+- 🔔 Grouped notifications
 
 ## Design decisions
 

src/app.css

@@ -307,6 +307,7 @@ a.mention span {
   border: 1px solid var(--divider-color);
   overflow: auto;
   max-height: 90vh;
+  max-height: 90dvh;
   position: relative;
 }
 .box > :is(h1, h2, h3):first-of-type {
@@ -464,6 +465,7 @@ button.carousel-dot[disabled].active {
 .sheet {
   align-self: flex-end;
   max-height: 90vh;
+  max-height: 90dvh;
   overflow: auto;
   overflow-x: hidden;
   background-color: var(--bg-color);

src/components/compose.jsx

@@ -408,6 +408,13 @@ function Compose({
                   return;
                 }
 
+                if (window.opener.__STATES__.showCompose) {
+                  const yes = confirm(
+                    'Looks like you already have a compose field open in the parent window. Popping in this window will discard the changes you made in the parent window. Continue?',
+                  );
+                  if (!yes) return;
+                }
+
                 const mediaAttachmentsWithIDs = mediaAttachments.filter(
                   (media) => media.id,
                 );

src/pages/notifications.jsx

@@ -147,7 +147,12 @@ function NotificationsList({ notifications, emptyCopy }) {
   // Create new flat list of notifications
   // Combine sibling notifications based on type and status id, ignore the id
   // Concat all notification.account into an array of _accounts
-  const cleanNotifications = [notifications[0]];
+  const cleanNotifications = [
+    {
+      ...notifications[0],
+      _accounts: [notifications[0].account],
+    },
+  ];
   for (let i = 1, j = 0; i < notifications.length; i++) {
     const notification = notifications[i];
     const cleanNotification = cleanNotifications[j];