Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2025-11-08 22:45:45 +01:00
Code Issues Packages Projects Releases Activity

added more information to modal body

Browse Source
This commit is contained in:
Florian Scholdei
2019-08-20 17:19:57 +02:00
parent 02c295207c
commit f72f740f17
4 changed files with 125 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
scm-ui/public/locales/de/admin.json
View File

@@ -31,12 +31,14 @@
},
"noPlugins": "Keine Plugins gefunden.",
"modal": {
"title": "Plugin installieren",
"dependency": "Abhängigkeit:",
"dependency_plural": "Abhängigkeiten:",
"title": "{{name}} Plugin installieren",
"restart": "Neustarten um Plugin zu aktivieren",
"install": "Installieren",
"abort": "Abbrechen"
"abort": "Abbrechen",
"author": "Autor",
"version": "Version",
"dependencyNotification": "Mit diesem Plugin werden folgende Abhängigkeiten mit installieren wenn sie noch nicht vorhanden sind.",
"dependencies": "Abhängigkeiten"
}
},
"repositoryRole": {

10
scm-ui/public/locales/en/admin.json
View File

@@ -31,12 +31,14 @@
},
"noPlugins": "No plugins found.",
"modal": {
"title": "Install Plugin",
"dependency": "Dependency:",
"dependency_plural": "Dependencies:",
"title": "Install {{name}} Plugin",
"restart": "Restart to activate",
"install": "Install",
"abort": "Abort"
"abort": "Abort",
"author": "Author",
"version": "Version",
"dependencyNotification": "With this plugin, the following dependencies are installed if they are not available yet.",
"dependencies": "Dependencies"
}
},
"repositoryRole": {

1
scm-ui/src/admin/plugins/components/PluginEntry.js
View File

@@ -19,6 +19,7 @@ type State = {
const styles = {
link: {
cursor: "pointer",
pointerEvents: "all"
}
};

105
scm-ui/src/admin/plugins/components/PluginModal.js
View File

@@ -1,6 +1,8 @@
//@flow
import React from "react";
import { compose } from "redux";
import { translate } from "react-i18next";
import injectSheet from "react-jss";
import type { Plugin } from "@scm-manager/ui-types";
import {
Button,
@@ -9,6 +11,7 @@ import {
Modal,
SubmitButton
} from "@scm-manager/ui-components";
import classNames from "classnames";
type Props = {
plugin: Plugin,
@@ -16,23 +19,58 @@ type Props = {
onClose: () => void,
// context props
classes: any,
t: string => string
};
const styles = {
titleVersion: {
marginLeft: "0.75rem"
},
userLabelAlignment: {
textAlign: "left",
marginRight: 0,
minWidth: "5.5em"
},
userFieldFlex: {
flexGrow: 4
},
listSpacing: {
marginTop: "0 !important"
}
};
class PluginModal extends React.Component<Props> {
renderDependencies() {
const { plugin, t } = this.props;
const { plugin, classes, t } = this.props;
let dependencies = null;
if (plugin.dependencies && plugin.dependencies.length > 0) {
dependencies = (
<>
{t("plugins.modal.dependency", {count: plugin.dependencies.length})}
<ul>
<strong>{t("plugin.modal.dependencyNotification")}</strong>
<div className="field is-horizontal">
<div
className={classNames(
classes.userLabelAlignment,
"field-label is-inline-flex"
)}
>
{t("plugins.modal.dependencies")}:
</div>
<div
className={classNames(
classes.userFieldFlex,
"field-body is-inline-flex"
)}
>
<ul className={classes.listSpacing}>
{plugin.dependencies.map((dependency, index) => {
return <li key={index}>{dependency}</li>;
})}
</ul>
</div>
</div>
</>
);
}
@@ -40,17 +78,67 @@ class PluginModal extends React.Component<Props> {
}
render() {
const { onSubmit, onClose, t } = this.props;
const { plugin, onSubmit, onClose, classes, t } = this.props;
const body = (
<>
<div className="media">
<div className="media-content">
<p>{plugin.description && plugin.description}</p>
</div>
</div>
<div className="media">
<div className="media-content">
<div className="field is-horizontal">
<div
className={classNames(
classes.userLabelAlignment,
"field-label is-inline-flex"
)}
>
{t("plugins.modal.author")}:
</div>
<div
className={classNames(
classes.userFieldFlex,
"field-body is-inline-flex"
)}
>
{plugin.author}
</div>
</div>
<div className="field is-horizontal">
<div
className={classNames(
classes.userLabelAlignment,
"field-label is-inline-flex"
)}
>
{t("plugins.modal.version")}:
</div>
<div
className={classNames(
classes.userFieldFlex,
"field-body is-inline-flex"
)}
>
{plugin.version}
</div>
</div>
{this.renderDependencies()}
</div>
</div>
<div className="media">
<div className="media-content">
<Checkbox
checked={false}
label={t("plugins.modal.restart")}
onChange={null}
disabled={null}
/>
</div>
</div>
</>
);
@@ -65,7 +153,9 @@ class PluginModal extends React.Component<Props> {
return (
<Modal
title={t("plugins.modal.title")}
title={t("plugins.modal.title", {
name: plugin.displayName ? plugin.displayName : ""
})}
closeFunction={() => onClose()}
body={body}
footer={footer}
@@ -75,4 +165,7 @@ class PluginModal extends React.Component<Props> {
}
}
export default translate("admin")(PluginModal);
export default compose(
injectSheet(styles),
translate("admin")
)(PluginModal);