From d52a043705634b7e2977e4fa3759c2c69feca507 Mon Sep 17 00:00:00 2001 From: Hugo Sales Date: Wed, 8 Dec 2021 17:53:29 +0000 Subject: [PATCH] [TWIG] Restructure user settings template, making it much easier to use and extend --- components/Avatar/Avatar.php | 17 +-- components/Avatar/Controller/Avatar.php | 2 +- plugins/Cover/Cover.php | 16 ++- .../EmailNotifications/EmailNotifications.php | 6 +- plugins/Oomox/Oomox.php | 56 +++----- plugins/ProfileColor/ProfileColor.php | 17 +-- .../XMPPNotifications/XMPPNotifications.php | 4 +- src/Controller/UserPanel.php | 16 ++- templates/settings/base.html.twig | 131 ++++++------------ 9 files changed, 107 insertions(+), 158 deletions(-) diff --git a/components/Avatar/Avatar.php b/components/Avatar/Avatar.php index f6cf7bbf0d..f378d1d6f8 100644 --- a/components/Avatar/Avatar.php +++ b/components/Avatar/Avatar.php @@ -50,15 +50,16 @@ class Avatar extends Component /** * @throws \App\Util\Exception\ClientException */ - public function onPopulateProfileSettingsTabs(Request $request, &$tabs): bool + public function onPopulateSettingsTabs(Request $request, string $section, &$tabs): bool { - // TODO avatar template shouldn't be on settings folder - $tabs[] = [ - 'title' => 'Avatar', - 'desc' => 'Change your avatar.', - 'controller' => C\Avatar::settings_avatar($request), - ]; - + if ($section === 'profile') { + $tabs[] = [ + 'title' => 'Avatar', + 'desc' => 'Change your avatar.', + 'id' => 'settings-avatar', + 'controller' => C\Avatar::settings_avatar($request), + ]; + } return Event::next; } diff --git a/components/Avatar/Controller/Avatar.php b/components/Avatar/Controller/Avatar.php index d877eae404..dbd4573b65 100644 --- a/components/Avatar/Controller/Avatar.php +++ b/components/Avatar/Controller/Avatar.php @@ -127,6 +127,6 @@ class Avatar extends Controller } } - return ['_template' => 'settings/avatar.html.twig', 'avatar' => $form->createView()]; + return ['_template' => 'avatar/settings.html.twig', 'avatar' => $form->createView()]; } } diff --git a/plugins/Cover/Cover.php b/plugins/Cover/Cover.php index 6af41c6b6a..583668b745 100644 --- a/plugins/Cover/Cover.php +++ b/plugins/Cover/Cover.php @@ -54,14 +54,16 @@ class Cover extends Plugin return Event::next; } - public function onPopulateProfileSettingsTabs(Request $request, &$tabs) + public function onPopulateSettingsTabs(Request $request, string $section, &$tabs) { - $tabs[] = [ - 'title' => 'Cover', - 'desc' => 'Change your cover.', - 'controller' => C\Cover::coverSettings($request), - ]; - + if ($section === 'profile') { + $tabs[] = [ + 'title' => 'Cover', + 'desc' => 'Change your cover.', + 'id' => 'settings-cover', + 'controller' => C\Cover::coverSettings($request), + ]; + } return Event::next; } diff --git a/plugins/EmailNotifications/EmailNotifications.php b/plugins/EmailNotifications/EmailNotifications.php index 2e27a18589..ab96291d3f 100644 --- a/plugins/EmailNotifications/EmailNotifications.php +++ b/plugins/EmailNotifications/EmailNotifications.php @@ -41,9 +41,9 @@ class EmailNotifications extends Plugin { public function onAddNotificationTransport(&$form_defs): bool { - $form_defs['email'] = $form_defs['placeholder']; - $form_defs['email'][] = $form_defs['placeholder']['save']('Email', 'save_email'); - unset($form_defs['email']['post_on_status_change']); + $form_defs['Email'] = $form_defs['placeholder']; + $form_defs['Email'][] = $form_defs['placeholder']['save']('Email', 'save_email'); + unset($form_defs['Email']['post_on_status_change']); return Event::next; } } diff --git a/plugins/Oomox/Oomox.php b/plugins/Oomox/Oomox.php index 70c56ece74..42153e2ec4 100644 --- a/plugins/Oomox/Oomox.php +++ b/plugins/Oomox/Oomox.php @@ -28,17 +28,13 @@ use App\Core\Event; use App\Core\Modules\Plugin; use App\Core\Router\RouteLoader; use App\Core\Router\Router; -use App\Entity\Actor; use App\Entity\LocalUser; use App\Util\Common; -use App\Util\Exception\ClientException; use App\Util\Exception\NotFoundException; use App\Util\Exception\RedirectException; use App\Util\Exception\ServerException; -use App\Util\Formatting; use Plugin\Oomox\Controller as C; use Symfony\Component\HttpFoundation\Request; -use function App\Core\I18n\_m; /** * Profile Colour plugin main class @@ -52,12 +48,8 @@ use function App\Core\I18n\_m; */ class Oomox extends Plugin { - /** * Map URLs to actions - * - * @param RouteLoader $r - * @return bool */ public function onAddRoute(RouteLoader $r): bool { @@ -66,55 +58,49 @@ class Oomox extends Plugin return Event::next; } - /** * Populates an additional profile user panel section * Used in templates/settings/base.html.twig * - * @param Request $request - * @param array $tabs - * @return bool + * @throws \App\Util\Exception\NoLoggedInUser * @throws RedirectException * @throws ServerException - * @throws \App\Util\Exception\NoLoggedInUser */ - public function onPopulateProfileSettingsTabs(Request $request, array &$tabs): bool + public function onPopulateSettingsTabs(Request $request, string $section, array &$tabs): bool { - $tabs[] = [ - 'title' => 'Light theme colours', - 'desc' => 'Change the theme colours.', - 'controller' => C\Oomox::oomoxSettingsLight($request), - ]; - - $tabs[] = [ - 'title' => 'Dark theme colours', - 'desc' => 'Change the theme colours.', - 'controller' => C\Oomox::oomoxSettingsDark($request), - ]; + if ($section === 'colours') { + $tabs[] = [ + 'title' => 'Light theme colours', + 'desc' => 'Change the theme colours.', + 'id' => 'settings-light-theme-colours-details', + 'controller' => C\Oomox::oomoxSettingsLight($request), + ]; + $tabs[] = [ + 'title' => 'Dark theme colours', + 'desc' => 'Change the theme colours.', + 'id' => 'settings-dark-theme-colours-details', + 'controller' => C\Oomox::oomoxSettingsDark($request), + ]; + } return Event::next; } /** * Returns Oomox cache key for the given user. - * - * @param LocalUser $user - * @return string */ - public static function cacheKey(LocalUser $user) :string { + public static function cacheKey(LocalUser $user): string + { return "oomox-css-{$user->getId()}"; } /** * Returns Entity\Oomox if it already exists - * - * @param LocalUser $user - * @return Entity\Oomox|null */ public static function getEntity(LocalUser $user): ?Entity\Oomox { try { - return Cache::get(self::cacheKey($user), fn() => DB::findOneBy('oomox', ['actor_id' => $user->getId()])); + return Cache::get(self::cacheKey($user), fn () => DB::findOneBy('oomox', ['actor_id' => $user->getId()])); } catch (NotFoundException $e) { return null; } @@ -123,14 +109,12 @@ class Oomox extends Plugin /** * Adds to array $styles the generated CSS according to user settings, if any are present. * - * @param array $styles - * @param string $route * @return bool */ public function onEndShowStyles(array &$styles, string $route) { $user = Common::user(); - if (!is_null($user) && !is_null(Cache::get(self::cacheKey($user), fn () => self::getEntity($user)))) { + if (!\is_null($user) && !\is_null(Cache::get(self::cacheKey($user), fn () => self::getEntity($user)))) { $styles[] = Router::url('oomox_css'); } return Event::next; diff --git a/plugins/ProfileColor/ProfileColor.php b/plugins/ProfileColor/ProfileColor.php index c0f022f9a6..b81f9032f1 100644 --- a/plugins/ProfileColor/ProfileColor.php +++ b/plugins/ProfileColor/ProfileColor.php @@ -61,15 +61,16 @@ class ProfileColor extends Plugin * @throws RedirectException * @throws ServerException */ - public function onPopulateProfileSettingsTabs(Request $request, array &$tabs): bool + public function onPopulateSettingsTabs(Request $request, string $section, array &$tabs): bool { - // TODO avatar template shouldn't be on settings folder - $tabs[] = [ - 'title' => 'Color', - 'desc' => 'Change your profile color.', - 'controller' => C\ProfileColor::profileColorSettings($request), - ]; - + if ($section === 'colours') { + $tabs[] = [ + 'title' => 'Profile Colour', + 'desc' => 'Change your profile colour.', + 'id' => 'settings-profile-colour-details', + 'controller' => C\ProfileColor::profileColorSettings($request), + ]; + } return Event::next; } diff --git a/plugins/XMPPNotifications/XMPPNotifications.php b/plugins/XMPPNotifications/XMPPNotifications.php index cc7a0c890d..6d8ba2e27d 100644 --- a/plugins/XMPPNotifications/XMPPNotifications.php +++ b/plugins/XMPPNotifications/XMPPNotifications.php @@ -41,8 +41,8 @@ class XMPPNotifications extends Plugin { public function onAddNotificationTransport(&$form_defs): bool { - $form_defs['xmpp'] = $form_defs['placeholder']; - $form_defs['xmpp'][] = $form_defs['placeholder']['save']('XMMP', 'save_xmpp'); + $form_defs['XMPP'] = $form_defs['placeholder']; + $form_defs['XMPP'][] = $form_defs['placeholder']['save']('XMMP', 'save_xmpp'); return Event::next; } } diff --git a/src/Controller/UserPanel.php b/src/Controller/UserPanel.php index b8de5fcd7a..6c46338b60 100644 --- a/src/Controller/UserPanel.php +++ b/src/Controller/UserPanel.php @@ -95,10 +95,10 @@ class UserPanel extends Controller return [ '_template' => 'settings/base.html.twig', - 'profile' => $personal_form->createView(), - 'email' => $email_form->createView(), - 'password' => $password_form->createView(), - 'language' => $language_form->createView(), + 'personal_info_form' => $personal_form->createView(), + 'email_form' => $email_form->createView(), + 'password_form' => $password_form->createView(), + 'language_form' => $language_form->createView(), 'tabbed_forms_notify' => $notifications_form_array, 'open_details_query' => $this->string('open'), ]; @@ -327,8 +327,11 @@ class UserPanel extends Controller $tabbed_forms = []; foreach ($form_defs as $transport_name => $f) { unset($f['save']); - $form = Form::create($f); - $tabbed_forms[$transport_name] = $form; + $form = Form::create($f); + $tabbed_forms[$transport_name]['title'] = $transport_name; + $tabbed_forms[$transport_name]['desc'] = _m('{transport} notification settings', ['transport' => $transport_name]); + $tabbed_forms[$transport_name]['id'] = "settings-notifications-{$transport_name}"; + $tabbed_forms[$transport_name]['form'] = $form->createView(); $form->handleRequest($request); if ($form->isSubmitted() && $form->isValid()) { @@ -353,7 +356,6 @@ class UserPanel extends Controller } } - $tabbed_forms = F\map($tabbed_forms, fn ($f) => $f->createView()); return $tabbed_forms; } diff --git a/templates/settings/base.html.twig b/templates/settings/base.html.twig index 5fcbf48874..63aaf82e59 100644 --- a/templates/settings/base.html.twig +++ b/templates/settings/base.html.twig @@ -8,8 +8,11 @@ {% endblock stylesheets %} -{% macro settings_details_element(title, summary, form_name, context) %} -
+{% macro settings_details_element(title, summary, id, details_content, context, details_ids) %} + {% if details_ids is null %} + {% set details_ids = [id] %} + {% endif %} +

{{ title | trans }} @@ -20,87 +23,37 @@

- - {{ form(attribute(context, form_name) | default) }} + {% if details_content is instanceof('Twig\\Markup') %} + {{ details_content }} + {% else %} + {{ form(details_content) }} + {% endif %}
{% endmacro settings_details_element %} -{% macro settings_details_container(title, summary, tabs, context) %} -
- -

- {{ title | trans }} - {{ icon('arrow-down', 'icon icon-details-open') | raw }} -

- - {{ summary | trans }} - - - - - {% if title == 'Profile' %} -
  • - -
    • - {% elseif title == 'Email' %} -
  • - {{ form(context.email) }} -
    • - {% elseif title == 'Password' %} -
  • - {{ form(context.password) }} -
    • - {% elseif title == 'Language' %} -
  • - {{ form(context.language) }} -
    • - {% elseif title == 'Notifications' %} -
  • - -
    • - {% endif %} -
    +{% macro settings_details_container(title, summary, container_id, tabs, context) %} + {% set children_ids = [container_id] %} + {% set details_content %} + + {% endset %} + {{ _self.settings_details_element(title, summary, container_id, details_content, context, children_ids) }} {% endmacro settings_details_container %} {% block body %} @@ -108,22 +61,28 @@

    Settings