Merge branch 'next' of github.com:devforth/adminforth into next

AdminForth/1731/security-audit

AdminForth/1731/security-audit

Author: yaroslav8765

adminforth/documentation/docs/tutorial/03-Customization/13-standardPagesTuning.md

@@ -542,6 +542,26 @@ And `edit` action will be available as quick action:
      
 
 
+## Show
+
+### Next record button
+
+By default, when a user opens a record from the list view, a **Next** button appears on the show page. It allows navigating through records one by one, respecting the current filters and sorting applied in the list. When the user reaches the last record on the current page, AdminForth automatically fetches the next page and continues navigation seamlessly.
+
+To disable the Next button for a resource, set `showNextButton` to `false`:
+
+```typescript title="./resources/apartments.ts"
+export default {
+  resourceId: 'aparts',
+  options: {
+//diff-add
+    showNextButton: false,
+  }
+}
+```
+
+> ☝️ The Next button is only shown when the user navigates to the show page from the list view. Opening a record directly via URL will not display the button.
+
 ## Creating
 
 ### Fill with default values

adminforth/documentation/docs/tutorial/06-Adapters/02-oauth2-adapters.md

@@ -59,7 +59,7 @@ Adds support for Twitch authentication, useful for streaming or creator-oriented
 ## Clerk OAuth Adapter
 
 ```bash
-pnpm i @adminforth/clerk-oauth-adapter
+pnpm i @adminforth/oauth-adapter-clerk
 ```
 
 Enables sign-in via [Clerk](https://clerk.com/) — a hosted authentication platform with built-in user management, MFA, and social logins.

adminforth/documentation/docs/tutorial/09-Plugins/11-oauth.md

@@ -481,7 +481,7 @@ plugins: [
 Install Adapter:
 
 ```bash
-pnpm install @adminforth/clerk-oauth-adapter --save
+pnpm install @adminforth/oauth-adapter-clerk --save
 ```
 
 1. Go to the [Clerk Dashboard](https://dashboard.clerk.com) and open your application.
@@ -502,7 +502,7 @@ CLERK_DOMAIN=https://your-app.clerk.accounts.dev
 Add the adapter to your plugin configuration:
 
 ```typescript title="./resources/adminuser.ts"
-import AdminForthAdapterClerkOauth2 from '@adminforth/clerk-oauth-adapter';
+import AdminForthAdapterClerkOauth2 from '@adminforth/oauth-adapter-clerk';
 
 // ... existing resource configuration ...
 plugins: [

adminforth/modules/restApi.ts

@@ -318,6 +318,7 @@ const getResourceDataResponseSchema: AnySchemaObject = createErrorOrSuccessSchem
       items: genericObjectSchema,
     },
     total: { type: 'number' },
+    recordIds: { type: 'array', items: {} },
     options: genericObjectSchema,
   },
   additionalProperties: true,
@@ -1599,6 +1600,11 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
           }
         }
 
+        if (source === 'list') {
+          const pkField = resource.columns.find((col) => col.primaryKey).name;
+          (data as any).recordIds = data.data.map((item) => item[pkField]);
+        }
+
         return data;
       },
     });

adminforth/spa/src/components/CustomDateRangePicker.vue

@@ -208,6 +208,10 @@ async function initDatepickers() {
     'flowbite-datepicker/Datepicker'
   );
 
+  if (!datepickerStartEl.value || !datepickerEndEl.value) {
+    return;
+  }
+
   const LS_LANG_KEY = `afLanguage`;
   datepickerStartObject.value = new Datepicker(datepickerStartEl.value, {format: 'dd M yyyy', language: localStorage.getItem(LS_LANG_KEY)});
   datepickerEndObject.value = new Datepicker(datepickerEndEl.value, {format: 'dd M yyyy', language: localStorage.getItem(LS_LANG_KEY)});
@@ -225,8 +229,8 @@ function removeChangeDateListener() {
 }
 
 function destroyDatepickerElement() {
-  datepickerStartObject.value.destroy();
-  datepickerEndObject.value.destroy();
+  datepickerStartObject.value?.destroy?.();
+  datepickerEndObject.value?.destroy?.();
 }
 
 function setStartDate(event) {

adminforth/spa/src/components/ResourceListTable.vue

@@ -422,7 +422,8 @@ const props = withDefaults(defineProps<{
   bufferSize?: number,
   customActionIconsThreeDotsMenuItems?: AdminForthComponentDeclaration[]
   tableRowReplaceInjection?: AdminForthComponentDeclaration,
-  isVirtualScrollEnabled: boolean
+  isVirtualScrollEnabled: boolean,
+  filters?: any[]
 }>(), {
   sort: () => []
 });
@@ -615,6 +616,12 @@ async function onClick(e: any, row: any) {
       // user asked to nothing on click
       return;
     }
+    coreStore.listRecordIds = props.rows?.map(r => r._primaryKeyValue) ?? [];
+    coreStore.listResourceId = props.resource?.resourceId ?? null;
+    coreStore.listSort = props.sort;
+    coreStore.listPage = page.value;
+    coreStore.listPageSize = props.pageSize;
+    coreStore.listFilters = props.filters ?? [];
     if (e.ctrlKey || e.metaKey || row._clickUrl?.includes('target=_blank')) {
       
       if (row._clickUrl) {

adminforth/spa/src/stores/core.ts

@@ -22,6 +22,12 @@ export const useCoreStore = defineStore('core', () => {
   const isResourceFetching = ref(false);
   const isInternetError = ref(false);
   const screenWidth = ref(window.innerWidth);
+  const listRecordIds: Ref<any[]> = ref([]);
+  const listResourceId: Ref<string | null> = ref(null);
+  const listFilters: Ref<any[]> = ref([]);
+  const listSort: Ref<any[]> = ref([]);
+  const listPage: Ref<number> = ref(0);
+  const listPageSize: Ref<number> = ref(0);
 
   onMounted(() => {
     window.addEventListener('resize', updateWidth);
@@ -214,6 +220,10 @@ export const useCoreStore = defineStore('core', () => {
         resourceId,
       }
     });
+    if (!res) {
+      isResourceFetching.value = false;
+      return;
+    }
     if (res.error) {
       resourceColumnsError.value = res.error;
     } else {
@@ -290,5 +300,11 @@ export const useCoreStore = defineStore('core', () => {
     isIos,
     isInternetError,
     isMobile,
+    listRecordIds,
+    listResourceId,
+    listFilters,
+    listSort,
+    listPage,
+    listPageSize,
   }
 })

adminforth/spa/src/utils/listUtils.ts

@@ -47,11 +47,12 @@ export async function getList(resource: AdminForthResourceFrontend, isPageLoaded
     return row;
   });
   totalRows = data.total;
-  
+  const recordIds = data.recordIds || [];
+
   // if checkboxes have items which are not in current data, remove them
   checkboxes.value = checkboxes.value.filter((pk: any) => rows.some((r: any) => r._primaryKeyValue === pk));
   await nextTick();
-  return { rows, totalRows };
+  return { rows, totalRows, recordIds };
 }
 
 

adminforth/spa/src/utils/utils.ts

@@ -641,11 +641,21 @@ export function checkShowIf(c: AdminForthResourceColumnInputCommon, record: Reco
 }
 
 export function btoa_function(source: string): string {
-  return btoa(source);
+  // UTF-8 safe base64 encode: plain btoa() throws on characters outside the
+  const bytes = new TextEncoder().encode(source);
+  let binary = '';
+  const chunkSize = 0x8000;
+  for (let i = 0; i < bytes.length; i += chunkSize) {
+    binary += String.fromCharCode(...bytes.subarray(i, i + chunkSize));
+  }
+  return btoa(binary);
 }
 
 export function atob_function(source: string): string {
-  return atob(source);
+  // UTF-8 safe base64 decode, the counterpart of btoa_function above.
+  const binary = atob(source);
+  const bytes = Uint8Array.from(binary, (c) => c.charCodeAt(0));
+  return new TextDecoder().decode(bytes);
 }
 
 export function compareOldAndNewRecord(oldRecord: Record<string, any>, newRecord: Record<string, any>): {ok: boolean, changedFields: Record<string, {oldValue: any, newValue: any}>} {

adminforth/spa/src/views/CreateView.vue

@@ -77,7 +77,7 @@ import BreadcrumbsWithButtons from '@/components/BreadcrumbsWithButtons.vue';
 import ResourceForm from '@/components/ResourceForm.vue';
 import SingleSkeletLoader from '@/components/SingleSkeletLoader.vue';
 import { useCoreStore } from '@/stores/core';
-import { callAdminForthApi, getCustomComponent,checkAcessByAllowedActions, initThreeDotsDropdown, checkShowIf, compareOldAndNewRecord, onBeforeRouteLeaveCreateEditViewGuard, leaveGuardActiveClass, formatComponent } from '@/utils';
+import { callAdminForthApi, getCustomComponent,checkAcessByAllowedActions, initThreeDotsDropdown, checkShowIf, compareOldAndNewRecord, onBeforeRouteLeaveCreateEditViewGuard, leaveGuardActiveClass, formatComponent, atob_function } from '@/utils';
 import { IconFloppyDiskSolid } from '@iconify-prerendered/vue-flowbite';
 import { onMounted, onBeforeMount, onBeforeUnmount, ref  } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
@@ -177,14 +177,14 @@ onMounted(async () => {
     if (userUseMultipleEncoding) {
       initialValues.value = { ...initialValues.value, ...JSON.parse(decodeURIComponent((route.query.values as string))) };
     } else {
-      initialValues.value = { ...initialValues.value, ...JSON.parse(atob(route.query.values as string)) };
+      initialValues.value = { ...initialValues.value, ...JSON.parse(atob_function(route.query.values as string)) };
     }
   }
   if (route.query.readonlyColumns) {
     if (userUseMultipleEncoding) {
       readonlyColumns.value = JSON.parse(decodeURIComponent((route.query.readonlyColumns as string)));
     } else {
-      readonlyColumns.value = JSON.parse(atob(route.query.readonlyColumns as string));
+      readonlyColumns.value = JSON.parse(atob_function(route.query.readonlyColumns as string));
     }
   }
   record.value = initialValues.value;