wip

Author: brendt

src/Tempest/View/src/Components/Icon.php

@@ -15,16 +15,10 @@
 use Tempest\View\Elements\ViewComponentElement;
 use Tempest\View\IconConfig;
 use Tempest\View\ViewComponent;
+use function Tempest\get;
 
 final readonly class Icon implements ViewComponent
 {
-    public function __construct(
-        private AppConfig $appConfig,
-        private IconCache $iconCache,
-        private IconConfig $iconConfig,
-        private HttpClient $http,
-    ) {}
-
     public static function getName(): string
     {
         return 'x-icon';
@@ -35,69 +29,88 @@ public function compile(ViewComponentElement $element): string
         $name = $element->getAttribute('name');
         $class = $element->getAttribute('class');
 
-        $svg = $this->render($name);
+        return sprintf(
+            '<?= %s::render(%s, \'%s\') ?>',
+            self::class,
+            // Having to replace `<?=` is a bit of a hack and should be improved
+            str_replace(['<?=', '?>'], '', $name),
+            $class,
+        );
+    }
+
+    /**
+     * Renders an icon
+     *
+     * This method is responsible for rendering the icon. If the icon is not
+     * in the cache, it will download it on the fly and cache it for future
+     * use. If the icon is already in the cache, it will be served from there.
+     */
+    public static function render(string $name, ?string $class): ?string
+    {
+        $svg = self::svg($name);
+        // We can't use injection because we don't have an instance of this view component at runtime. Might be worth refactoring, though.
+        $appConfig = get(AppConfig::class);
 
         if (! $svg) {
-            return $this->appConfig->environment->isLocal()
+            return $appConfig->environment->isLocal()
                 ? ('<!-- unknown-icon: ' . $name . ' -->')
                 : '';
         }
 
-        return match ($class) {
-            null => $svg,
-            default => $this->injectClass($svg, $class),
-        };
+        if ($class !== null) {
+            $svg = self::injectClass($svg, $class);
+        }
+
+        return $svg;
     }
 
-    /**
-     * Downloads the icon's SVG file from the Iconify API
-     */
-    private function download(string $prefix, string $name): ?string
+    private static function svg(string $name): ?string
     {
-        try {
-            $url = new ImmutableString($this->iconConfig->iconifyApiUrl)
-                ->finish('/')
-                ->append("{$prefix}/{$name}.svg")
-                ->toString();
+        $iconCache = get(IconCache::class);
 
-            $response = $this->http->get($url);
+        try {
+            $parts = explode(':', $name, 2);
 
-            if ($response->status !== Status::OK) {
+            if (count($parts) !== 2) {
                 return null;
             }
 
-            return $response->body;
+            [$prefix, $name] = $parts;
+
+            return $iconCache->resolve(
+                key: "iconify-{$prefix}-{$name}",
+                cache: fn () => self::download($prefix, $name),
+                expiresAt: $iconCache->cacheDuration
+                    ? new DateTimeImmutable()
+                        ->add(DateInterval::createFromDateString("{$iconCache->cacheDuration} seconds"))
+                    : null,
+            );
         } catch (Exception) {
             return null;
         }
     }
 
     /**
-     * Renders an icon
-     *
-     * This method is responsible for rendering the icon. If the icon is not
-     * in the cache, it will download it on the fly and cache it for future
-     * use. If the icon is already in the cache, it will be served from there.
+     * Downloads the icon's SVG file from the Iconify API
      */
-    private function render(string $name): ?string
+    private static function download(string $prefix, string $name): ?string
     {
+        $iconConfig = get(IconConfig::class);
+        $http = get(HttpClient::class);
+
         try {
-            $parts = explode(':', $name, 2);
+            $url = new ImmutableString($iconConfig->iconifyApiUrl)
+                ->finish('/')
+                ->append("{$prefix}/{$name}.svg")
+                ->toString();
 
-            if (count($parts) !== 2) {
+            $response = $http->get($url);
+
+            if ($response->status !== Status::OK) {
                 return null;
             }
 
-            [$prefix, $name] = $parts;
-
-            return $this->iconCache->resolve(
-                key: "iconify-{$prefix}-{$name}",
-                cache: fn () => $this->download($prefix, $name),
-                expiresAt: $this->iconConfig->cacheDuration
-                    ? new DateTimeImmutable()
-                        ->add(DateInterval::createFromDateString("{$this->iconConfig->cacheDuration} seconds"))
-                    : null,
-            );
+            return $response->body;
         } catch (Exception) {
             return null;
         }
@@ -106,12 +119,12 @@ private function render(string $name): ?string
     /**
      * Forwards the user-provided class attribute to the SVG element
      */
-    private function injectClass(string $svg, string $class): string
+    private static function injectClass(string $svg, string $class): string
     {
         return new ImmutableString($svg)
             ->replace(
-                search: '<svg ',
-                replace: "<svg class=\"{$class}\" ",
+                search: '<svg',
+                replace: "<svg class=\"{$class}\"",
             )
             ->toString();
     }

src/Tempest/View/src/Parser/TempestViewCompiler.php

@@ -48,7 +48,7 @@ public function compile(string|View $view): string
 
         // 5. Compile to PHP
         $compiled = $this->compileElements($elements);
-
+lw($compiled);
         return $compiled;
     }
 

tests/Integration/View/IconComponentTest.php

@@ -161,4 +161,26 @@ public function test_it_forwards_the_class_attribute(): void
             ),
         );
     }
+    
+    public function test_with_dynamic_data(): void
+    {
+        $mockHttpClient = $this->createMock(HttpClient::class);
+        $mockHttpClient
+            ->expects($this->exactly(1))
+            ->method('get')
+            ->with('https://api.iconify.design/ph/eye.svg')
+            ->willReturn(new GenericResponse(status: Status::OK, body: '<svg></svg>'));
+
+        $this->container->register(HttpClient::class, fn () => $mockHttpClient);
+
+        $rendered = $this->render(
+            '<x-icon :name="$iconName" class="size-5" />',
+            iconName: "ph:eye",
+        );
+
+        $this->assertSame(
+            '<svg class="size-5"></svg>',
+            $rendered,
+        );
+    }
 }