feat(account): enhance session item removal animation and update metadata description

ts_web/elements/account/views/baseview.ts

@@ -266,6 +266,19 @@ export class BaseView extends DeesElement {
         gap: 12px;
         padding: 12px 20px;
         border-bottom: 1px solid #27272a;
+        overflow: hidden;
+        transition: all 0.3s ease-out;
+        opacity: 1;
+        max-height: 100px;
+      }
+
+      .session-item.removing {
+        opacity: 0;
+        max-height: 0;
+        padding-top: 0;
+        padding-bottom: 0;
+        margin: 0;
+        border-bottom-color: transparent;
       }
 
       .session-item:last-child {
@@ -600,7 +613,7 @@ export class BaseView extends DeesElement {
     return html`
       <div class="session-list">
         ${this.sessions.map((session) => html`
-          <div class="session-item">
+          <div class="session-item" data-session-id=${session.id}>
             <div class="session-icon ${session.isCurrent ? 'current' : ''}">
               <dees-icon .icon=${this.getDeviceIcon(session.os)}></dees-icon>
             </div>
@@ -797,6 +810,14 @@ export class BaseView extends DeesElement {
       );
 
       await typedRequest.fire({ jwt, sessionId });
+
+      // Animate the session item collapse before removing from DOM
+      const sessionElement = this.shadowRoot?.querySelector(`[data-session-id="${sessionId}"]`) as HTMLElement;
+      if (sessionElement) {
+        sessionElement.classList.add('removing');
+        await new Promise(resolve => setTimeout(resolve, 300)); // Wait for animation
+      }
+
       await this.loadSessions();
     } catch (error) {
       console.error('Error revoking session:', error);

ts_web/index.ts

@@ -12,7 +12,7 @@ const run = async () => {
     metaObject: {
       title: 'idp.global',
       description:
-        'the code that runs idp.global',
+        'Your permanent identity on the web',
       canonicalDomain: 'https://idp.global',
       ldCompany: {
         name: 'Task Venture Capital GmbH',
@@ -29,9 +29,7 @@ const run = async () => {
           description: 'work',
           name: 'Task Venture Capital GmbH',
           type: 'company',
-          facebookUrl: 'https://www.facebook.com/undefined variable',
+          website: 'https://task.vc',
-          twitterUrl: 'https://twitter.com/undefined variable',
-          website: 'https://Task Venture Capital GmbH',
           phone: '+49 421 16767 548',
         },
         closedDate: null,