feat(home): add Home V2 with latest channel content

AGENTS.md

@@ -0,0 +1,45 @@
+# bump 1777865725
+# bump 1777865814
+# bump 1777867296
+# bump 1777910623
+# bump 1777953698
+# bump 1777996897
+# bump 1778040099
+# bump 1778083307
+# bump 1778126499
+# bump 1778169697
+# bump 1778212893
+# bump 1778256087
+# bump 1778299283
+# bump 1778342482
+# bump 1778385682
+# bump 1778428882
+# bump 1778472084
+# bump 1778515291
+# bump 1778558469
+# bump 1778601676
+# bump 1778644868
+# bump 1778688075
+# bump 1778731277
+# bump 1778774474
+# bump 1778817673
+# bump 1778860876
+# bump 1778904071
+# bump 1778947272
+# bump 1778990476
+# bump 1779033667
+# bump 1779076871
+# bump 1779120076
+# bump 1779163272
+# bump 1779206475
+# bump 1779249674
+# bump 1779292878
+# bump 1779336069
+# bump 1779379280
+# bump 1779422475
+# bump 1779465673
+# bump 1779508869
+# bump 1779552070
+# bump 1779595269
+# bump 1779638469
+# bump 1779681673

webui-src/app/home_v2.js

@@ -0,0 +1,229 @@
+const m = require('mithril');
+const rs = require('rswebui');
+const widget = require('widgets');
+const util = require('channels/channels_util');
+
+const logo = () => {
+  return {
+    view() {
+      return m('.logo', [
+        m('img', {
+          src: 'images/retroshare.svg',
+          alt: 'retroshare_icon',
+        }),
+        m('.retroshareText', [
+          m('.retrotext', [m('span', 'RETRO'), 'SHARE']),
+          m('b', 'secure communication for everyone'),
+        ]),
+      ]);
+    },
+  };
+};
+
+const retroshareId = () => {
+  return {
+    view(v) {
+      return m('.retroshareID', [
+        m(
+          'textarea[readonly].textArea',
+          {
+            id: 'retroId',
+            placeholder: 'certificate',
+            onclick: () => {
+              document.getElementById('retroId').select();
+            },
+          },
+          v.attrs.ownCert
+        ),
+        m('i.fas.fa-copy', {
+          onclick: () => {
+            document.getElementById('retroId').select();
+            document.execCommand('copy');
+          },
+        }),
+      ]);
+    },
+  };
+};
+
+const ChannelPostCard = () => {
+  return {
+    view: (v) => {
+      const post = v.attrs.post;
+      const channel = v.attrs.channel;
+      const thumb = post.mThumbnail.mData.base64 === '' ? 'data/streaming.png' : 'data:image/png;base64,' + post.mThumbnail.mData.base64;
+      return m('.channel-post-card', {
+        onclick: () => {
+          m.route.set('/channels/subscribed/' + channel.mGroupId + '/' + post.mMeta.mMsgId);
+        },
+      }, [
+        m('.channel-post-card__thumb', m('img', { src: thumb, alt: post.mMeta.mMsgName })),
+        m('.channel-post-card__info', [
+          m('p.channel-post-card__title', post.mMeta.mMsgName),
+          m('p.channel-post-card__channel', channel.name || 'Unknown Channel'),
+          m('p.channel-post-card__date', new Date(post.mMeta.mPublishTs * 1000).toLocaleDateString()),
+        ]),
+      ]);
+    },
+  };
+};
+
+const ChannelCard = () => {
+  return {
+    view: (v) => {
+      const ch = v.attrs.channel;
+      const img = ch.image.mData.base64 === '' ? 'data/streaming.png' : 'data:image/png;base64,' + ch.image.mData.base64;
+      return m('.channel-card', {
+        onclick: () => m.route.set('/channels/subscribed/' + ch.mGroupId),
+      }, [
+        m('.channel-card__img', m('img', { src: img, alt: ch.name })),
+        m('.channel-card__info', [
+          m('p.channel-card__name', ch.name),
+          m('p.channel-card__posts', (ch.posts || 0) + ' posts'),
+        ]),
+      ]);
+    },
+  };
+};
+
+const HomeV2 = () => {
+  let ownCert = '';
+  let latestPosts = [];
+  let subscribedChannels = [];
+  let loading = true;
+
+  const loadData = () => {
+    // Load own certificate
+    rs.rsJsonApiRequest('/rsPeers/GetShortInvite', { formatRadix: true }, (data) => {
+      ownCert = decodeURIComponent(data.invite).substring(34);
+      m.redraw();
+    });
+
+    // Load channels
+    rs.rsJsonApiRequest('/rsgxschannels/getChannelsSummaries', {}, (data) => {
+      if (data && data.channels) {
+        const channels = data.channels;
+        // Get subscribed channels
+        subscribedChannels = channels.filter((ch) => ch.mSubscribed);
+        m.redraw();
+
+        // Load display info for channels to get names and images
+        subscribedChannels.slice(0, 6).forEach((ch) => {
+          util.updatedisplaychannels(ch.mGroupId);
+        });
+
+        // Load latest posts from subscribed channels
+        loadLatestPosts();
+      }
+    });
+  };
+
+  const loadLatestPosts = () => {
+    const posts = [];
+    let count = 0;
+    // Collect posts from all subscribed channels (limit to 10)
+    for (const chanId in util.Data.Posts) {
+      const channelInfo = util.Data.DisplayChannels[chanId];
+      if (!channelInfo || !channelInfo.isSubscribed) continue;
+      const chanPosts = util.Data.Posts[chanId];
+      for (const postId in chanPosts) {
+        if (chanPosts[postId] && chanPosts[postId].post) {
+          posts.push({
+            post: chanPosts[postId].post,
+            channel: channelInfo,
+          });
+          count++;
+          if (count >= 10) break;
+        }
+      }
+      if (count >= 10) break;
+    }
+    // Sort by publish time (newest first)
+    posts.sort((a, b) => (b.post.mMeta.mPublishTs || 0) - (a.post.mMeta.mPublishTs || 0));
+    latestPosts = posts;
+    loading = false;
+    m.redraw();
+  };
+
+  return {
+    oninit: () => {
+      loadData();
+      // Refresh data periodically
+      rs.setBackgroundTask(loadData, 30000, () => {});
+    },
+    view: () => {
+      return m('.homepage-v2', [
+        m(logo),
+        m('.home-v2-content', [
+          // Quick Access Row
+          m('.home-v2-section', [
+            m('h3', 'Quick Access'),
+            m('.quick-access', [
+              m('a.quick-access__item[href="/channels/subscribed"]', [
+                m('i.fas.fa-tv'),
+                m('span', 'My Channels'),
+              ]),
+              m('a.quick-access__item[href="/mail/inbox"]', [
+                m('i.fas.fa-envelope'),
+                m('span', 'Mail'),
+              ]),
+              m('a.quick-access__item[href="/people/MyContacts"]', [
+                m('i.fas.fa-address-book'),
+                m('span', 'Contacts'),
+              ]),
+              m('a.quick-access__item[href="/forums"]', [
+                m('i.fas.fa-comments'),
+                m('span', 'Forums'),
+              ]),
+            ]),
+          ]),
+
+          // My Channels
+          m('.home-v2-section', [
+            m('h3', 'My Channels'),
+            m('.channel-grid', [
+              subscribedChannels.length === 0
+                ? m('p', 'No subscribed channels yet')
+                : subscribedChannels.slice(0, 6).map((ch) =>
+                    m(ChannelCard, { channel: util.Data.DisplayChannels[ch.mGroupId] || { name: ch.mGroupId, image: { mData: { base64: '' } }, mGroupId: ch.mGroupId } })
+                  ),
+            ]),
+          ]),
+
+          // Latest Channel Posts
+          m('.home-v2-section', [
+            m('h3', 'Latest from Channels'),
+            loading
+              ? m('p', 'Loading...')
+              : m('.latest-posts', [
+                  latestPosts.length === 0
+                    ? m('p', 'No posts yet. Subscribe to channels to see content here.')
+                    : latestPosts.map((item) =>
+                        m(ChannelPostCard, { post: item.post, channel: item.channel })
+                      ),
+                ]),
+          ]),
+
+          // Your ID section
+          m('.home-v2-section', [
+            m('h3', 'Your Retroshare ID'),
+            m('.rs-id-section', [
+              ownCert
+                ? m(retroshareId, { ownCert })
+                : m('p', 'Loading your ID...'),
+              m('p.help-text', 'Share this ID with friends to connect'),
+            ]),
+          ]),
+        ]),
+      ]);
+    },
+  };
+};
+
+const Layout = () => {
+  return {
+    view: () => m(HomeV2),
+  };
+};
+
+module.exports = Layout;

webui-src/app/main.js

@@ -3,6 +3,7 @@ const m = require('mithril');
 const login = require('login');
 const rs = require('rswebui');
 const home = require('home');
+const home_v2 = require('home_v2');
 const network = require('network/network');
 const people = require('people/people_resolver');
 const chat = require('chat/chat');
@@ -137,6 +138,9 @@ m.route(document.getElementById('main'), '/', {
     render: () => m(login),
   },
   '/home': {
+    render: () => m(Layout, m(home_v2)),
+  },
+  '/home-old': {
     render: () => m(Layout, m(home)),
   },
   '/network': {