feat: Add simple storage portlet - MEED-8221 - Meeds-io/MIPs#176

crowdin.yml

@@ -575,4 +575,21 @@ files: [
     "escape_special_characters": 0,
     "escape_quotes": 0,
   },
+  {
+    "source": "/webapp/src/main/resources/locale/portlet/SimpleStorage_en.properties",
+    "translation": "%original_path%/%file_name%!_%locale_with_underscore%.%file_extension%",
+    "translation_replace": {
+      "_en!": "","ar_SA": "ar","ar_OM": "aro","az_AZ": "az","ca_ES": "ca","ceb_PH": "ceb",
+      "co_FR": "co","cs_CZ": "cs","de_DE": "de","el_GR": "el","en_US": "en","es_ES": "es_ES","eu_ES": "eu","fa_IR": "fa",
+      "fi_FI": "fi","fil_PH": "fil","fr_FR": "fr","hi_IN": "hi","hu_HU": "hu","id_ID": "id","it_IT": "it","ja_JP": "ja",
+      "kab_KAB": "kab","ko_KR": "ko","lt_LT": "lt","ms_MY": "ms","nl_NL": "nl","no_NO": "no","pcm_NG": "pcm","pl_PL": "pl",
+      "pt_BR": "pt_BR","pt_PT": "pt_PT","ro_RO": "ro","ru_RU": "ru","sk_SK": "sk","sl_SI": "sl","sq_AL": "sq",
+      "sv_SE": "sv_SE","th_TH": "th","tl_PH": "tl","tr_TR": "tr","uk_UA": "uk","ur_IN": "ur_IN","vi_VN": "vi",
+      "zh_CN": "zh_CN","zh_TW": "zh_TW",
+    },
+    "dest": "hub/social/webapp/SimpleStorage.properties",
+    "update_option": "update_as_unapproved",
+    "escape_special_characters": 0,
+    "escape_quotes": 0,
+  }
 ]

webapp/src/main/resources/locale/portlet/SimpleStorage_en.properties

@@ -0,0 +1,9 @@
+simpleStorage.title.label=Simple storage
+simpleStorage.addImage.label=Add
+simpleStorage.filter.placeholder=Filter by name
+simpleStorage.name.label=Name
+simpleStorage.creationDate.label=Creation Date
+simpleStorage.size.label=Size
+simpleStorage.actions.label=Actions
+simpleStorage.delete.label=Delete
+simpleStorage.copyLink.label=Copy link

webapp/src/main/resources/locale/portlet/SimpleStorage_fr.properties

@@ -0,0 +1,9 @@
+simpleStorage.title.label=Stockage simple
+simpleStorage.addImage.label=Ajouter
+simpleStorage.filter.placeholder=Filtrer par nom
+simpleStorage.name.label=Nom
+simpleStorage.creationDate.label=Date de cr\u00E9ation
+simpleStorage.size.label=Taille
+simpleStorage.actions.label=Actions
+simpleStorage.delete.label=Supprimer
+simpleStorage.copyLink.label=Copier le lien

webapp/src/main/webapp/WEB-INF/gatein-resources.xml

@@ -2061,6 +2061,34 @@
     </module>
   </portlet>
 
+  <portlet>
+    <name>SimpleStorage</name>
+    <module>
+      <script>
+        <minify>false</minify>
+        <path>/js/simpleStorage.bundle.js</path>
+      </script>
+      <depends>
+        <module>vue</module>
+      </depends>
+      <depends>
+        <module>vuetify</module>
+      </depends>
+      <depends>
+        <module>commonVueComponents</module>
+      </depends>
+      <depends>
+        <module>applicationToolbarComponent</module>
+      </depends>
+      <depends>
+        <module>eXoVueI18n</module>
+      </depends>
+      <depends>
+        <module>extensionRegistry</module>
+      </depends>
+    </module>
+  </portlet>
+
   <module>
     <name>siteDetailsComponent</name>
     <load-group>vueGRP</load-group>

webapp/src/main/webapp/WEB-INF/portlet.xml

@@ -1115,4 +1115,25 @@
     </portlet-info>
   </portlet>
 
+  <portlet>
+    <portlet-name>SimpleStorage</portlet-name>
+    <display-name>Simple storage portlet</display-name>
+    <portlet-class>org.exoplatform.commons.api.portlet.GenericDispatchedViewPortlet</portlet-class>
+    <init-param>
+      <name>portlet-view-dispatched-file-path</name>
+      <value>/html/simpleStorage.html</value>
+    </init-param>
+    <expiration-cache>-1</expiration-cache>
+    <cache-scope>PUBLIC</cache-scope>
+    <supports>
+      <mime-type>text/html</mime-type>
+    </supports>
+    <supported-locale>en</supported-locale>
+    <resource-bundle>locale.portlet.Portlets</resource-bundle>
+    <portlet-info>
+      <title>Simple storage</title>
+      <keywords>Simple storage</keywords>
+    </portlet-info>
+  </portlet>
+
 </portlet-app>

webapp/src/main/webapp/html/simpleStorage.html

@@ -0,0 +1,7 @@
+<div class="VuetifyApp">
+    <div id="simpleStorage">
+        <script type="text/javascript">
+            require(['PORTLET/social/SimpleStorage'], app => app.init());
+        </script>
+    </div>
+</div>

webapp/src/main/webapp/vue-apps/simple-storage/components/SimpleStorageApp.vue

@@ -0,0 +1,39 @@
+<!--
+ * This file is part of the Meeds project (https://meeds.io/).
+ *
+ * Copyright (C) 2025 Meeds Association [email protected]
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+-->
+
+<template>
+  <v-app>
+    <v-card
+      class="application-body position-static pb-5"
+      flat>
+      <h4 class="text-title px-5 pt-5 ma-0">
+        {{ $t('simpleStorage.title.label') }}
+      </h4>
+      <simple-storage-toolbar
+        class="mb-3" />
+      <simple-storage-image-list />
+    </v-card>
+  </v-app>
+</template>
+
+<script>
+export default {
+};
+</script>

webapp/src/main/webapp/vue-apps/simple-storage/components/view/SimpleStorageImageList.vue

@@ -0,0 +1,51 @@
+<!--
+ * This file is part of the Meeds project (https://meeds.io/).
+ *
+ * Copyright (C) 2025 Meeds Association [email protected]
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+-->
+
+<template>
+  <v-data-table
+    :headers="headers"
+    :items="items"
+    item-key="name"
+    class="px-5"
+    hide-default-footer
+    dense>
+    <!-- eslint-disable-next-line vue/valid-v-slot -->
+    <template #item.actions="{ item }">
+      {{ item }}
+      //
+    </template>
+  </v-data-table>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      headers: [
+        {text: this.$t('simpleStorage.name.label'), value: 'name'},
+        {text: this.$t('simpleStorage.creationDate.label'), value: 'creationDate'},
+        {text: this.$t('simpleStorage.size.label'), value: 'size'},
+        {text: this.$t('simpleStorage.actions.label'), value: 'actions', sortable: false},
+      ],
+      items: []
+    };
+  }
+};
+</script>

webapp/src/main/webapp/vue-apps/simple-storage/components/view/SimpleStorageToolbar.vue

@@ -0,0 +1,50 @@
+<!--
+ * This file is part of the Meeds project (https://meeds.io/).
+ *
+ * Copyright (C) 2025 Meeds Association contact@meeds.io
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+-->
+<template>
+  <application-toolbar
+    :right-text-filter="{
+      minCharacters: 1,
+      placeholder: $t('simpleStorage.filter.placeholder'),
+      tooltip: $t('simpleStorage.filter.placeholder'),
+    }"
+    class="px-1"
+    @filter-text-input="$emit('filter-changed', $event)"
+    @filter-text-input-end-typing="$emit('filter-changed-end-typing', $event)">
+    <template #left>
+      <v-btn
+        id="applicationToolbarLeftButton"
+        :aria-label="$t('simpleStorage.addImage.label')"
+        class="btn btn-primary text-truncate">
+        <v-icon
+          size="18">
+          fa-plus
+        </v-icon>
+        <span class="text-truncate text-none hidden-xs-only ms-2">
+          {{ $t('simpleStorage.addImage.label') }}
+        </span>
+      </v-btn>
+    </template>
+  </application-toolbar>
+</template>
+
+<script>
+export default {
+};
+</script>

webapp/src/main/webapp/vue-apps/simple-storage/initComponents.js

@@ -0,0 +1,33 @@
+/*
+ * This file is part of the Meeds project (https://meeds.io/).
+ *
+ * Copyright (C) 2025 Meeds Association [email protected]
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+*/
+
+import SimpleStorageApp from './components/SimpleStorageApp.vue';
+import SimpleStorageToolbar from './components/view/SimpleStorageToolbar.vue';
+import SimpleStorageImageList from './components/view/SimpleStorageImageList.vue';
+
+const components = {
+  'simple-storage-app': SimpleStorageApp,
+  'simple-storage-toolbar': SimpleStorageToolbar,
+  'simple-storage-image-list': SimpleStorageImageList
+};
+
+for (const key in components) {
+  Vue.component(key, components[key]);
+}

webapp/src/main/webapp/vue-apps/simple-storage/main.js

@@ -0,0 +1,50 @@
+/*
+* This file is part of the Meeds project (https://meeds.io/).
+*
+* Copyright (C) 2025 Meeds Association [email protected]
+*
+* This program is free software; you can redistribute it and/or
+* modify it under the terms of the GNU Lesser General Public
+* License as published by the Free Software Foundation; either
+* version 3 of the License, or (at your option) any later version.
+*
+* This program is distributed in the hope that it will be useful,
+* but WITHOUT ANY WARRANTY; without even the implied warranty of
+* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+* Lesser General Public License for more details.
+*
+* You should have received a copy of the GNU Lesser General Public License
+* along with this program; if not, write to the Free Software Foundation,
+* Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+*/
+
+
+import './initComponents.js';
+
+// get overridden components if exists
+if (extensionRegistry) {
+  const components = extensionRegistry.loadComponents('simpleStorage');
+  if (components && components.length > 0) {
+    components.forEach(cmp => {
+      Vue.component(cmp.componentName, cmp.componentOptions);
+    });
+  }
+}
+
+const lang = eXo && eXo.env.portal.language || 'en';
+const url = `/social/i18n/locale.portlet.SimpleStorage?lang=${lang}`;
+const vuetify = Vue.prototype.vuetifyOptions;
+const appId = 'simpleStorage';
+
+export function init(languages) {
+  exoi18n.loadLanguageAsync(lang, url).then(i18n => {
+    Vue.createApp({
+      data: {
+        languages: languages,
+      },
+      template: '<simple-storage-app />',
+      vuetify,
+      i18n
+    }, `#${appId}`, 'Simple storage');
+  });
+}

webapp/webpack.common.js

@@ -95,7 +95,8 @@ let config = {
     breadcrumb: './src/main/webapp/vue-apps/breadcrumb/main.js',
     complementaryFilter: './src/main/webapp/vue-apps/complementary-filter/main.js',
     organizationalChart: './src/main/webapp/vue-apps/organizational-chart/main.js',
-    organizationalChartExtension: './src/main/webapp/vue-apps/organizational-chart/extensions/main.js'
+    organizationalChartExtension: './src/main/webapp/vue-apps/organizational-chart/extensions/main.js',
+    simpleStorage: './src/main/webapp/vue-apps/simple-storage/main.js'
   },
   module: {
     rules: [