Upgrade data-dspace-angular to DSpace 9

[devangm]

• Cleanly pull upstream dspace-9.0 release into a feature branch
• Resolve merge conflicts
• Upgrade theme customizations for features below
• Determine app changes diverging from upstream and ensure the corresponding issues are still resolved
• Perform QA on the features below

For each issue below, gather all file changes in related PRs. There may be issues below that can be grouped by feature.

• TAMULib/data-dspace-angular#6, FEATURE, [Data@TAMU] Browse By help text improvements
• TAMULib/dspace-angular#133, FEATURE, [Data@TAMU] Add hover state styling to default thumbnail SVG
• TAMULib/dspace-angular#109, FEATURE, [Data@TAMU] In dspace-angular, ensure that dc.title shows normally in simple and in ...
• TAMULib/dspace-angular#106, FEATURE, [Data@TAMU] Have links to the Datasets on the simple-item-view of the Research Proje...
• TAMULib/dspace-angular#105, FEATURE, [Data@TAMU] Display Department (dc.contributor.department) on Research Project simpl...
• TAMULib/dspace-angular#104, FEATURE, [Data@TAMU] On simple-item-view of Research Project, make dc.creator.pi linkable
• TAMULib/dspace-angular#102, FEATURE, [Data@TAMU] Collapse Abstract (dc.description.abstract) on simple-item-view.
• TAMULib/dspace-angular#101, FEATURE, [Data@TAMU] Display associated publications in simple-item-view of Dataset and Resea...
• TAMULib/dspace-angular#100, FEATURE, [Data@TAMU] On simple-item-view of PDAC, dc.title is not displaying normally
• TAMULib/dspace-angular#99, FEATURE, [Data@TAMU] Use person glyphicon (or other standard free icon) for PDAC entity
• TAMULib/dspace-angular#108, FEATURE, [Data@TAMU] Change "Abstract" to "Abstract or Project Summary"
• TAMULib/dspace-angular#94, FEATURE, [Data@TAMU] Researcher profile link should open in new tab (currently it navigates a...
• TAMULib/dspace-angular#93, FEATURE, [Data@TAMU] Add "Research Project" badge and translation in UI
• TAMULib/dspace-angular#90, FEATURE, [Data@TAMU] Display PI and Co-PIs on Simple Item page
• TAMULib/dspace-angular#86, FEATURE, [Data@TAMU] Customize Title display on Dataset entities

These changes could exist in app code changes, app i18n changes, custom themes, or configuration. See tl_docker for configuration. The app code changes should be reviewed for removal pending resolution upstream. Custom themes will require refactoring to conform to the latest Angular and dspace-angular code.

[tamu-sad-iii]

Here are the custom theme files for the above issues. There are also unchanged custom and dspace themes left out for brevity.

├───rdc
│   │   eager-theme.module.ts
│   │
│   ├───app
│   │   ├───core
│   │   │   └───breadcrumbs
│   │   │           rdc-dso-name.service.ts
│   │   │
│   │   ├───item-page
│   │   │   └───simple
│   │   │       ├───field-components
│   │   │       │   └───specific-field
│   │   │       │       └───abstract
│   │   │       │               rdc-item-page-abstract-field.component.ts
│   │   │       │
│   │   │       └───item-types
│   │   │           └───untyped-item
│   │   │                   untyped-item.component.html
│   │   │                   untyped-item.component.scss
│   │   │                   untyped-item.component.ts
│   │   │
│   │   └───shared
│   │       └───comcol-page-browse-by
│   │               comcol-page-browse-by.component.ts
│   │
│   ├───assets
│   │   └───i18n
│   │           en.json5
│   │
│   └───styles
│           theme.scss
│           _theme_css_variable_overrides.scss
│           _thumnail_overrides.scss
│
└───tamu
    │   eager-theme.module.ts
    │   lazy-theme.module.ts
    │
    ├───app
    │   ├───header
    │   │       header.component.html
    │   │       header.component.scss
    │   │       header.component.ts
    │   │
    │   ├───header-nav-wrapper
    │   │       header-navbar-wrapper.component.html
    │   │       header-navbar-wrapper.component.scss
    │   │       header-navbar-wrapper.component.ts
    │   │
    │   ├───home-page
    │   │   └───home-news
    │   │           home-news.component.html
    │   │           home-news.component.scss
    │   │           home-news.component.ts
    │   │
    │   ├───login-page
    │   │       login-page.component.html
    │   │       login-page.component.scss
    │   │       login-page.component.ts
    │   │
    │   ├───logout-page
    │   │       logout-page.component.html
    │   │       logout-page.component.ts
    │   │
    │   └───navbar
    │           navbar.component.html
    │           navbar.component.scss
    │           navbar.component.ts
    │
    ├───assets
    │   ├───fonts
    │   │       .gitkeep
    │   │
    │   ├───i18n
    │   │       en.json5
    │   │
    │   └───images
    │       │   .gitkeep
    │       │   TAM-Logo.svg
    │       │
    │       └───favicons
    │               android-chrome-192x192.png
    │               android-chrome-512x512.png
    │               apple-touch-icon.png
    │               favicon.ico
    │               favicon.svg
    │               manifest.webmanifest
    │
    └───styles
            theme.scss
            _global-styles.scss
            _theme_css_variable_overrides.scss
            _theme_sass_variable_overrides.scss

[tamu-sad-iii]

The tamu theme customizations are intended to be synchronized and can only be done manually at this time.

We will be upgrading the tamu and rdc themes. The tamu theme upgrades will be the same for the upstream OAKTrust tamu theme.

Here is an initial process to follow for upgrading customizations:

• 1. Pull in upstream changes from target version.
• 2. Open custom theme file.
• 3. Find original file excluding components and services not available upstream.
• 4. Copy and paste file upstream file over customized file.
• 5. Carefully inspect this diff, the diff of the changes of the current version, the PRs, and the issues.
• 6. Port customizations following the latest standards.

Repeat 2 through 6 until all customized theme files in tamu and rdc are upgraded. The upgrade changes so far are to include additional decorator parameters that change components into standalone components with declarative imports. The original files from the components can be from the other themes dspace default or custom examples. They can also be completely original or a copy of a component from the app. The components must be careful which template and style files they use, as they can use custom theme files or app files. The original template HTML and SCSS files are from the app or dspace theme, not the custom theme. Consider adding TAMU customization comments similar to the backend. This will require some other conventions due to file formats and changes required.

[tamu-sad-iii]

The eager and lazy modules per theme are required to be upgraded. They are to remove module imports and service declarations. The modules are to be imported per component in the Component decorator as imports.

The custom service in the rdc theme no longer can be declared in these modules and will require a new custom module to import into the appropriate standalone components.

[tamu-sad-iii]

The style customizations have to be upgraded as well. This is for each theme that overrides any of the following files.

Original default dspace theme.

└───styles
        theme.scss
        _global-styles.scss
        _theme_css_variable_overrides.scss
        _theme_sass_variable_overrides.scss

Copy and paste dspace theme and customized as tamu theme.

└───styles
        theme.scss
        _global-styles.scss
        _theme_css_variable_overrides.scss
        _theme_sass_variable_overrides.scss

Customized rdc theme extending tamu theme.

└───styles
        theme.scss
        _theme_css_variable_overrides.scss
        _thumnail_overrides.scss

Following rdc theme configuration.

themes:
  - name: rdc
    extends: tamu
  - name: tamu
    headTags:
    - tagName: link
      attributes:
        rel: icon
        href: assets/tamu/images/favicons/favicon.ico
        sizes: any
    - tagName: link
      attributes:
        rel: icon
        href: assets/tamu/images/favicons/favicon.svg
        type: image/svg+xml
    - tagName: link
      attributes:
        rel: apple-touch-icon
        href: assets/tamu/images/favicons/apple-touch-icon.png
    - tagName: link
      attributes:
        rel: manifest
        href: assets/tamu/images/favicons/manifest.webmanifest

This leaves the dspace theme unmodified, allowing for direct comparison to provide an initial process for upgrade.

1. Current version of dspace theme files with tamu modified theme files. *opted for skipping this until necessary
2. Target version of dspace theme files with tamu modified theme files.

Performing these two comparisons is straightforward and should provide a starting point. This is important to determine what changes have to be upgraded. The changes could be annotated in comments with their feature name, and the issues/PRs could be standardized to include the feature name. Until we have established a standard and it becomes consistent, we have to continue to watch for patches to customizations along with patches to upstream bugs.

[tamu-sad-iii]

The i18n customizations can be updated as well. This is for each theme that overrides any of the following files.

Original default dspace i18n are in the root of the project and not currently under the dspace theme.

│
└───i18n
        ar.json5
        bn.json5
        ca.json5
        cs.json5
        de.json5
        el.json5
        en.json5
        es.json5
        fi.json5
        fr.json5
        gd.json5
        hi.json5
        hu.json5
        it.json5
        ja.json5
        kk.json5
        lv.json5
        nl.json5
        pl.json5
        pt-BR.json5
        pt-PT.json5
        sr-cyr.json5
        sr-lat.json5
        sv.json5
        sw.json5
        tr.json5
        uk.json5
        vi.json5

We have only modified en.json.

tamu theme i18n translations.

└───i18n
        en.json5

rdc theme i18n translations.

└───i18n
        en.json5

These are all aggregated together into src/assets/i18n files using script/sync-i18n-files.

npm run merge-i18n -s src/themes/rdc/assets/i18n
npm run merge-i18n -s src/themes/tamu/assets/i18n