Skip to content

Commit 6a665cd

Browse files
azinitazinit
authored
Merge pull request feature-sliced#313 from feature-sliced/chore/FEEDBACK-307-add-metrics
FEEDBACK-307: Add base metrics for analytics
2 parents a1d935e + dac9c88 commit 6a665cd

File tree

21 files changed

+317
-97
lines changed

21 files changed

+317
-97
lines changed

‎.gitignore

+7-6
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
/.vscode/settings.json
2-
/website/node_modules/**
3-
/website/.docusaurus/**
4-
/website/build/**
5-
/node_modules/
6-
.idea
1+
/.vscode/settings.json
2+
/website/node_modules/**
3+
/website/.docusaurus/**
4+
/website/build/**
5+
/node_modules/
6+
.idea
7+
.env

‎website/.env.sample

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
ALGOLIA_KEY=
2+
GA_ID=
3+
HOTJAR_ID=

‎website/docusaurus.config.js

+40-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
require("dotenv").config();
2+
13
const DOMAIN = "https://feature-sliced.design/";
24
const GITHUB_ORG = "https://github.com/feature-sliced";
35
const GITHUB_DOCS = "https://github.com/feature-sliced/documentation";
@@ -174,6 +176,15 @@ const footer = {
174176
// TODO: Добавить ссыль на dev.to позднее (как доработаем)
175177
// { label: 'Blog', to: '/blog' },
176178
{ label: "GitHub", href: GITHUB_ORG },
179+
{
180+
label: "Contribution Guide (RU)",
181+
href: `${GITHUB_DOCS}/blob/master/CONTRIBUTING.md`,
182+
},
183+
{
184+
label: "License",
185+
href: `${GITHUB_DOCS}/blob/master/LICENSE`,
186+
},
187+
{ label: "Privacy", href: "/docs/privacy" },
177188
],
178189
},
179190
],
@@ -185,6 +196,24 @@ const footer = {
185196
copyright: `Copyright © ${new Date().getFullYear()} Feature-Sliced`,
186197
};
187198

199+
// We use metrics only for analyze and refinement website discovery experience
200+
// @see Privacy
201+
const metrics = {
202+
gtag: {
203+
trackingID: process.env.GA_ID, // the Google Analytics Tracking ID
204+
anonymizeIP: true, // Should IPs be anonymized?
205+
},
206+
googleAnalytics: {
207+
trackingID: process.env.GA_ID, // the Google Analytics Tracking ID
208+
anonymizeIP: true, // Should IPs be anonymized?
209+
},
210+
// to integrate Hotjar feedback
211+
// @see https://github.com/symblai/docusaurus-plugin-hotjar
212+
hotjar: {
213+
applicationId: process.env.HOTJAR_ID,
214+
},
215+
};
216+
188217
/** @type {Config["presets"]} */
189218
const presets = [
190219
[
@@ -262,7 +291,8 @@ const plugins = [
262291
steps: 2, // the max number of images generated between min and max (inclusive)
263292
},
264293
],
265-
];
294+
process.env.HOTJAR_ID && "docusaurus-plugin-hotjar", // For preventing crashing
295+
].filter(Boolean);
266296

267297
/** @type {Config["themeConfig"]["algolia"]} */
268298
const algolia = {
@@ -332,6 +362,7 @@ module.exports = {
332362
announcementBar,
333363
algolia,
334364
hideableSidebar: true,
365+
...metrics,
335366
},
336367
i18n: {
337368
defaultLocale: DEFAULT_LOCALE,
@@ -349,6 +380,14 @@ module.exports = {
349380
plugins,
350381
};
351382

383+
// Remove configs if there are not secrets passed
352384
if (!process.env.ALGOLIA_KEY) {
353385
delete module.exports.themeConfig.algolia;
354386
}
387+
if (!process.env.GA_ID) {
388+
delete module.exports.themeConfig.gtag;
389+
delete module.exports.themeConfig.googleAnalytics;
390+
}
391+
if (!process.env.HOTJAR_ID) {
392+
delete module.exports.themeConfig.hotjar;
393+
}

‎website/i18n/en/code.json

+12
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,18 @@
111111
"message": "Documentation for older versions of {of} can be found here ",
112112
"description": "Description for legacy version"
113113
},
114+
"features.cookie-consent.alert": {
115+
"message": "🍰 We use cookies for analytics",
116+
"description": "Cookie Consent alert"
117+
},
118+
"features.cookie-consent.accept": {
119+
"message": "OK",
120+
"description": "Cookie Consent accept label"
121+
},
122+
"features.cookie-consent.reason": {
123+
"message": "why?",
124+
"description": "Cookie Consent reason label"
125+
},
114126
"features.feedback.label": {
115127
"message": "Share your feedback about documentation 🤙",
116128
"description": "Feedback share button label"

‎website/i18n/en/docusaurus-plugin-content-docs/current/privacy.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# Privacy
2+
3+
**We use cookies for collect data about documentation usage (only for further analytics and improvement of the site, and for no other purpose)**
4+
5+
The only plugins this site relies on are [@docusaurus/plugin-google-analytics](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-google-analytics) and [docusaurus-plugin-hotjar](https://github.com/symblai/docusaurus-plugin-hotjar). We only use the traffic data provided by [Google Analystics](https://analytics.google.com/) and [Hotjar](https://www.hotjar.com/) to collect feedback from you and refine your user experience.
6+
7+
:::warning NOTE
8+
This page is not a legal notice, please refer to [Google Analystics](https://analytics.google.com/) and [Hotjar](https://www.hotjar.com/) for more details
9+
:::
10+
11+
**Who will have access to this metrics data?**
12+
13+
- Core-team of methodology
14+
- Google Analytics, which we relies on for analyze service usage [(more...)](https://www.google.com/analytics/terms/us.html)
15+
- Hotjar, which we relies on for collect usage feedback [(more...)](https://help.hotjar.com/hc/en-us/categories/360003405813)
16+
17+
![feature-sliced-banner](/img/banner.jpg)

‎website/i18n/en/docusaurus-theme-classic/footer.json

+12
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,18 @@
1919
"message": "Discussions",
2020
"description": "The label of footer link with label=Discussions linking to https://github.com/feature-sliced/documentation/discussions"
2121
},
22+
"link.item.label.License": {
23+
"message": "License",
24+
"description": "The label of footer link with label=License linking to LICENSE"
25+
},
26+
"link.item.label.Privacy": {
27+
"message": "Privacy",
28+
"description": "The label of footer link with label=Privacy linking to /docs/privacy"
29+
},
30+
"link.item.label.Contribution Guide (RU)": {
31+
"message": "Гайдлайны по контрибьютингу (RU)",
32+
"description": "The label of footer link with label=Contribution Guide (RU) linking to CONTRIBUTING.md"
33+
},
2234
"link.item.label.Telegram": {
2335
"message": "Telegram",
2436
"description": "The label of footer link with label=Telegram linking to https://t.me/feature_sliced"

‎website/i18n/ru/code.json

+12
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,18 @@
111111
"message": "Здесь можно найти документацию для старых версий {of}",
112112
"description": "Description for legacy version"
113113
},
114+
"features.cookie-consent.alert": {
115+
"message": "🍰 Мы используем куки для аналитики",
116+
"description": "Cookie Consent alert"
117+
},
118+
"features.cookie-consent.accept": {
119+
"message": "Хорошо",
120+
"description": "Cookie Consent accept label"
121+
},
122+
"features.cookie-consent.reason": {
123+
"message": "зачем?",
124+
"description": "Cookie Consent reason label"
125+
},
114126
"features.feedback.label": {
115127
"message": "Поделись фидбеком по документации 🤙",
116128
"description": "Feedback share button label"

‎website/i18n/ru/docusaurus-plugin-content-docs/current/privacy.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# Конфиденциальность
2+
3+
**Мы используем куки, для сбора данных по использованию документации (для дальнейшей аналитики и улучшения сайта, и ни для каких иных целей)**
4+
5+
Единственные плагины для сбора метрик это [@docusaurus/plugin-google-analytics](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-google-analytics) и [docusaurus-plugin-hotjar](https://github.com/symblai/docusaurus-plugin-hotjar). Мы анализируем только те данные, что предоставляются с помощью [Google Analystics](https://analytics.google.com/) и [Hotjar](https://www.hotjar.com/) - чтобы собрать фидбек и улучшить ваш пользовательский опыт.
6+
7+
:::warning NOTE
8+
Эта страница не является юридически полноценной, поэтому за другими подробностями обратитесь пожалуйста к офиц.сайтам [Google Analystics](https://analytics.google.com/) и [Hotjar](https://www.hotjar.com/)
9+
:::
10+
11+
**Кто имеет доступ к метрикам?**
12+
13+
- Core-team методологии
14+
- Google Analytics, на которую мы опираемся для анализа использования сервиса [(см. подробнее)](https://www.google.com/analytics/terms/us.html)
15+
- Hotjar, на который мы опираемся при сборе фидбека по взаимодействию [(см. подробнее)](https://help.hotjar.com/hc/en-us/categories/360003405813)
16+
17+
![feature-sliced-banner](/img/banner.jpg)

‎website/i18n/ru/docusaurus-theme-classic/footer.json

+12
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,18 @@
1919
"message": "Обсуждения",
2020
"description": "The label of footer link with label=Обсуждения linking to https://github.com/feature-sliced/documentation/discussions"
2121
},
22+
"link.item.label.License": {
23+
"message": "Лицензия",
24+
"description": "The label of footer link with label=License linking to LICENSE"
25+
},
26+
"link.item.label.Privacy": {
27+
"message": "Конфиденциальность",
28+
"description": "The label of footer link with label=Privacy linking to /docs/privacy"
29+
},
30+
"link.item.label.Contribution Guide (RU)": {
31+
"message": "Гайдлайны по контрибьютингу (RU)",
32+
"description": "The label of footer link with label=Contribution Guide (RU) linking to CONTRIBUTING.md"
33+
},
2234
"link.item.label.Telegram": {
2335
"message": "Telegram",
2436
"description": "The label of footer link with label=Telegram linking to https://t.me/feature_sliced"

‎website/package.json

+3
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,11 @@
2727
"@mdx-js/react": "^1.6.21",
2828
"@svgr/webpack": "^5.5.0",
2929
"clsx": "^1.1.1",
30+
"docusaurus-plugin-hotjar": "^0.0.2",
31+
"dotenv": "^10.0.0",
3032
"file-loader": "^6.2.0",
3133
"react": "^17.0.1",
34+
"react-cookie-consent": "^6.4.1",
3235
"react-dom": "^17.0.1",
3336
"url-loader": "^4.1.1"
3437
},

‎website/src/features/cookie-consent/index.jsx

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import React from "react";
2+
import ReactCookieConsent from "react-cookie-consent";
3+
import Link from "@docusaurus/Link";
4+
import { translate } from "@docusaurus/Translate";
5+
6+
import styles from "./styles.module.css";
7+
8+
export const CookieConsent = () => {
9+
return (
10+
<ReactCookieConsent
11+
location="bottom"
12+
buttonText={translate({ id: "features.cookie-consent.accept" })}
13+
containerClasses={styles.root}
14+
contentClasses={styles.content}
15+
buttonWrapperClasses={styles.buttonWrapper}
16+
buttonClasses={styles.button}
17+
cookieName="FeatureSlicedAnalytics"
18+
expires={30}
19+
>
20+
{translate({ id: "features.cookie-consent.alert" })}
21+
<Link to="/docs/privacy"> ({translate({ id: "features.cookie-consent.reason" })})</Link>
22+
</ReactCookieConsent>
23+
);
24+
};

‎website/src/features/cookie-consent/styles.module.css

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/* !important overridings because of react-cookie-consent selectors-specifity */
2+
3+
.root {
4+
color: var(--ifm-font-color-base) !important;
5+
background-color: var(--ifm-background-surface-color) !important;
6+
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3);
7+
}
8+
9+
.button {
10+
padding: var(--ifm-button-padding-vertical) var(--ifm-button-padding-horizontal) !important;
11+
margin: 8px !important;
12+
color: var(--ifm-button-color) !important;
13+
background: var(--ifm-color-primary-dark) !important;
14+
border-radius: var(--ifm-button-border-radius) !important;
15+
transition: 0.25s;
16+
}
17+
18+
.button:hover {
19+
opacity: 0.7;
20+
}
21+
22+
@media (max-width: 460px) {
23+
.buttonWrapper {
24+
flex-grow: 1;
25+
text-align: center;
26+
}
27+
28+
.content {
29+
margin-bottom: 4px !important;
30+
text-align: center;
31+
}
32+
}

‎website/src/pages/_config.jsx ‎website/src/pages/_home/_config.jsx

File renamed without changes.

‎website/src/pages/_home/index.jsx

+86
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
import React from "react";
2+
// It's utility, not hook =)
3+
import getBaseUrl from "@docusaurus/useBaseUrl";
4+
// eslint-disable-next-line import/no-unresolved
5+
import Layout from "@theme/Layout";
6+
// eslint-disable-next-line import/no-unresolved
7+
import Image from "@theme/IdealImage";
8+
import { translate } from "@docusaurus/Translate";
9+
import { Header } from "@site/src/features/header";
10+
import { Card, Section } from "@site/src/shared/ui";
11+
import imgScheme from "@site/static/img/visual_schema.jpg";
12+
// NOTE: Locate at index before of specific route-mapping while Node/SSR building
13+
// "_" for excluding file from routing
14+
import { features, concepts, companies } from "./_config";
15+
import styles from "./styles.module.css";
16+
17+
export default function HomePage() {
18+
// NOTE: use siteConfig for getting config
19+
// const {siteConfig} = useDocusaurusContext();
20+
return (
21+
<Layout title="Welcome" description="Structural methodology for frontend projects">
22+
<Header />
23+
<main>
24+
<Section title={translate({ id: "pages.home.features.title" })}>
25+
{features.map((feature) => (
26+
<Card key={feature.title} size={12 / features.length} {...feature} />
27+
))}
28+
</Section>
29+
<Section title={translate({ id: "pages.home.concepts.title" })} withAltBg>
30+
{concepts.map((concept) => (
31+
<Card key={concept.title} size={12 / concepts.length} {...concept} />
32+
))}
33+
</Section>
34+
<Section
35+
title={translate({ id: "pages.home.scheme.title" })}
36+
rowClass={styles.scheme}
37+
>
38+
{/**
39+
* NOTE: Set fixed height for correct alignment from mobile devices
40+
* @see https://t.me/c/1463227827/197935
41+
* NOTE: Cannot be used as native img because of ideal-image plugin preprocessing
42+
*/}
43+
<Image
44+
className={styles.schemeImg}
45+
img={imgScheme}
46+
alt="feature-sliced-scheme"
47+
/>
48+
</Section>
49+
<Section
50+
title={translate({ id: "pages.home.companies.using" })}
51+
className={styles.companiesContainer}
52+
>
53+
<div className={styles.companies}>
54+
{companies.map(({ url, src, alt }) => (
55+
<a
56+
key={src}
57+
className={styles.companiesItem}
58+
href={url}
59+
target="_blank"
60+
rel="noopener noreferrer"
61+
>
62+
<img
63+
className={styles.companiesItemImg}
64+
// It's utility, not hook =)
65+
src={getBaseUrl(`img/companies/${src}`)}
66+
title={alt}
67+
alt={alt}
68+
/>
69+
</a>
70+
))}
71+
</div>
72+
<span className={styles.companiesSubtitle}>
73+
{translate({ id: "pages.home.companies.add_me" })}{" "}
74+
<a
75+
href="https://github.com/feature-sliced/documentation/issues/131"
76+
target="_blank"
77+
rel="noopener noreferrer"
78+
>
79+
{translate({ id: "pages.home.companies.tell_us" })}
80+
</a>
81+
</span>
82+
</Section>
83+
</main>
84+
</Layout>
85+
);
86+
}

‎website/src/pages/markdown-page.md ‎website/src/pages/_home/markdown-page.md

File renamed without changes.

‎website/src/pages/styles.module.css ‎website/src/pages/_home/styles.module.css

File renamed without changes.

0 commit comments

Comments
 (0)