Merge pull request #12019 from nextcloud/icons-svg-api-fixes

Move svg api endpoint

5 files changed, 25 insertions, 23 deletions

diff --git a/apps/accessibility/lib/Controller/AccessibilityController.php b/apps/accessibility/lib/Controller/AccessibilityController.php
index 5a5ff5b8a2f..6d0684cd439 100644
--- a/apps/accessibility/lib/Controller/AccessibilityController.php
+++ b/apps/accessibility/lib/Controller/AccessibilityController.php
@@ -258,7 +258,7 @@ class AccessibilityController extends Controller {
 	 * @return string
 	 */
 	private function invertSvgIconsColor(string $css) {
-		return str_replace(['/000', '/fff', '/***'], ['/***', '/000', '/fff'], $css);
+		return str_replace(['color=000', 'color=fff', 'color=***'], ['color=***', 'color=000', 'color=fff'], $css);
 	}
 
 	/**
diff --git a/core/css/functions.scss b/core/css/functions.scss
index 5007c3bbe79..70c0b688fed 100644
--- a/core/css/functions.scss
+++ b/core/css/functions.scss
@@ -47,9 +47,9 @@
 @function icon-color-path($icon, $dir, $color, $version: 1, $core: false) {
 	$color: remove-hash-from-color($color);
 	@if $core {
-		@return '#{$webroot}/svg/core/#{$dir}/#{$icon}/#{$color}?v=#{$version}';
+		@return '#{$webroot}/svg/core/#{$dir}/#{$icon}?color=#{$color}&v=#{$version}';
 	} @else {
-		@return '#{$webroot}/svg/#{$dir}/#{$icon}/#{$color}?v=#{$version}';
+		@return '#{$webroot}/svg/#{$dir}/#{$icon}?color=#{$color}&v=#{$version}';
 	}
 }
 
diff --git a/core/routes.php b/core/routes.php
index f3884a765a2..f5e6d8e7d21 100644
--- a/core/routes.php
+++ b/core/routes.php
@@ -61,9 +61,9 @@ $application->registerRoutes($this, [
 		['name' => 'OCJS#getConfig', 'url' => '/core/js/oc.js', 'verb' => 'GET'],
 		['name' => 'Preview#getPreviewByFileId', 'url' => '/core/preview', 'verb' => 'GET'],
 		['name' => 'Preview#getPreview', 'url' => '/core/preview.png', 'verb' => 'GET'],
-		['name' => 'Svg#getSvgFromCore', 'url' => '/svg/core/{folder}/{fileName}/{color}', 'verb' => 'GET'],
-		['name' => 'Svg#getSvgFromSettings', 'url' => '/svg/settings/{folder}/{fileName}/{color}', 'verb' => 'GET'],
-		['name' => 'Svg#getSvgFromApp', 'url' => '/svg/{app}/{fileName}/{color}', 'verb' => 'GET'],
+		['name' => 'Svg#getSvgFromCore', 'url' => '/svg/core/{folder}/{fileName}', 'verb' => 'GET'],
+		['name' => 'Svg#getSvgFromSettings', 'url' => '/svg/settings/{folder}/{fileName}', 'verb' => 'GET'],
+		['name' => 'Svg#getSvgFromApp', 'url' => '/svg/{app}/{fileName}', 'verb' => 'GET'],
 		['name' => 'Css#getCss', 'url' => '/css/{appName}/{fileName}', 'verb' => 'GET'],
 		['name' => 'Js#getJs', 'url' => '/js/{appName}/{fileName}', 'verb' => 'GET'],
 		['name' => 'contactsMenu#index', 'url' => '/contactsmenu/contacts', 'verb' => 'POST'],
diff --git a/lib/private/Template/IconsCacher.php b/lib/private/Template/IconsCacher.php
index c1a78a567f9..c91bf13ad53 100644
--- a/lib/private/Template/IconsCacher.php
+++ b/lib/private/Template/IconsCacher.php
@@ -47,7 +47,7 @@ class IconsCacher {
 	protected $urlGenerator;
 
 	/** @var string */
-	private $iconVarRE = '/--(icon-[a-zA-Z0-9-]+):\s?url\(["\']?([a-zA-Z0-9-_\~\/\.\?\=\:\;\+\,]+)[^;]+;/m';
+	private $iconVarRE = '/--(icon-[a-zA-Z0-9-]+):\s?url\(["\']?([a-zA-Z0-9-_\~\/\.\?\&\=\:\;\+\,]+)[^;]+;/m';
 
 	/** @var string */
 	private $fileName = 'icons-vars.css';
@@ -112,7 +112,10 @@ class IconsCacher {
 		foreach ($icons as $icon => $url) {
 			$list .= "--$icon: url('$url');";
 			list($location,$color) = $this->parseUrl($url);
-			$svg = file_get_contents($location);
+			$svg = false;
+			if ($location !== '') {
+				$svg = file_get_contents($location);
+			}
 			if ($svg === false) {
 				$this->logger->debug('Failed to get icon file ' . $location);
 				$data .= "--$icon: url('$url');";
@@ -142,21 +145,20 @@ class IconsCacher {
 		$base = $this->getRoutePrefix() . '/svg/';
 		$cleanUrl = \substr($url, \strlen($base));
 		if (\strpos($url, $base . 'core') === 0) {
-			$cleanUrl = \substr($cleanUrl, \strlen('core'), \strpos($cleanUrl, '?')-\strlen('core'));
-			$parts = \explode('/', $cleanUrl);
-			$color = \array_pop($parts);
-			$cleanUrl = \implode('/', $parts);
-			$location = \OC::$SERVERROOT . '/core/img/' . $cleanUrl . '.svg';
+			$cleanUrl = \substr($cleanUrl, \strlen('core'));
+			if (\preg_match('/\/([a-zA-Z0-9-_\~\/\.\=\:\;\+\,]+)\?color=([0-9a-fA-F]{3,6})/', $cleanUrl, $matches)) {
+				list(,$cleanUrl,$color) = $matches;
+				$location = \OC::$SERVERROOT . '/core/img/' . $cleanUrl . '.svg';
+			}
 		} elseif (\strpos($url, $base) === 0) {
-			$cleanUrl = \substr($cleanUrl, 0, \strpos($cleanUrl, '?'));
-			$parts = \explode('/', $cleanUrl);
-			$app = \array_shift($parts);
-			$color = \array_pop($parts);
-			$cleanUrl = \implode('/', $parts);
-			$location = \OC_App::getAppPath($app) . '/img/' . $cleanUrl . '.svg';
-			if ($app === 'settings') {
-				$location = \OC::$SERVERROOT . '/settings/img/' . $cleanUrl . '.svg';
+			if(\preg_match('/([A-z0-9\_\-]+)\/([a-zA-Z0-9-_\~\/\.\=\:\;\+\,]+)\?color=([0-9a-fA-F]{3,6})/', $cleanUrl, $matches)) {
+				list(,$app,$cleanUrl, $color) = $matches;
+				$location = \OC_App::getAppPath($app) . '/img/' . $cleanUrl . '.svg';
+				if ($app === 'settings') {
+					$location = \OC::$SERVERROOT . '/settings/img/' . $cleanUrl . '.svg';
+				}
 			}
+
 		}
 		return [
 			$location,
diff --git a/tests/lib/Template/IconsCacherTest.php b/tests/lib/Template/IconsCacherTest.php
index 33735e3a45e..c537323e0eb 100644
--- a/tests/lib/Template/IconsCacherTest.php
+++ b/tests/lib/Template/IconsCacherTest.php
@@ -104,7 +104,7 @@ class IconsCacherTest extends \Test\TestCase {
 	public function testSetIconsFromValidCss() {
 		$css = "
 			icon.test {
-				--icon-test: url('/index.php/svg/core/actions/add/000?v=1');
+				--icon-test: url('/index.php/svg/core/actions/add?color=000&v=1');
 				background-image: var(--icon-test);
 			}
 		";
@@ -127,7 +127,7 @@ class IconsCacherTest extends \Test\TestCase {
 	public function testSetIconsFromValidCssMultipleTimes() {
 		$css = "
 			icon.test {
-				--icon-test: url('/index.php/svg/core/actions/add/000?v=1');
+				--icon-test: url('/index.php/svg/core/actions/add?color=000&v=1');
 				background-image: var(--icon-test);
 			}
 		";