refact!: Change versionId → mode preview view

config/areas/site/buttons.php

@@ -4,54 +4,42 @@
 use Kirby\Cms\Page;
 use Kirby\Cms\Site;
 use Kirby\Panel\Ui\Button\LanguagesButton;
-use Kirby\Panel\Ui\Button\OpenButton;
+use Kirby\Panel\Ui\Button\ModelOpenButton;
 use Kirby\Panel\Ui\Button\PageStatusButton;
 use Kirby\Panel\Ui\Button\PreviewButton;
 use Kirby\Panel\Ui\Button\SettingsButton;
 use Kirby\Panel\Ui\Button\VersionsButton;
 
 return [
-	'site.open' => function (Site $site, string $versionId = 'latest') {
-		$versionId = $versionId === 'compare' ? 'changes' : $versionId;
-		$link      = $site->previewUrl($versionId);
-
-		if ($link !== null) {
-			return new OpenButton(
-				link: $link,
-			);
-		}
-	},
+	'site.open' => fn (Site $site, string $mode = 'latest') => new ModelOpenButton(
+		model: $site,
+		mode: $mode
+	),
 	'site.preview' => function (Site $site) {
 		if ($site->previewUrl() !== null) {
 			return new PreviewButton(
 				link: $site->panel()->url(true) . '/preview/changes',
 			);
 		}
 	},
-	'site.versions' => fn (Site $site, string $versionId = 'latest') => new VersionsButton(
+	'site.versions' => fn (Site $site, string $mode = 'latest') => new VersionsButton(
 		model: $site,
-		mode: $versionId
+		mode:  $mode
+	),
+	'page.open' => fn (Page $page, string $mode = 'latest') => new ModelOpenButton(
+		model: $page,
+		mode: $mode
 	),
-	'page.open' => function (Page $page, string $versionId = 'latest') {
-		$versionId = $versionId === 'compare' ? 'changes' : $versionId;
-		$link      = $page->previewUrl($versionId);
-
-		if ($link !== null) {
-			return new OpenButton(
-				link: $link,
-			);
-		}
-	},
 	'page.preview' => function (Page $page) {
 		if ($page->previewUrl() !== null) {
 			return new PreviewButton(
 				link: $page->panel()->url(true) . '/preview/changes',
 			);
 		}
 	},
-	'page.versions' => fn (Page $page, string $versionId = 'latest') => new VersionsButton(
+	'page.versions' => fn (Page $page, string $mode = 'latest') => new VersionsButton(
 		model: $page,
-		mode: $versionId
+		mode:  $mode
 	),
 	'page.settings' => fn (Page $page) => new SettingsButton($page),
 	'page.status'   => fn (Page $page) => new PageStatusButton($page),

panel/src/components/Views/Preview/PreviewBrowser.vue

@@ -6,7 +6,7 @@
 				{{ label }}
 			</k-headline>
 			<k-button-group>
-				<template v-if="versionId === 'changes'">
+				<template v-if="mode === 'changes'">
 					<p v-if="hasDiff === false" class="k-preview-browser-message">
 						{{ $t("lock.unsaved.empty") }}
 					</p>
@@ -38,7 +38,7 @@ export default {
 	props: {
 		label: String,
 		src: String,
-		versionId: String
+		mode: String
 	},
 	emits: ["discard", "submit"],
 	computed: {

panel/src/components/Views/Preview/PreviewView.vue

@@ -1,5 +1,5 @@
 <template>
-	<k-panel class="k-panel-inside k-preview-view" :data-version-id="versionId">
+	<k-panel class="k-panel-inside k-preview-view" :data-mode="mode">
 		<header class="k-preview-view-header">
 			<k-button-group>
 				<k-button
@@ -29,7 +29,7 @@
 			</k-button-group>
 		</header>
 		<main class="k-preview-view-grid">
-			<template v-if="versionId === 'compare'">
+			<template v-if="mode === 'compare'">
 				<k-preview-browser
 					v-bind="browserProps('latest')"
 					@discard="onDiscard"
@@ -43,7 +43,7 @@
 			</template>
 			<template v-else>
 				<k-preview-browser
-					v-bind="browserProps(versionId)"
+					v-bind="browserProps(mode)"
 					@discard="onDiscard"
 					@submit="onSubmit"
 				/>
@@ -61,7 +61,7 @@ export default {
 	extends: ModelView,
 	props: {
 		back: String,
-		versionId: String,
+		mode: String,
 		src: Object,
 		title: String
 	},
@@ -72,15 +72,15 @@ export default {
 		this.$events.off("keydown.esc", this.exit);
 	},
 	methods: {
-		browserProps(versionId) {
+		browserProps(mode) {
 			return {
 				editor: this.editor,
 				hasDiff: this.hasDiff,
 				isLocked: this.isLocked,
 				modified: this.modified,
-				label: this.$t("version." + versionId),
-				src: this.src[versionId],
-				versionId: versionId
+				label: this.$t("version." + mode),
+				src: this.src[mode],
+				mode: mode
 			};
 		},
 		exit() {
@@ -98,10 +98,10 @@ export default {
 			this.$refs.tree.close();
 
 			if (page.id === "/") {
-				return this.$panel.view.open("site/preview/" + this.versionId);
+				return this.$panel.view.open("site/preview/" + this.mode);
 			}
 
-			const url = this.$api.pages.url(page.id, "preview/" + this.versionId);
+			const url = this.$api.pages.url(page.id, "preview/" + this.mode);
 			this.$panel.view.open(url);
 		}
 	}

src/Panel/Controller/View/ModelPreviewViewController.php

@@ -24,22 +24,22 @@ abstract class ModelPreviewViewController extends ViewController
 {
 	public function __construct(
 		public Page|Site $model,
-		public string $versionId
+		public string $mode
 	) {
 		parent::__construct();
 	}
 
 	public function buttons(): ViewButtons
 	{
 		return ViewButtons::view(view: $this->id(), model: $this->model)->defaults($this->model::CLASS_ALIAS . '.versions', 'languages')
-			->bind(['versionId' => $this->versionId]);
+			->bind(['mode' => $this->mode]);
 	}
 
-	public static function factory(string $path, string $versionId): static
+	public static function factory(string $path, string $mode): static
 	{
 		return new static(
 			model:     Find::parent($path),
-			versionId: $versionId
+			mode: $mode
 		);
 	}
 
@@ -65,7 +65,7 @@ public function props(): array
 			'component' => 'k-preview-view',
 			'buttons'   => $this->buttons(),
 			'src'       => $this->src(),
-			'versionId' => $this->versionId,
+			'mode'      => $this->mode,
 		];
 	}
 

src/Panel/Controller/View/PagePreviewViewController.php

@@ -19,9 +19,9 @@ class PagePreviewViewController extends ModelPreviewViewController
 {
 	public function __construct(
 		Page $model,
-		string $versionId
+		string $mode
 	) {
-		parent::__construct($model, $versionId);
+		parent::__construct($model, $mode);
 	}
 
 	public function props(): array

src/Panel/Controller/View/SitePreviewViewController.php

@@ -19,9 +19,9 @@ class SitePreviewViewController extends ModelPreviewViewController
 {
 	public function __construct(
 		Site $model,
-		string $versionId
+		string $mode
 	) {
-		parent::__construct($model, $versionId);
+		parent::__construct($model, $mode);
 	}
 
 	public function props(): array

src/Panel/Ui/Button/ModelOpenButton.php

@@ -0,0 +1,43 @@
+<?php
+
+namespace Kirby\Panel\Ui\Button;
+
+use Kirby\Cms\Page;
+use Kirby\Cms\Site;
+
+/**
+ * Open button for pages and site
+ *
+ * @package   Kirby Panel
+ * @author    Nico Hoffmann <nico@getkirby.com>
+ * @link      https://getkirby.com
+ * @copyright Bastian Allgeier
+ * @license   https://getkirby.com/license
+ * @since     6.0.0
+ * @unstable
+ */
+class ModelOpenButton extends OpenButton
+{
+	public function __construct(
+		Page|Site $model,
+		string $mode = 'latest'
+	) {
+		$mode = match ($mode) {
+			'compare' => 'changes',
+			default   => $mode
+		};
+
+		parent::__construct(
+			link: $model->previewUrl($mode)
+		);
+	}
+
+	public function render(): array|null
+	{
+		if ($this->link === null) {
+			return null;
+		}
+
+		return parent::render();
+	}
+}

src/Panel/Ui/Button/VersionsButton.php

@@ -107,8 +107,8 @@ public function props(): array
 	 * Returns the preview view URL for the given version ID
 	 * @since 6.0.0
 	 */
-	public function url(string $versionId): string
+	public function url(string $mode): string
 	{
-		return $this->model->panel()->url(true) . '/preview/' . $versionId;
+		return $this->model->panel()->url(true) . '/preview/' . $mode;
 	}
 }

tests/Panel/Controller/View/PagePreviewViewControllerTest.php

@@ -40,7 +40,7 @@ public function testFactory(): void
 		$controller = PagePreviewViewController::factory('pages/test', 'changes');
 		$this->assertInstanceOf(PagePreviewViewController::class, $controller);
 		$this->assertSame($this->app->page('test'), $controller->model);
-		$this->assertSame('changes', $controller->versionId);
+		$this->assertSame('changes', $controller->mode);
 	}
 
 	public function testId(): void

tests/Panel/Controller/View/SitePreviewViewControllerTest.php

@@ -26,7 +26,7 @@ public function testFactory(): void
 		$controller = SitePreviewViewController::factory('site', 'changes');
 		$this->assertInstanceOf(SitePreviewViewController::class, $controller);
 		$this->assertSame($this->app->site(), $controller->model);
-		$this->assertSame('changes', $controller->versionId);
+		$this->assertSame('changes', $controller->mode);
 	}
 
 	public function testId(): void

tests/Panel/Ui/Button/ModelOpenButtonTest.php

@@ -0,0 +1,47 @@
+<?php
+
+namespace Kirby\Panel\Ui\Button;
+
+use Kirby\Cms\App;
+use Kirby\Cms\Page;
+use Kirby\TestCase;
+use PHPUnit\Framework\Attributes\CoversClass;
+
+#[CoversClass(ModelOpenButton::class)]
+class ModelOpenButtonTest extends TestCase
+{
+	public function testButton(): void
+	{
+		$page   = new Page(['slug' => 'test']);
+		$button = new ModelOpenButton(model: $page);
+
+		$this->assertSame('k-view-button', $button->component);
+		$this->assertSame('k-open-view-button', $button->class);
+		$this->assertSame('open', $button->icon);
+		$this->assertNull($button->link);
+		$this->assertSame('_blank', $button->target);
+		$this->assertSame('Open', $button->title);
+	}
+
+	public function testRender(): void
+	{
+		$test      = $this;
+		$this->app = new App();
+		$this->app->impersonate('kirby', function () use ($test) {
+			$page   = new Page(['slug' => 'test']);
+			$button = new ModelOpenButton(model: $page);
+			$render = $button->render();
+			$props  = $render['props'];
+			$test->assertSame('k-view-button', $render['component']);
+			$test->assertSame('k-open-view-button', $props['class']);
+			$test->assertSame('/test', $props['link']);
+		});
+	}
+
+	public function testRenderNoButton(): void
+	{
+		$page   = new Page(['slug' => 'test']);
+		$button = new ModelOpenButton(model: $page);
+		$this->assertNull($button->render());
+	}
+}