Migrate codebase to Typescript and CSS Modules #1106

pavelgrinchenko · 2020-04-01T16:45:05Z

refactor gatsby-node.js (We should split into docs and blog if it possible at all, move common helpers outside?)
review .eslintrc.json after migration
remove temporary.tmp-empty-package after getting rid of styled-components
utils refactoring
- [WIP] Blog merging into main website codebase #1091 (review)
- [WIP] Blog merging into main website codebase #1091 (review)
review blogpost markdown styles after getting rid of styles components (.layoutBlog, etc) at the end of migration
update deps

package.json

src/components/ShowOnly/styles.module.css

…ssNames instead of global in few components

…tion

…Use it everywhere on main page. Refactor DownloadButton component

…l warnings

pavelgrinchenko · 2020-04-08T11:55:27Z

@shcheklein

Main page - fonts, styles are different

Could you clarify it, point by point? In this case I can review it step by step too. I already fixed some of them, and some styles was changed after getting rid of duplication.
For example Download and Watch Video buttons now have more balanced paddings

We don't render sag anymore (the same in prod) - https://dvc.org/blog/a-public-reddit-dataset

I’m not sure what do you mean when saying sag. Could you clarify?

Tooltip (abbr) in docs are not styled properly

Previous version was heavily dependent on interpolations from styles-components so I fully refactored it. Styles a little bit another, right. But here we can only improve them. What should I change?

Docs: page animation is broken

Could you clarify what animation do you mean?

fabiosantoscode · 2020-04-08T18:37:03Z

package.json

    "isomorphic-fetch": "^2.2.1",
-    "lodash.fill": "^3.4.0",
    "lodash.includes": "^4.3.0",
    "lodash.kebabcase": "^4.1.1",
    "lodash.startcase": "^4.4.0",
    "lodash.throttle": "^4.1.1",
    "lodash.topairs": "^4.3.0",


aside: we have tree-shaking so we can simply do:

import { get } from 'lodash'

Knowing only get is included in the bundle. So we don't have to install lodash bit by bit.

Unfortunately not =( Tree shaking usually works like a 💩
There are a lot articles which describe this problem, like this one https://www.azavea.com/blog/2019/03/07/lessons-on-tree-shaking-lodash/
But we can replace it via import get from lodash/get and it should work, but maybe it can be done in another PR (or tomorrow if it still won't be merged)

fabiosantoscode · 2020-04-08T18:40:23Z

src/components/Community/Contribute/index.tsx

+const logPR = (): void => logEvent('community', 'contribute-pr')
+const logBlogpost = (): void => logEvent('community', 'contribute-blogpost')
+const logTalk = (): void => logEvent('community', 'contribute-talk')
+const logAmbassador = (): void => logEvent('community', 'contribute-ambassador')


IIRC there's an option to not have to mark up every return type, if you get bored of doing that.

Yep, but we intentionally enabled this rule to have more strict type checking

fabiosantoscode · 2020-04-08T18:41:05Z

src/components/Community/Contribute/index.tsx

                  href="mailto:[email protected]?subject=I want to give a talk!"
                  target="_blank"
-                  rel="noreferrer noopener"


Why remove this?

It's now automatically handled by Link component

fabiosantoscode · 2020-04-08T18:43:54Z

src/utils/front/ga.ts

+
+  // eslint-disable-next-line @typescript-eslint/interface-name-prefix
+  interface Window {
+    ga: (command: 'send', data: IGaEvent | IGaException) => void


Should be ga?. Ad blockers and privacy extensions cause ga to not load.

window.ga is set by gatsby-plugin-google-analytics. I only described its interface

pavelgrinchenko self-assigned this Apr 1, 2020

shcheklein temporarily deployed to dvc-landing-ts-migratio-q78qb3 April 1, 2020 16:45 Inactive

pavelgrinchenko force-pushed the ts-migration branch from fd7c836 to 38ebda9 Compare April 2, 2020 18:09

shcheklein temporarily deployed to dvc-landing-ts-migratio-q78qb3 April 2, 2020 18:09 Inactive

pavelgrinchenko force-pushed the ts-migration branch from 38ebda9 to 3f85dc6 Compare April 3, 2020 07:59

shcheklein temporarily deployed to dvc-landing-ts-migratio-q78qb3 April 3, 2020 08:00 Inactive

pavelgrinchenko force-pushed the ts-migration branch from 3f85dc6 to 79bd2c1 Compare April 3, 2020 15:20

shcheklein temporarily deployed to dvc-landing-ts-migratio-q78qb3 April 3, 2020 15:21 Inactive

pavelgrinchenko force-pushed the ts-migration branch from 79bd2c1 to 5a8821a Compare April 3, 2020 15:35

shcheklein deployed to dvc-landing-ts-migratio-q78qb3 April 3, 2020 15:36 View deployment

shcheklein temporarily deployed to dvc-landing-ts-migratio-q78qb3 April 6, 2020 18:35 Inactive

shcheklein temporarily deployed to dvc-landing-ts-migratio-lrfc1h April 6, 2020 19:00 Inactive

shcheklein reviewed Apr 7, 2020

View reviewed changes

package.json Show resolved Hide resolved

shcheklein reviewed Apr 7, 2020

View reviewed changes

src/components/ShowOnly/styles.module.css Outdated Show resolved Hide resolved

pavelgrinchenko force-pushed the ts-migration branch from d7b4617 to bc25fec Compare April 7, 2020 07:38

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 7, 2020 07:38 Inactive

pavelgrinchenko force-pushed the ts-migration branch from bc25fec to b934a9f Compare April 7, 2020 12:22

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 7, 2020 12:22 Inactive

psdcoder added 12 commits April 7, 2020 15:23

Move blog's components under Blog namespace

19ae153

Restructure components

5edd0de

Allow to scroll smoothly in the scrollIntoLayout util function

421dae7

Replace styled-reset to reset-css. Merge global styles. Use local cla…

06ad93a

…ssNames instead of global in few components

Refactor Home page components to TS

f069e21

Remove duplicated component - TrySection and replace it with PromoSec…

c9922da

…tion

Refactor SubscribeSection to get rid of linter warning

22da091

Extend scroll utils

ab5712a

Create one common component for buttons with two rows: TwoRowButton. …

625cdc7

…Use it everywhere on main page. Refactor DownloadButton component

Refactor Support page components to TS

dacaf66

Fix scroll for no-hash links

d05da29

Disable trailing slash redirects for dev mode

b47d227

Make tsconfig more stricter. Remove wrong eslint rule and refactor al…

5c6107b

…l warnings

pavelgrinchenko force-pushed the ts-migration branch from 70a2cb1 to 5c6107b Compare April 8, 2020 09:37

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 8, 2020 09:37 Inactive

psdcoder added 9 commits April 8, 2020 13:02

Toggle mobile menu only in mobile version

0ae12ff

Fix Algolia's dropdown position

d142b35

Fix Get Started button for the mobile version of main page

f2c4326

Align buttons in PromoSection component for mobile view

ffa3e21

Fix comments blog rendering

d4b941e

Fix share buttons overlapping

1b1e3c6

Fix line height for main page sections titles

1eb4d42

Fix some styles for the main page

a96f30b

Fix styles of RightPanel

a4b2a58

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 8, 2020 11:45 Inactive

Change styles of docs abbr tooltip a little bit

7e06bdc

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 8, 2020 11:52 Inactive

psdcoder added 3 commits April 8, 2020 15:16

Fix initial scrolling in the RightPanel

368e7f4

Fix wrong tagname

37ab5b4

Fix scroll in the left sidebar

724cb7e

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 8, 2020 12:28 Inactive

psdcoder added 2 commits April 8, 2020 19:50

Move src/utils/node to src/gatsby

0d748ec

Fix animation for doc pages

7a35301

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 8, 2020 17:03 Inactive

psdcoder added 2 commits April 8, 2020 20:36

Fix styles for abbr tooltip

889f7ba

Fix svg images in the blog

56078f7

shcheklein temporarily deployed to dvc-landing-ts-migratio-bbtxq8 April 8, 2020 17:45 Inactive

fabiosantoscode suggested changes Apr 8, 2020

View reviewed changes

shcheklein approved these changes Apr 8, 2020

View reviewed changes

shcheklein merged commit d54388a into master Apr 8, 2020

kevgathuku mentioned this pull request Apr 16, 2020

Ensure icon on sidebar bullets is rotated when link is active #1157

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Migrate codebase to Typescript and CSS Modules #1106

Migrate codebase to Typescript and CSS Modules #1106

pavelgrinchenko commented Apr 1, 2020 •

edited

Loading

pavelgrinchenko commented Apr 8, 2020 •

edited

Loading

fabiosantoscode Apr 8, 2020

pavelgrinchenko Apr 8, 2020

fabiosantoscode Apr 8, 2020

pavelgrinchenko Apr 8, 2020

fabiosantoscode Apr 8, 2020

pavelgrinchenko Apr 8, 2020

fabiosantoscode Apr 8, 2020

pavelgrinchenko Apr 8, 2020

Migrate codebase to Typescript and CSS Modules #1106

Migrate codebase to Typescript and CSS Modules #1106

Conversation

pavelgrinchenko commented Apr 1, 2020 • edited Loading

pavelgrinchenko commented Apr 8, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pavelgrinchenko commented Apr 1, 2020 •

edited

Loading

pavelgrinchenko commented Apr 8, 2020 •

edited

Loading