@SimoneThisDot Please be aware of T305517: Consider migrating from Vuex 4 to Pinia!

Moving to tracking because this ticket will need to be completed by the design systems team, not the structured data team, as per @SimoneThisDot.

define which version of pinia to use (last reviewed was 2.0.16)

I think we can safely use the latest version (2.0.29), there appear to have been only minor changes, and no meaningful changes to dependencies.

Add the lib to core

For this I would recommend adding the library to foreign-resources.yaml and adding a ResourceLoader module for it in Resources.php. As I noted in T305517, Pinia has a dependency on vue-demi (which we don't provide), and one of its builds also has a dependency on @vue/devtools-api. Thankfully, the iife build inlines @vue/devtools-api, and we can provide Vue 3 itself in vue-demi's place. I think the easiest way to get Pinia to work in MediaWiki would be to use the pinia.iife.prod.js build, but prepend var vueDemi = require( 'vue' ); and append module.exports = Pinia;. This is almost exactly the same as what we do for Vuex. See here for how we handle this prepend+append stuff for Vuex (and also for how we use the .prod.js file in production mode and the non-prod one in debug mode; we'd want to do the same for Pinia).

(TBD) - Add pinia to the current Vue initialization or add a way to choose pinia over vuex or both when initializing the vue instance

I don't think we have to do anything explicit here, other than maybe adding documentation. Right now Vuex doesn't come with Vue by default in MediaWiki, you have to add it as a separate dependency and add it to your app. Pinia would work the same:

// How Vuex currently works:
const Vue = require( 'vue' );
const Vuex = require( 'vuex' );
const App = require( './App.vue' );
const store = new Vuex.Store( ... );

Vue.createMwApp( App )
    .use( store )
    .mount( '#foo' );

// How Pinia would work:
const Vue = require( 'vue' );
const { createPinia } = require( 'pinia' );
const App = require( './App.vue' );

const pinia = createPinia();
Vue.createMwApp( App )
    .use( pinia )
    .mount( '#foo' );

I have added the package in core and tested it locally.

I have used the last approved version 2.0.16, but happy to use the latest one ( I do not know the internal process after a version is approved. Not sure if I can get the latest or have to use the actual version).

Change 909646 had a related patch set uploaded (by Simone Cuomo; author: Simone Cuomo):

[mediawiki/core@master] Add Pinia to MediaWiki core

https://gerrit.wikimedia.org/r/909646

Change 909646 merged by jenkins-bot:

[mediawiki/core@master] Add Pinia to MediaWiki core

https://gerrit.wikimedia.org/r/909646

There have been 20 Pinia releases (patch changes) since it was added to core. Do we have a plan to keep our version updated? eg: update it on minor changes or once a month.