Skip to content
Snippets Groups Projects
Commit c8855db5 authored by Allen Gilliland's avatar Allen Gilliland
Browse files

add the option for users to subscribe to the Metabase newsletter from the end of the setup flow.

parent 237f54b5
No related merge requests found
import React, { Component, PropTypes } from "react";
import Icon from 'metabase/components/Icon.jsx';
export default class NewsletterForm extends Component {
constructor(props, context) {
super(props, context);
this.state = { submitted: false };
this.styles = {
container: {
borderWidth: "2px"
},
input: {
fontSize: '1.1rem',
color: '#676C72',
width: "350px"
},
label: {
top: "-12px"
}
}
}
static propTypes = {
password: PropTypes.string.isRequired
};
subscribeUser(e) {
e.preventDefault();
var formData = new FormData();
formData.append("EMAIL", React.findDOMNode(this.refs.email).value);
formData.append("b_869fec0e4689e8fd1db91e795_b9664113a8", "");
let req = new XMLHttpRequest();
req.open("POST", "https://metabase.us10.list-manage.com/subscribe/post?u=869fec0e4689e8fd1db91e795&id=b9664113a8");
req.send(formData);
this.setState({submitted: true});
}
render() {
const { initialEmail } = this.props;
const { submitted } = this.state;
return (
<div style={this.styles.container} className="bordered rounded p4 relative">
<div style={this.styles.label} className="absolute text-centered left right">
<span className="px3 bg-white h5 text-bold text-grey-4 text-uppercase"><Icon className="mr1" name="mail" width="16px" height="16px" />Metabase Newsletter</span>
</div>
<div className="MB-Newsletter sm-float-right">
<div>
<div style={{color: "#878E95"}} className="text-grey-4 text-strong h3 pb3">
Get infrequent emails about new releases and feature updates.
</div>
<form onSubmit={this.subscribeUser.bind(this)} novalidate>
<div>
{ !submitted ?
<div className="">
<input ref="email" style={this.styles.input} className="AdminInput bordered rounded h3 inline-block" type="email" value={initialEmail} placeholder="Email address" />
<input className="Button float-right inline-block ml1" type="submit" value="Subscribe" name="subscribe" />
</div>
:
<div className="text-success text-centered text-bold h3 p1">
<Icon className="mr2" name="check" width="16px" height="16px" />You're subscribed. Thanks for using Metabase!
</div>
}
</div>
</form>
</div>
</div>
</div>
);
}
}
......@@ -72,6 +72,7 @@
/* text weight */
.text-light { font-weight: 300; }
.text-normal { font-weight: 400; }
.text-strong { font-weight: 570; }
.text-bold { font-weight: 700; }
/* text style */
......
......@@ -69,6 +69,10 @@ export var ICON_PATHS = {
attrs: { viewBox: '0 0 24 24' }
},
lock: 'M8.8125,13.2659641 L5.50307055,13.2659641 C4.93891776,13.2659641 4.5,13.7132101 4.5,14.2649158 L4.5,30.8472021 C4.5,31.4051918 4.94908998,31.8461538 5.50307055,31.8461538 L26.4969294,31.8461538 C27.0610822,31.8461538 27.5,31.3989079 27.5,30.8472021 L27.5,14.2649158 C27.5,13.7069262 27.05091,13.2659641 26.4969294,13.2659641 L23.1875,13.2659641 L23.1875,7.18200446 C23.1875,3.22368836 19.9695466,0 16,0 C12.0385306,0 8.8125,3.21549292 8.8125,7.18200446 L8.8125,13.2659641 Z M12.3509615,7.187641 C12.3509615,5.17225484 13.9813894,3.53846154 15.9955768,3.53846154 C18.0084423,3.53846154 19.6401921,5.17309313 19.6401921,7.187641 L19.6401921,13.0473232 L12.3509615,13.0473232 L12.3509615,7.187641 Z',
mail: {
path: 'M0 6 L16 16 L32 6 z M0 9 L0 26 L32 26 L32 9 L16 19 z',
attrs: { viewBox: '0 0 32 32' }
},
mine: 'M28.4907419,50 C25.5584999,53.6578499 21.0527692,56 16,56 C10.9472308,56 6.44150015,53.6578499 3.50925809,50 L28.4907419,50 Z M29.8594823,31.9999955 C27.0930063,27.217587 21.922257,24 16,24 C10.077743,24 4.9069937,27.217587 2.1405177,31.9999955 L29.8594849,32 Z M16,21 C19.8659932,21 23,17.1944204 23,12.5 C23,7.80557963 22,3 16,3 C10,3 9,7.80557963 9,12.5 C9,17.1944204 12.1340068,21 16,21 Z',
number: 'M8,8.4963932 C8,8.22224281 8.22618103,8 8.4963932,8 L23.5036068,8 C23.7777572,8 24,8.22618103 24,8.4963932 L24,23.5036068 C24,23.7777572 23.773819,24 23.5036068,24 L8.4963932,24 C8.22224281,24 8,23.773819 8,23.5036068 L8,8.4963932 Z M12.136,19 L12.136,13.4 L11.232,13.4 C11.1999998,13.6133344 11.1333338,13.7919993 11.032,13.936 C10.9306662,14.0800007 10.8066674,14.1959996 10.66,14.284 C10.5133326,14.3720004 10.3480009,14.4333332 10.164,14.468 C9.97999908,14.5026668 9.78933432,14.5173334 9.592,14.512 L9.592,15.368 L11,15.368 L11,19 L12.136,19 Z M13.616,16.176 C13.616,16.7360028 13.6706661,17.2039981 13.78,17.58 C13.8893339,17.9560019 14.0373324,18.2559989 14.224,18.48 C14.4106676,18.7040011 14.6279988,18.8639995 14.876,18.96 C15.1240012,19.0560005 15.3866653,19.104 15.664,19.104 C15.9466681,19.104 16.2119988,19.0560005 16.46,18.96 C16.7080012,18.8639995 16.9266657,18.7040011 17.116,18.48 C17.3053343,18.2559989 17.4546661,17.9560019 17.564,17.58 C17.6733339,17.2039981 17.728,16.7360028 17.728,16.176 C17.728,15.6319973 17.6733339,15.1746685 17.564,14.804 C17.4546661,14.4333315 17.3053343,14.1360011 17.116,13.912 C16.9266657,13.6879989 16.7080012,13.5280005 16.46,13.432 C16.2119988,13.3359995 15.9466681,13.288 15.664,13.288 C15.3866653,13.288 15.1240012,13.3359995 14.876,13.432 C14.6279988,13.5280005 14.4106676,13.6879989 14.224,13.912 C14.0373324,14.1360011 13.8893339,14.4333315 13.78,14.804 C13.6706661,15.1746685 13.616,15.6319973 13.616,16.176 Z M14.752,16.176 C14.752,16.0799995 14.7533333,15.9640007 14.756,15.828 C14.7586667,15.6919993 14.7679999,15.5520007 14.784,15.408 C14.8000001,15.2639993 14.8266665,15.121334 14.864,14.98 C14.9013335,14.838666 14.953333,14.7120006 15.02,14.6 C15.086667,14.4879994 15.1719995,14.3973337 15.276,14.328 C15.3800005,14.2586663 15.5093326,14.224 15.664,14.224 C15.8186674,14.224 15.9493328,14.2586663 16.056,14.328 C16.1626672,14.3973337 16.2506663,14.4879994 16.32,14.6 C16.3893337,14.7120006 16.4413332,14.838666 16.476,14.98 C16.5106668,15.121334 16.5373332,15.2639993 16.556,15.408 C16.5746668,15.5520007 16.5853333,15.6919993 16.588,15.828 C16.5906667,15.9640007 16.592,16.0799995 16.592,16.176 C16.592,16.3360008 16.5866667,16.5293322 16.576,16.756 C16.5653333,16.9826678 16.5320003,17.2013323 16.476,17.412 C16.4199997,17.6226677 16.329334,17.8026659 16.204,17.952 C16.078666,18.1013341 15.8986678,18.176 15.664,18.176 C15.4346655,18.176 15.2586673,18.1013341 15.136,17.952 C15.0133327,17.8026659 14.9240003,17.6226677 14.868,17.412 C14.8119997,17.2013323 14.7786667,16.9826678 14.768,16.756 C14.7573333,16.5293322 14.752,16.3360008 14.752,16.176 Z M18.064,16.176 C18.064,16.7360028 18.1186661,17.2039981 18.228,17.58 C18.3373339,17.9560019 18.4853324,18.2559989 18.672,18.48 C18.8586676,18.7040011 19.0759988,18.8639995 19.324,18.96 C19.5720012,19.0560005 19.8346653,19.104 20.112,19.104 C20.3946681,19.104 20.6599988,19.0560005 20.908,18.96 C21.1560012,18.8639995 21.3746657,18.7040011 21.564,18.48 C21.7533343,18.2559989 21.9026661,17.9560019 22.012,17.58 C22.1213339,17.2039981 22.176,16.7360028 22.176,16.176 C22.176,15.6319973 22.1213339,15.1746685 22.012,14.804 C21.9026661,14.4333315 21.7533343,14.1360011 21.564,13.912 C21.3746657,13.6879989 21.1560012,13.5280005 20.908,13.432 C20.6599988,13.3359995 20.3946681,13.288 20.112,13.288 C19.8346653,13.288 19.5720012,13.3359995 19.324,13.432 C19.0759988,13.5280005 18.8586676,13.6879989 18.672,13.912 C18.4853324,14.1360011 18.3373339,14.4333315 18.228,14.804 C18.1186661,15.1746685 18.064,15.6319973 18.064,16.176 Z M19.2,16.176 C19.2,16.0799995 19.2013333,15.9640007 19.204,15.828 C19.2066667,15.6919993 19.2159999,15.5520007 19.232,15.408 C19.2480001,15.2639993 19.2746665,15.121334 19.312,14.98 C19.3493335,14.838666 19.401333,14.7120006 19.468,14.6 C19.534667,14.4879994 19.6199995,14.3973337 19.724,14.328 C19.8280005,14.2586663 19.9573326,14.224 20.112,14.224 C20.2666674,14.224 20.3973328,14.2586663 20.504,14.328 C20.6106672,14.3973337 20.6986663,14.4879994 20.768,14.6 C20.8373337,14.7120006 20.8893332,14.838666 20.924,14.98 C20.9586668,15.121334 20.9853332,15.2639993 21.004,15.408 C21.0226668,15.5520007 21.0333333,15.6919993 21.036,15.828 C21.0386667,15.9640007 21.04,16.0799995 21.04,16.176 C21.04,16.3360008 21.0346667,16.5293322 21.024,16.756 C21.0133333,16.9826678 20.9800003,17.2013323 20.924,17.412 C20.8679997,17.6226677 20.777334,17.8026659 20.652,17.952 C20.526666,18.1013341 20.3466678,18.176 20.112,18.176 C19.8826655,18.176 19.7066673,18.1013341 19.584,17.952 C19.4613327,17.8026659 19.3720003,17.6226677 19.316,17.412 C19.2599997,17.2013323 19.2266667,16.9826678 19.216,16.756 C19.2053333,16.5293322 19.2,16.3360008 19.2,16.176 Z',
pencil: 'M4.7352182,19.1979208 L11.3429107,25.5873267 L24.069853,12.5293069 L17.4624587,6.1419802 L4.7352182,19.1979208 Z M9.63604523,27.3406931 L3.02805455,20.9509901 L0.238146568,29.9610891 L9.63604523,27.3406931 Z M23.4499066,0 L19.1734989,4.38653465 L25.7811914,10.7759406 L30.0575991,6.38732673 L23.4499066,0 Z',
......
import React, { Component, PropTypes } from "react";
import LogoIcon from 'metabase/components/LogoIcon.jsx';
import NewsletterForm from 'metabase/components/NewsletterForm.jsx';
import MetabaseAnalytics from "metabase/lib/analytics";
import MetabaseSettings from "metabase/lib/settings";
......@@ -40,7 +41,7 @@ export default class Setup extends Component {
}
render() {
let { activeStep, setupComplete } = this.props;
let { activeStep, setupComplete, userDetails } = this.props;
if (activeStep === WELCOME_STEP_NUMBER) {
return (
......@@ -76,7 +77,10 @@ export default class Setup extends Component {
{ setupComplete ?
<section className="SetupStep rounded SetupStep--active flex flex-column layout-centered p4">
<h1 style={{fontSize: "xx-large"}} className="text-normal pt2">You're all set up!</h1>
<h1 style={{fontSize: "xx-large"}} className="text-light pt2 pb2">You're all set up!</h1>
<div className="pt4">
<NewsletterForm initialEmail={userDetails.email} />
</div>
<div className="pt4 pb2">
<a className="Button Button--primary" href="/?new" onClick={this.completeSetup.bind(this)}>Take me to Metabase</a>
</div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment