hacklab/OASIS_MOBILE
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions 1

[0.9.1] Mobile: Personal/Community filter the home hive from any page

Browse source 
- Turn the header Personal/Community tabs into links to
  /activity?hive=personal|community, so they work on every page (they take
  you to the home and filter the hexagons), not only while already on
  /activity — no more dead buttons off the home.
- Drop the "All" tab: entering shows all 10 categories; clicking a filter
  that is already active toggles it off and shows all again.
- Filter the hive server-side (renderHiveNav reads the request filter set
  by the middleware) instead of the CSS radio-hack, and drop the now-dead
  half-filter CSS. Active tab is highlighted via the .active class.
This commit is contained in:
s1to 2026-08-04 11:46:19 +02:00
parent d5dac39bfd
commit 7f85389a88
4 changed files with 19 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/views/activity_view.js
View file

@ -1994,7 +1994,7 @@ exports.activityView = (actions, filter, userId, q = '', extras = {}) => {
p(desc)
),
renderHiveNav(),
input({ type: 'checkbox', id: 'activity-filter-toggle', class: 'hive-filter-radio' }),
input({ type: 'checkbox', id: 'activity-filter-toggle', class: 'activity-filter-toggle' }),
label({ for: 'activity-filter-toggle', class: 'activity-filter-btn' },
span(i18n.filter || 'Filter'), span({ class: 'activity-filter-caret' }, '▾')),
div({ class: 'activity-filter-panel' },

24
src/views/main_views.js
View file

@ -1239,17 +1239,20 @@ const renderHiveNav = () => {
{ id: 'fediverse', emoji: '⌬', title: i18n.fediverse, mods: [
{ href: '/fediverse', glyph: 'ꗵ', labelKey: 'fediverseTimeline', mod: 'fediverseMod' } ] },
];
const half = (c) => (CATS.indexOf(c) < 5 ? 'hive-half-p' : 'hive-half-c');
const catHex = (c) => label({ for: `hive-${c.id}`, class: `hex-cat ${half(c)}` },
// filtro server-side (lo pone el middleware desde ?hive=): personal = CATS[0..4], community = CATS[5..9], vacío = las 10
const hiveFilter = (typeof global !== "undefined" && global.__OASIS_HIVE_FILTER__) || "";
const shown = hiveFilter === "personal" ? CATS.slice(0, 5) : hiveFilter === "community" ? CATS.slice(5) : CATS;
const rowSizes = shown.length <= 5 ? [3, 2] : [3, 4, 3];
const catHex = (c) => label({ for: `hive-${c.id}`, class: 'hex-cat' },
span({ class: 'hx-ico' }, c.emoji), span({ class: 'hx-lbl' }, c.title));
const modHex = (m) => a({ class: 'hex-mod', href: m.href },
span({ class: 'hx-ico' }, m.glyph), span({ class: 'hx-lbl' }, i18n[m.labelKey] || ''));
const radios = CATS.map(c => input({ type: 'radio', name: 'hive-cat', id: `hive-${c.id}`, class: 'hive-radio' }));
const radios = shown.map(c => input({ type: 'radio', name: 'hive-cat', id: `hive-${c.id}`, class: 'hive-radio' }));
const catRows = [];
let idx = 0;
for (const size of [3, 4, 3]) { catRows.push(div({ class: 'hive-row' }, ...CATS.slice(idx, idx + size).map(catHex))); idx += size; }
for (const size of rowSizes) { catRows.push(div({ class: 'hive-row' }, ...shown.slice(idx, idx + size).map(catHex))); idx += size; }
const grid = div({ class: 'hive-grid hive-cats' }, ...catRows);
const panels = CATS.map(c => div({ class: `hive-panel ${half(c)}`, id: `hive-panel-${c.id}` },
const panels = shown.map(c => div({ class: 'hive-panel', id: `hive-panel-${c.id}` },
div({ class: 'hive-mods' }, ...c.mods.filter(m => modOn(m.mod)).map(modHex))
));
return div({ class: 'hive-nav' }, ...radios, grid, ...panels);
@ -1260,6 +1263,7 @@ const template = (titlePrefix, ...elements) => {
const currentConfig = getConfig();
const theme = currentConfig.themes.current || "Dark-SNH";
const uxMode = currentConfig.ux?.current === "ainav" ? "ainav" : "blocks";
const hiveFilter = (typeof global !== "undefined" && global.__OASIS_HIVE_FILTER__) || "";
const themeLink = link({
rel: "stylesheet",
href: `/assets/themes/${theme}.css`
@ -1285,17 +1289,15 @@ const template = (titlePrefix, ...elements) => {
})
),
body(
input({ type: "radio", name: "hive-filter", id: "hive-filter-all", class: "hive-filter-radio", checked: true }),
input({ type: "radio", name: "hive-filter", id: "hive-filter-personal", class: "hive-filter-radio" }),
input({ type: "radio", name: "hive-filter", id: "hive-filter-community", class: "hive-filter-radio" }),
div(
{ class: uxMode === "ainav" ? "header ainav-only" : "header" },
renderMobileTopbar(),
div(
{ class: "oasis-mobile-menus" },
label({ for: "hive-filter-all", class: "oasis-menu-btn" }, span(i18n.menuAll || "All")),
label({ for: "hive-filter-personal", class: "oasis-menu-btn" }, span(i18n.menuPersonal || "Personal")),
label({ for: "hive-filter-community", class: "oasis-menu-btn" }, span(i18n.menuCommunity || "Community"))
// enlaces (no checkboxes): funcionan en CUALQUIER página → navegan al home /activity con el filtro.
// toggle: si el filtro ya está activo, el enlace lleva a /activity (se deselecciona → todos)
a({ class: hiveFilter === "personal" ? "oasis-menu-btn active" : "oasis-menu-btn", href: hiveFilter === "personal" ? "/activity" : "/activity?hive=personal" }, span(i18n.menuPersonal || "Personal")),
a({ class: hiveFilter === "community" ? "oasis-menu-btn active" : "oasis-menu-btn", href: hiveFilter === "community" ? "/activity" : "/activity?hive=community" }, span(i18n.menuCommunity || "Community"))
),
(() => {
const aiNavOn = getConfig().modules.aiNavMod === 'on';