Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add more info on deployed version like commit sha date etc #7934

Closed
2 tasks
MV88 opened this issue Mar 9, 2022 · 20 comments
Closed
2 tasks

Add more info on deployed version like commit sha date etc #7934

MV88 opened this issue Mar 9, 2022 · 20 comments

Comments

@MV88
Copy link
Contributor

MV88 commented Mar 9, 2022

Description

In a different project I've implemented a specific page called version that shows the following
image

I would like to include this info also in mapstore and i wan to open the discussion about it
Proposal and ideas are welcome:

  • one way is to create a dedicated page accessible via a specific url
  • another way is to integrate these info in the Settings plugin, maybe with a collapsible panel

Acceptance criteria

  • add previous information in mapstore
  • TDB how to add them

Other useful information

@MV88 MV88 added question New Feature used for new functionalities labels Mar 9, 2022
@tdipisa tdipisa assigned MV88 and unassigned offtherailz, MV88 and allyoucanmap Mar 9, 2022
@MV88
Copy link
Contributor Author

MV88 commented Mar 9, 2022

@offtherailz @allyoucanmap @tdipisa let's discuss on how you would like do this

i don't have preferences, it can even be a flag button in the footer with a popover

@allyoucanmap
Copy link
Contributor

@offtherailz @allyoucanmap @tdipisa let's discuss on how you would like do this

i don't have preferences, it can even be a flag button in the footer with a popover

@MV88 These seems more information for debugging purposes so I would prefer a separate html compiled during build phase instead of a react component, maybe using html replacement plugin in webpack..

@MV88
Copy link
Contributor Author

MV88 commented Mar 9, 2022

@allyoucanmap it's just about to know which commit is effectively deployed

I'm ok also on your proposal,
anyway projects that wants this have to update their config settings or add new html files

@allyoucanmap
Copy link
Contributor

anyway projects that wants this have to update their config settings or add new html files

I think we could create the html file on the fly with a node script to avoid to update project

@MV88
Copy link
Contributor Author

MV88 commented Mar 9, 2022

@allyoucanmap
so everything I have done here can be in a script?

anyway I'm open to any proposal

@allyoucanmap
Copy link
Contributor

so everything I have done here can be in a script?

yes, it seems so anyway my it's only a proposal based on the description

@MV88
Copy link
Contributor Author

MV88 commented Mar 9, 2022

probably the script is the best option because is more portable

@allyoucanmap
Copy link
Contributor

I did not test it but I mean something like this

const path = require('path');
const fs = require('fs-extra');
const { GitRevisionPlugin } = require('git-revision-webpack-plugin');

const gitRevPlugin = new GitRevisionPlugin({
    branchCommand: 'log -n1 --format=format:"Message: %s%nCommit: %H%nDate: %aD%nAuthor: %an"'
});

const versionHtmlFileDestination = path.join('path', 'to', 'dist', 'version.html');

const __COMMITHASH__ = gitRevPlugin.commithash();
const __COMMIT_DATA__ = gitRevPlugin.branch()
    .replace("Message:", "<strong>Message:</strong>")
    .replace("Author:", "<br/><strong>Author:</strong>")
    .replace("Date:", "<br/><strong>Date:</strong>")
    .replace("Commit:", "<br/><strong>Commit:</strong>");
const htmlContent = `
<html>
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <style>

        </style>
    </head>
    <body>
        <ul class="version">
            <li>
                <span class="value-git commit-data">
                    ${__COMMIT_DATA__}
                </span>
            </li>
            <li>
                <span class="label-git">
                    GITHUB:
                </span>
                <span class="value-git link-github">
                    <a href="https://github.com/geosolutions-it/webmapper-halliburton/tree/${__COMMITHASH__}" target="_blank" >Open github tree in a new tab </a>
                </span>
            </li>
        </ul>
</body>
</html>
`;

fs.writeFileSync(versionHtmlFileDestination, htmlContent);

@tdipisa
Copy link
Member

tdipisa commented May 25, 2022

I would like to have a kind of Version plugin in options that may opens a modal window with relevantinfo or improve what we currently already have in Settings. In the first option we should clean up the Settings part.

@MV88
Copy link
Contributor Author

MV88 commented May 25, 2022

@tdipisa
I think we should clarify a bit the technical part for this issue
For example where to fetch these data?
In my previous post there is an implementation that includes changes to the core webpack configuration and this can be avoided if we go in the script direction + load data from a file

@offtherailz
suggested to have a script that would generate a json file that will be fetched to then show these info in this new Version plugin

I can suggest that these info can be shown in the footer in a panel (no modal) opened by a click on a button similarly on what we do for CRS selector plugin

@MV88
Copy link
Contributor Author

MV88 commented Jun 14, 2022

@barema4

As agreed with Tobia I would like to do as follows:

  • extend webpack configuration in order to include commit sha as global variable
    • both for dev and prod
    • also for standard template
  • show this value in a new dedicated Version plugin to be visible in all main pages of mapstore
    • in normal viewer below sidebar after the login plugin
    • in homepage as non logged user in a burger menu
    • in home page as logged user in manager menu (burger menu of admins)
    • in dashboard in burger menu
    • in geostories in burger menu
  • this plugin will show a modal when clicked with relevant information as the following ones
    image
  • for the button you can use the "button info" in following comment

you can take some inspiration from here

@MV88
Copy link
Contributor Author

MV88 commented Jun 14, 2022

if you can't access the link these are the needed chagges for the first point

package.json

"git-revision-webpack-plugin": "5.0.0",

webpack-config.json or buildConfig

const { GitRevisionPlugin } = require('git-revision-webpack-plugin');
const DefinePlugin = require("webpack/lib/DefinePlugin");
const gitRevPlugin = new GitRevisionPlugin({
    branchCommand: 'log -n1 --format=format:"Message: %s%nCommit: %H%nDate: %aD%nAuthor: %an"'
});

[
            extractThemesPlugin,
            ModuleFederationPlugin,
            new DefinePlugin({
                __COMMITHASH__: JSON.stringify(gitRevPlugin.commithash()),
                __COMMIT_DATA__: JSON.stringify(gitRevPlugin.branch())
            })
        ],

example of usage

<span className="value-git commit-data" dangerouslySetInnerHTML={{ __html: __COMMIT_DATA__
                    .replace("Message:", "<strong>Message:</strong>")
                    .replace("Author:", "<br/><strong>Author:</strong>")
                    .replace("Date:", "<br/><strong>Date:</strong>")
                    .replace("Commit:", "<br/><strong>Commit:</strong>")
                }}>

button info

const githubUrl = "https://github.com/geosolutions-it/MapStore/tree/" + __COMMITHASH__;
<a href={githubUrl} target="_blank" ><Button> Open github tree in a new tab </Button></a>


@tdipisa
Copy link
Member

tdipisa commented Aug 1, 2022

@barema4 after a review of the current implementation it would be better if we leverage on the About for what is requested in this issue and we remove the version plugin completely from MS. Below is what we can do in my opinion:

2022_08_01_18_14_01_Window

Then, the About plugin should be also added to the Burger Menu of both dashboards and geostories

@MV88 @allyoucanmap let me know your thoughts

@MV88
Copy link
Contributor Author

MV88 commented Aug 2, 2022

@tdipisa sounds good to me as we agreed in our internal call

@barema4
Copy link
Contributor

barema4 commented Aug 2, 2022

Alright, @tdipisa @MV88. thanks for the feedback. Let me make the necessary changes as highlighted above.

@tdipisa tdipisa assigned MV88 and unassigned barema4 Aug 8, 2022
MV88 added a commit to MV88/MapStore2 that referenced this issue Aug 22, 2022
MV88 added a commit to MV88/MapStore2 that referenced this issue Aug 24, 2022
MV88 added a commit that referenced this issue Aug 26, 2022
* #7934 refactor to version plugin, moving it to About plugin
* update migration guideline
MV88 added a commit to MV88/MapStore2 that referenced this issue Aug 26, 2022
…lugin (geosolutions-it#8504)

* geosolutions-it#7934 refactor to version plugin, moving it to About plugin
* update migration guideline

# Conflicts:
#	web/client/hooks/useModulePlugins.js
#	web/client/plugins/Version.jsx
#	web/client/product/plugins.js
MV88 added a commit that referenced this issue Aug 26, 2022
…8510)

* #7934 refactor to version plugin, moving it to About plugin
* update migration guideline

# Conflicts:
#	web/client/hooks/useModulePlugins.js
#	web/client/plugins/Version.jsx
#	web/client/product/plugins.js
@offtherailz offtherailz added this to the v2022.02.00 milestone Sep 28, 2022
MV88 added a commit to MV88/MapStore2 that referenced this issue Oct 18, 2022
MV88 added a commit to MV88/MapStore2 that referenced this issue Oct 20, 2022
MV88 added a commit that referenced this issue Oct 20, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

6 participants