poc: improve galaxy rendering

core/models.py

@@ -560,7 +560,7 @@ class User(AbstractUser):
         """Determine if the object is owned by the user."""
         if hasattr(obj, "is_owned_by") and obj.is_owned_by(self):
             return True
-        if hasattr(obj, "owner_group") and self.is_in_group(pk=obj.owner_group_id):
+        if hasattr(obj, "owner_group") and self.is_in_group(pk=obj.owner_group.id):
             return True
         return self.is_root
 
@@ -569,15 +569,9 @@ class User(AbstractUser):
         if hasattr(obj, "can_be_edited_by") and obj.can_be_edited_by(self):
             return True
         if hasattr(obj, "edit_groups"):
-            if (
+            for pk in obj.edit_groups.values_list("pk", flat=True):
-                hasattr(obj, "_prefetched_objects_cache")
+                if self.is_in_group(pk=pk):
-                and "edit_groups" in obj._prefetched_objects_cache
+                    return True
-            ):
-                pks = [g.id for g in obj.edit_groups.all()]
-            else:
-                pks = list(obj.edit_groups.values_list("id", flat=True))
-            if any(self.is_in_group(pk=pk) for pk in pks):
-                return True
         if isinstance(obj, User) and obj == self:
             return True
         return self.is_owner(obj)
@@ -587,18 +581,9 @@ class User(AbstractUser):
         if hasattr(obj, "can_be_viewed_by") and obj.can_be_viewed_by(self):
             return True
         if hasattr(obj, "view_groups"):
-            # if "view_groups" has already been prefetched, use
+            for pk in obj.view_groups.values_list("pk", flat=True):
-            # the prefetch cache, else fetch only the ids, to make
+                if self.is_in_group(pk=pk):
-            # the query lighter.
+                    return True
-            if (
-                hasattr(obj, "_prefetched_objects_cache")
-                and "view_groups" in obj._prefetched_objects_cache
-            ):
-                pks = [g.id for g in obj.view_groups.all()]
-            else:
-                pks = list(obj.view_groups.values_list("id", flat=True))
-            if any(self.is_in_group(pk=pk) for pk in pks):
-                return True
         return self.can_edit(obj)
 
     def can_be_edited_by(self, user):
@@ -1399,9 +1384,9 @@ class Page(models.Model):
 
     @cached_property
     def is_club_page(self):
-        return (
+        club_root_page = Page.objects.filter(name=settings.SITH_CLUB_ROOT_PAGE).first()
-            self.name == settings.SITH_CLUB_ROOT_PAGE
+        return club_root_page is not None and (
-            or settings.SITH_CLUB_ROOT_PAGE in [p.name for p in self.get_parent_list()]
+            self == club_root_page or club_root_page in self.get_parent_list()
         )
 
     @cached_property

core/templates/core/page_list.jinja

@@ -5,12 +5,16 @@
 {% endblock %}
 
 {% block content %}
-  <h3>{% trans %}Page list{% endtrans %}</h3>
+  {% if page_list %}
-  <ul>
+    <h3>{% trans %}Page list{% endtrans %}</h3>
-    {% for p in page_list %}
+    <ul>
-      <li><a href="{{ p.get_absolute_url() }}">{{ p.display_name }}</a></li>
+      {% for p in page_list %}
-    {% endfor %}
+        <li><a href="{{ p.get_absolute_url() }}">{{ p.get_display_name() }}</a></li>
-  </ul>
+      {% endfor %}
+    </ul>
+  {% else %}
+    {% trans %}There is no page in this website.{% endtrans %}
+  {% endif %}
 {% endblock %}
 
 

core/views/page.py

@@ -12,10 +12,7 @@
 # OR WITHIN THE LOCAL FILE "LICENSE"
 #
 #
-
 from django.contrib.auth.mixins import PermissionRequiredMixin
-from django.db.models import F, OuterRef, Subquery
-from django.db.models.functions import Coalesce
 
 # This file contains all the views that concern the page model
 from django.forms.models import modelform_factory
@@ -46,20 +43,6 @@ class CanEditPagePropMixin(CanEditPropMixin):
 class PageListView(CanViewMixin, ListView):
     model = Page
     template_name = "core/page_list.jinja"
-    queryset = (
-        Page.objects.annotate(
-            display_name=Coalesce(
-                Subquery(
-                    PageRev.objects.filter(page=OuterRef("id"))
-                    .order_by("-date")
-                    .values("title")[:1]
-                ),
-                F("name"),
-            )
-        )
-        .prefetch_related("view_groups")
-        .select_related("parent")
-    )
 
 
 class PageView(CanViewMixin, DetailView):

counter/forms.py

@@ -1,19 +1,13 @@
 import math
 
 from django import forms
-from django.core.exceptions import ValidationError
 from django.db.models import Q
 from django.utils.translation import gettext_lazy as _
-from django_celery_beat.models import ClockedSchedule, PeriodicTask
 from phonenumber_field.widgets import RegionalPhoneNumberWidget
 
 from club.widgets.ajax_select import AutoCompleteSelectClub
 from core.models import User
-from core.views.forms import (
+from core.views.forms import NFCTextInput, SelectDate, SelectDateTime
-    NFCTextInput,
-    SelectDate,
-    SelectDateTime,
-)
 from core.views.widgets.ajax_select import (
     AutoCompleteSelect,
     AutoCompleteSelectMultipleGroup,
@@ -164,66 +158,6 @@ class CounterEditForm(forms.ModelForm):
         }
 
 
-class ProductArchiveForm(forms.Form):
-    """Form for automatic product archiving."""
-
-    enabled = forms.BooleanField(
-        label=_("Enabled"),
-        widget=forms.CheckboxInput(attrs={"class": "switch"}),
-        required=False,
-    )
-    archive_at = forms.DateTimeField(
-        label=_("Date and time of archiving"), widget=SelectDateTime, required=False
-    )
-
-    def __init__(self, *args, product: Product, **kwargs):
-        self.product = product
-        self.instance = PeriodicTask.objects.filter(
-            task="counter.tasks.archive_product", args=f"[{product.id}]"
-        ).first()
-        super().__init__(*args, **kwargs)
-        if self.instance:
-            self.fields["enabled"].initial = self.instance.enabled
-            self.fields["archive_at"].initial = self.instance.clocked.clocked_time
-
-    def clean(self):
-        cleaned_data = super().clean()
-        if cleaned_data["enabled"] is True and cleaned_data["archive_at"] is None:
-            raise ValidationError(
-                _(
-                    "Automatic archiving cannot be enabled "
-                    "without providing a archiving date."
-                )
-            )
-
-    def save(self):
-        if not self.changed_data:
-            return
-        if not self.instance:
-            PeriodicTask.objects.create(
-                task="counter.tasks.archive_product",
-                args=f"[{self.product.id}]",
-                name=f"Archive product {self.product}",
-                clocked=ClockedSchedule.objects.create(
-                    clocked_time=self.cleaned_data["archive_at"]
-                ),
-                enabled=self.cleaned_data["enabled"],
-                one_off=True,
-            )
-            return
-        if (
-            "archive_at" in self.changed_data
-            and self.cleaned_data["archive_at"] is None
-        ):
-            self.instance.delete()
-        elif "archive_at" in self.changed_data:
-            self.instance.clocked.clocked_time = self.cleaned_data["archive_at"]
-            self.instance.clocked.save()
-        self.instance.enabled = self.cleaned_data["enabled"]
-        self.instance.save()
-        return self.instance
-
-
 class ProductEditForm(forms.ModelForm):
     error_css_class = "error"
     required_css_class = "required"
@@ -265,19 +199,22 @@ class ProductEditForm(forms.ModelForm):
         queryset=Counter.objects.all(),
     )
 
-    def __init__(self, *args, instance=None, **kwargs):
+    def __init__(self, *args, **kwargs):
-        super().__init__(*args, instance=instance, **kwargs)
+        super().__init__(*args, **kwargs)
         if self.instance.id:
             self.fields["counters"].initial = self.instance.counters.all()
-        self.archive_form = ProductArchiveForm(*args, product=self.instance, **kwargs)
-
-    def is_valid(self):
-        return super().is_valid() and self.archive_form.is_valid()
 
     def save(self, *args, **kwargs):
         ret = super().save(*args, **kwargs)
-        self.instance.counters.set(self.cleaned_data["counters"])
+        if self.fields["counters"].initial:
-        self.archive_form.save()
+            # Remove the product from all counter it was added to
+            # It will then only be added to selected counters
+            for counter in self.fields["counters"].initial:
+                counter.products.remove(self.instance)
+                counter.save()
+        for counter in self.cleaned_data["counters"]:
+            counter.products.add(self.instance)
+            counter.save()
         return ret
 
 

counter/models.py

@@ -445,8 +445,7 @@ class Product(models.Model):
         buying_groups = list(self.buying_groups.all())
         if not buying_groups:
             return True
-        res = any(user.is_in_group(pk=group.id) for group in buying_groups)
+        return any(user.is_in_group(pk=group.id) for group in buying_groups)
-        return res
 
     @property
     def profit(self):

counter/tasks.py

@@ -1,13 +0,0 @@
-# Create your tasks here
-
-from celery import shared_task
-
-from counter.models import Product
-
-
-@shared_task
-def archive_product(product_id):
-    product = Product.objects.get(id=product_id)
-    product.archived = True
-    product.save()
-    product.counters.clear()

counter/templates/counter/product_form.jinja

@@ -1,31 +0,0 @@
-{% extends "core/base.jinja" %}
-
-{% block content %}
-  {% if object %}
-    <h2>{% trans name=object %}Edit product {{ name }}{% endtrans %}</h2>
-  {% else %}
-    <h2>{% trans %}Product creation{% endtrans %}</h2>
-  {% endif %}
-  <form method="post">
-    {% csrf_token %}
-    {{ form.as_p() }}
-
-    <br />
-
-    <h3>{% trans %}Automatic archiving{% endtrans %}</h3>
-
-    <p>
-      <em>
-        {%- trans trimmed -%}
-          Automatic archiving allows you to mark a product as archived
-          and remove it from all its counters at a specified time and date.
-        {%- endtrans -%}
-      </em>
-    </p>
-
-    <fieldset x-data="{enabled: {{ form.archive_form.enabled.initial|tojson }}}">
-      {{ form.archive_form.as_p() }}
-    </fieldset>
-    <p><input type="submit" value="{% trans %}Save{% endtrans %}" /></p>
-  </form>
-{% endblock %}

counter/views/admin.py

@@ -147,7 +147,7 @@ class ProductCreateView(CounterAdminTabsMixin, CounterAdminMixin, CreateView):
 
     model = Product
     form_class = ProductEditForm
-    template_name = "counter/product_form.jinja"
+    template_name = "core/create.jinja"
     current_tab = "products"
 
 
@@ -157,7 +157,7 @@ class ProductEditView(CounterAdminTabsMixin, CounterAdminMixin, UpdateView):
     model = Product
     form_class = ProductEditForm
     pk_url_kwarg = "product_id"
-    template_name = "counter/product_form.jinja"
+    template_name = "core/edit.jinja"
     current_tab = "products"
 
 

galaxy/static/bundled/galaxy/galaxy-index.js

@@ -1,138 +0,0 @@
-import { default as ForceGraph3D } from "3d-force-graph";
-import { forceX, forceY, forceZ } from "d3-force-3d";
-// biome-ignore lint/style/noNamespaceImport: This is how it should be imported
-import * as Three from "three";
-import SpriteText from "three-spritetext";
-
-/**
- * @typedef GalaxyConfig
- * @property {number} nodeId id of the current user node
- * @property {string} dataUrl url to fetch the galaxy data from
- **/
-
-/**
- * Load the galaxy of an user
- * @param {GalaxyConfig} config
- **/
-window.loadGalaxy = (config) => {
-  window.getNodeFromId = (id) => {
-    return Graph.graphData().nodes.find((n) => n.id === id);
-  };
-
-  window.getLinksFromNodeId = (id) => {
-    return Graph.graphData().links.filter(
-      (l) => l.source.id === id || l.target.id === id,
-    );
-  };
-
-  window.focusNode = (node) => {
-    highlightNodes.clear();
-    highlightLinks.clear();
-
-    hoverNode = node || null;
-    if (node) {
-      // collect neighbors and links for highlighting
-      for (const link of window.getLinksFromNodeId(node.id)) {
-        highlightLinks.add(link);
-        highlightNodes.add(link.source);
-        highlightNodes.add(link.target);
-      }
-    }
-
-    // refresh node and link display
-    Graph.nodeThreeObject(Graph.nodeThreeObject())
-      .linkWidth(Graph.linkWidth())
-      .linkDirectionalParticles(Graph.linkDirectionalParticles());
-
-    // Aim at node from outside it
-    const distance = 42;
-    const distRatio = 1 + distance / Math.hypot(node.x, node.y, node.z);
-
-    const newPos =
-      node.x || node.y || node.z
-        ? { x: node.x * distRatio, y: node.y * distRatio, z: node.z * distRatio }
-        : { x: 0, y: 0, z: distance }; // special case if node is in (0,0,0)
-
-    Graph.cameraPosition(
-      newPos, // new position
-      node, // lookAt ({ x, y, z })
-      3000, // ms transition duration
-    );
-  };
-
-  const highlightNodes = new Set();
-  const highlightLinks = new Set();
-  let hoverNode = null;
-
-  const grpahDiv = document.getElementById("3d-graph");
-  const Graph = ForceGraph3D();
-  Graph(grpahDiv);
-  Graph.jsonUrl(config.dataUrl)
-    .width(
-      grpahDiv.parentElement.clientWidth > 1200
-        ? 1200
-        : grpahDiv.parentElement.clientWidth,
-    ) // Not perfect at all. JS-fu master from the future, please fix this :-)
-    .height(1000)
-    .enableNodeDrag(false) // allow easier navigation
-    .onNodeClick((node) => {
-      const camera = Graph.cameraPosition();
-      const distance = Math.sqrt(
-        (node.x - camera.x) ** 2 + (node.y - camera.y) ** 2 + (node.z - camera.z) ** 2,
-      );
-      if (distance < 120 || highlightNodes.has(node)) {
-        window.focusNode(node);
-      }
-    })
-    .linkWidth((link) => (highlightLinks.has(link) ? 0.4 : 0.0))
-    .linkColor((link) =>
-      highlightLinks.has(link) ? "rgba(255,160,0,1)" : "rgba(128,255,255,0.6)",
-    )
-    .linkVisibility((link) => highlightLinks.has(link))
-    .nodeVisibility((node) => highlightNodes.has(node) || node.mass > 4)
-    // .linkDirectionalParticles(link => highlightLinks.has(link) ? 3 : 1) // kinda buggy for now, and slows this a bit, but would be great to help visualize lanes
-    .linkDirectionalParticleWidth(0.2)
-    .linkDirectionalParticleSpeed(-0.006)
-    .nodeThreeObject((node) => {
-      const sprite = new SpriteText(node.name);
-      sprite.material.depthWrite = false; // make sprite background transparent
-      sprite.color = highlightNodes.has(node)
-        ? node === hoverNode
-          ? "rgba(200,0,0,1)"
-          : "rgba(255,160,0,0.8)"
-        : "rgba(0,255,255,0.2)";
-      sprite.textHeight = 2;
-      sprite.center = new Three.Vector2(1.2, 0.5);
-      return sprite;
-    })
-    .onEngineStop(() => {
-      window.focusNode(window.getNodeFromId(config.nodeId));
-      Graph.onEngineStop(() => {
-        /* nope */
-      }); // don't call ourselves in a loop while moving the focus
-    });
-
-  // Set distance between stars
-  Graph.d3Force("link").distance((link) => link.value);
-
-  // Set high masses nearer the center of the galaxy
-  // TODO: quick and dirty strength computation, this will need tuning.
-  Graph.d3Force(
-    "positionX",
-    forceX().strength((node) => {
-      return 1 - 1 / node.mass;
-    }),
-  );
-  Graph.d3Force(
-    "positionY",
-    forceY().strength((node) => {
-      return 1 - 1 / node.mass;
-    }),
-  );
-  Graph.d3Force(
-    "positionZ",
-    forceZ().strength((node) => {
-      return 1 - 1 / node.mass;
-    }),
-  );
-};

galaxy/static/bundled/galaxy/galaxy-index.ts

@@ -0,0 +1,137 @@
+import { exportToHtml } from "#core:utils/globals";
+
+import cytoscape from "cytoscape";
+import d3Force, { type D3ForceLayoutOptions } from "cytoscape-d3-force";
+
+cytoscape.use(d3Force);
+
+interface GalaxyConfig {
+  nodeId: number;
+  dataUrl: string;
+}
+
+async function getGraphData(dataUrl: string) {
+  const response = await fetch(dataUrl);
+  if (!response.ok) {
+    return [];
+  }
+
+  const content = await response.json();
+  const nodes = content.nodes.map((node, i) => {
+    return {
+      group: "nodes",
+      data: {
+        id: node.id,
+        name: node.name,
+        mass: node.mass,
+      },
+    };
+  });
+
+  const edges = content.links.map((link) => {
+    return {
+      group: "edges",
+      data: {
+        id: `edge_${link.source}_${link.value}`,
+        source: link.source,
+        target: link.target,
+        value: link.value,
+      },
+    };
+  });
+
+  return { nodes: nodes, edges: edges };
+}
+
+exportToHtml("loadGalaxy", async (config: GalaxyConfig) => {
+  const graphDiv = document.getElementById("3d-graph");
+  const elements = await getGraphData(config.dataUrl);
+  const cy = cytoscape({
+    container: graphDiv,
+    elements: elements,
+    style: [
+      {
+        selector: "node",
+        style: {
+          label: "data(name)",
+          "background-color": "red",
+        },
+      },
+      {
+        selector: ".focused",
+        style: {
+          "border-width": "5px",
+          "border-style": "solid",
+          "border-color": "black",
+          "target-arrow-color": "black",
+          "line-color": "black",
+        },
+      },
+      {
+        selector: "edge",
+        style: {
+          width: 0.1,
+        },
+      },
+      {
+        selector: ".direct",
+        style: {
+          width: "5px",
+          "line-color": "red",
+        },
+      },
+    ],
+    layout: {
+      name: "d3-force",
+      animate: true,
+      fit: false,
+      ungrabifyWhileSimulating: true,
+      fixedAfterDragging: true,
+
+      linkId: (node) => {
+        return node.id;
+      },
+
+      linkDistance: (link) => {
+        return elements.nodes.length * 10;
+      },
+
+      linkStrength: (link) => {
+        return 1 / Math.max(1, link?.value);
+      },
+
+      linkIterations: 10,
+
+      manyBodyStrength: (node) => {
+        return node?.mass;
+      },
+
+      // manyBodyDistanceMin: 500,
+      collideRadius: () => {
+        return 50;
+      },
+
+      ready: (e) => {
+        // Center on current user node at the start of the simulation
+        // Color all direct paths from that citizen to it's neighbor
+        const citizen = e.cy.nodes(`#${config.nodeId}`)[0];
+        citizen.addClass("focused");
+        citizen.connectedEdges().addClass("direct");
+        e.cy.center(citizen);
+      },
+
+      tick: () => {
+        // Center on current user node during simulation
+        const citizen = cy.nodes(`#${config.nodeId}`)[0];
+        cy.center(citizen);
+      },
+
+      stop: (e) => {
+        // Disable user grabbing of nodes
+        // This has to be disabled after the simulation is done
+        // Otherwise the simulation can't move nodes
+        e.cy.autolock(true);
+      },
+    } as D3ForceLayoutOptions,
+  });
+});

galaxy/templates/galaxy/user.jinja

@@ -5,14 +5,14 @@
 {% endblock %}
 
 {% block additional_js %}
-  <script type="module" src="{{ static('bundled/galaxy/galaxy-index.js') }}"></script>
+  <script type="module" src="{{ static('bundled/galaxy/galaxy-index.ts') }}"></script>
 {% endblock %}
 
 
 {% block content %}
   {% if object.current_star %}
     <div style="display: flex; flex-wrap: wrap;">
-      <div id="3d-graph"></div>
+      <div style="width: 100%; height: 70vh; display: block" id="3d-graph"></div>
 
       <div style="margin: 1em;">
         <p><a onclick="window.focusNode(window.getNodeFromId({{ object.id }}))">Reset on {{ object.get_display_name() }}</a></p>

locale/fr/LC_MESSAGES/django.po

@@ -6,7 +6,7 @@
 msgid ""
 msgstr ""
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2025-09-14 01:35+0200\n"
+"POT-Creation-Date: 2025-09-01 18:18+0200\n"
 "PO-Revision-Date: 2016-07-18\n"
 "Last-Translator: Maréchal <thomas.girod@utbm.fr\n"
 "Language-Team: AE info <ae.info@utbm.fr>\n"
@@ -561,7 +561,6 @@ msgstr ""
 #: core/templates/core/user_godfathers_tree.jinja
 #: core/templates/core/user_preferences.jinja
 #: counter/templates/counter/cash_register_summary.jinja
-#: counter/templates/counter/product_form.jinja
 #: forum/templates/forum/reply.jinja
 #: subscription/templates/subscription/fragments/creation_form.jinja
 #: trombi/templates/trombi/comment.jinja
@@ -1714,8 +1713,8 @@ msgid ""
 "AE UTBM is a voluntary organisation run by UTBM students. It organises "
 "student life at UTBM and manages its student facilities."
 msgstr ""
-"L'AE UTBM est une association bénévole gérée par les étudiants de l'UTBM. "
+"L'AE UTBM est une association bénévole gérée par les étudiants de "
-"Elle organise la vie étudiante de l'UTBM et gère ses lieux de vie."
+"l'UTBM. Elle organise la vie étudiante de l'UTBM et gère ses lieux de vie."
 
 #: core/templates/core/base/footer.jinja core/templates/core/base/navbar.jinja
 msgid "Contacts"
@@ -2158,6 +2157,10 @@ msgstr ""
 msgid "Page history"
 msgstr "Historique de la page"
 
+#: core/templates/core/page_list.jinja
+msgid "There is no page in this website."
+msgstr "Il n'y a pas de page sur ce site web."
+
 #: core/templates/core/page_prop.jinja
 msgid "Page properties"
 msgstr "Propriétés de la page"
@@ -2893,20 +2896,6 @@ msgstr "Cet UID est invalide"
 msgid "User not found"
 msgstr "Utilisateur non trouvé"
 
-#: counter/forms.py
-msgid "Enabled"
-msgstr "Activé"
-
-#: counter/forms.py
-msgid "Date and time of archiving"
-msgstr "Date et heure de l'archivage"
-
-#: counter/forms.py
-msgid ""
-"Automatic archiving cannot be enabled without providing a archiving date."
-msgstr ""
-"L'archivage automatique ne peut pas activé sans fournir une date d'archivage."
-
 #: counter/forms.py
 msgid ""
 "Describe the product. If it's an event's click, give some insights about it, "
@@ -3559,29 +3548,6 @@ msgstr ""
 "votre cotisation. Si vous ne renouvelez pas votre cotisation, il n'y aura "
 "aucune conséquence autre que le retrait de l'argent de votre compte."
 
-#: counter/templates/counter/product_form.jinja
-#, python-format
-msgid "Edit product %(name)s"
-msgstr "Édition du produit %(name)s"
-
-#: counter/templates/counter/product_form.jinja
-#, fuzzy
-#| msgid "Product state"
-msgid "Product creation"
-msgstr "Etat du produit"
-
-#: counter/templates/counter/product_form.jinja
-msgid "Automatic archiving"
-msgstr "Archivage automatique"
-
-#: counter/templates/counter/product_form.jinja
-msgid ""
-"Automatic archiving allows you to mark a product as archived and remove it "
-"from all its counters at a specified time and date."
-msgstr ""
-"L'archivage automatique permet de marquer un produit comme archivé et de le "
-"retirer de tous ses comptoirs à une heure et une date voulues."
-
 #: counter/templates/counter/product_list.jinja
 msgid "Product list"
 msgstr "Liste des produits"

package-lock.json

@@ -25,6 +25,7 @@
         "country-flag-emoji-polyfill": "^0.1.8",
         "cytoscape": "^3.30.2",
         "cytoscape-cxtmenu": "^3.5.0",
+        "cytoscape-d3-force": "^1.1.4",
         "cytoscape-klay": "^3.1.4",
         "d3-force-3d": "^3.0.5",
         "easymde": "^2.19.0",
@@ -46,6 +47,7 @@
         "@rollup/plugin-inject": "^5.0.5",
         "@types/alpinejs": "^3.13.10",
         "@types/cytoscape-cxtmenu": "^3.4.4",
+        "@types/cytoscape-d3-force": "^1.0.0",
         "@types/cytoscape-klay": "^3.1.4",
         "@types/jquery": "^3.5.31",
         "@types/js-cookie": "^3.0.6",
@@ -2873,6 +2875,16 @@
         "@types/cytoscape": "*"
       }
     },
+    "node_modules/@types/cytoscape-d3-force": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@types/cytoscape-d3-force/-/cytoscape-d3-force-1.0.0.tgz",
+      "integrity": "sha512-1eRd9xr/DvJ4MIA5lCEG8DMX2Ha87qAbpP7irpuKZun0ZCBQPpoOBo9mPl0WrkJbXH+hHwG8s3E2CpUz3HxLrw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/cytoscape": "^3.0.9"
+      }
+    },
     "node_modules/@types/cytoscape-klay": {
       "version": "3.1.4",
       "resolved": "https://registry.npmjs.org/@types/cytoscape-klay/-/cytoscape-klay-3.1.4.tgz",
@@ -3530,6 +3542,18 @@
         "cytoscape": "^3.2.0"
       }
     },
+    "node_modules/cytoscape-d3-force": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/cytoscape-d3-force/-/cytoscape-d3-force-1.1.4.tgz",
+      "integrity": "sha512-8NjI/yEoB3YqVsdf7ud7Oh8Kyi+C9Lhh1fICmtemIo6EC1ZUtm8KcPNLkQySYO8nRS2mQKj5eVdCr7W0L8ONoQ==",
+      "license": "MIT",
+      "dependencies": {
+        "d3-force": "^2.0.1"
+      },
+      "peerDependencies": {
+        "cytoscape": "^3.2.0"
+      }
+    },
     "node_modules/cytoscape-klay": {
       "version": "3.1.4",
       "resolved": "https://registry.npmjs.org/cytoscape-klay/-/cytoscape-klay-3.1.4.tgz",
@@ -3578,6 +3602,17 @@
         "node": ">=12"
       }
     },
+    "node_modules/d3-force": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/d3-force/-/d3-force-2.1.1.tgz",
+      "integrity": "sha512-nAuHEzBqMvpFVMf9OX75d00OxvOXdxY+xECIXjW6Gv8BRrXu6gAWbv/9XKrvfJ5i5DCokDW7RYE50LRoK092ew==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "d3-dispatch": "1 - 2",
+        "d3-quadtree": "1 - 2",
+        "d3-timer": "1 - 2"
+      }
+    },
     "node_modules/d3-force-3d": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/d3-force-3d/-/d3-force-3d-3.0.6.tgz",
@@ -3594,6 +3629,24 @@
         "node": ">=12"
       }
     },
+    "node_modules/d3-force/node_modules/d3-dispatch": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-2.0.0.tgz",
+      "integrity": "sha512-S/m2VsXI7gAti2pBoLClFFTMOO1HTtT0j99AuXLoGFKO6deHDdnv6ZGTxSTTUTgO1zVcv82fCOtDjYK4EECmWA==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/d3-force/node_modules/d3-quadtree": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-2.0.0.tgz",
+      "integrity": "sha512-b0Ed2t1UUalJpc3qXzKi+cPGxeXRr4KU9YSlocN74aTzp6R/Ud43t79yLLqxHRWZfsvWXmbDWPpoENK1K539xw==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/d3-force/node_modules/d3-timer": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-2.0.0.tgz",
+      "integrity": "sha512-TO4VLh0/420Y/9dO3+f9abDEFYeCUr2WZRlxJvbp4HPTQcSylXNiL6yZa9FIUvV1yRiFufl1bszTCLDqv9PWNA==",
+      "license": "BSD-3-Clause"
+    },
     "node_modules/d3-format": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.0.tgz",
@@ -5737,9 +5790,9 @@
       }
     },
     "node_modules/vite": {
-      "version": "6.3.5",
+      "version": "6.3.6",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.6.tgz",
-      "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==",
+      "integrity": "sha512-0msEVHJEScQbhkbVTb/4iHZdJ6SXp/AvxL2sjwYQFfBqleHtnCqv1J3sa9zbWz/6kW1m9Tfzn92vW+kZ1WV6QA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {

package.json

@@ -31,6 +31,7 @@
     "@rollup/plugin-inject": "^5.0.5",
     "@types/alpinejs": "^3.13.10",
     "@types/cytoscape-cxtmenu": "^3.4.4",
+    "@types/cytoscape-d3-force": "^1.0.0",
     "@types/cytoscape-klay": "^3.1.4",
     "@types/jquery": "^3.5.31",
     "@types/js-cookie": "^3.0.6",
@@ -56,6 +57,7 @@
     "country-flag-emoji-polyfill": "^0.1.8",
     "cytoscape": "^3.30.2",
     "cytoscape-cxtmenu": "^3.5.0",
+    "cytoscape-d3-force": "^1.1.4",
     "cytoscape-klay": "^3.1.4",
     "d3-force-3d": "^3.0.5",
     "easymde": "^2.19.0",