Fix: Remove the access to go back in program detail page - MEED-9582 - Meeds-io/meeds#3419 (#1958)

Before this change, from a program detail page, it was possible to go back to the list using a button (arrow-left + program name are clickable), Program detail page can be accessed using the drawer and it is no more use to go back to the programs list, URL changes but it doesn't work. To fix this problem, remove the arrow-left button and change replaceState to pushState for browser history. After this change, the arrow-left and the click to the program name are deleted and the user can close the drawer or go back using the browser options.

Author: akhanfir

portlets/src/main/webapp/vue-app/commons/components/program/Programs.vue

@@ -66,9 +66,9 @@ export default {
   watch: {
     displayProgramDetail() {
       if (this.displayProgramDetail && this.program?.id) {
-        window.history.replaceState('programs', this.$t('engagementCenter.label.programs'), `${this.programsLinkBasePath}/${this.program.id}`);
+        window.history.pushState('programs', this.$t('engagementCenter.label.programs'), `${this.programsLinkBasePath}/${this.program.id}`);
       } else {
-        window.history.replaceState('programs', this.$t('engagementCenter.label.programs'), `${this.programsLinkBasePath}`);
+        window.history.pushState('programs', this.$t('engagementCenter.label.programs'), `${this.programsLinkBasePath}`);
       }
     },
   },

portlets/src/main/webapp/vue-app/commons/components/program/detail/ProgramDetail.vue

@@ -18,23 +18,11 @@ Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
   <div id="engagementCenterProgramDetail" class="px-4">
     <div v-if="!isDeleted">
       <div class="py-2 py-sm-5 d-flex align-center">
-        <v-tooltip :disabled="$root.isMobile" bottom>
-          <template #activator="{ on }">
-            <v-card
-              class="d-flex align-center"
-              flat
-              v-on="on"
-              @click="backToProgramList">
-              <v-btn
-                class="width-auto ms-n3"
-                icon>
-                <v-icon size="18" class="icon-default-color mx-2">fa-arrow-left</v-icon>
-              </v-btn>
-              <div class="text-header-title"> {{ programTitle }}</div>
-            </v-card>
-          </template>
-          <span>{{ $t('programs.details.label.BackToList') }}</span>
-        </v-tooltip>
+        <v-card
+          class="d-flex align-center"
+          flat>
+          <div class="text-header-title"> {{ programTitle }}</div>
+        </v-card>
         <v-spacer />
         <span class="text-header-title d-none d-sm-block" v-sanitized-html="$t('programs.budget', $t(programBudgetLabel))"></span>
       </div>