From c562aef6667dcbb98ce82cb6e435f026243d8a18 Mon Sep 17 00:00:00 2001
From: Tom Schulze <tom@codemonauts.com>
Date: Fri, 29 Apr 2022 15:12:47 +0200
Subject: [PATCH] Craft 4 compatibility, refactoring, add twig template
 rendering, sortable

---
 CHANGELOG.md                                  |  18 ++-
 README.md                                     |   4 +-
 composer.json                                 |  12 +-
 resources/readonly.png                        | Bin 4900 -> 5245 bytes
 src/{Readonly.php => ReadonlyPlugin.php}      |  11 +-
 .../{Readonly.php => ReadonlyField.php}       |   4 +-
 src/fields/Readonly.php                       |  78 -----------
 src/fields/ReadonlyField.php                  | 128 ++++++++++++++++++
 src/icon-mask.svg                             |  10 ++
 .../m220429_104217_change_class_name.php      |  34 +++++
 src/templates/input.twig                      |   2 +-
 src/templates/settings.twig                   |  10 ++
 src/translations/de/readonly.php              |   2 +
 13 files changed, 217 insertions(+), 96 deletions(-)
 rename src/{Readonly.php => ReadonlyPlugin.php} (74%)
 rename src/feedme/{Readonly.php => ReadonlyField.php} (86%)
 delete mode 100644 src/fields/Readonly.php
 create mode 100644 src/fields/ReadonlyField.php
 create mode 100644 src/icon-mask.svg
 create mode 100644 src/migrations/m220429_104217_change_class_name.php
 create mode 100644 src/templates/settings.twig

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 202cafa..25a9b20 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,13 +1,27 @@
 # Read-only Field Changelog
 
-## Unreleased
+## 2.0.0 - 2022-04-29
+
+### Added
+
+- Craft CMS 4 compatibility
+- php 8.1 compatibility
+- Support for Craft CMS 4 condition builder
+- Twig formatting of value in CP
+- The field is now sortable
+
 ### Changed
-- Fixed background color of icon
+
+- Requires Craft CMS >= 4.0 and php >= 8.0
 
 ## 1.0.1 - 2019-09-14
+
 ### Added
+- 
 - Support for Feed-Me plugin
 
 ## 1.0.0 - 2019-04-06
+
 ### Added
+- 
 - Initial release
diff --git a/README.md b/README.md
index b5464c0..bcfbe05 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-# Read-only Field for Craft CMS 3.x
+# Read-only Field for Craft CMS
 
 ![Icon](resources/readonly.png)
 
@@ -10,7 +10,7 @@ Sometimes you add content to Craft entries (for example via an API) that should
 
 ## Requirements
 
- * Craft CMS >= 3.0.0
+ * Craft CMS >= 4.0.0
 
 ## Installation
 
diff --git a/composer.json b/composer.json
index 2436610..06b46cc 100644
--- a/composer.json
+++ b/composer.json
@@ -1,7 +1,7 @@
 {
   "name": "codemonauts/craft-readonly-field",
   "description": "Craft CMS plugin to add a simple, read-only plaintext field.",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "type": "craft-plugin",
   "keywords": [
     "craft",
@@ -24,7 +24,8 @@
     "issues": "https://github.com/codemonauts/craft-readonly-field/issues"
   },
   "require": {
-    "craftcms/cms": "^3.0.0"
+    "craftcms/cms": "^4.0.0-alpha",
+    "php": "^8.0"
   },
   "autoload": {
     "psr-4": {
@@ -33,10 +34,7 @@
   },
   "extra": {
     "handle": "readonly",
-    "class": "codemonauts\\readonly\\Readonly",
-    "name": "Read-only Field",
-    "description": "Simple, read-only plaintext field.",
-    "hasCpSection": false,
-    "hasSettings": false
+    "class": "codemonauts\\readonly\\ReadonlyPlugin",
+    "name": "Read-only Field"
   }
 }
diff --git a/resources/readonly.png b/resources/readonly.png
index 2164cef04a0a6e386d14d30eb6c15bea1e26c66b..ac51d1d0ec73d73eacddd063673d7281bb04afc1 100644
GIT binary patch
delta 5244
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
CB+0D+

delta 4897
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
TQTObx00000NkvXXu0mjf9*S7r

diff --git a/src/Readonly.php b/src/ReadonlyPlugin.php
similarity index 74%
rename from src/Readonly.php
rename to src/ReadonlyPlugin.php
index c3b1619..6f32040 100644
--- a/src/Readonly.php
+++ b/src/ReadonlyPlugin.php
@@ -2,17 +2,20 @@
 
 namespace codemonauts\readonly;
 
+use Craft;
 use craft\base\Plugin;
 use craft\events\RegisterComponentTypesEvent;
 use craft\services\Fields;
 use yii\base\Event;
-use codemonauts\readonly\fields\Readonly as ReadonlyField;
-use codemonauts\readonly\feedme\Readonly as ReadonlyFeedme;
+use codemonauts\readonly\fields\ReadonlyField;
+use codemonauts\readonly\feedme\ReadonlyField as ReadonlyFeedme;
 use craft\feedme\events\RegisterFeedMeFieldsEvent;
 use craft\feedme\services\Fields as FeedMeFields;
 
-class Readonly extends Plugin
+class ReadonlyPlugin extends Plugin
 {
+    public string $schemaVersion = '1.0.1';
+
     public function init()
     {
         parent::init();
@@ -22,7 +25,7 @@ public function init()
         });
 
         // Register field for feed-me plugin if installed
-        if (\Craft::$app->plugins->isPluginEnabled('feed-me')) {
+        if (Craft::$app->plugins->isPluginEnabled('feed-me')) {
             Event::on(FeedMeFields::class, FeedMeFields::EVENT_REGISTER_FEED_ME_FIELDS, function(RegisterFeedMeFieldsEvent $e) {
                     $e->fields[] = ReadonlyFeedme::class;
                 }
diff --git a/src/feedme/Readonly.php b/src/feedme/ReadonlyField.php
similarity index 86%
rename from src/feedme/Readonly.php
rename to src/feedme/ReadonlyField.php
index 348389d..5771907 100644
--- a/src/feedme/Readonly.php
+++ b/src/feedme/ReadonlyField.php
@@ -5,10 +5,10 @@
 use craft\feedme\base\Field;
 use craft\feedme\base\FieldInterface;
 
-class Readonly extends Field implements FieldInterface
+class ReadonlyField extends Field implements FieldInterface
 {
     public static $name = 'Read-only Field';
-    public static $class = 'codemonauts\readonly\fields\Readonly';
+    public static $class = 'codemonauts\readonly\fields\ReadonlyField';
 
     public function getMappingTemplate(): string
     {
diff --git a/src/fields/Readonly.php b/src/fields/Readonly.php
deleted file mode 100644
index ea45b4a..0000000
--- a/src/fields/Readonly.php
+++ /dev/null
@@ -1,78 +0,0 @@
-<?php
-
-namespace codemonauts\readonly\fields;
-
-use Craft;
-use craft\base\ElementInterface;
-use craft\base\Field;
-use craft\base\PreviewableFieldInterface;
-use LitEmoji\LitEmoji;
-use yii\db\Schema;
-
-class Readonly extends Field implements PreviewableFieldInterface
-{
-    /**
-     * @var string The type of database column the field should have in the content table
-     */
-    public $columnType = Schema::TYPE_STRING;
-
-    /**
-     * @inheritdoc
-     */
-    public static function displayName(): string
-    {
-        return Craft::t('readonly', 'Read-only Field');
-    }
-
-    /**
-     * @inheritdoc
-     */
-    public function __construct(array $config = [])
-    {
-        parent::__construct($config);
-    }
-
-    /**
-     * @inheritdoc
-     */
-    public function getContentColumnType(): string
-    {
-        return $this->columnType;
-    }
-
-    /**
-     * @inheritdoc
-     */
-    public function getInputHtml($value, ElementInterface $element = null): string
-    {
-        return Craft::$app->getView()->renderTemplate('readonly/input',
-            [
-                'name' => $this->handle,
-                'value' => $value,
-                'field' => $this,
-            ]);
-    }
-
-    /**
-     * @inheritdoc
-     */
-    public function serializeValue($value, ElementInterface $element = null)
-    {
-        if ($value !== null) {
-            $value = LitEmoji::unicodeToShortcode($value);
-        }
-
-        return $value;
-    }
-
-    /**
-     * @inheritdoc
-     */
-    public function getSearchKeywords($value, ElementInterface $element): string
-    {
-        $value = (string)$value;
-        $value = LitEmoji::unicodeToShortcode($value);
-
-        return $value;
-    }
-}
diff --git a/src/fields/ReadonlyField.php b/src/fields/ReadonlyField.php
new file mode 100644
index 0000000..ca6fb19
--- /dev/null
+++ b/src/fields/ReadonlyField.php
@@ -0,0 +1,128 @@
+<?php
+
+namespace codemonauts\readonly\fields;
+
+use Craft;
+use craft\base\ElementInterface;
+use craft\base\Field;
+use craft\base\PreviewableFieldInterface;
+use craft\base\SortableFieldInterface;
+use craft\fields\conditions\TextFieldConditionRule;
+use craft\helpers\Html;
+use craft\helpers\StringHelper;
+use LitEmoji\LitEmoji;
+use Twig\Error\Error;
+use yii\db\Schema;
+
+class ReadonlyField extends Field implements PreviewableFieldInterface, SortableFieldInterface
+{
+    /**
+     * @var string The type of database column the field should have in the content table
+     */
+    public string $columnType = Schema::TYPE_STRING;
+
+    /**
+     * @var string|null The template to render the value
+     */
+    public ?string $template = null;
+
+    /**
+     * @inheritdoc
+     */
+    public static function displayName(): string
+    {
+        return Craft::t('readonly', 'Read-only Field');
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function getContentColumnType(): string
+    {
+        return $this->columnType;
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function getInputHtml($value, ElementInterface $element = null): string
+    {
+        return Craft::$app->getView()->renderTemplate('readonly/input', [
+            'name' => $this->handle,
+            'value' => $value,
+            'renderedValue' => $this->renderValue($value, $element),
+            'field' => $this,
+        ]);
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function serializeValue($value, ElementInterface $element = null): mixed
+    {
+        if ($value !== null) {
+            $value = LitEmoji::unicodeToShortcode($value);
+        }
+
+        return $value;
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function getSearchKeywords($value, ElementInterface $element): string
+    {
+        $value = (string)$value;
+        return LitEmoji::unicodeToShortcode($value);
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function getElementConditionRuleType(): ?string
+    {
+        return TextFieldConditionRule::class;
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function getSettingsHtml(): ?string
+    {
+        return Craft::$app->getView()->renderTemplate('readonly/settings', [
+            'field' => $this,
+        ]);
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function getTableAttributeHtml(mixed $value, ElementInterface $element): string
+    {
+        return Html::encode(StringHelper::stripHtml($this->renderValue((string)$value, $element)));
+    }
+
+    /**
+     * @param string $value
+     * @param \craft\base\ElementInterface $element
+     *
+     * @return string
+     * @throws \Twig\Error\LoaderError
+     * @throws \Twig\Error\SyntaxError
+     */
+    private function renderValue(?string $value, ElementInterface $element): string
+    {
+        if ($this->template !== null) {
+            try {
+                $value = Craft::$app->getView()->renderString($this->template, [
+                    'value' => $value,
+                    'element' => $element,
+                ]);
+            } catch (Error) {
+                Craft::error('Error rendering template of read-only field with handle "' . $this->handle . '".', 'readonly');
+            }
+        }
+
+        return $value;
+    }
+}
diff --git a/src/icon-mask.svg b/src/icon-mask.svg
new file mode 100644
index 0000000..ae43d72
--- /dev/null
+++ b/src/icon-mask.svg
@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16">
+  <defs>
+    <clipPath id="clip-readonly-icon-mask">
+      <rect width="16" height="16"/>
+    </clipPath>
+  </defs>
+  <g id="readonly-icon-mask" clip-path="url(#clip-readonly-icon-mask)">
+    <path d="M2520.41-1335.172l-14-14a1,1,0,0,1,0-1.417,1,1,0,0,1,1.417,0l5.033,5.033h0l3.76,3.759h0l5.2,5.2a1,1,0,0,1,0,1.418,1,1,0,0,1-.709.294A1,1,0,0,1,2520.41-1335.172Zm-13.774-.447a.7.7,0,0,1-.175-.547l.373-3.353,4.2-4.2,3.759,3.758-4.2,4.2-3.352.37a.786.786,0,0,1-.079,0A.7.7,0,0,1,2506.636-1335.62Zm10.4-6.589h0l-3.758-3.758,1.713-1.713,3.758,3.759-1.711,1.712Zm2.376-2.377-3.759-3.757,1.661-1.661a1.4,1.4,0,0,1,1-.413,1.4,1.4,0,0,1,1,.413l1.765,1.765a1.4,1.4,0,0,1,.413,1,1.4,1.4,0,0,1-.413,1l-1.659,1.66h0Z" transform="translate(-2506.121 1350.879)" fill="currentColor"/>
+  </g>
+</svg>
diff --git a/src/migrations/m220429_104217_change_class_name.php b/src/migrations/m220429_104217_change_class_name.php
new file mode 100644
index 0000000..e1d0adb
--- /dev/null
+++ b/src/migrations/m220429_104217_change_class_name.php
@@ -0,0 +1,34 @@
+<?php
+
+namespace codemonauts\readonly\migrations;
+
+use Craft;
+use craft\db\Migration;
+use craft\db\Table;
+
+/**
+ * m220429_104217_change_class_name migration.
+ */
+class m220429_104217_change_class_name extends Migration
+{
+    /**
+     * @inheritdoc
+     */
+    public function safeUp(): bool
+    {
+        $this->getDb()->createCommand()
+            ->update(Table::FIELDS, ['type' => 'codemonauts\readonly\fields\ReadonlyField'], ['type' => 'codemonauts\readonly\fields\Readonly'])
+            ->execute();
+
+        return true;
+    }
+
+    /**
+     * @inheritdoc
+     */
+    public function safeDown(): bool
+    {
+        echo "m220429_104217_change_class_name cannot be reverted.\n";
+        return false;
+    }
+}
diff --git a/src/templates/input.twig b/src/templates/input.twig
index b6968c0..b977676 100644
--- a/src/templates/input.twig
+++ b/src/templates/input.twig
@@ -1,2 +1,2 @@
-<strong>{{ value }}</strong>
+<strong>{{ renderedValue }}</strong>
 <input name="{{ name }}" type="hidden" value="{{ value }}" />
diff --git a/src/templates/settings.twig b/src/templates/settings.twig
new file mode 100644
index 0000000..9aed44e
--- /dev/null
+++ b/src/templates/settings.twig
@@ -0,0 +1,10 @@
+{% import "_includes/forms" as forms %}
+
+{{ forms.textField({
+    label: "Template String"|t('readonly'),
+    instructions: "Twig template string for displaying the value in CP. If not set, the value is printed. You can use {{ value }} and {{ element }}."|t('readonly'),
+    id: 'template',
+    name: 'template',
+    value: field.template,
+    errors: field.getErrors('template')
+}) }}
\ No newline at end of file
diff --git a/src/translations/de/readonly.php b/src/translations/de/readonly.php
index ec66f66..9a46a43 100644
--- a/src/translations/de/readonly.php
+++ b/src/translations/de/readonly.php
@@ -2,4 +2,6 @@
 
 return [
     'Read-only Field' => 'Schreibgeschütztes Feld',
+    'Template String' => 'Template String',
+    'Twig template string for displaying the value in CP. If not set, the value is printed. You can use {{ value }} and {{ element }}.' => 'Twig Template für die Ausgabe im CP. Wenn nicht gesetzt wird der Wert ausgegeben. Es stehen {{ value }} und {{ element }} zur Verfügung.',
 ];