Merge branch 'main' into l10n_main

the-clothing-loop · May 1, 2024 · 7857d1a · 7857d1a
2 parents 6e001a8 + 999528f
commit 7857d1a
Show file tree

Hide file tree

Showing 17 changed files with 513 additions and 77 deletions.
diff --git a/.github/workflows/deploy-acceptance-app.yml b/.github/workflows/deploy-acceptance-app.yml
@@ -35,6 +35,6 @@ jobs:
         run: |
           rsync -az --delete ./app/build/ admin@vps2.vps.webdock.cloud:/home/admin/acc.app.clothingloop.org/
           ssh admin@vps2.vps.webdock.cloud "\
-          sudo chmod -R 0775 /home/admin/acc.app.clothingloop.org/; \
+          sudo rsync -z -rlt --chown=www-data:www-data --chmod=0775 --delete /home/admin/acc.app.clothingloop.org/ /var/www/acc.app.clothingloop.org/; \
           sudo systemctl reload caddy"
           echo "done"
diff --git a/.github/workflows/deploy-acceptance-fe.yml b/.github/workflows/deploy-acceptance-fe.yml
@@ -35,6 +35,6 @@ jobs:
         run: |
           rsync -az --delete ./frontend/build/ admin@vps2.vps.webdock.cloud:/home/admin/acc.clothingloop.org/
           ssh admin@vps2.vps.webdock.cloud "\
-          sudo chmod -R 0775 /home/admin/acc.clothingloop.org/; \
+          sudo rsync -z -rlt --chown=www-data:www-data --chmod=0775 --delete /home/admin/acc.clothingloop.org/ /var/www/acc.clothingloop.org/; \
           sudo systemctl reload caddy"
           echo "done"
diff --git a/app/src/components/AddressList/AddressListItem.tsx b/app/src/components/AddressList/AddressListItem.tsx
@@ -1,6 +1,6 @@
 import { IonItem, IonText, IonIcon } from "@ionic/react";
 import { t } from "i18next";
-import { shield, pauseCircleSharp } from "ionicons/icons";
+import { shield, pauseCircleSharp, bag } from "ionicons/icons";
 import { Bag, User } from "../../api/types";
 import BagSVG from "../Bags/Svg";
 
@@ -30,64 +30,81 @@ export default function AddressListItem({
     <IonItem
       lines="full"
       routerLink={routerLink}
-      color={isUserPaused ? "light" : undefined}
+      color={isMe ? "primary" : isUserPaused ? "light" : undefined}
+      id={"ali-" + user.uid}
     >
-      <IonText className="ion-text-ellipsis tw-my-1.5">
-        <h5
-          className={`ion-no-margin ${
-            isMe ? "tw-text-primary" : isUserPaused ? "tw-text-medium" : ""
-          }`}
-        >
-          {user.name}
-
-          {isHost ? (
-            <IonIcon
-              icon={shield}
-              color="medium"
-              className="tw-w-4 tw-h-4 tw-m-0 tw-ml-[5px] tw-align-text-top"
-            />
-          ) : null}
-        </h5>
-        <span className="tw-opacity-60">
-          {isUserPaused ? (
-            isChainAdmin ? (
-              <small>{user.address}</small>
-            ) : null
-          ) : isAddressPrivate ? (
-            <small>&nbsp;</small>
-          ) : (
-            <small>{user.address}</small>
-          )}
-        </span>
-      </IonText>
       <IonText
         slot="start"
-        color="medium"
-        className="!tw-font-bold tw-w-[30px] tw-whitespace-nowrap"
+        color={isMe ? "light" : "medium"}
+        className="!tw-font-bold tw-w-10 tw-mr-2.5 -tw-ml-2 tw-text-right tw-whitespace-nowrap"
       >
+        {isHost ? (
+          <IonIcon
+            icon={shield}
+            color={isMe ? undefined : "medium"}
+            className="tw-absolute tw-top-1 tw-left-1 tw-w-4 tw-h-4 tw-m-0"
+          />
+        ) : null}
         {isUserPaused ? (
           <IonIcon
             icon={pauseCircleSharp}
-            color="medium"
-            className="tw-w-6 tw-h-6 tw-m-0 tw-align-text-top "
+            color={isMe ? "light" : "medium"}
+            className="tw-w-6 tw-h-6 tw-m-0 tw-align-text-top"
           />
         ) : (
-          <span>{"#" + number}</span>
+          <span>
+            <small>#</small>
+            {number}
+          </span>
         )}
       </IonText>
-      <div
-        slot="end"
-        style={{
-          width: bags.length < 4 ? 0 : 20 * Math.floor(bags.length / 2),
-          paddingBottom: bags.length < 4 ? 20 : 0,
-        }}
-        className="tw-flex tw-flex-col tw-h-10 tw-flex-wrap-reverse tw-items-end"
-      >
-        {bags.map((b) => (
-          <div className="tw-w-4 tw-h-4" key={b.id}>
-            <BagSVG bag={{ number: "", color: b.color }} isList />
+      <div className="tw-flex tw-flex-row tw-w-full">
+        <div className="tw-flex-grow tw-flex tw-flex-col tw-justify-center ion-text-ellipsis tw-my-1.5">
+          <h5
+            className={`ion-no-margin ${
+              isMe ? "tw-text-light" : isUserPaused ? "tw-text-medium" : ""
+            }`}
+          >
+            {user.name}
+          </h5>
+          <span
+            className={"tw-inline-block tw-mt-0.5 ion-text-ellipsis tw-h-4 tw-max-w-[220px] tw-text-xs ".concat(
+              isMe ? "tw-text-light" : "tw-opacity-60",
+            )}
+          >
+            {isUserPaused ? (
+              isChainAdmin ? (
+                <span>{user.address}</span>
+              ) : null
+            ) : isAddressPrivate ? null : (
+              <span>{user.address}</span>
+            )}
+          </span>
+        </div>
+        <div className="tw-flex tw-justify-end tw-items-center">
+          <div
+            dir="rtl"
+            className={"tw-grid tw-grid-rows-2 tw-gap-1 tw-mx-0.5"}
+            style={{
+              gridTemplateColumns: `repeat(${Math.ceil(
+                bags.length / 2,
+              )}, minmax(0, 1fr))`,
+            }}
+          >
+            {bags.map((b) => (
+              <div
+                className={"tw-w-4 tw-h-4".concat(
+                  isMe ? " tw-shadow-bags" : "",
+                )}
+                key={b.id}
+              >
+                <div className="-tw-translate-y-px">
+                  <BagSVG bag={{ number: "", color: b.color }} isList />
+                </div>
+              </div>
+            ))}
           </div>
-        ))}
+        </div>
       </div>
     </IonItem>
   );

diff --git a/app/src/components/UserCard.tsx b/app/src/components/UserCard.tsx
@@ -82,7 +82,7 @@ export default function UserCard({
 }) {
   const { t } = useTranslation();
   const isAddressPrivate = IsPrivate(user.address);
-  const isEmailPrivate = IsPrivate(user.email);
+  const isPhonePrivate = !user.phone_number || IsPrivate(user.phone_number);
   const isUserAdmin = useMemo(
     () => IsChainAdmin(user, chain?.uid),
     [user, chain],
@@ -158,7 +158,7 @@ export default function UserCard({
         </IonText>
       </div>
       <IonList>
-        {isEmailPrivate && !user.phone_number ? null : (
+        {isPhonePrivate ? null : (
           <>
             <IonItem
               lines="none"

diff --git a/app/src/pages/AddressList.tsx b/app/src/pages/AddressList.tsx
@@ -15,7 +15,7 @@ import {
   IonTitle,
   IonToolbar,
 } from "@ionic/react";
-import { useContext, useMemo, useRef, useState } from "react";
+import { useContext, useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { StoreContext } from "../stores/Store";
 import { openOutline, searchOutline } from "ionicons/icons";
@@ -59,6 +59,16 @@ export default function AddressList() {
 
   const [search, setSearch] = useState("");
   const slowSearch = useDebounce(search, 500);
+
+  useEffect(() => {
+    if (authUser) {
+      const el = document.querySelector("ali-" + authUser.uid);
+      el?.scrollIntoView({
+        block: "center",
+      });
+    }
+  }, []);
+
   const routeListItems = useMemo(() => {
     const routeLength = route.length;
     if (!chain || routeLength === 0) return [];
@@ -68,13 +78,10 @@ export default function AddressList() {
     }
     let topRouteIndex = 0;
     if (routeListView === "dynamic") {
-      const routePrivacy = chain.route_privacy || 2;
-      if (routePrivacy * 2 < routeLength) {
-        topRouteIndex = wrapIndex(
-          meRouteIndex - (routePrivacy <= 3 ? routePrivacy : 3),
-          routeLength,
-        );
-      }
+      topRouteIndex =
+        routeLength < 6
+          ? routeLength - 1
+          : wrapIndex(meRouteIndex - 6, routeLength);
       console.log("topRouteIndex", topRouteIndex);
     }
 

diff --git a/app/src/tailwind.css b/app/src/tailwind.css
@@ -81,6 +81,16 @@
       rgba(255, 213, 52, 1) 40px
     );
   }
+  .tw-shadow-bags {
+    @apply tw-relative;
+  }
+  .tw-shadow-bags::before {
+    @apply tw-block tw-w-full tw-h-full tw-absolute -tw-z-10;
+    content: "";
+    transform: scale(1.15);
+    border-radius: 100%;
+    background-color: #fff;
+  }
 }
 
 ion-radio::part(container) {
@@ -106,3 +116,9 @@ ion-radio.radio-checked::part(mark) {
 
   transform: rotate(45deg);
 }
+
+ion-item.ion-color-primary::part(detail-icon) {
+  --detail-icon-color: var(--ion-color-light) !important;
+  --detail-icon-opacity: 0.8;
+  /* display: none !important; */
+}
diff --git a/devops/vps2/configs/Caddyfile b/devops/vps2/configs/Caddyfile
@@ -139,7 +139,10 @@ acc.clothingloop.org {
 	}
 
 	handle_path /api/* {
-		reverse_proxy 127.0.0.1:8082
+		reverse_proxy 127.0.0.1:8082 {
+			health_uri /v2/ping
+			lb_try_duration 30s
+		}
 	}
 
 	redir /mailpit /mailpit/
@@ -148,7 +151,10 @@ acc.clothingloop.org {
 			hello@clothingloop.org TUFJTFBJVF9QQVNTV09SRA==
 		}
 		rewrite * /mailpit{path}
-		reverse_proxy 127.0.0.1:8085
+		reverse_proxy 127.0.0.1:8085 {
+			health_uri /api/v1/info
+			lb_try_duration 30s
+		}
 	}
 
 	handle {
@@ -172,7 +178,10 @@ acc.app.clothingloop.org {
 	}
 
 	handle_path /api/* {
-		reverse_proxy 127.0.0.1:8082
+		reverse_proxy 127.0.0.1:8082 {
+			health_uri /v2/ping
+			lb_try_duration 30s
+		}
 	}
 
 	handle {

diff --git a/frontend/astro-i18next.config.mjs b/frontend/astro-i18next.config.mjs
@@ -5,7 +5,14 @@ const languages = getLanguages(false);
 /** @type {import('astro-i18next').AstroI18nextConfig} */
 export default {
   locales: languages,
-  namespaces: ["about", "faq", "testimonials", "translation", "contribute"],
+  namespaces: [
+    "about",
+    "faq",
+    "testimonials",
+    "translation",
+    "contribute",
+    "survey",
+  ],
   defaultNamespace: "translation",
   load: ["server", "client"], // load i18next server and client side
   i18nextServerPlugins: {