Merge branch 'master' into frontend-performance-improvements

2026-05-25 20:54:56 +00:00 · 2025-05-05 02:24:27 +02:00
parent 8b49332453 6d14dce668
commit d70c04b841
257 changed files with 30966 additions and 11128 deletions
--- a/resources/scripts/admin/views/SampleTable.vue
+++ b/resources/scripts/admin/views/SampleTable.vue
@@ -41,7 +41,7 @@
        <base-dropdown width-class="w-48" margin-class="mt-1">
          <template #activator>
            <div class="flex items-center justify-center">
-              <DotsHorizontalIcon class="w-6 h-6 text-gray-600" />
+              <EllipsisHorizontalIcon class="w-6 h-6 text-gray-600" />
            </div>
          </template>

@@ -79,17 +79,18 @@
 </template>

 <script>
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
+
 import { computed, reactive } from 'vue'
 import { useItemStore } from '@/scripts/admin/stores/item'
 import {
  UserIcon,
  DocumentIcon,
  DocumentTextIcon,
-  DotsHorizontalIcon,
-} from '@heroicons/vue/solid'
-import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
-import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
-import BasePage from '@/scripts/components/base/BasePage.vue'
+  EllipsisHorizontalIcon,
+} from '@heroicons/vue/24/solid'

 export default {
  components: {
@@ -97,7 +98,7 @@ export default {
    BaseDropdown,
    BaseDropdownItem,
    BaseTable,
-    DotsHorizontalIcon,
+    EllipsisHorizontalIcon,
    UserIcon,
    DocumentIcon,
    DocumentTextIcon,
--- a/resources/scripts/admin/views/auth/Login.vue
+++ b/resources/scripts/admin/views/auth/Login.vue
@@ -31,7 +31,7 @@
      >
        <template #right>
          <BaseIcon
-            :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+            :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
            class="mr-1 text-gray-500 cursor-pointer"
            @click="isShowPassword = !isShowPassword"
          />
--- a/resources/scripts/admin/views/customers/Create.vue
+++ b/resources/scripts/admin/views/customers/Create.vue
@@ -17,7 +17,7 @@
          <div class="flex items-center justify-end">
            <BaseButton type="submit" :loading="isSaving" :disabled="isSaving">
              <template #left="slotProps">
-                <BaseIcon name="SaveIcon" :class="slotProps.class" />
+                <BaseIcon name="ArrowDownOnSquareIcon" :class="slotProps.class" />
              </template>
              {{
                isEdit
@@ -223,7 +223,7 @@
              >
                <template #right>
                  <BaseIcon
-                    :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+                    :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
                    class="mr-1 text-gray-500 cursor-pointer"
                    @click="isShowPassword = !isShowPassword"
                  />
@@ -250,7 +250,7 @@
              >
                <template #right>
                  <BaseIcon
-                    :name="isShowConfirmPassword ? 'EyeIcon' : 'EyeOffIcon'"
+                    :name="isShowConfirmPassword ? 'EyeIcon' : 'EyeSlashIcon'"
                    class="mr-1 text-gray-500 cursor-pointer"
                    @click="isShowConfirmPassword = !isShowConfirmPassword"
                  />
--- a/resources/scripts/admin/views/customers/Index.vue
+++ b/resources/scripts/admin/views/customers/Index.vue
@@ -22,10 +22,10 @@
            <template #right="slotProps">
              <BaseIcon
                v-if="!showFilters"
-                name="FilterIcon"
+                name="FunnelIcon"
                :class="slotProps.class"
              />
-              <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+              <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
            </template>
          </BaseButton>

--- a/resources/scripts/admin/views/customers/partials/CustomerChart.vue
+++ b/resources/scripts/admin/views/customers/partials/CustomerChart.vue
@@ -6,7 +6,7 @@
      <div class="col-span-12 xl:col-span-9 xxl:col-span-10">
        <div class="flex justify-between mt-1 mb-6">
          <h6 class="flex items-center">
-            <BaseIcon name="ChartSquareBarIcon" class="h-5 text-primary-400" />
+            <BaseIcon name="ChartBarSquareIcon" class="h-5 text-primary-400" />
            {{ $t('dashboard.monthly_chart.title') }}
          </h6>

--- a/resources/scripts/admin/views/customers/partials/CustomerViewSidebar.vue
+++ b/resources/scripts/admin/views/customers/partials/CustomerViewSidebar.vue
@@ -35,7 +35,7 @@
        variant="gray"
        @input="onSearch()"
      >
-        <BaseIcon name="SearchIcon" class="text-gray-500" />
+        <BaseIcon name="MagnifyingGlassIcon" class="text-gray-500" />
      </BaseInput>

      <div class="flex mb-6 ml-3" role="group" aria-label="First group">
@@ -47,7 +47,7 @@
        >
          <template #activator>
            <BaseButton variant="gray">
-              <BaseIcon name="FilterIcon" />
+              <BaseIcon name="FunnelIcon" />
            </BaseButton>
          </template>

--- a/resources/scripts/admin/views/dashboard/DashboardChart.vue
+++ b/resources/scripts/admin/views/dashboard/DashboardChart.vue
@@ -18,7 +18,7 @@
      >
        <div class="flex justify-between mt-1 mb-4 flex-col md:flex-row">
          <h6 class="flex items-center sw-section-title h-10">
-            <BaseIcon name="ChartSquareBarIcon" class="text-primary-400 mr-1" />
+            <BaseIcon name="ChartBarSquareIcon" class="text-primary-400 mr-1" />
            {{ $t('dashboard.monthly_chart.title') }}
          </h6>

--- a/resources/scripts/admin/views/estimates/Index.vue
+++ b/resources/scripts/admin/views/estimates/Index.vue
@@ -24,9 +24,9 @@
            <BaseIcon
              v-if="!showFilters"
              :class="slotProps.class"
-              name="FilterIcon"
+              name="FunnelIcon"
            />
-            <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+            <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
          </template>
        </BaseButton>

--- a/resources/scripts/admin/views/estimates/View.vue
+++ b/resources/scripts/admin/views/estimates/View.vue
@@ -73,7 +73,7 @@
            @input="onSearched()"
          >
            <template #right>
-              <BaseIcon name="SearchIcon" class="text-gray-400" />
+              <BaseIcon name="MagnifyingGlassIcon" class="text-gray-400" />
            </template>
          </BaseInput>
        </div>
@@ -87,7 +87,7 @@
          >
            <template #activator>
              <BaseButton size="md" variant="gray">
-                <BaseIcon name="FilterIcon" />
+                <BaseIcon name="FunnelIcon" />
              </BaseButton>
            </template>

--- a/resources/scripts/admin/views/estimates/create/EstimateCreate.vue
+++ b/resources/scripts/admin/views/estimates/create/EstimateCreate.vue
@@ -60,7 +60,7 @@
              <BaseIcon
                v-if="!isSaving"
                :class="slotProps.class"
-                name="SaveIcon"
+                name="ArrowDownOnSquareIcon"
              />
            </template>
            {{ $t('estimates.save_estimate') }}
--- a/resources/scripts/admin/views/expenses/Create.vue
+++ b/resources/scripts/admin/views/expenses/Create.vue
@@ -45,7 +45,7 @@
              <template #left="slotProps">
                <BaseIcon
                  v-if="!isSaving"
-                  name="SaveIcon"
+                  name="ArrowDownOnSquareIcon"
                  :class="slotProps.class"
                />
              </template>
@@ -264,7 +264,7 @@
              <template #left="slotProps">
                <BaseIcon
                  v-if="!isSaving"
-                  name="SaveIcon"
+                  name="ArrowDownOnSquareIcon"
                  :class="slotProps.class"
                />
              </template>
--- a/resources/scripts/admin/views/expenses/Index.vue
+++ b/resources/scripts/admin/views/expenses/Index.vue
@@ -17,10 +17,10 @@
          <template #right="slotProps">
            <BaseIcon
              v-if="!showFilters"
-              name="FilterIcon"
+              name="FunnelIcon"
              :class="slotProps.class"
            />
-            <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+            <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
          </template>
        </BaseButton>

--- a/resources/scripts/admin/views/installation/Step6AccountSettings.vue
+++ b/resources/scripts/admin/views/installation/Step6AccountSettings.vue
@@ -69,7 +69,7 @@
          >
            <template #right>
              <BaseIcon
-                :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+                :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
                class="mr-1 text-gray-500 cursor-pointer"
                @click="isShowPassword = !isShowPassword"
              />
@@ -94,7 +94,7 @@
          >
            <template #right>
              <BaseIcon
-                :name="isShowConfirmPassword ? 'EyeIcon' : 'EyeOffIcon'"
+                :name="isShowConfirmPassword ? 'EyeIcon' : 'EyeSlashIcon'"
                class="mr-1 text-gray-500 cursor-pointer"
                @click="isShowConfirmPassword = !isShowConfirmPassword"
              />
@@ -105,7 +105,7 @@

      <BaseButton :loading="isSaving" :disabled="isSaving" class="mt-4">
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+          <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
        </template>
        {{ $t('wizard.save_cont') }}
      </BaseButton>
--- a/resources/scripts/admin/views/installation/Step7CompanyInfo.vue
+++ b/resources/scripts/admin/views/installation/Step7CompanyInfo.vue
@@ -153,7 +153,7 @@

      <BaseButton :loading="isSaving" :disabled="isSaving" class="mt-4">
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+          <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
        </template>
        {{ $t('wizard.save_cont') }}
      </BaseButton>
--- a/resources/scripts/admin/views/installation/Step8CompanyPreferences.vue
+++ b/resources/scripts/admin/views/installation/Step8CompanyPreferences.vue
@@ -134,7 +134,7 @@
          class="mt-4"
        >
          <template #left="slotProps">
-            <BaseIcon name="SaveIcon" :class="slotProps.class" />
+            <BaseIcon name="ArrowDownOnSquareIcon" :class="slotProps.class" />
          </template>
          {{ $t('wizard.save_cont') }}
        </BaseButton>
--- a/resources/scripts/admin/views/installation/database/MysqlDatabase.vue
+++ b/resources/scripts/admin/views/installation/database/MysqlDatabase.vue
@@ -98,7 +98,7 @@
      :disabled="isSaving"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>
      {{ $t('wizard.save_cont') }}
    </BaseButton>
--- a/resources/scripts/admin/views/installation/database/PgsqlDatabase.vue
+++ b/resources/scripts/admin/views/installation/database/PgsqlDatabase.vue
@@ -118,7 +118,7 @@
      :disabled="isSaving"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>
      {{ $t('wizard.save_cont') }}
    </BaseButton>
--- a/resources/scripts/admin/views/installation/database/SqliteDatabase.vue
+++ b/resources/scripts/admin/views/installation/database/SqliteDatabase.vue
@@ -62,7 +62,7 @@
      :disabled="isSaving"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>
      {{ $t('wizard.save_cont') }}
    </BaseButton>
--- a/resources/scripts/admin/views/installation/mail-driver/BasicMailDriver.vue
+++ b/resources/scripts/admin/views/installation/mail-driver/BasicMailDriver.vue
@@ -67,7 +67,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>
      {{ $t('general.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/installation/mail-driver/MailgunMailDriver.vue
+++ b/resources/scripts/admin/views/installation/mail-driver/MailgunMailDriver.vue
@@ -62,7 +62,7 @@
        >
          <template #right>
            <BaseIcon
-              :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+              :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
              class="mr-1 text-gray-500 cursor-pointer"
              @click="isShowPassword = !isShowPassword"
            />
@@ -137,7 +137,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>
      {{ $t('general.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/installation/mail-driver/SesMailDriver.vue
+++ b/resources/scripts/admin/views/installation/mail-driver/SesMailDriver.vue
@@ -160,13 +160,32 @@
        >
          <template #right>
            <BaseIcon
-              :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+              :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
              class="mr-1 text-gray-500 cursor-pointer"
              @click="isShowPassword = !isShowPassword"
            />
          </template>
        </BaseInput>
      </BaseInputGroup>
+
+      <BaseInputGroup
+        :label="$t('settings.mail.ses_region')"
+        :content-loading="isFetchingInitialData"
+        :error="
+          v$.sesConfig.mail_ses_region.$error &&
+          v$.sesConfig.mail_ses_region.$errors[0].$message
+        "
+        required
+      >
+        <BaseInput
+          v-model.trim="mailDriverStore.sesConfig.mail_ses_region"
+          :content-loading="isFetchingInitialData"
+          type="text"
+          name="mail_ses_region"
+          :invalid="v$.sesConfig.mail_ses_region.$error"
+          @input="v$.sesConfig.mail_ses_region.$touch()"
+        />
+      </BaseInputGroup>
    </div>

    <BaseButton
@@ -176,7 +195,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>

      {{ $t('general.save') }}
@@ -242,6 +261,9 @@ const rules = computed(() => {
      mail_ses_secret: {
        required: helpers.withMessage(t('validation.required'), required),
      },
+      mail_ses_region: {
+        required: helpers.withMessage(t('validation.required'), required),
+      },
      mail_encryption: {
        required: helpers.withMessage(t('validation.required'), required),
      },
--- a/resources/scripts/admin/views/installation/mail-driver/SmtpMailDriver.vue
+++ b/resources/scripts/admin/views/installation/mail-driver/SmtpMailDriver.vue
@@ -67,7 +67,7 @@
        >
          <template #right>
            <BaseIcon
-              :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+              :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
              class="mr-1 text-gray-500 cursor-pointer"
              @click="isShowPassword = !isShowPassword"
            />
@@ -163,7 +163,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
      </template>
      {{ $t('general.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/invoices/Index.vue
+++ b/resources/scripts/admin/views/invoices/Index.vue
@@ -17,10 +17,10 @@
          <template #right="slotProps">
            <BaseIcon
              v-if="!showFilters"
-              name="FilterIcon"
+              name="FunnelIcon"
              :class="slotProps.class"
            />
-            <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+            <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
          </template>
        </BaseButton>

--- a/resources/scripts/admin/views/invoices/View.vue
+++ b/resources/scripts/admin/views/invoices/View.vue
@@ -335,7 +335,7 @@ onSearched = debounce(onSearched, 500)
            @input="onSearched()"
          >
            <template #right>
-              <BaseIcon name="SearchIcon" class="h-5 text-gray-400" />
+              <BaseIcon name="MagnifyingGlassIcon" class="h-5 text-gray-400" />
            </template>
          </BaseInput>
        </div>
@@ -344,7 +344,7 @@ onSearched = debounce(onSearched, 500)
          <BaseDropdown class="ml-3" position="bottom-start">
            <template #activator>
              <BaseButton size="md" variant="gray">
-                <BaseIcon name="FilterIcon" />
+                <BaseIcon name="FunnelIcon" />
              </BaseButton>
            </template>
            <div
--- a/resources/scripts/admin/views/invoices/create/InvoiceCreate.vue
+++ b/resources/scripts/admin/views/invoices/create/InvoiceCreate.vue
@@ -58,7 +58,7 @@
            <template #left="slotProps">
              <BaseIcon
                v-if="!isSaving"
-                name="SaveIcon"
+                name="ArrowDownOnSquareIcon"
                :class="slotProps.class"
              />
            </template>
@@ -145,6 +145,7 @@ import { cloneDeep } from 'lodash'

 import { useInvoiceStore } from '@/scripts/admin/stores/invoice'
 import { useModuleStore } from '@/scripts/admin/stores/module'
+import { useNotesStore } from '@/scripts/admin/stores/note'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useCustomFieldStore } from '@/scripts/admin/stores/custom-field'

@@ -170,6 +171,8 @@ const invoiceStore = useInvoiceStore()
 const companyStore = useCompanyStore()
 const customFieldStore = useCustomFieldStore()
 const moduleStore = useModuleStore()
+const notesStore = useNotesStore()
+
 const { t } = useI18n()
 let route = useRoute()
 let router = useRouter()
--- a/resources/scripts/admin/views/items/Create.vue
+++ b/resources/scripts/admin/views/items/Create.vue
@@ -118,7 +118,7 @@
              <template #left="slotProps">
                <BaseIcon
                  v-if="!isSaving"
-                  name="SaveIcon"
+                  name="ArrowDownOnSquareIcon"
                  :class="slotProps.class"
                />
              </template>
@@ -191,7 +191,12 @@ const taxes = computed({
        return {
          ...tax,
          tax_type_id: tax.id,
-          tax_name: tax.name + ' (' + tax.percent + '%)',
+          tax_name: `${tax.name} (${tax.calculation_type === 'fixed' 
+            ? new Intl.NumberFormat(undefined, {
+                style: 'currency',
+                currency: companyStore.selectedCompanyCurrency.code
+              }).format(tax.fixed_amount / 100)
+            : `${tax.percent}%`})`,
        }
      }
    }),
@@ -211,7 +216,12 @@ const getTaxTypes = computed(() => {
    return {
      ...tax,
      tax_type_id: tax.id,
-      tax_name: tax.name + ' (' + tax.percent + '%)',
+      tax_name: `${tax.name} (${tax.calculation_type === 'fixed' 
+        ? new Intl.NumberFormat(undefined, {
+            style: 'currency',
+            currency: companyStore.selectedCompanyCurrency.code
+          }).format(tax.fixed_amount / 100)
+        : `${tax.percent}%`})`,
    }
  })
 })
@@ -287,7 +297,9 @@ async function submitItem() {
      data.taxes = itemStore.currentItem.taxes.map((tax) => {
        return {
          tax_type_id: tax.tax_type_id,
-          amount: price.value * tax.percent,
+          calculation_type: tax.calculation_type,
+          fixed_amount: tax.fixed_amount,
+          amount: tax.calculation_type === 'fixed' ? tax.fixed_amount : price.value * tax.percent,
          percent: tax.percent,
          name: tax.name,
          collective_tax: 0,
--- a/resources/scripts/admin/views/items/Index.vue
+++ b/resources/scripts/admin/views/items/Index.vue
@@ -18,9 +18,9 @@
              <BaseIcon
                v-if="!showFilters"
                :class="slotProps.class"
-                name="FilterIcon"
+                name="FunnelIcon"
              />
-              <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+              <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
            </template>
          </BaseButton>

--- a/resources/scripts/admin/views/modules/Index.vue
+++ b/resources/scripts/admin/views/modules/Index.vue
@@ -90,7 +90,7 @@
          <div class="flex space-x-2">
            <BaseButton class="mt-6" :loading="isSaving" type="submit">
              <template #left="slotProps">
-                <BaseIcon name="SaveIcon" :class="slotProps.class" />
+                <BaseIcon name="ArrowDownOnSquareIcon" :class="slotProps.class" />
              </template>
              {{ $t('general.save') }}
            </BaseButton>
--- a/resources/scripts/admin/views/modules/View.vue
+++ b/resources/scripts/admin/views/modules/View.vue
@@ -274,7 +274,7 @@
              class="mr-4 flex items-center justify-center text-base"
              @click="installModule()"
            >
-              <BaseIcon v-if="!isInstalling" name="DownloadIcon" class="mr-2" />
+              <BaseIcon v-if="!isInstalling" name="ArrowDownTrayIcon" class="mr-2" />
              {{ $t('modules.install') }}
            </BaseButton>
          </div>
@@ -306,7 +306,7 @@
                class="mr-4 flex items-center justify-center text-base"
                @click="disableModule"
              >
-                <BaseIcon v-if="!isDisabling" name="BanIcon" class="mr-2" />
+                <BaseIcon v-if="!isDisabling" name="NoSymbolIcon" class="mr-2" />
                {{ $t('modules.disable') }}
              </BaseButton>
              <BaseButton
--- a/resources/scripts/admin/views/payments/Create.vue
+++ b/resources/scripts/admin/views/payments/Create.vue
@@ -27,7 +27,7 @@
            <template #left="slotProps">
              <BaseIcon
                v-if="!isSaving"
-                name="SaveIcon"
+                name="ArrowDownOnSquareIcon"
                :class="slotProps.class"
              />
            </template>
@@ -237,7 +237,7 @@
          <template #left="slotProps">
            <BaseIcon
              v-if="!isSaving"
-              name="SaveIcon"
+              name="ArrowDownOnSquareIcon"
              :class="slotProps.class"
            />
          </template>
--- a/resources/scripts/admin/views/payments/Index.vue
+++ b/resources/scripts/admin/views/payments/Index.vue
@@ -19,9 +19,9 @@
            <BaseIcon
              v-if="!showFilters"
              :class="slotProps.class"
-              name="FilterIcon"
+              name="FunnelIcon"
            />
-            <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+            <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
          </template>
        </BaseButton>

--- a/resources/scripts/admin/views/payments/View.vue
+++ b/resources/scripts/admin/views/payments/View.vue
@@ -54,7 +54,7 @@
          type="text"
          @input="onSearch"
        >
-          <BaseIcon name="SearchIcon" class="h-5" />
+          <BaseIcon name="MagnifyingGlassIcon" class="h-5" />
        </BaseInput>

        <div class="flex ml-3" role="group" aria-label="First group">
@@ -65,7 +65,7 @@
          >
            <template #activator>
              <BaseButton variant="gray">
-                <BaseIcon name="FilterIcon" />
+                <BaseIcon name="FunnelIcon" />
              </BaseButton>
            </template>

--- a/resources/scripts/admin/views/recurring-invoices/Index.vue
+++ b/resources/scripts/admin/views/recurring-invoices/Index.vue
@@ -23,10 +23,10 @@
          <template #right="slotProps">
            <BaseIcon
              v-if="!showFilters"
-              name="FilterIcon"
+              name="FunnelIcon"
              :class="slotProps.class"
            />
-            <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+            <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
          </template>
        </BaseButton>

--- a/resources/scripts/admin/views/recurring-invoices/create/RecurringInvoiceCreate.vue
+++ b/resources/scripts/admin/views/recurring-invoices/create/RecurringInvoiceCreate.vue
@@ -56,7 +56,7 @@
            <template #left="slotProps">
              <BaseIcon
                v-if="!isSaving"
-                name="SaveIcon"
+                name="ArrowDownOnSquareIcon"
                :class="slotProps.class"
              />
            </template>
--- a/resources/scripts/admin/views/recurring-invoices/partials/RecurringInvoiceViewSidebar.vue
+++ b/resources/scripts/admin/views/recurring-invoices/partials/RecurringInvoiceViewSidebar.vue
@@ -186,7 +186,7 @@ onSearched = debounce(onSearched, 500)
          @input="onSearched()"
        >
          <template #right>
-            <BaseIcon name="SearchIcon" class="h-5 text-gray-400" />
+            <BaseIcon name="MagnifyingGlassIcon" class="h-5 text-gray-400" />
          </template>
        </BaseInput>
      </div>
@@ -195,7 +195,7 @@ onSearched = debounce(onSearched, 500)
        <BaseDropdown class="ml-3" position="bottom-start">
          <template #activator>
            <BaseButton size="md" variant="gray">
-              <BaseIcon name="FilterIcon" class="h-5" />
+              <BaseIcon name="FunnelIcon" class="h-5" />
            </BaseButton>
          </template>
          <div
--- a/resources/scripts/admin/views/reports/layout/Index.vue
+++ b/resources/scripts/admin/views/reports/layout/Index.vue
@@ -12,7 +12,7 @@
      <template #actions>
        <BaseButton variant="primary" class="ml-4" @click="onDownload">
          <template #left="slotProps">
-            <BaseIcon name="DownloadIcon" :class="slotProps.class" />
+            <BaseIcon name="ArrowDownTrayIcon" :class="slotProps.class" />
          </template>
          {{ $t('reports.download_pdf') }}
        </BaseButton>
--- a/resources/scripts/admin/views/settings/AccountSetting.vue
+++ b/resources/scripts/admin/views/settings/AccountSetting.vue
@@ -86,7 +86,7 @@
        <template #left="slotProps">
          <BaseIcon
            v-if="!isSaving"
-            name="SaveIcon"
+            name="ArrowDownOnSquareIcon"
            :class="slotProps.class"
          ></BaseIcon>
        </template>
--- a/resources/scripts/admin/views/settings/BackupSetting.vue
+++ b/resources/scripts/admin/views/settings/BackupSetting.vue
@@ -47,12 +47,12 @@
        <BaseDropdown>
          <template #activator>
            <div class="inline-block">
-              <BaseIcon name="DotsHorizontalIcon" class="text-gray-500" />
+              <BaseIcon name="EllipsisHorizontalIcon" class="text-gray-500" />
            </div>
          </template>

          <BaseDropdownItem @click="onDownloadBckup(row.data)">
-            <BaseIcon name="CloudDownloadIcon" class="mr-3 text-gray-600" />
+            <BaseIcon name="CloudArrowDownIcon" class="mr-3 text-gray-600" />

            {{ $t('general.download') }}
          </BaseDropdownItem>
--- a/resources/scripts/admin/views/settings/CompanyInfoSettings.vue
+++ b/resources/scripts/admin/views/settings/CompanyInfoSettings.vue
@@ -103,7 +103,7 @@
        class="mt-6"
      >
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+          <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
        </template>
        {{ $t('settings.company_info.save') }}
      </BaseButton>
--- a/resources/scripts/admin/views/settings/ExchangeRateProviderSetting.vue
+++ b/resources/scripts/admin/views/settings/ExchangeRateProviderSetting.vue
@@ -47,7 +47,7 @@
        <BaseDropdown>
          <template #activator>
            <div class="inline-block">
-              <DotsHorizontalIcon class="w-5 text-gray-500" />
+              <EllipsisHorizontalIcon class="w-5 text-gray-500" />
            </div>
          </template>

@@ -71,10 +71,17 @@ import { useExchangeRateStore } from '@/scripts/admin/stores/exchange-rate'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useModalStore } from '@/scripts/stores/modal'
 import { useDialogStore } from '@/scripts/stores/dialog'
-import { DotsHorizontalIcon, PencilIcon, PlusIcon, TrashIcon } from '@heroicons/vue/outline'
-import { computed, inject, reactive, ref } from 'vue'
+import { ArrowDownOnSquareIcon } from '@heroicons/vue/24/outline'
+import { ref, computed, inject, reactive } from 'vue'
 import ExchangeRateProviderModal from '@/scripts/admin/components/modal-components/ExchangeRateProviderModal.vue'
 import { useI18n } from 'vue-i18n'
+import {
+  PlusIcon,
+  EllipsisHorizontalIcon,
+  PencilIcon,
+  TrashIcon,
+} from '@heroicons/vue/24/outline'
+
 import BaseTable from '@/scripts/components/base/base-table/BaseTable.vue'
 import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
 import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
--- a/resources/scripts/admin/views/settings/FileDiskSetting.vue
+++ b/resources/scripts/admin/views/settings/FileDiskSetting.vue
@@ -39,7 +39,7 @@
        <BaseDropdown v-if="isNotSystemDisk(row.data)">
          <template #activator>
            <div class="inline-block">
-              <BaseIcon name="DotsHorizontalIcon" class="text-gray-500" />
+              <BaseIcon name="EllipsisHorizontalIcon" class="text-gray-500" />
            </div>
          </template>

--- a/resources/scripts/admin/views/settings/NotesSetting.vue
+++ b/resources/scripts/admin/views/settings/NotesSetting.vue
@@ -31,6 +31,10 @@
          :load-data="refreshTable"
        />
      </template>
+      <template #cell-name="{ row }">
+        {{ row.data.name }}
+        <BaseIcon v-if="row.data.is_default" name="StarIcon" class="w-3 h-3 text-primary-400" />
+      </template>
      <template #cell-type="{ row }">
        {{ getLabelNote(row.data.type) }}
      </template>
@@ -42,9 +46,7 @@
 import { computed, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useModalStore } from '@/scripts/stores/modal'
-import { useDialogStore } from '@/scripts/stores/dialog'
 import { useNotesStore } from '@/scripts/admin/stores/note'
-import { useNotificationStore } from '@/scripts/stores/notification'
 import NoteDropdown from '@/scripts/admin/components/dropdowns/NoteIndexDropdown.vue'
 import NoteModal from '@/scripts/admin/components/modal-components/NoteModal.vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
@@ -57,9 +59,7 @@ import BaseSettingCard from '@/scripts/components/base/BaseSettingCard.vue'
 const { t } = useI18n()

 const modalStore = useModalStore()
-const dialogStore = useDialogStore()
 const noteStore = useNotesStore()
-const notificationStore = useNotificationStore()
 const userStore = useUserStore()

 const table = ref('')
@@ -70,7 +70,7 @@ const notesColumns = computed(() => {
      key: 'name',
      label: t('settings.customization.notes.name'),
      thClass: 'extra',
-      tdClass: 'font-medium text-gray-900',
+      tdClass: 'font-medium text-gray-900 flex gap-1 items-center',
    },
    {
      key: 'type',
--- a/resources/scripts/admin/views/settings/NotificationsSetting.vue
+++ b/resources/scripts/admin/views/settings/NotificationsSetting.vue
@@ -33,7 +33,7 @@
            <BaseIcon
              v-if="!isSaving"
              :class="slotProps.class"
-              name="SaveIcon"
+              name="ArrowDownOnSquareIcon"
            />
          </template>

--- a/resources/scripts/admin/views/settings/PDFGenerationSetting.vue
+++ b/resources/scripts/admin/views/settings/PDFGenerationSetting.vue
@@ -0,0 +1,72 @@
+<template>
+    <BaseSettingCard
+      :title="$t('settings.pdf.pdf_configuration')"
+      :description="$t('settings.pdf.section_description')"
+    >
+    <div v-if="pdfDriverStore && pdfDriverStore.pdfDriverConfig" class="mt-14">
+      <component
+        :is="pdfDriver"
+        :config-data="pdfDriverStore.pdfDriverConfig"
+        :is-saving="isSaving"
+        :drivers="pdfDriverStore.pdf_drivers"
+        :is-fetching-initial-data="isFetchingInitialData"
+        @on-change-driver="(val) => changeDriver(val)"
+        @submit-data="saveConfig"
+      >
+      </component>
+    </div>
+    </BaseSettingCard>
+</template>
+
+<script setup>
+  import GotenbergDriver from '@/scripts/admin/views/settings/pdf-driver/GotenbergDriver.vue';
+  import DomPDFDriver from '@/scripts/admin/views/settings/pdf-driver/DomPDFDriver.vue';
+  import { ref, computed } from 'vue'
+  import { useI18n } from 'vue-i18n'
+  import { usePDFDriverStore } from '@/scripts/admin/stores/pdf-driver'
+  const emit = defineEmits(['submit-data', 'on-change-driver'])
+
+  let isFetchingInitialData = ref(false)
+  let isSaving = ref(false)
+
+  const pdfDriverStore = usePDFDriverStore();
+  const { t } = useI18n();
+
+  function changeDriver(value) {
+    pdfDriverStore.pdf_driver = value
+    pdfDriverStore.pdfDriverConfig.pdf_driver = value
+  }
+
+  async function loadData() {
+    isFetchingInitialData.value = true
+    await Promise.all([
+      pdfDriverStore.fetchDrivers(),
+      pdfDriverStore.fetchConfig(),
+    ])
+    isFetchingInitialData.value = false
+  }
+  loadData();
+
+  async function saveConfig(value) {
+    try {
+      isSaving.value = true
+      await pdfDriverStore.updateConfig(value)
+    } catch (e) {
+      console.error(e)
+    } finally {
+      isSaving.value = false
+      return false
+    }
+  }
+
+  const pdfDriver = computed(() => {
+    switch (pdfDriverStore.pdf_driver) {
+      case 'dompdf':
+        return DomPDFDriver
+      case 'gotenberg':
+        return GotenbergDriver
+      default:
+        return DomPDFDriver
+    }
+  })
+</script>
--- a/resources/scripts/admin/views/settings/PreferencesSetting.vue
+++ b/resources/scripts/admin/views/settings/PreferencesSetting.vue
@@ -143,7 +143,7 @@
        class="mt-6"
      >
        <template #left="slotProps">
-          <BaseIcon name="SaveIcon" :class="slotProps.class" />
+          <BaseIcon name="ArrowDownOnSquareIcon" :class="slotProps.class" />
        </template>
        {{ $t('settings.company_info.save') }}
      </BaseButton>
@@ -183,7 +183,7 @@
            class="mt-6"
          >
            <template #left="slotProps">
-              <BaseIcon name="SaveIcon" :class="slotProps.class" />
+              <BaseIcon name="ArrowDownOnSquareIcon" :class="slotProps.class" />
            </template>
            {{ $t('general.save') }}
          </BaseButton>
--- a/resources/scripts/admin/views/settings/TaxTypesSetting.vue
+++ b/resources/scripts/admin/views/settings/TaxTypesSetting.vue
@@ -20,7 +20,20 @@
      :data="fetchData"
      :columns="taxTypeColumns"
    >
-      <template #cell-percent="{ row }"> {{ row.data.percent }} % </template>
+    <template #cell-calculation_type="{ row }">
+      {{ $t(`settings.tax_types.${row.data.calculation_type}`) }}
+    </template>
+    <template #cell-amount="{ row }">
+      <template v-if="row.data.calculation_type === 'percentage'">
+        {{ row.data.percent }} %
+      </template>
+      <template v-else-if="row.data.calculation_type === 'fixed'">
+        <BaseFormatMoney :amount="row.data.fixed_amount" :currency="defaultCurrency" />
+      </template>
+      <template v-else>
+        -
+      </template>
+    </template>

      <template v-if="hasAtleastOneAbility()" #cell-actions="{ row }">
        <TaxTypeDropdown
@@ -70,9 +83,9 @@ const taxTypeStore = useTaxTypeStore()
 const modalStore = useModalStore()
 const userStore = useUserStore()
 const moduleStore = useModuleStore()
-
 const table = ref(null)
 const taxPerItemSetting = ref(companyStore.selectedCompanySettings.tax_per_item)
+const defaultCurrency = computed(() => companyStore.selectedCompanyCurrency)

 const taxTypeColumns = computed(() => {
  return [
@@ -83,8 +96,14 @@ const taxTypeColumns = computed(() => {
      tdClass: 'font-medium text-gray-900',
    },
    {
-      key: 'percent',
-      label: t('settings.tax_types.percent'),
+      key: 'calculation_type',
+      label: t('settings.tax_types.calculation_type'),
+      thClass: 'extra',
+      tdClass: 'font-medium text-gray-900',
+    },
+    {
+      key: 'amount',
+      label: t('settings.tax_types.amount'),
      thClass: 'extra',
      tdClass: 'font-medium text-gray-900',
    },
--- a/resources/scripts/admin/views/settings/customization/NumberCustomizer.vue
+++ b/resources/scripts/admin/views/settings/customization/NumberCustomizer.vue
@@ -129,7 +129,7 @@
                {{ $t('general.remove') }}
                <template #left="slotProps">
                  <BaseIcon
-                    name="XIcon"
+                    name="XMarkIcon"
                    class="!sm:m-0"
                    :class="slotProps.class"
                  />
@@ -189,7 +189,7 @@
    @click="submitForm"
  >
    <template #left="slotProps">
-      <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+      <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
    </template>
    {{ $t('settings.customization.save') }}
  </BaseButton>
--- a/resources/scripts/admin/views/settings/customization/estimates/EstimatesTabDefaultFormats.vue
+++ b/resources/scripts/admin/views/settings/customization/estimates/EstimatesTabDefaultFormats.vue
@@ -57,7 +57,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
      </template>
      {{ $t('settings.customization.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/settings/customization/estimates/EstimatesTabExpiryDate.vue
+++ b/resources/scripts/admin/views/settings/customization/estimates/EstimatesTabExpiryDate.vue
@@ -46,7 +46,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
      </template>
      {{ $t('settings.customization.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/settings/customization/invoices/InvoicesTabDefaultFormats.vue
+++ b/resources/scripts/admin/views/settings/customization/invoices/InvoicesTabDefaultFormats.vue
@@ -55,7 +55,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
      </template>
      {{ $t('settings.customization.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/settings/customization/invoices/InvoicesTabDueDate.vue
+++ b/resources/scripts/admin/views/settings/customization/invoices/InvoicesTabDueDate.vue
@@ -44,7 +44,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
      </template>
      {{ $t('settings.customization.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/settings/customization/items/ItemsTab.vue
+++ b/resources/scripts/admin/views/settings/customization/items/ItemsTab.vue
@@ -15,7 +15,7 @@
      <BaseDropdown>
        <template #activator>
          <div class="inline-block">
-            <BaseIcon name="DotsHorizontalIcon" class="text-gray-500" />
+            <BaseIcon name="EllipsisHorizontalIcon" class="text-gray-500" />
          </div>
        </template>

--- a/resources/scripts/admin/views/settings/customization/payments/PaymentsTabDefaultFormats.vue
+++ b/resources/scripts/admin/views/settings/customization/payments/PaymentsTabDefaultFormats.vue
@@ -47,7 +47,7 @@
      class="mt-4"
    >
      <template #left="slotProps">
-        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+        <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
      </template>
      {{ $t('settings.customization.save') }}
    </BaseButton>
--- a/resources/scripts/admin/views/settings/mail-driver/BasicMailDriver.vue
+++ b/resources/scripts/admin/views/settings/mail-driver/BasicMailDriver.vue
@@ -67,7 +67,7 @@
        type="submit"
      >
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" :class="slotProps.class" name="SaveIcon" />
+          <BaseIcon v-if="!isSaving" :class="slotProps.class" name="ArrowDownOnSquareIcon" />
        </template>
        {{ $t('general.save') }}
      </BaseButton>
--- a/resources/scripts/admin/views/settings/mail-driver/MailgunMailDriver.vue
+++ b/resources/scripts/admin/views/settings/mail-driver/MailgunMailDriver.vue
@@ -59,7 +59,7 @@
        >
          <template #right>
            <BaseIcon
-              :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+              :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
              class="mr-1 text-gray-500 cursor-pointer"
              @click="isShowPassword = !isShowPassword"
            />
@@ -133,7 +133,7 @@
        type="submit"
      >
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+          <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
        </template>
        {{ $t('general.save') }}
      </BaseButton>
--- a/resources/scripts/admin/views/settings/mail-driver/SesMailDriver.vue
+++ b/resources/scripts/admin/views/settings/mail-driver/SesMailDriver.vue
@@ -154,13 +154,33 @@
        >
          <template #right>
            <BaseIcon
-              :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+              :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
              class="mr-1 text-gray-500 cursor-pointer"
              @click="isShowPassword = !isShowPassword"
            />
          </template>
        </BaseInput>
      </BaseInputGroup>
+
+      <BaseInputGroup
+        :label="$t('settings.mail.ses_region')"
+        :content-loading="isFetchingInitialData"
+        :error="
+          v$.sesConfig.mail_ses_region.$error &&
+          v$.sesConfig.mail_ses_region.$errors[0].$message
+        "
+        required
+      >
+        <BaseInput
+          v-model.trim="mailDriverStore.sesConfig.mail_ses_region"
+          :content-loading="isFetchingInitialData"
+          type="text"
+          name="mail_ses_region"
+          :invalid="v$.sesConfig.mail_ses_region.$error"
+          @input="v$.sesConfig.mail_ses_region.$touch()"
+        />
+      </BaseInputGroup>
+
    </BaseInputGrid>

    <div class="flex my-10">
@@ -172,7 +192,7 @@
        type="submit"
      >
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+          <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
        </template>
        {{ $t('general.save') }}
      </BaseButton>
@@ -244,6 +264,9 @@ const rules = computed(() => {
      mail_ses_secret: {
        required: helpers.withMessage(t('validation.required'), required),
      },
+      mail_ses_region: {
+        required: helpers.withMessage(t('validation.required'), required),
+      },
      mail_encryption: {
        required: helpers.withMessage(t('validation.required'), required),
      },
--- a/resources/scripts/admin/views/settings/mail-driver/SmtpMailDriver.vue
+++ b/resources/scripts/admin/views/settings/mail-driver/SmtpMailDriver.vue
@@ -63,7 +63,7 @@
        >
          <template #right>
            <BaseIcon
-              :name="isShowPassword ? 'EyeIcon' : 'EyeOffIcon'"
+              :name="isShowPassword ? 'EyeIcon' : 'EyeSlashIcon'"
              class="mr-1 text-gray-500 cursor-pointer"
              @click="isShowPassword = !isShowPassword"
            />
@@ -159,7 +159,7 @@
        variant="primary"
      >
        <template #left="slotProps">
-          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+          <BaseIcon v-if="!isSaving" name="ArrowDownOnSquareIcon" :class="slotProps.class" />
        </template>
        {{ $t('general.save') }}
      </BaseButton>
--- a/resources/scripts/admin/views/settings/pdf-driver/DomPDFDriver.vue
+++ b/resources/scripts/admin/views/settings/pdf-driver/DomPDFDriver.vue
@@ -0,0 +1,117 @@
+<template>
+  <form @submit.prevent="saveConfig">
+    <BaseInputGrid>
+      <BaseInputGroup
+        :label="$t('settings.pdf.driver')"
+        :error="
+          v$.dompdf.pdf_driver.$error &&
+          v$.dompdf.pdf_driver.$errors[0].$message
+        "
+        required
+      >
+        <BaseMultiselect
+          v-model="pdfDriverStore.dompdf.pdf_driver"
+          :content-loading="isFetchingInitialData"
+          :options="drivers"
+          :can-deselect="false"
+          :invalid="v$.dompdf.pdf_driver.$error"
+          @update:modelValue="onChangeDriver"
+        />
+      </BaseInputGroup>
+    </BaseInputGrid>
+    <div class="flex my-10">
+      <BaseButton
+        :disabled="isSaving"
+        :content-loading="isFetchingInitialData"
+        :loading="isSaving"
+        type="submit"
+        variant="primary"
+      >
+        <template #left="slotProps">
+          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        </template>
+        {{ $t('general.save') }}
+      </BaseButton>
+      <slot />
+    </div>
+  </form>
+</template>
+
+<script setup>
+  import { ref, computed, onMounted } from 'vue'
+  import { useI18n } from 'vue-i18n'
+  import { usePDFDriverStore } from '@/scripts/admin/stores/pdf-driver'
+  import {required, email, helpers} from '@vuelidate/validators'
+  import useVuelidate from '@vuelidate/core'
+
+  const props = defineProps({
+    configData: {
+      type: Object,
+      require: true,
+      default: Object,
+    },
+    isSaving: {
+      type: Boolean,
+      require: true,
+      default: false,
+    },
+    isFetchingInitialData: {
+      type: Boolean,
+      require: true,
+      default: false,
+    },
+    drivers: {
+      type: Array,
+      require: true,
+      default: Array,
+    },
+  })
+
+
+  const emit = defineEmits(['submit-data', 'on-change-driver'])
+
+  let isFetchingInitialData = ref(false)
+
+  const pdfDriverStore = usePDFDriverStore();
+  const { t } = useI18n();
+
+  const rules = computed(() => {
+    return {
+      dompdf: {
+        pdf_driver: {
+          required: helpers.withMessage(t('validation.required'), required),
+        },
+      },
+    }
+  })
+
+  const v$ = useVuelidate(
+    rules,
+    computed(() => pdfDriverStore)
+  )
+
+  function onChangeDriver() {
+    // validation
+    v$.value.dompdf.pdf_driver.$touch()
+    emit('on-change-driver', pdfDriverStore.dompdf.pdf_driver)
+  }
+
+  async function saveConfig() {
+    v$.value.dompdf.$touch()
+    if (!v$.value.dompdf.$invalid) {
+      emit('submit-data', pdfDriverStore.dompdf)
+    }
+    return false
+  }
+
+  onMounted(() => {
+    for (const key in pdfDriverStore.dompdf) {
+      if (props.configData.hasOwnProperty(key)) {
+        pdfDriverStore.$patch((state) => {
+          state.dompdf[key] = props.configData[key]
+        });
+      }
+    }
+  })
+
+</script>
--- a/resources/scripts/admin/views/settings/pdf-driver/GotenbergDriver.vue
+++ b/resources/scripts/admin/views/settings/pdf-driver/GotenbergDriver.vue
@@ -0,0 +1,128 @@
+<template>
+  <form @submit.prevent="saveConfig">
+    <BaseInputGrid>
+      <BaseInputGroup :label="$t('settings.pdf.driver')" :error="
+          v$.gotenberg.pdf_driver.$error &&
+          v$.gotenberg.pdf_driver.$errors[0].$message
+        " required>
+        <BaseMultiselect v-model="pdfDriverStore.gotenberg.pdf_driver" :content-loading="isFetchingInitialData"
+          :options="drivers" :can-deselect="false" @update:modelValue="onChangeDriver"
+          :invalid="v$.gotenberg.pdf_driver.$error" />
+      </BaseInputGroup>
+      <BaseInputGroup :label="$t('settings.pdf.gotenberg_host')" :content-loading="isFetchingInitialData"
+        :error="
+          v$.gotenberg.gotenberg_host.$error &&
+          v$.gotenberg.gotenberg_host.$errors[0].$message
+        " required>
+        <BaseInput v-model="pdfDriverStore.gotenberg.gotenberg_host" :content-loading="isFetchingInitialData"
+          :invalid="v$.gotenberg.gotenberg_host.$error" type="text" name="gotenberg_host" />
+      </BaseInputGroup>
+      <BaseInputGroup :label="$t('settings.pdf.papersize')" :content-loading="isFetchingInitialData" :error="
+          v$.gotenberg.gotenberg_papersize.$error &&
+          v$.gotenberg.gotenberg_papersize.$errors[0].$message
+        "
+          :help-text="$t('settings.pdf.papersize_hint')"
+        required>
+        <BaseInput v-model="pdfDriverStore.gotenberg.gotenberg_papersize" :content-loading="isFetchingInitialData"
+          :invalid="v$.gotenberg.gotenberg_papersize.$error" type="text" name="gotenberg_papersize" />
+      </BaseInputGroup>
+    </BaseInputGrid>
+    <div class="flex my-10">
+      <BaseButton :disabled="isSaving" :content-loading="isFetchingInitialData" :loading="isSaving" type="submit"
+        variant="primary">
+        <template #left="slotProps">
+          <BaseIcon v-if="!isSaving" name="SaveIcon" :class="slotProps.class" />
+        </template>
+        {{ $t('general.save') }}
+      </BaseButton>
+      <slot />
+    </div>
+  </form>
+</template>
+
+<script setup>
+  import {ref, computed, onMounted} from 'vue'
+  import {useI18n} from 'vue-i18n'
+  import {usePDFDriverStore} from '@/scripts/admin/stores/pdf-driver'
+  import {required, email, helpers} from '@vuelidate/validators'
+  import useVuelidate from '@vuelidate/core'
+
+  const props = defineProps({
+    configData: {
+      type: Object,
+      require: true,
+      default: Object,
+    },
+    isSaving: {
+      type: Boolean,
+      require: true,
+      default: false,
+    },
+    isFetchingInitialData: {
+      type: Boolean,
+      require: true,
+      default: false,
+    },
+    drivers: {
+      type: Array,
+      require: true,
+      default: Array,
+    },
+  })
+
+
+  const emit = defineEmits(['submit-data', 'on-change-driver'])
+
+  const pdfDriverStore = usePDFDriverStore();
+  const {t} = useI18n();
+
+  const rules = computed(() => {
+    return {
+      gotenberg: {
+        pdf_driver: {
+          required: helpers.withMessage(t('validation.required'), required),
+        },
+        gotenberg_host: {
+          required: helpers.withMessage(t('validation.required'), required),
+        },
+        gotenberg_papersize: {
+          required: helpers.withMessage(t('validation.required'), required),
+        },
+      },
+    }
+  })
+
+  const v$ = useVuelidate(
+    rules,
+    computed(() => pdfDriverStore)
+  )
+
+  function onChangeDriver() {
+    v$.value.gotenberg.pdf_driver.$touch()
+    emit('on-change-driver', pdfDriverStore.gotenberg.pdf_driver)
+  }
+
+  async function saveConfig() {
+    v$.value.gotenberg.$touch()
+    if (!v$.value.gotenberg.$invalid) {
+      emit('submit-data', pdfDriverStore.gotenberg)
+    }
+    return false
+  }
+
+  // Fill pdfDriverStore.gotenbergConfig with data from config prop
+  onMounted(() => {
+    for (const key in pdfDriverStore.gotenberg) {
+      if (props.configData.hasOwnProperty(key)) {
+        pdfDriverStore.$patch((state) => {
+          state.gotenberg[key] = props.configData[key]
+        });
+      }
+    }
+    if (pdfDriverStore.gotenberg.gotenberg_papersize == '')
+      pdfDriverStore.$patch((state) => {
+        state.gotenberg.gotenberg_papersize = '210mm 297mm';
+      });
+  })
+
+</script>
--- a/resources/scripts/admin/views/users/Create.vue
+++ b/resources/scripts/admin/views/users/Create.vue
@@ -149,7 +149,7 @@
            <template #left="slotProps">
              <BaseIcon
                v-if="!isSaving"
-                name="SaveIcon"
+                name="ArrowDownOnSquareIcon"
                :class="slotProps.class"
              />
            </template>
--- a/resources/scripts/admin/views/users/Index.vue
+++ b/resources/scripts/admin/views/users/Index.vue
@@ -18,10 +18,10 @@
            <template #right="slotProps">
              <BaseIcon
                v-if="!showFilters"
-                name="FilterIcon"
+                name="FunnelIcon"
                :class="slotProps.class"
              />
-              <BaseIcon v-else name="XIcon" :class="slotProps.class" />
+              <BaseIcon v-else name="XMarkIcon" :class="slotProps.class" />
            </template>
          </BaseButton>