release v4.1.1

Reviewed-on: https://gitnet.fr/deblan/side_menu/pulls/399

.woodpecker/.build.yml

@@ -7,16 +7,10 @@ when:
   branch: [master, develop, feature/*, fix/*, bugfix/*, translations]
 
 steps:
-  "Install dependencies":
-    image: node:16
-    pull: true
-    commands:
-      - npm i
-
   "Build JS":
-    image: node:16
+    image: node:20
     commands:
-      - npm run build
+      - make build
 
   "Build translations":
     image: deblan/php:8.3

.woodpecker/.publish.yml

@@ -18,9 +18,12 @@ steps:
 
   "Create signature":
     image: nextcloud:25
-    secrets: [app_certificate, app_public_certificate]
     volumes: *volumes
     environment:
+      APP_CERTIFICATE:
+        from_secret: app_certificate
+      APP_PUBLIC_CERTIFICATE:
+        from_secret: app_public_certificate
       SQLITE_DATABASE: /var/www/data/data.db
       NEXTCLOUD_ADMIN_USER: admin
       NEXTCLOUD_ADMIN_PASSWORD: admin
@@ -39,7 +42,9 @@ steps:
   "Create package":
     image: deblan/php:8.3
     volumes: *volumes
-    secrets: [app_certificate]
+    environment:
+      APP_CERTIFICATE:
+        from_secret: app_certificate
     commands:
       - cd "/builds/$CI_COMMIT_SHA"
       - apt-get update

CHANGELOG.md

@@ -1,5 +1,28 @@
 ## [Unreleased]
 
+## 4.1.1
+### Fixed
+* fix(CssController): add missing NoCSRFRequired import (#397)
+* fix(SideMenu): ncApps must be an array (#369)
+
+## 4.1.0
+### Added
+* add compatibility with NC31
+### Fixed
+* fix(service): add service constructor arguments
+* fix(settings): remove non-existing and unused ILogger service
+### Changed
+* refactor(controller): usage of attributes instead of annotations
+
+## 4.0.1
+### Fixed
+* fix top menu labels (fix #368)
+* fix #369: The menu is displayed even if there are no apps
+
+## 4.0.0
+### Added
+* add compatibility with NC30
+
 ## 3.13.1
 ### Fixed
 * fix #354: remove the opener when the menu is always displayed

appinfo/info.xml

@@ -1,6 +1,5 @@
-<?xml version="1.0"?>
-<info xmlns:xsi= "http://www.w3.org/2001/XMLSchema-instance"
-      xsi:noNamespaceSchemaLocation="https://apps.nextcloud.com/schema/apps/info.xsd">
+<?xml version="1.0" encoding="UTF-8" ?>
+<info xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="https://apps.nextcloud.com/schema/apps/info.xsd">
     <id>side_menu</id>
     <name>Custom menu</name>
     <summary>Modify the display of the menu.</summary>
@@ -17,7 +16,7 @@ You can report a bug or request a feature by opening an issue.
 
 Requirements:
 
-* PHP >= 8.0
+* PHP >= 8.1
 * App `theming` enabled
 
 If you like this application and if you want to support the development:
@@ -32,9 +31,9 @@ Notice
 Because I believe in a free and decentralized Internet, [Gitnet](https://gitnet.fr) is **self-hosted at home**.
 In case of downtime, you can download **Custom Menu** from [here](https://kim.deblan.fr/~side_menu/).
 ]]></description>
-    <version>3.13.1</version>
+    <version>4.1.1</version>
     <licence>agpl</licence>
-    <author mail="contact@deblan.fr" homepage="https://www.deblan.io/">Simon Vieille</author>
+    <author mail="contact@deblan.fr" homepage="https://www.deblan.fr/">Simon Vieille</author>
     <namespace>SideMenu</namespace>
     <documentation>
         <admin>https://deblan.gitnet.page/side_menu_doc/</admin>
@@ -42,20 +41,20 @@ In case of downtime, you can download **Custom Menu** from [here](https://kim.de
     </documentation>
     <category>customization</category>
     <website>https://gitnet.fr/deblan/side_menu</website>
-    <discussion>https://matrix.to/#/!TFPucDATKODpHNVAtu:neutralnetwork.org?via=neutralnetwork.org</discussion>
+    <discussion><![CDATA[https://matrix.to/#/!TFPucDATKODpHNVAtu:neutralnetwork.org?via=neutralnetwork.org]]></discussion>
     <bugs>https://gitnet.fr/deblan/side_menu/issues</bugs>
     <repository type="git">https://gitnet.fr/deblan/side_menu</repository>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc19_default_menu.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/admin_settings.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/n19_big_menu.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc18_menu_always_displayed.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc20_big_menu_responsive.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/personal_settings.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc25_big_menu.png</screenshot>
-    <screenshot>https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc25_default_menu.png</screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc19_default_menu.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/admin_settings.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/n19_big_menu.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc18_menu_always_displayed.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc20_big_menu_responsive.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/personal_settings.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc25_big_menu.png]]></screenshot>
+    <screenshot><![CDATA[https://gitnet.fr/deblan/side_menu/raw/branch/master/screenshots/nc25_default_menu.png]]></screenshot>
     <dependencies>
-        <nextcloud min-version="25" max-version="29"/>
-        <php min-version="8.0"/>
+        <php min-version="8.1" max-version="8.4" />
+        <nextcloud min-version="30" max-version="32"/>
     </dependencies>
     <settings>
         <admin>OCA\SideMenu\Settings\Admin</admin>

appinfo/routes.php

@@ -1,31 +0,0 @@
-<?php
-
-/**
- * @license GNU AGPL version 3 or any later version
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-
-return [
-    'routes' => [
-        ['name' => 'App#index', 'url' => '/', 'verb' => 'GET'],
-        ['name' => 'Css#stylesheet', 'url' => '/css/stylesheet', 'verb' => 'GET'],
-        ['name' => 'Js#script', 'url' => '/js/script', 'verb' => 'GET'],
-        ['name' => 'Js#config', 'url' => '/js/config', 'verb' => 'GET'],
-        ['name' => 'Nav#items', 'url' => '/nav/items', 'verb' => 'GET'],
-        ['name' => 'PersonalSetting#valueSet', 'url' => '/personalSetting/valueSet', 'verb' => 'POST'],
-        ['name' => 'AdminSetting#removeCache', 'url' => '/admin/cache/remove', 'verb' => 'GET'],
-        ['name' => 'AdminSetting#exportConfiguration', 'url' => '/admin/config/export', 'verb' => 'GET'],
-    ],
-];

css/sideMenu.css

@@ -225,6 +225,11 @@
 .side-menu-category-title {
   padding-left: 10px;
   color: var(--side-menu-text-color, #fff);
+  font-weight: bold;
+  font-size: 20px;
+  margin-bottom: 12px;
+  line-height: 30px;
+  margin-top: 0;
 }
 
 .side-menu-loader {

lib/AppInfo/Application.php

@@ -3,6 +3,7 @@
 namespace OCA\SideMenu\AppInfo;
 
 use OC;
+use OC\App\AppStore\Fetcher\CategoryFetcher;
 use OC\Security\CSP\ContentSecurityPolicyNonceManager;
 use OC\User\User;
 use OCA\SideMenu\Service\AppRepository;
@@ -12,7 +13,11 @@ use OCP\AppFramework\App;
 use OCP\AppFramework\Bootstrap\IBootContext;
 use OCP\AppFramework\Bootstrap\IBootstrap;
 use OCP\AppFramework\Bootstrap\IRegistrationContext;
+use OCP\EventDispatcher\IEventDispatcher;
+use OCP\IConfig;
+use OCP\INavigationManager;
 use OCP\IUserSession;
+use OCP\L10N\IFactory;
 use OCP\Util;
 use Psr\Container\ContainerInterface;
 
@@ -26,6 +31,7 @@ class Application extends App implements IBootstrap
     public const APP_ID = 'side_menu';
 
     public const APP_NAME = 'Custom menu';
+
     /**
      * @var OC\AllConfig
      */
@@ -41,14 +47,55 @@ class Application extends App implements IBootstrap
      */
     protected $user;
 
-    /**
-     * {@inheritdoc}
-     */
     public function __construct(array $urlParams = [])
     {
         parent::__construct(self::APP_ID, $urlParams);
     }
 
+    public function register(IRegistrationContext $context): void
+    {
+        $context->registerService(CategoryRepository::class, function (ContainerInterface $c) {
+            return new CategoryRepository(
+                $c->get(CategoryFetcher::class),
+                $c->get(ConfigProxy::class),
+                $c->get(IConfig::class),
+                $c->get(IFactory::class),
+                $c->get(IUserSession::class)
+            );
+        });
+
+        $context->registerService(AppRepository::class, function (ContainerInterface $c) {
+            return new AppRepository(
+                $c->get(\OC_App::class),
+                $c->get(INavigationManager::class),
+                $c->get(IFactory::class),
+                $c->get(ConfigProxy::class),
+                $c->get(CategoryRepository::class),
+                $c->get(IEventDispatcher::class),
+                $c->get(IUserSession::class)
+            );
+        });
+
+        $context->registerService(ConfigProxy::class, function (ContainerInterface $c) {
+            return new ConfigProxy(
+                $c->get(IConfig::class),
+            );
+        });
+    }
+
+    public function boot(IBootContext $context): void
+    {
+        $this->config = \OC::$server->getConfig();
+        $this->cspnm = \OC::$server->getContentSecurityPolicyNonceManager();
+        $this->user = \OC::$server[IUserSession::class]->getUser();
+
+        if (!$this->isEnabled()) {
+            return;
+        }
+
+        $this->addAssets();
+    }
+
     protected function isEnabled(): bool
     {
         $enabled = true;
@@ -97,38 +144,14 @@ class Application extends App implements IBootstrap
         $cache = $this->config->getAppValue(self::APP_ID, 'cache', '0');
 
         foreach ($assets as $value) {
-            $route = OC::$server->getURLGenerator()->linkToRoute($value['route'], ['v' => $cache]);
+            $route = \OC::$server->getURLGenerator()->linkToRoute(
+                $value['route'],
+                ['v' => $cache]
+            );
+
             $value['attr'][$value['route_attr']] = $route;
 
             Util::addHeader($value['type'], $value['attr'], '');
         }
     }
-
-    public function register(IRegistrationContext $context): void
-    {
-        $context->registerService('AppRepository', function () {
-            return new AppRepository();
-        });
-
-        $context->registerService('CategoryRepository', function () {
-            return new CategoryRepository();
-        });
-
-        $context->registerService('ConfigProxy', function () {
-            return new ConfigProxy();
-        });
-    }
-
-    public function boot(IBootContext $context): void
-    {
-        $this->config = OC::$server->getConfig();
-        $this->cspnm = OC::$server->getContentSecurityPolicyNonceManager();
-        $this->user = OC::$server[IUserSession::class]->getUser();
-
-        if (!$this->isEnabled()) {
-            return;
-        }
-
-        $this->addAssets();
-    }
 }

lib/Controller/AdminSettingController.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -20,6 +21,8 @@ namespace OCA\SideMenu\Controller;
 
 use OCA\SideMenu\AppInfo\Application;
 use OCP\AppFramework\Controller;
+use OCP\AppFramework\Http\Attribute\FrontpageRoute;
+use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
 use OCP\AppFramework\Http\DataDownloadResponse;
 use OCP\AppFramework\Http\RedirectResponse;
 use OCP\IConfig;
@@ -37,9 +40,8 @@ class AdminSettingController extends Controller
         parent::__construct($appName, $request);
     }
 
-    /**
-     * @NoCSRFRequired
-     */
+    #[NoCSRFRequired]
+    #[FrontpageRoute(verb: 'GET', url: '/admin/cache/remove')]
     public function removeCache(): RedirectResponse
     {
         $this->config->setAppValue(Application::APP_ID, 'cache-categories', '[]');
@@ -49,9 +51,8 @@ class AdminSettingController extends Controller
         ]).'#more');
     }
 
-    /**
-     * @NoCSRFRequired
-     */
+    #[NoCSRFRequired]
+    #[FrontpageRoute(verb: 'GET', url: '/admin/config/export')]
     public function exportConfiguration(): DataDownloadResponse
     {
         $keys = $this->config->getAppKeys(Application::APP_ID);

lib/Controller/AppController.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -18,10 +19,12 @@
 
 namespace OCA\SideMenu\Controller;
 
-use OC;
 use OCA\SideMenu\Service\AppRepository;
 use OCA\SideMenu\Service\ConfigProxy;
 use OCP\AppFramework\Controller;
+use OCP\AppFramework\Http\Attribute\FrontpageRoute;
+use OCP\AppFramework\Http\Attribute\NoAdminRequired;
+use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
 use OCP\AppFramework\Http\RedirectResponse;
 use OCP\IRequest;
 use OCP\IURLGenerator;
@@ -39,13 +42,12 @@ class AppController extends Controller
         parent::__construct($appName, $request);
     }
 
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     */
+    #[NoCSRFRequired]
+    #[NoAdminRequired]
+    #[FrontpageRoute(verb: 'GET', url: '/')]
     public function index(): RedirectResponse
     {
-        $user = OC::$server[IUserSession::class]->getUser();
+        $user = \OC::$server[IUserSession::class]->getUser();
         $topMenuApps = $this->config->getAppValueArray('top-menu-apps', '[]');
         $hiddenApps = $this->config->getAppValueArray('big-menu-hidden-apps', '[]');
         $isForced = $this->config->getAppValueBool('force', '0');
@@ -73,7 +75,7 @@ class AppController extends Controller
     protected function redirectToApp($app, bool $isHref = false): RedirectResponse
     {
         if (!$isHref) {
-            $isIgnoreFrontController = true === OC::$server->getConfig()->getSystemValue(
+            $isIgnoreFrontController = true === \OC::$server->getConfig()->getSystemValue(
                 'htaccess.IgnoreFrontController',
                 false
             );

lib/Controller/CssController.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -18,14 +19,15 @@
 
 namespace OCA\SideMenu\Controller;
 
-use OC;
 use OC\User\User;
 use OCA\SideMenu\AppInfo\Application;
 use OCA\SideMenu\Service\Color;
 use OCA\SideMenu\Service\ConfigProxy;
 use OCA\Theming\ThemingDefaults;
 use OCP\AppFramework\Controller;
-use OCP\AppFramework\Http\Response;
+use OCP\AppFramework\Http\Attribute\FrontpageRoute;
+use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
+use OCP\AppFramework\Http\Attribute\PublicPage;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\IRequest;
 use OCP\IUserSession;
@@ -43,14 +45,13 @@ class CssController extends Controller
     ) {
         parent::__construct($appName, $request);
 
-        $this->user = OC::$server[IUserSession::class]->getUser();
+        $this->user = \OC::$server[IUserSession::class]->getUser();
     }
 
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     * @PublicPage
-     */
+    #[NoCSRFRequired]
+    #[NoAdminRequired]
+    #[PublicPage]
+    #[FrontpageRoute(verb: 'GET', url: '/css/stylesheet')]
     public function stylesheet(): TemplateResponse
     {
         $response = new TemplateResponse(Application::APP_ID, 'css/stylesheet', $this->getConfig(), 'blank');

lib/Controller/JsController.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -18,12 +19,15 @@
 
 namespace OCA\SideMenu\Controller;
 
-use OC;
 use OC\User\User;
 use OCA\SideMenu\AppInfo\Application;
 use OCA\SideMenu\Service\ConfigProxy;
 use OCA\Theming\ThemingDefaults;
 use OCP\AppFramework\Controller;
+use OCP\AppFramework\Http\Attribute\FrontpageRoute;
+use OCP\AppFramework\Http\Attribute\NoAdminRequired;
+use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
+use OCP\AppFramework\Http\Attribute\PublicPage;
 use OCP\AppFramework\Http\JSONResponse;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\IRequest;
@@ -45,16 +49,15 @@ class JsController extends Controller
 
         $this->themingDefaults = $themingDefaults;
 
-        $this->user = OC::$server[IUserSession::class]->getUser();
+        $this->user = \OC::$server[IUserSession::class]->getUser();
         $this->config = $config;
         $this->l10nFactory = $l10nFactory;
     }
 
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     * @PublicPage
-     */
+    #[NoCSRFRequired]
+    #[NoAdminRequired]
+    #[PublicPage]
+    #[FrontpageRoute(verb: 'GET', url: '/js/script')]
     public function script(): TemplateResponse
     {
         $response = new TemplateResponse(Application::APP_ID, 'js/script', $this->getConfig(), 'blank');
@@ -63,11 +66,10 @@ class JsController extends Controller
         return $response;
     }
 
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     * @PublicPage
-     */
+    #[NoCSRFRequired]
+    #[NoAdminRequired]
+    #[PublicPage]
+    #[FrontpageRoute(verb: 'GET', url: '/js/config')]
     public function config(): JSONResponse
     {
         return new JSONResponse($this->getConfig());
@@ -109,10 +111,10 @@ class JsController extends Controller
                 $targetBlankApps = $userTargetBlankApps;
             }
 
-            $isAvatarSet = OC::$server->getAvatarManager()->getAvatar($this->user->getUid())->exists();
+            $isAvatarSet = \OC::$server->getAvatarManager()->getAvatar($this->user->getUid())->exists();
 
             if ($useAvatar && $isAvatarSet) {
-                $avatar = OC::$server->getURLGenerator()->linkToRoute('core.avatar.getAvatar', [
+                $avatar = \OC::$server->getURLGenerator()->linkToRoute('core.avatar.getAvatar', [
                     'userId' => $this->user->getUid(),
                     'size' => 128,
                     'v' => $this->config->getUserValueInt($this->user, 'avatar', 'version', 0),
@@ -120,13 +122,13 @@ class JsController extends Controller
             }
 
             if ($this->config->getAppValueBool('show-settings', '0')) {
-                $settingsNav = OC::$server->getNavigationManager()->getAll('settings');
+                $settingsNav = \OC::$server->getNavigationManager()->getAll('settings');
 
                 if (isset($settingsNav['settings'])) {
                     $settings = [
                         'href' => $settingsNav['settings']['href'],
                         'name' => $settingsNav['settings']['name'],
-                        'avatar' => OC::$server->getURLGenerator()->linkToRoute('core.avatar.getAvatar', [
+                        'avatar' => \OC::$server->getURLGenerator()->linkToRoute('core.avatar.getAvatar', [
                             'userId' => $this->user->getUid(),
                             'size' => 32,
                             'v' => $this->config->getUserValueInt($this->user, 'avatar', 'version', 0),
@@ -136,7 +138,7 @@ class JsController extends Controller
             }
         }
 
-        $indexUrl = OC::$server->getURLGenerator()->linkTo('', 'index.php');
+        $indexUrl = \OC::$server->getURLGenerator()->linkTo('', 'index.php');
 
         return [
             'opener-position' => $this->config->getAppValue('opener-position', 'before'),

lib/Controller/NavController.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -18,12 +19,15 @@
 
 namespace OCA\SideMenu\Controller;
 
-use OC;
 use OC\URLGenerator;
 use OCA\SideMenu\Service\AppRepository;
 use OCA\SideMenu\Service\CategoryRepository;
 use OCA\SideMenu\Service\ConfigProxy;
 use OCP\AppFramework\Controller;
+use OCP\AppFramework\Http\Attribute\FrontpageRoute;
+use OCP\AppFramework\Http\Attribute\NoAdminRequired;
+use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
+use OCP\AppFramework\Http\Attribute\PublicPage;
 use OCP\AppFramework\Http\JSONResponse;
 use OCP\IRequest;
 use OCP\IUserSession;
@@ -43,14 +47,13 @@ class NavController extends Controller
         parent::__construct($appName, $request);
     }
 
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     * @PublicPage
-     */
+    #[NoCSRFRequired]
+    #[NoAdminRequired]
+    #[PublicPage]
+    #[FrontpageRoute(verb: 'GET', url: '/nav/items')]
     public function items(): JSONResponse
     {
-        $user = OC::$server[IUserSession::class]->getUser();
+        $user = \OC::$server[IUserSession::class]->getUser();
         $items = [];
 
         if (!$user) {

lib/Controller/PersonalSettingController.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -21,6 +22,9 @@ namespace OCA\SideMenu\Controller;
 use OCA\SideMenu\AppInfo\Application;
 use OCA\SideMenu\Service\ConfigProxy;
 use OCP\AppFramework\Controller;
+use OCP\AppFramework\Http\Attribute\FrontpageRoute;
+use OCP\AppFramework\Http\Attribute\NoAdminRequired;
+use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
 use OCP\IConfig;
 use OCP\IRequest;
 use OCP\IUserSession;
@@ -37,13 +41,9 @@ class PersonalSettingController extends Controller
         parent::__construct($appName, $request);
     }
 
-    /**
-     * @NoAdminRequired
-     * @NoCSRFRequired
-     *
-     * @param mixed $name
-     * @param mixed $value
-     */
+    #[NoCSRFRequired]
+    #[NoAdminRequired]
+    #[FrontpageRoute(verb: 'POST', url: '/personalSetting/valueSet')]
     public function valueSet($name, $value): array
     {
         $doSave = false;

lib/Service/CategoryRepository.php

@@ -21,8 +21,7 @@ class CategoryRepository
         protected IConfig $iConfig,
         protected IFactory $l10nFactory,
         protected IUserSession $userSession
-    ) {
-    }
+    ) {}
 
     /**
      * Retrieves categories.

lib/Settings/Admin.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -27,22 +28,19 @@ use OCA\SideMenu\Service\LangRepository;
 use OCA\Theming\ThemingDefaults;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\IL10N;
-use OCP\ILogger;
 use OCP\Settings\ISettings;
 
 class Admin implements ISettings
 {
     public function __construct(
         protected IL10N $l,
-        protected ILogger $logger,
         protected ConfigProxy $config,
         protected AppRepository $appRepository,
         protected CategoryRepository $categoryRepository,
         protected ThemingDefaults $theming,
         protected Color $color,
         protected LangRepository $langRepository
-    ) {
-    }
+    ) {}
 
     /**
      * @return TemplateResponse

lib/Settings/AdminSection.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -28,8 +29,7 @@ class AdminSection implements IIconSection
     public function __construct(
         protected IURLGenerator $url,
         protected IL10N $l
-    ) {
-    }
+    ) {}
 
     public function getID()
     {
@@ -46,9 +46,6 @@ class AdminSection implements IIconSection
         return 70;
     }
 
-    /**
-     * {@inheritdoc}
-     */
     public function getIcon()
     {
         return $this->url->imagePath(Application::APP_ID, 'icon.svg');

lib/Settings/Personal.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -23,7 +24,6 @@ use OCA\SideMenu\Service\AppRepository;
 use OCA\SideMenu\Service\ConfigProxy;
 use OCP\AppFramework\Http\TemplateResponse;
 use OCP\IL10N;
-use OCP\ILogger;
 use OCP\IUserSession;
 use OCP\Settings\ISettings;
 
@@ -31,12 +31,10 @@ class Personal implements ISettings
 {
     public function __construct(
         protected IL10N $l,
-        protected ILogger $logger,
         protected ConfigProxy $config,
         protected IUserSession $userSession,
         protected AppRepository $appRepository
-    ) {
-    }
+    ) {}
 
     /**
      * @return TemplateResponse

lib/Settings/PersonalSection.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * @license GNU AGPL version 3 or any later version
  *
@@ -30,8 +31,7 @@ class PersonalSection implements IIconSection
         protected IURLGenerator $url,
         protected IL10N $l,
         protected ConfigProxy $configProxy
-    ) {
-    }
+    ) {}
 
     public function getID()
     {
@@ -60,9 +60,6 @@ class PersonalSection implements IIconSection
         return 70;
     }
 
-    /**
-     * {@inheritdoc}
-     */
     public function getIcon()
     {
         return $this->url->imagePath(Application::APP_ID, 'icon.svg');

package.json

@@ -11,9 +11,15 @@
 		"stylelint:fix": "./node_modules/.bin/stylelint src --fix"
 	},
 	"dependencies": {
+		"@nextcloud/axios": "^2.5.1",
+		"@nextcloud/browserslist-config": "^3.0.1",
+		"@nextcloud/event-bus": "^3.3.1",
+		"@nextcloud/initial-state": "^2.2.0",
+		"@nextcloud/l10n": "^3.1.0",
+		"@nextcloud/vue": "^8.19.0",
+		"@vueuse/core": "^11.1.0",
 		"axios": "^1.6.7",
-		"trim": "^1.0.1",
-		"vue": "^2.6.11"
+		"trim": "^1.0.1"
 	},
 	"browserslist": [
 		"extends @nextcloud/browserslist-config"
@@ -22,42 +28,46 @@
 		"node": ">=16.0.0"
 	},
 	"devDependencies": {
-		"@babel/core": "^7.9.0",
-		"@babel/plugin-syntax-dynamic-import": "^7.8.3",
-		"@babel/preset-env": "^7.9.0",
-		"@nextcloud/axios": "^2.3.0",
-		"@nextcloud/browserslist-config": "^2.3.0",
-		"@nextcloud/eslint-config": "^8.1.2",
-		"@nextcloud/initial-state": "^2.0.0",
-		"@nextcloud/l10n": "^2.1.0",
-		"@nextcloud/vue": "^7.12.1",
-		"babel-eslint": "^10.1.0",
-		"babel-loader": "^8.1.0",
-		"css-loader": "^6.10.0",
-		"eslint": "^8.0.0",
-		"eslint-config-standard": "^17.0.0",
-		"eslint-import-resolver-webpack": "^0.12.1",
-		"eslint-plugin-import": "^2.20.0",
-		"eslint-plugin-nextcloud": "^0.3.0",
-		"eslint-plugin-node": "^10.0.0",
-		"eslint-plugin-promise": "^6.0.0",
-		"eslint-plugin-standard": "^4.0.1",
-		"eslint-plugin-vue": "^9.0.0",
-		"eslint-webpack-plugin": "^3.0.0",
-		"file-loader": "^6.0.0",
-		"sass": "^1.49.9",
-		"sass-loader": "^13.0.2",
-		"stylelint": "^14.0.0",
-		"stylelint-config-recommended-scss": "^7.0.0",
-		"stylelint-scss": "^4.0.0",
-		"stylelint-webpack-plugin": "^3.3.0",
-		"url-loader": "^4.0.0",
-		"vue-loader": "^15",
-		"vue-style-loader": "^4.1.3",
-		"vue-template-compiler": "^2.7.13",
-		"webpack": "^5.0.0",
-		"webpack-cli": "^4.0.0",
-		"webpack-merge": "^4.2.2",
-		"webpack-node-externals": "^1.7.2"
+		"@babel/node": "^7.25.7",
+		"@babel/plugin-transform-private-methods": "^7.25.7",
+		"@babel/preset-typescript": "^7.24.7",
+		"@cypress/vue2": "^2.1.1",
+		"@cypress/webpack-preprocessor": "^6.0.2",
+		"@nextcloud/babel-config": "^1.2.0",
+		"@nextcloud/eslint-config": "^8.4.1",
+		"@nextcloud/stylelint-config": "^3.0.1",
+		"@nextcloud/typings": "^1.9.1",
+		"@nextcloud/webpack-vue-config": "^6.0.1",
+		"@simplewebauthn/types": "^10.0.0",
+		"@types/dockerode": "^3.3.29",
+		"@types/wait-on": "^5.3.4",
+		"@vue/tsconfig": "^0.5.1",
+		"babel-loader": "^9.2.1",
+		"babel-loader-exclude-node-modules-except": "^1.2.1",
+		"babel-plugin-module-resolver": "^5.0.2",
+		"colord": "^2.9.3",
+		"eslint-plugin-cypress": "^3.5.0",
+		"eslint-plugin-es": "^4.1.0",
+		"exports-loader": "^5.0.0",
+		"file-loader": "^6.2.0",
+		"handlebars-loader": "^1.7.3",
+		"jasmine-core": "~2.5.2",
+		"jasmine-sinon": "^0.4.0",
+		"jsdoc": "^4.0.2",
+		"raw-loader": "^4.0.2",
+		"sass": "^1.79.3",
+		"stylelint": "^16.9.0",
+		"stylelint-use-logical": "^2.1.2",
+		"ts-loader": "^9.5.0",
+		"ts-node": "^10.9.1",
+		"tslib": "^2.7.0",
+		"typescript": "^5.6.2",
+		"vue-loader": "^15.9.8",
+		"vue-template-compiler": "^2.7.16",
+		"wait-on": "^8.0.1",
+		"webpack": "^5.94.0",
+		"webpack-cli": "^5.0.2",
+		"webpack-merge": "^6.0.1",
+		"workbox-webpack-plugin": "^7.1.0"
 	}
 }

src/AdminCategoriesCustom.vue

@@ -84,9 +84,9 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 </style>
 
 <script>
-import NcModal from '@nextcloud/vue/dist/Components/NcModal'
-import NcActions from '@nextcloud/vue/dist/Components/NcActions'
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 
 export default {
   name: 'AdminCategoriesCustom',

src/AppMenu.vue

@@ -28,9 +28,9 @@
     <ul
       class="app-menu-main"
       :class="{ 'app-menu-main__hidden-label': hiddenLabels === 1, 'app-menu-main__show-hovered': hiddenLabels === 2 }"
-      v-if="apps !== null"
+      v-if="appList.length"
       >
-      <li v-for="app in mainAppList()"
+      <li v-for="app in mainAppList(state)"
         :key="app.id"
         :data-app-id="app.id"
         class="app-menu-entry"
@@ -50,8 +50,8 @@
         </a>
       </li>
     </ul>
-    <NcActions class="app-menu-more" :aria-label="t('core', 'More apps')" v-if="apps !== null">
-      <NcActionLink v-for="app in popoverAppList()"
+    <NcActions class="app-menu-more" :aria-label="t('core', 'More apps')">
+      <NcActionLink v-for="app in popoverAppList(state)"
         :key="app.id"
         :aria-label="appLabel(app)"
         :aria-current="app.active ? 'page' : false"
@@ -71,92 +71,128 @@
 </template>
 
 <script>
+import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 import { loadState } from '@nextcloud/initial-state'
+import { n, t } from '@nextcloud/l10n'
+import { useElementSize } from '@vueuse/core'
+import { defineComponent, ref } from 'vue'
+import axios from '@nextcloud/axios'
+import { generateOcsUrl } from '@nextcloud/router'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink.js'
 
-export default {
+export default defineComponent({
   name: 'AppMenu',
+
   components: {
-    NcActions, NcActionLink,
+    NcActions,
+    NcActionLink,
   },
+
+  setup() {
+    return {
+        t,
+        n,
+    }
+  },
+
   data() {
     return {
       apps: null,
-      appLimit: 0,
+      appList: [],
       observer: null,
       targetBlankApps: [],
-      hiddenLabels: true
+      hiddenLabels: true,
+      state: 1,
     }
   },
+
   mounted() {
-    const ncApps = loadState('core', 'apps', {})
-    this.apps = {}
-    let orders = {}
+    axios.get(generateOcsUrl('core/navigation', 2) + '/apps?format=json')
+      .then((response) => response.data)
+      .then((data) => {
+        if (data.ocs.meta.statuscode !== 200) {
+          return
+        }
 
-    window.menuAppsOrder.forEach((app, order) => {
-      orders[app] = order + 1
-    })
-
-    Array.from(window.topMenuApps).forEach((id) => {
-      if (ncApps.hasOwnProperty(id)) {
-        this.apps[id] = ncApps[id]
-        this.apps[id].order = orders[id] || null
-      }
-    })
+        this.setApps(data.ocs.data)
+      })
 
     this.targetBlankApps = window.targetBlankApps
     this.hiddenLabels = window.topMenuAppsMouseOverHiddenLabel
-    this.observer = new ResizeObserver(this.resize)
-    this.observer.observe(this.$el)
-    this.resize()
-  },
-  beforeDestroy() {
-    this.observer.disconnect()
+    let timeout = null
+
+    window.addEventListener('resize', () => {
+      timeout = window.setTimeout(() => {
+        this.update()
+      }, 300)
+    })
   },
+
   methods: {
+    update() {
+      ++this.state
+    },
+
+    mainAppList() {
+      return this.appList.slice(0, this.appLimit())
+    },
+
+    popoverAppList() {
+      return this.appList.slice(this.appLimit())
+    },
+
+    appLimit() {
+      const maxApps = Math.floor(this.$root.$el.offsetWidth / 60)
+
+      if (maxApps < this.appList.length) {
+        // Ensure there is space for the overflow menu
+        return Math.max(maxApps - 1, 0)
+      }
+
+      return maxApps
+    },
+
+    setNavigationCounter(id, counter) {
+      const app = this.appList.find(({ app }) => app === id)
+      if (app) {
+        this.$set(app, 'unread', counter)
+      } else {
+        logger.warn(`Could not find app "${id}" for setting navigation count`)
+      }
+    },
+
+    setApps(apps) {
+      this.appList = []
+      let orders = {}
+
+      window.menuAppsOrder.forEach((app, order) => {
+        orders[app] = order + 1
+      })
+
+      apps.forEach((app) => {
+        Array.from(window.topMenuApps).forEach((id) => {
+          if (app.id === id) {
+            app.order = orders[id] || null
+            this.appList.push(app)
+          }
+        })
+      })
+    },
+
     appLabel(app) {
       return app.name
         + (app.active ? ' (' + t('core', 'Currently open') + ')' : '')
         + (app.unread > 0 ? ' (' + n('core', '{count} notification', '{count} notifications', app.unread, { count: app.unread }) + ')' : '')
     },
-    appList() {
-      let items = Object.values(this.apps)
 
-      items.sort((a, b) => {
-        return a.order < b.order ? -1 : 1;
-      })
-
-      return items
-    },
-    mainAppList() {
-      return this.appList().slice(0, this.appLimit)
-    },
-    popoverAppList() {
-      return this.appList().slice(this.appLimit)
-    },
-    setNavigationCounter(id, counter) {
-      this.$set(this.apps[id], 'unread', counter)
-    },
-    resize() {
-      const availableWidth = this.$el.offsetWidth
-      let appCount = Math.floor(availableWidth / 50) - 1
-      const popoverAppCount = this.appList.length - appCount
-      if (popoverAppCount === 1) {
-        appCount--
-      }
-      if (appCount < 1) {
-        appCount = 0
-      }
-      this.appLimit = appCount
-    },
     makeStyle(app) {
       if (app.order !== null) {
         return `order: ${app.order}`
       }
     }
   },
-}
+})
 </script>
 
 <style lang="scss" scoped>
@@ -304,7 +340,7 @@ $header-icon-size: 20px;
   filter: var(--background-image-invert-if-bright, var(--primary-invert-if-bright));
 
   &:not([aria-expanded="true"]) {
-    color: var(--color-primary-element-text);
+    color: var(--color-main-text);
 
     &:hover {
       opacity: 1;

src/SideMenu.js

@@ -21,12 +21,10 @@ import SideMenu from './SideMenu.vue'
 import SideMenuBig from './SideMenuBig.vue'
 import SideMenuWithCategories from './SideMenuWithCategories.vue'
 import PageLoader from './PageLoader'
-import SMcreateElement from './lib/createElement'
 
 Vue.prototype.OC = OC
 Vue.prototype.t = OC.L10N.translate
 
-window.SMcreateElement = SMcreateElement
 window.PageLoader = PageLoader
 
 const mountSideMenuComponent = () => {

src/SideMenu.vue

@@ -39,7 +39,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
     <ul class="side-menu-apps-list" :class="{'side-menu-apps-list--with-settings': !!settings}">
       <SideMenuApp
         v-for="(app, key) in apps"
-        v-if="!hiddenApps.includes(app.id) && searchMatch(app.name)"
+        v-if="searchMatch(app.name)"
         v-bind:classes="{'side-menu-app': true, 'active': app.active}"
         v-bind:key="key"
         v-bind:icon="app.icon"
@@ -86,7 +86,7 @@ export default {
   },
   methods: {
     retrieveApps() {
-      const ncApps = loadState('core', 'apps', {})
+      const ncApps = loadState('core', 'apps', [])
       let orders = {}
       let finalApps = []
 
@@ -94,17 +94,16 @@ export default {
         orders[app] = order + 1
       })
 
-      for (let id in ncApps) {
-        if (window.topMenuApps.includes(id) && !window.topSideMenuApps.includes(id)) {
+      for (let app of ncApps) {
+        if (window.topMenuApps.includes(app.id) && !window.topSideMenuApps.includes(app.id)) {
           continue
         }
 
-        if (this.hiddenApps.includes(id)) {
+        if (this.hiddenApps.includes(app.id)) {
           continue
         }
 
-        let app = ncApps[id]
-        app.order = orders[id] || null
+        app.order = orders[app.id] || null
 
         finalApps.push(app)
       }

templates/js/script.php

@@ -1,5 +1,7 @@
 <?php
 
+header('Content-type: text/javascript');
+
 $display = 'default';
 
 if ($_['always-displayed']) {
@@ -12,6 +14,24 @@ if ($_['always-displayed']) {
 
 ?>
 
+const SMcreateElement = (tagName, attributes) => {
+  const element = document.createElement(tagName)
+
+  if (typeof attributes === 'object') {
+    for (let i in attributes) {
+      if (i === 'text') {
+        element.textContent = attributes[i]
+      } else if (i === 'html') {
+        element.innerHTML = attributes[i]
+      } else {
+        element.setAttribute(i, attributes[i])
+      }
+    }
+  }
+
+  return element
+}
+
 (function() {
   const sideMenuContainer = SMcreateElement('div', {id: 'side-menu-container'})
   const sideMenuOpener = SMcreateElement('button', {

tsconfig.json

@@ -0,0 +1,33 @@
+{
+	"extends": "@vue/tsconfig/tsconfig.json",
+	"include": ["./src/**/*.js"],
+	"compilerOptions": {
+		"types": ["node", "vue", "vue-router"],
+		"outDir": "./js/",
+		"target": "ESNext",
+		"module": "ESNext",
+		// Set module resolution to bundler and `noEmit` to be able to set `allowImportingTsExtensions`, so we can import Typescript with .ts extension
+		"moduleResolution": "Bundler",
+		"allowImportingTsExtensions": true,
+		"noEmit": true,
+		// Allow ts to import js files
+		"allowJs": true,
+		"allowSyntheticDefaultImports": true,
+		"declaration": false,
+		"noImplicitAny": false,
+		"resolveJsonModule": true,
+		"strict": true,
+	},
+	"vueCompilerOptions": {
+		"target": 2.7
+	},
+	"ts-node": {
+		// these options are overrides used only by ts-node
+		// same as our --compilerOptions flag and our TS_NODE_COMPILER_OPTIONS environment variable
+		"compilerOptions": {
+			"moduleResolution": "node",
+			"module": "commonjs",
+			"verbatimModuleSyntax": false
+		}
+	}
+}

webpack.js

@@ -1,54 +1,70 @@
 const path = require('path')
-const { VueLoaderPlugin } = require('vue-loader')
-const StyleLintPlugin = require('stylelint-webpack-plugin')
+const BabelLoaderExcludeNodeModulesExcept = require('babel-loader-exclude-node-modules-except')
+const {
+  VueLoaderPlugin
+} = require('vue-loader')
+// const StyleLintPlugin = require('stylelint-webpack-plugin')
 
 module.exports = {
-    devtool: "source-map",
-    entry: {
-        'admin': path.join(__dirname, 'src', 'admin.js'),
-        'sideMenu': path.join(__dirname, 'src', 'SideMenu.js'),
-    },
-    output: {
-        path: path.resolve(__dirname, './js'),
-        publicPath: '/js',
-        filename: '[name].js?v=[hash]',
-        chunkFilename: 'chunks/[name]-[hash].js',
-    },
-    module: {
-        rules: [
-            {
-                test: /\.css$/,
-                use: ['vue-style-loader', 'css-loader'],
-            },
-            {
-                test: /\.scss$/,
-                use: ['vue-style-loader', 'css-loader', 'sass-loader'],
-            },
-            {
-                test: /\.vue$/,
-                loader: 'vue-loader',
-            },
-            {
-                test: /\.js$/,
-                loader: 'babel-loader',
-                exclude: /node_modules/,
-            },
-            {
-                test: /\.(png|jpg|gif|svg)$/,
-                loader: 'url-loader',
-                options: {
-                    name: '[name].[ext]?[hash]',
-                    limit: 8192,
-                },
+  devtool: "source-map",
+  entry: {
+    'admin': path.join(__dirname, 'src', 'admin.js'),
+    'sideMenu': path.join(__dirname, 'src', 'SideMenu.js'),
+  },
+  output: {
+    path: path.resolve(__dirname, './js'),
+    publicPath: '/js',
+    filename: '[name].js?v=[chunkhash]',
+    chunkFilename: 'chunks/[name]-[chunkhash].js',
+  },
+  module: {
+    rules: [{
+        test: /\.css$/,
+        use: ['vue-style-loader', 'css-loader'],
+      },
+      {
+        test: /\.scss$/,
+        use: ['vue-style-loader', 'css-loader', 'sass-loader'],
+      },
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+      },
+      {
+        test: /\.tsx?$/,
+        use: [
+          'babel-loader',
+          {
+            // Fix TypeScript syntax errors in Vue
+            loader: 'ts-loader',
+            options: {
+              transpileOnly: true,
             },
+          },
         ],
-    },
-    plugins: [
-        new VueLoaderPlugin(),
-        new StyleLintPlugin(),
+        exclude: BabelLoaderExcludeNodeModulesExcept([]),
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel-loader',
+        exclude: /node_modules/,
+      },
+      {
+        test: /\.(png|jpg|gif|svg)$/,
+        loader: 'url-loader',
+        options: {
+          name: '[name].[ext]?[hash]',
+          limit: 8192,
+        },
+      },
     ],
-    resolve: {
-        extensions: ['*', '.js', '.vue'],
-        symlinks: false,
-    },
+  },
+  plugins: [
+    new VueLoaderPlugin(),
+    // new StyleLintPlugin(),
+  ],
+  resolve: {
+    extensions: ['.*', '.js', '.vue'],
+    symlinks: false,
+  },
 }