scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-09-08 14:15:35 +08:00
Code Issues Projects Releases Packages Wiki Activity

Update main application, slight refactor

Browse source
This commit is contained in:
Luka Murn 2017-09-27 17:59:04 +02:00
parent a46f50af21
commit f6c7e854ad
3 changed files with 40 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
app/javascript/src/components/Alert/index.jsx
View file

@ -3,7 +3,7 @@ import PropTypes from "prop-types";
class Alert extends Component { class Alert extends Component {
static alertClass (type) { static alertClass(type) {
const classes = { const classes = {
error: "alert-danger", error: "alert-danger",
alert: "alert-warning", alert: "alert-warning",
@ -13,7 +13,7 @@ class Alert extends Component {
return classes[type] || classes.success; return classes[type] || classes.success;
} }
static glyphiconClass (type) { static glyphiconClass(type) {
const classes = { const classes = {
error: "glyphicon-exclamation-sign", error: "glyphicon-exclamation-sign",
alert: "glyphicon-exclamation-sign", alert: "glyphicon-exclamation-sign",
@ -38,13 +38,13 @@ class Alert extends Component {
const message = this.props.message; const message = this.props.message;
const alertClassName = const alertClassName =
`alert `alert
${this.alertClass(message.type)} ${Alert.alertClass(message.type)}
alert-dismissable alert-dismissable
alert-floating alert-floating
fade in`; fade in`;
const glyphiconClassName = const glyphiconClassName =
`glyphicon `glyphicon
${this.glyphiconClass(message.type)}`; ${Alert.glyphiconClass(message.type)}`;
return( return(
<div className={alertClassName}> <div className={alertClassName}>
@ -58,7 +58,7 @@ class Alert extends Component {
<span aria-hidden="true">×</span> <span aria-hidden="true">×</span>
</button> </button>
<span className={glyphiconClassName} /> <span className={glyphiconClassName} />
<span>{message.text}</span> <span>&nbsp;{message.text}</span>
</div> </div>
</div> </div>
); );
@ -69,7 +69,6 @@ Alert.propTypes = {
onClose: PropTypes.func, onClose: PropTypes.func,
timeout: PropTypes.number, timeout: PropTypes.number,
message: PropTypes.shape({ message: PropTypes.shape({
id: PropTypes.number,
type: PropTypes.string.isRequired, type: PropTypes.string.isRequired,
text: PropTypes.string.isRequired text: PropTypes.string.isRequired
}).isRequired }).isRequired

1
app/javascript/src/components/Navigation/index.jsx
View file

@ -20,6 +20,7 @@ import UserAccountDropdown from "./components/UserAccountDropdown";
const StyledNavbar = styled(Navbar)` const StyledNavbar = styled(Navbar)`
background-color: ${WHITE_COLOR}; background-color: ${WHITE_COLOR};
border-color: ${BORDER_GRAY_COLOR}; border-color: ${BORDER_GRAY_COLOR};
margin-bottom: 0;
`; `;
const StyledBrand = styled.a` const StyledBrand = styled.a`

50
app/javascript/src/index.jsx
View file

@ -1,4 +1,4 @@
import React from "react"; import React, { Component } from "react";
import { BrowserRouter } from "react-router-dom"; import { BrowserRouter } from "react-router-dom";
import { Provider } from "react-redux"; import { Provider } from "react-redux";
import { IntlProvider, addLocaleData } from "react-intl"; import { IntlProvider, addLocaleData } from "react-intl";
@ -8,6 +8,7 @@ import messages from "./config/locales/messages";
import store from "./config/store"; import store from "./config/store";
import Spinner from "./components/Spinner"; import Spinner from "./components/Spinner";
import Alert from "./components/Alert";
import ModalsContainer from "./components/ModalsContainer"; import ModalsContainer from "./components/ModalsContainer";
import SettingsPage from "./scenes/SettingsPage"; import SettingsPage from "./scenes/SettingsPage";
import Navigation from "./components/Navigation"; import Navigation from "./components/Navigation";
@ -15,19 +16,36 @@ import Navigation from "./components/Navigation";
addLocaleData([...enLocaleData]); addLocaleData([...enLocaleData]);
const locale = "en-US"; const locale = "en-US";
export default () => class ScinoteApp extends Component {
<Provider store={store}> constructor(props) {
<IntlProvider locale={locale} messages={flattenMessages(messages[locale])}> super(props);
<div> const a = 5;
<BrowserRouter> }
<div>
<Navigation />
<SettingsPage />
</div>
</BrowserRouter>
<ModalsContainer /> render() {
<Spinner /> return (
</div> <Provider store={store}>
</IntlProvider> <IntlProvider locale={locale}
</Provider>; messages={flattenMessages(messages[locale])}
>
<div>
<BrowserRouter>
<div>
<Navigation />
<div>
<Alert message={{type: "alert", text: "Yadayadayada!!!"}} />
</div>
<SettingsPage />
</div>
</BrowserRouter>
<ModalsContainer />
<Spinner />
</div>
</IntlProvider>
</Provider>
);
}
}
export default ScinoteApp;