From 53297be0fe1c0004a94efe221390b1f37a463c84 Mon Sep 17 00:00:00 2001
From: hanzhenfeng <hanzhenfeng@baidu.com>
Date: Sun, 16 Oct 2022 18:55:04 +0800
Subject: [PATCH 1/2] #493: As a user, I want to share the diagram so that they
 can collaborate with me 1. when user click the button, browser will open a
 new window show the github survey page 2. regarding the implements: 2.1 I
 have to add an empty function for the share button, I don't know how to avoid
 that 2.2 I might need to change the share button position

---
 src/components/ContentWrap.jsx | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx
index f048b748..33c6b7e3 100644
--- a/src/components/ContentWrap.jsx
+++ b/src/components/ContentWrap.jsx
@@ -765,6 +765,8 @@ export default class ContentWrap extends Component {
 		this.cm.js.setValue(codeService.addCode(code, param));
 	}
 
+	gotoShareSurvey() {}
+
 	render() {
 		return (
 			<SplitPane
@@ -1002,6 +1004,16 @@ export default class ContentWrap extends Component {
 					{window.zenumlDesktop ? (null) : (
 						<div className='promotion'>
 							<div className="downloads">
+								<a href='https://github.com/ZenUml/web-sequence/discussions/496' target="_blank"
+								   style={{textDecoration:'none'}}>
+									<Button
+										className="btn--dark button icon-button hint--rounded hint--bottom-left"
+										aria-label="Share Your Work"
+										onClick={this.gotoShareSurvey.bind()}>
+										<span className="material-symbols-outlined">share</span>
+										<span>Share</span>
+									</Button>
+								</a>
 								<Button
 									className="btn--dark button icon-button hint--rounded hint--bottom-left"
 									aria-label="Export as PNG"

From 35b4d534e5e63e17d736f1adc6a9ea41d5385ee4 Mon Sep 17 00:00:00 2001
From: hanzhenfeng <hanzhenfeng@baidu.com>
Date: Wed, 19 Oct 2022 09:54:56 +0800
Subject: [PATCH 2/2] Add tract event for share survey

---
 src/components/ContentWrap.jsx | 10 ++++++----
 src/style.css                  |  2 +-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx
index 33c6b7e3..8bc99c71 100644
--- a/src/components/ContentWrap.jsx
+++ b/src/components/ContentWrap.jsx
@@ -460,6 +460,10 @@ export default class ContentWrap extends Component {
 		trackEvent('ui', 'downloadJpeg');
 	}
 
+	shareClickHandler(e) {
+		trackEvent('ui', 'shareSurvey');
+	}
+
 	async resetSplitting() {
 		await this.setState({
 			codeSplitSizes: this.getCodeSplitSizes(),
@@ -765,8 +769,6 @@ export default class ContentWrap extends Component {
 		this.cm.js.setValue(codeService.addCode(code, param));
 	}
 
-	gotoShareSurvey() {}
-
 	render() {
 		return (
 			<SplitPane
@@ -1003,13 +1005,13 @@ export default class ContentWrap extends Component {
 				<div class="demo-side" id="js-demo-side" style="overflow-y: auto; -webkit-overflow-scrolling: touch;">
 					{window.zenumlDesktop ? (null) : (
 						<div className='promotion'>
-							<div className="downloads">
+							<div className="actions">
 								<a href='https://github.com/ZenUml/web-sequence/discussions/496' target="_blank"
 								   style={{textDecoration:'none'}}>
 									<Button
 										className="btn--dark button icon-button hint--rounded hint--bottom-left"
 										aria-label="Share Your Work"
-										onClick={this.gotoShareSurvey.bind()}>
+										onClick={this.shareClickHandler.bind(this)}>
 										<span className="material-symbols-outlined">share</span>
 										<span>Share</span>
 									</Button>
diff --git a/src/style.css b/src/style.css
index df7e17a5..acd8bf38 100644
--- a/src/style.css
+++ b/src/style.css
@@ -382,7 +382,7 @@ body:not(.light-version).overlay-visible .main-container {
 	font-weight: lighter;
 }
 
-.demo-side .promotion .downloads {
+.demo-side .promotion .actions {
 	margin-left: auto;
 	display: flex;
 	align-items: center;