From ec14e61ba48122f0835b5f5515a2fa26589c80d6 Mon Sep 17 00:00:00 2001 From: Matt Blenkinsop Date: Wed, 21 Jan 2026 09:43:39 +0000 Subject: [PATCH] Bug 26355: Add a Vue island for the self renewal modal Signed-off-by: Hannah Dunne-Howrie --- .gitignore | 1 + .../PatronSelfRenewal/PatronSelfRenewal.vue | 171 ++++++++++++++++++ .../PatronSelfRenewal/VerificationChecks.vue | 85 +++++++++ .../prog/js/vue/modules/islands.ts | 13 ++ rspack.config.js | 67 ++++--- 5 files changed, 309 insertions(+), 28 deletions(-) create mode 100644 koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/PatronSelfRenewal.vue create mode 100644 koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/VerificationChecks.vue diff --git a/.gitignore b/.gitignore index 82402ae9cf7..91557f4995a 100644 --- a/.gitignore +++ b/.gitignore @@ -13,6 +13,7 @@ koha-tmpl/opac-tmpl/bootstrap/css/print.css koha-tmpl/opac-tmpl/bootstrap/css/print-rtl.css koha-tmpl/opac-tmpl/bootstrap/css/sco.css koha-tmpl/opac-tmpl/bootstrap/css/sco-rtl.css +koha-tmpl/opac-tmpl/bootstrap/js/vue/dist/ koha-tmpl/intranet-tmpl/prog/css/maps/ koha-tmpl/intranet-tmpl/prog/css/bookings.css diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/PatronSelfRenewal.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/PatronSelfRenewal.vue new file mode 100644 index 00000000000..0dd7a48e5c3 --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/PatronSelfRenewal.vue @@ -0,0 +1,171 @@ + + + + + diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/VerificationChecks.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/VerificationChecks.vue new file mode 100644 index 00000000000..e001a210011 --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Islands/PatronSelfRenewal/VerificationChecks.vue @@ -0,0 +1,85 @@ + + + + + diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/modules/islands.ts b/koha-tmpl/intranet-tmpl/prog/js/vue/modules/islands.ts index b9b15766ab2..fec9da74428 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/modules/islands.ts +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/modules/islands.ts @@ -72,6 +72,19 @@ export const componentRegistry: Map = }, }, ], + [ + "patron-self-renewal", + { + importFn: async () => { + const module = await import( + /* webpackChunkName: "patron-self-renewal" */ + "../components/Islands/PatronSelfRenewal/PatronSelfRenewal.vue" + ); + return module.default; + }, + config: {}, + }, + ], ]); /** diff --git a/rspack.config.js b/rspack.config.js index 62cf6b1956c..c9986d99bca 100644 --- a/rspack.config.js +++ b/rspack.config.js @@ -3,8 +3,13 @@ const { VueLoaderPlugin } = require("vue-loader"); const path = require("path"); const rspack = require("@rspack/core"); -module.exports = [ - { +const islandsExport = application => { + const vueDir = + application === "intranet" + ? "intranet-tmpl/prog" + : "opac-tmpl/bootstrap"; + + return { resolve: { alias: { "@fetch": path.resolve( @@ -15,28 +20,22 @@ module.exports = [ __dirname, "koha-tmpl/intranet-tmpl/prog/js/vue" ), - "@cypress": path.resolve(__dirname, "t/cypress"), }, }, + experiments: { + outputModule: true, + }, entry: { - erm: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts", - preservation: - "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/preservation.ts", - "admin/record_sources": - "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/admin/record_sources.ts", - acquisitions: - "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/acquisitions.ts", islands: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/islands.ts", - sip2: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/sip2.ts", }, output: { - filename: "[name].js", - path: path.resolve( - __dirname, - "koha-tmpl/intranet-tmpl/prog/js/vue/dist/" - ), - chunkFilename: "[name].[contenthash].js", + filename: "[name].esm.js", + path: path.resolve(__dirname, `koha-tmpl/${vueDir}/js/vue/dist/`), + chunkFilename: "[name].[contenthash].esm.js", globalObject: "window", + library: { + type: "module", + }, }, module: { rules: [ @@ -46,7 +45,7 @@ module.exports = [ options: { experimentalInlineMatchResource: true, }, - //exclude: [path.resolve(__dirname, "t/cypress/")], + exclude: [path.resolve(__dirname, "t/cypress/")], }, { test: /\.ts$/, @@ -88,7 +87,10 @@ module.exports = [ "datatables.net-buttons/js/buttons.print": "DataTable", "datatables.net-buttons/js/buttons.colVis": "DataTable", }, - }, + }; +}; + +module.exports = [ { resolve: { alias: { @@ -96,25 +98,32 @@ module.exports = [ __dirname, "koha-tmpl/intranet-tmpl/prog/js/fetch" ), + "@koha-vue": path.resolve( + __dirname, + "koha-tmpl/intranet-tmpl/prog/js/vue" + ), + "@cypress": path.resolve(__dirname, "t/cypress"), }, }, - experiments: { - outputModule: true, - }, entry: { + erm: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts", + preservation: + "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/preservation.ts", + "admin/record_sources": + "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/admin/record_sources.ts", + acquisitions: + "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/acquisitions.ts", islands: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/islands.ts", + sip2: "./koha-tmpl/intranet-tmpl/prog/js/vue/modules/sip2.ts", }, output: { - filename: "[name].esm.js", + filename: "[name].js", path: path.resolve( __dirname, "koha-tmpl/intranet-tmpl/prog/js/vue/dist/" ), - chunkFilename: "[name].[contenthash].esm.js", + chunkFilename: "[name].[contenthash].js", globalObject: "window", - library: { - type: "module", - }, }, module: { rules: [ @@ -124,7 +133,7 @@ module.exports = [ options: { experimentalInlineMatchResource: true, }, - exclude: [path.resolve(__dirname, "t/cypress/")], + //exclude: [path.resolve(__dirname, "t/cypress/")], }, { test: /\.ts$/, @@ -167,6 +176,8 @@ module.exports = [ "datatables.net-buttons/js/buttons.colVis": "DataTable", }, }, + islandsExport("intranet"), + islandsExport("opac"), { entry: { "api-client.cjs": -- 2.39.5