Skip to content

Commit df229dd

Browse files
sergiou87sergiou87
committed
Create new view to announce we're sunsetting Atom
1 parent 586efc2 commit df229dd

File tree

5 files changed

+206
-22
lines changed

5 files changed

+206
-22
lines changed

‎packages/welcome/docs/events.md

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -14,23 +14,29 @@ Currently the Welcome package does not log any timing events.
1414

1515
#### Welcome package shown
1616

17-
* **eventType**: `welcome-v1`
18-
* **metadata**
17+
- **eventType**: `welcome-v1`
18+
- **metadata**
1919

20-
| field | value |
21-
|-------|-------|
22-
| `ea` | `show-on-initial-load`
20+
| field | value |
21+
| ----- | ---------------------- |
22+
| `ea` | `show-on-initial-load` |
2323

24+
#### Sunsetting announcement shown
2425

25-
#### Click on links
26+
- **eventType**: `sunsetting-v1`
27+
- **metadata**
2628

27-
* **eventType**: `welcome-v1`
28-
* **metadata**
29+
| field | value |
30+
| ----- | --------------------------------- |
31+
| `ea` | `show-sunsetting-on-initial-load` |
2932

30-
| field | value |
31-
|-------|-------|
32-
| `ea` | link that was clicked
33+
#### Click on links
3334

34-
(There are many potential values for the `ea` param, e.g: `clicked-welcome-atom-docs-link`,`clicked-welcome-atom-org-link`, `clicked-project-cta`, `clicked-init-script-cta`, ...).
35+
- **eventType**: `welcome-v1`
36+
- **metadata**
3537

38+
| field | value |
39+
| ----- | --------------------- |
40+
| `ea` | link that was clicked |
3641

42+
(There are many potential values for the `ea` param, e.g: `clicked-welcome-atom-docs-link`,`clicked-welcome-atom-org-link`, `clicked-project-cta`, `clicked-init-script-cta`, ...).

‎packages/welcome/lib/sunsetting-view.js

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
/** @babel */
2+
/** @jsx etch.dom **/
3+
4+
import etch from 'etch';
5+
6+
export default class SunsettingView {
7+
constructor(props) {
8+
this.props = props;
9+
etch.initialize(this);
10+
11+
this.element.addEventListener('click', (event) => {
12+
const link = event.target.closest('a');
13+
if (link && link.dataset.event) {
14+
this.props.reporterProxy.sendEvent(
15+
`clicked-sunsetting-${link.dataset.event}-link`
16+
);
17+
}
18+
});
19+
}
20+
21+
didChangeShowOnStartup() {
22+
atom.config.set('welcome.showSunsettingOnStartup', this.checked);
23+
}
24+
25+
update() {}
26+
27+
serialize() {
28+
return {
29+
deserializer: 'SunsettingView',
30+
uri: this.props.uri,
31+
};
32+
}
33+
34+
render() {
35+
return (
36+
<div className="welcome">
37+
<div className="welcome-container">
38+
<header className="welcome-header">
39+
<a href="https://github.blog/2022-06-08-sunsetting-atom/">
40+
<svg
41+
className="welcome-logo"
42+
width="330px"
43+
height="68px"
44+
viewBox="0 0 330 68"
45+
version="1.1"
46+
>
47+
<g
48+
stroke="none"
49+
stroke-width="1"
50+
fill="none"
51+
fill-rule="evenodd"
52+
>
53+
<g transform="translate(2.000000, 1.000000)">
54+
<g
55+
transform="translate(96.000000, 8.000000)"
56+
fill="currentColor"
57+
>
58+
<path d="M185.498,3.399 C185.498,2.417 186.34,1.573 187.324,1.573 L187.674,1.573 C188.447,1.573 189.01,1.995 189.5,2.628 L208.676,30.862 L227.852,2.628 C228.272,1.995 228.905,1.573 229.676,1.573 L230.028,1.573 C231.01,1.573 231.854,2.417 231.854,3.399 L231.854,49.403 C231.854,50.387 231.01,51.231 230.028,51.231 C229.044,51.231 228.202,50.387 228.202,49.403 L228.202,8.246 L210.151,34.515 C209.729,35.148 209.237,35.428 208.606,35.428 C207.973,35.428 207.481,35.148 207.061,34.515 L189.01,8.246 L189.01,49.475 C189.01,50.457 188.237,51.231 187.254,51.231 C186.27,51.231 185.498,50.458 185.498,49.475 L185.498,3.399 L185.498,3.399 Z" />
59+
<path d="M113.086,26.507 L113.086,26.367 C113.086,12.952 122.99,0.941 137.881,0.941 C152.77,0.941 162.533,12.811 162.533,26.225 L162.533,26.367 C162.533,39.782 152.629,51.792 137.74,51.792 C122.85,51.792 113.086,39.923 113.086,26.507 M158.74,26.507 L158.74,26.367 C158.74,14.216 149.89,4.242 137.74,4.242 C125.588,4.242 116.879,14.075 116.879,26.225 L116.879,26.367 C116.879,38.518 125.729,48.491 137.881,48.491 C150.031,48.491 158.74,38.658 158.74,26.507" />
60+
<path d="M76.705,5.155 L60.972,5.155 C60.06,5.155 59.287,4.384 59.287,3.469 C59.287,2.556 60.059,1.783 60.972,1.783 L96.092,1.783 C97.004,1.783 97.778,2.555 97.778,3.469 C97.778,4.383 97.005,5.155 96.092,5.155 L80.358,5.155 L80.358,49.405 C80.358,50.387 79.516,51.231 78.532,51.231 C77.55,51.231 76.706,50.387 76.706,49.405 L76.706,5.155 L76.705,5.155 Z" />
61+
<path d="M0.291,48.562 L21.291,3.05 C21.783,1.995 22.485,1.292 23.75,1.292 L23.891,1.292 C25.155,1.292 25.858,1.995 26.348,3.05 L47.279,48.421 C47.49,48.843 47.56,49.194 47.56,49.546 C47.56,50.458 46.788,51.231 45.803,51.231 C44.961,51.231 44.329,50.599 43.978,49.826 L38.219,37.183 L9.21,37.183 L3.45,49.897 C3.099,50.739 2.538,51.231 1.694,51.231 C0.781,51.231 0.008,50.529 0.008,49.685 C0.009,49.404 0.08,48.983 0.291,48.562 L0.291,48.562 Z M36.673,33.882 L23.749,5.437 L10.755,33.882 L36.673,33.882 L36.673,33.882 Z" />
62+
</g>
63+
<g>
64+
<path
65+
d="M40.363,32.075 C40.874,34.44 39.371,36.77 37.006,37.282 C34.641,37.793 32.311,36.29 31.799,33.925 C31.289,31.56 32.791,29.23 35.156,28.718 C37.521,28.207 39.851,29.71 40.363,32.075"
66+
fill="currentColor"
67+
/>
68+
<path
69+
d="M48.578,28.615 C56.851,45.587 58.558,61.581 52.288,64.778 C45.822,68.076 33.326,56.521 24.375,38.969 C15.424,21.418 13.409,4.518 19.874,1.221 C22.689,-0.216 26.648,1.166 30.959,4.629"
70+
stroke="currentColor"
71+
stroke-width="3.08"
72+
stroke-linecap="round"
73+
/>
74+
<path
75+
d="M7.64,39.45 C2.806,36.94 -0.009,33.915 0.154,30.79 C0.531,23.542 16.787,18.497 36.462,19.52 C56.137,20.544 71.781,27.249 71.404,34.497 C71.241,37.622 68.127,40.338 63.06,42.333"
76+
stroke="currentColor"
77+
stroke-width="3.08"
78+
stroke-linecap="round"
79+
/>
80+
<path
81+
d="M28.828,59.354 C23.545,63.168 18.843,64.561 15.902,62.653 C9.814,58.702 13.572,42.102 24.296,25.575 C35.02,9.048 48.649,-1.149 54.736,2.803 C57.566,4.639 58.269,9.208 57.133,15.232"
82+
stroke="currentColor"
83+
stroke-width="3.08"
84+
stroke-linecap="round"
85+
/>
86+
</g>
87+
</g>
88+
</g>
89+
</svg>
90+
<h1 className="welcome-title">We are sunsetting Atom</h1>
91+
</a>
92+
</header>
93+
94+
<section className="welcome-panel">
95+
<p>
96+
We are archiving Atom and all projects under the Atom organization
97+
for an official sunset on December 15, 2022.
98+
</p>
99+
<p>
100+
You can learn more about this in our{' '}
101+
<a href="https://github.blog/2022-06-08-sunsetting-atom/">
102+
blog post
103+
</a>
104+
.
105+
</p>
106+
</section>
107+
108+
<section className="welcome-panel">
109+
<label>
110+
<input
111+
className="input-checkbox"
112+
type="checkbox"
113+
checked={atom.config.get('welcome.showSunsettingOnStartup')}
114+
onchange={this.didChangeShowOnStartup}
115+
/>
116+
Show this announce when opening Atom
117+
</label>
118+
</section>
119+
120+
<footer className="welcome-footer">
121+
<a href="https://atom.io/" dataset={{ event: 'footer-atom-io' }}>
122+
atom.io
123+
</a>{' '}
124+
<span className="text-subtle">×</span>{' '}
125+
<a
126+
className="icon icon-octoface"
127+
href="https://github.com/"
128+
dataset={{ event: 'footer-octocat' }}
129+
/>
130+
</footer>
131+
</div>
132+
</div>
133+
);
134+
}
135+
136+
getURI() {
137+
return this.props.uri;
138+
}
139+
140+
getTitle() {
141+
return 'Sunsetting Atom';
142+
}
143+
144+
isEqual(other) {
145+
return other instanceof SunsettingView;
146+
}
147+
}

‎packages/welcome/lib/welcome-package.js

Lines changed: 34 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@
33
import { CompositeDisposable } from 'atom';
44
import ReporterProxy from './reporter-proxy';
55

6-
let WelcomeView, GuideView, ConsentView;
6+
let WelcomeView, GuideView, ConsentView, SunsettingView;
77

8+
const SUNSETTING_URI = 'atom://welcome/sunsetting';
89
const WELCOME_URI = 'atom://welcome/welcome';
910
const GUIDE_URI = 'atom://welcome/guide';
1011
const CONSENT_URI = 'atom://welcome/consent';
@@ -18,50 +19,70 @@ export default class WelcomePackage {
1819
this.subscriptions = new CompositeDisposable();
1920

2021
this.subscriptions.add(
21-
atom.workspace.addOpener(filePath => {
22+
atom.workspace.addOpener((filePath) => {
23+
if (filePath === SUNSETTING_URI) {
24+
return this.createSunsettingView({ uri: SUNSETTING_URI });
25+
}
26+
})
27+
);
28+
29+
this.subscriptions.add(
30+
atom.workspace.addOpener((filePath) => {
2231
if (filePath === WELCOME_URI) {
2332
return this.createWelcomeView({ uri: WELCOME_URI });
2433
}
2534
})
2635
);
2736

2837
this.subscriptions.add(
29-
atom.workspace.addOpener(filePath => {
38+
atom.workspace.addOpener((filePath) => {
3039
if (filePath === GUIDE_URI) {
3140
return this.createGuideView({ uri: GUIDE_URI });
3241
}
3342
})
3443
);
3544

3645
this.subscriptions.add(
37-
atom.workspace.addOpener(filePath => {
46+
atom.workspace.addOpener((filePath) => {
3847
if (filePath === CONSENT_URI) {
3948
return this.createConsentView({ uri: CONSENT_URI });
4049
}
4150
})
4251
);
4352

4453
this.subscriptions.add(
45-
atom.commands.add('atom-workspace', 'welcome:show', () => this.show())
54+
atom.commands.add('atom-workspace', 'welcome:show', () =>
55+
this.showWelcome()
56+
)
4657
);
4758

4859
if (atom.config.get('core.telemetryConsent') === 'undecided') {
4960
await atom.workspace.open(CONSENT_URI);
5061
}
5162

5263
if (atom.config.get('welcome.showOnStartup')) {
53-
await this.show();
64+
await this.showWelcome();
5465
this.reporterProxy.sendEvent('show-on-initial-load');
5566
}
67+
68+
if (atom.config.get('welcome.showSunsettingOnStartup')) {
69+
await this.showSunsetting();
70+
this.reporterProxy.sendEvent('show-sunsetting-on-initial-load');
71+
}
5672
}
5773

58-
show() {
74+
showWelcome() {
5975
return Promise.all([
6076
atom.workspace.open(WELCOME_URI, { split: 'left' }),
61-
atom.workspace.open(GUIDE_URI, { split: 'right' })
77+
atom.workspace.open(SUNSETTING_URI, { split: 'left' }),
78+
atom.workspace.open(GUIDE_URI, { split: 'right' }),
6279
]);
6380
}
6481

82+
showSunsetting() {
83+
return atom.workspace.open(SUNSETTING_URI, { split: 'left' });
84+
}
85+
6586
consumeReporter(reporter) {
6687
return this.reporterProxy.setReporter(reporter);
6788
}
@@ -70,6 +91,11 @@ export default class WelcomePackage {
7091
this.subscriptions.dispose();
7192
}
7293

94+
createSunsettingView(state) {
95+
if (SunsettingView == null) SunsettingView = require('./sunsetting-view');
96+
return new SunsettingView({ reporterProxy: this.reporterProxy, ...state });
97+
}
98+
7399
createWelcomeView(state) {
74100
if (WelcomeView == null) WelcomeView = require('./welcome-view');
75101
return new WelcomeView({ reporterProxy: this.reporterProxy, ...state });

‎packages/welcome/lib/welcome-view.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default class WelcomeView {
88
this.props = props;
99
etch.initialize(this);
1010

11-
this.element.addEventListener('click', event => {
11+
this.element.addEventListener('click', (event) => {
1212
const link = event.target.closest('a');
1313
if (link && link.dataset.event) {
1414
this.props.reporterProxy.sendEvent(
@@ -27,7 +27,7 @@ export default class WelcomeView {
2727
serialize() {
2828
return {
2929
deserializer: 'WelcomeView',
30-
uri: this.props.uri
30+
uri: this.props.uri,
3131
};
3232
}
3333

‎packages/welcome/package.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,11 @@
2525
"type": "boolean",
2626
"default": true,
2727
"description": "Show welcome panes with useful information when opening a new Atom window."
28+
},
29+
"showSunsettingOnStartup": {
30+
"type": "boolean",
31+
"default": true,
32+
"description": "Show sunsetting pane when opening a new Atom window."
2833
}
2934
},
3035
"deserializers": {

0 commit comments

Comments
 (0)