Merge branch 'refactor/address-fields' into beta

.github/CODEOWNERS

@@ -0,0 +1 @@
+*.* @seebeen @oblakbot

.github/workflows/release.yml

@@ -15,6 +15,7 @@ on:
       - 'package.json'
       - 'package-lock.json'
       - 'serbian-addons-for-woocommerce.php'
+      - 'release.config.js'
 
 jobs:
   ci:

.github/workflows/reusable_release.yml

@@ -124,6 +124,7 @@ jobs:
     name: Publish
     runs-on: ubuntu-latest
     needs: release
+    if: ${{ inputs.dry_run == false }}
     steps:
       - name: Download Package
         uses: actions/download-artifact@v4

.gitignore

@@ -1,5 +1,6 @@
 .vscode
 dist
 languages/*backup*
+languages/*.php
 node_modules
 vendor

assets/scripts/@types/index.d.ts

@@ -1,6 +1,13 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import _ from 'lodash';
-
 declare global {
-  const _: typeof _;
+  const Backbone: typeof Backbone;
+  const _: _.UnderscoreStatic;
+
+  interface Window {
+    wc_address_i18n_params: any;
+    wp: {
+      template: (id: string) => _.CompiledTemplate;
+    };
+  }
 }
+
+export {};

assets/scripts/admin/controllers/company-settings.controller.ts

@@ -1,42 +1,41 @@
-import { TemplateExecutor } from 'lodash';
-
 export class CompanySettingsController {
-  private templates: Record<string, TemplateExecutor> = {};
+  private templates: Record<string, _.CompiledTemplate> = {};
 
   init(): void {
-    document
-      .querySelectorAll<HTMLElement>('.repeater-tmpl')
-      .forEach((tmpl) => this.registerTemplate(tmpl));
+    this.registerTemplates('woocommerce_store_bank_accounts');
   }
 
   finalize(): void {
     document
       .querySelectorAll<HTMLButtonElement>('.repeater-add-row')
-      .forEach((btn) => btn.addEventListener('click', (e) => this.addRow(e)));
+      .forEach((btn) =>
+        btn.addEventListener('click', ({ target }) =>
+          this.addRow(target as HTMLButtonElement),
+        ),
+      );
 
     document
       .querySelector('.bank-accounts')
-      .addEventListener('click', (e) => this.removeRow(e));
+      .addEventListener('click', ({ target }) =>
+        this.removeRow(target as HTMLButtonElement),
+      );
   }
 
-  private registerTemplate(tmpl: HTMLElement): void {
-    this.templates[tmpl.id] = _.template(tmpl.innerHTML);
+  private registerTemplates(...ids: string[]): void {
+    ids.forEach((id) => {
+      this.templates[id] = window.wp.template(id);
+    });
   }
 
-  private addRow(event: Event): void {
-    const btn = event.target as HTMLButtonElement;
-    const { tmpl, ...template } = btn.dataset;
-    const id = tmpl.replace('-tmpl', '');
-
-    const wrapper = document.createElement('div');
-    wrapper.innerHTML = this.templates[tmpl]({ data: template });
+  private addRow(btn: HTMLButtonElement): void {
+    const { tmpl, ...data } = btn.dataset;
 
-    document.querySelector(`#${id}`).appendChild(wrapper.querySelector('div'));
+    document
+      .querySelector(`#${tmpl}`)
+      .insertAdjacentHTML('beforeend', this.templates[tmpl](data));
   }
 
-  private removeRow(e: Event): void {
-    const btn = e.target as HTMLButtonElement;
-
+  private removeRow(btn: HTMLButtonElement): void {
     if (!btn.classList.contains('repeater-remove-row')) {
       return;
     }

assets/scripts/frontend/controllers/address-page.controller.ts

@@ -1,25 +1,77 @@
 const $ = jQuery;
 
 export default class AddressPageController {
-  private $inputs: JQuery<HTMLInputElement>;
+  private selector = '.entity-type-control input';
+  private locale: Record<string, string>;
 
   public init(): void {
-    this.$inputs = $('.entity-type-control input[type="radio"]');
+    this.locale = JSON.parse(window.wc_address_i18n_params.locale_fields);
   }
 
   public finalize(): void {
-    this.$inputs.on('click', ({ currentTarget }) =>
-      this.toggleFields($(currentTarget)),
+    $(document.body).on('change refresh', this.selector, (e) => {
+      console.log('change refresh');
+      this.toggleEntityType($(e.target));
+    });
+
+    $(document.body).on('country_to_state_changing', () => {
+      window.setTimeout(
+        () => this.toggleEntityType($(`${this.selector}:checked`)),
+        100,
+      );
+      console.log('country_to_state_changing');
+    });
+  }
+
+  private toggleEntityType($input: JQuery<HTMLInputElement>): void {
+    const isCompany = $input.val() === 'company';
+
+    console.log($input.is(':checked'), $input.val());
+
+    this.isRequired($<HTMLParagraphElement>('.entity-type-toggle'), isCompany);
+  }
+
+  private isRequired(
+    $field: JQuery<HTMLParagraphElement>,
+    required: boolean,
+  ): void {
+    $field.find('input').prop({
+      'aria-required': required,
+      disabled: !required,
+    });
+
+    if (required) {
+      $field.find('label .optional').remove();
+      $field.addClass('shown validate-required');
+
+      if ($field.find('label .required').length === 0) {
+        $field
+          .find('label')
+          .append(
+            `<abbr class="required" title="${window.wc_address_i18n_params.i18n_required_text}">*</abbr>`,
+          );
+      }
+
+      return;
+    }
+
+    $field.find('label .required').remove();
+    $field.removeClass(
+      'shown validate-required woocommerce-invalid woocommerce-invalid-required-field',
     );
-    this.toggleFields(this.$inputs.filter(':checked'));
+
+    if ($field.find('label .optional').length === 0) {
+      $field
+        .find('label')
+        .append(
+          `<abbr class="optional" title="${window.wc_address_i18n_params.i18n_optional_text}">${window.wc_address_i18n_params.i18n_optional_text}</abbr>`,
+        );
+    }
   }
 
   private toggleFields($toggle: JQuery<HTMLInputElement>): void {
     const isPerson = $toggle.attr('value') === 'person';
 
-    $('.hide-if-person').toggleClass('shown', !isPerson).find('input').prop({
-      required: isPerson,
-      disabled: isPerson,
-    });
+    $('.hide-if-person').toggleClass('shown', !isPerson);
   }
 }

assets/styles/components/_billing_fields.scss

@@ -15,11 +15,11 @@
       }
     }
 
-    .hide-if-person {
-      display: none;
+    .entity-type-toggle {
+      display: none !important;
 
       &.shown {
-        display: block;
+        display: block !important;
       }
     }
   }

composer.json

@@ -2,14 +2,15 @@
   "type": "project",
   "require": {
     "php": "^8.0",
-    "automattic/jetpack-autoloader": "^3",
+    "automattic/jetpack-autoloader": "^3.1",
     "chillerlan/php-qrcode": "^5",
     "oblak/serbian-validators": "^1",
     "oblak/woocommerce-utils": "^1.27",
     "oblak/wp-hook-di": "^1",
     "oblak/wp-plugin-installer": "^2",
     "x-wp/asset-loader": "^1.0",
     "x-wp/helper-functions": "^1.4",
+    "x-wp/helper-woocommerce": "^1.13",
     "x-wp/wc-template-customizer": "^1.0"
   },
   "require-dev": {
@@ -19,13 +20,19 @@
   },
   "autoload": {
     "psr-4": {
-      "Oblak\\WooCommerce\\Serbian_Addons\\": "lib"
+      "Oblak\\WCSRB\\": "lib/"
     },
+    "classmap": [
+      "lib/Admin/",
+      "lib/Gateway/",
+      "lib/QR/"
+    ],
     "files": [
-      "lib/Utils/wcsrb-core.php",
-      "lib/Utils/wcsrb-helpers.php",
-      "lib/Utils/wcsrb-payment-slip.php",
-      "lib/Utils/wcsrb-settings.php"
+      "lib/Functions/wcsrb-address-field-fns.php",
+      "lib/Functions/wcsrb-core.php",
+      "lib/Functions/wcsrb-helpers.php",
+      "lib/Functions/wcsrb-payment-slip.php",
+      "lib/Functions/wcsrb-settings.php"
     ]
   },
   "config": {