Aug 3, 2021 · Aug 3, 2021 · Aug 3, 2021 · Aug 3, 2021 · Aug 3, 2021 · Aug 3, 2021
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
      - name: (Frontend) Build Project
        working-directory: ./frontend_server
        run: npm run build.ci
      - name:(Frontend) Check Bundle Size
      - name:check /etc/hosts
        working-directory: ./frontend_server
        run: BUNDLEWATCH_GITHUB_TOKEN=${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }} npm run size.check
      - name: (Frontend) Run e2e Tests
        run: echo "#>>>>#"; cat /etc/hosts; pwd; echo "#>>>>#"
      # - name: (Frontend) Check Bundle Size
      #   working-directory: ./frontend_server
      #   run: BUNDLEWATCH_GITHUB_TOKEN=${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }} npm run size.check
      # - name: (Frontend) Run e2e Tests
      #   working-directory: ./frontend_server
      #   run: npm run test:ci
  cypress-run:
    name: run cypress
    runs-on: ubuntu-latest
    steps:
      - name: Cypress run
        working-directory: ./frontend_server
        run: npm run test:ci
        uses: cypress-io/github-action@v2
        with:
          browser: chrome
          # build: npm run build
          start: npm run ci
          wait-on: http://localhost:3000
diff --git a/package.json b/package.json
    "dev": "cross-env NODE_ENV=dev node server.js",
    "prod": "cross-env NODE_ENV=production run-p server",
    "local": "cross-env NODE_ENV=local node server",
    "ci": "cross-env NODE_ENV=ci node server --inspect",
    "ci": "cross-env NODE_ENV=ci node server",
    "server": "npm run clean && node server.js",
    "build": "next build",
    "build:clean": "run-s dist clean",
    "bundlewatch": "^0.2.7",
    "commitizen": "3.1.2",
    "coveralls": "3.0.14",
    "cypress": "4.2.0",
    "cypress": "^8.1.0",
    "cz-conventional-changelog": "^3.0.0",
    "enzyme": "3.11.0",
    "enzyme-adapter-react-16": "1.15.2",
diff --git a/src/components/FormItem/index.js b/src/components/FormItem/index.js
 import T from 'prop-types'
 import { isEmpty } from 'ramda'

 import { buildLog, hasValue } from '@/utils'
 import { buildLog } from '@/utils/logger'
 import { hasValue } from '@/utils/validator'
 import { SIZE } from '@/constant'
 import Maybe from '@/components/Maybe'

diff --git a/src/components/Modal/Belt.js b/src/components/Modal/Belt.js
 import React from 'react'

 import{useScript}from '@/hooks'
 import useScript from '@/hooks/useScript'

 import { Wrapper, Holder } from './styles/belt'

diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx
 import { ICON_CMD } from '@/config'
 import { toggleGlobalBlur } from '@/utils/dom'
 import { buildLog } from '@/utils/logger'
 import{useShortcut}from '@/hooks'
 import useShortcut from '@/hooks/useShortcut'

 import ViewportTracker from '@/components/ViewportTracker'
 import Belt from './Belt'
diff --git a/src/components/NaviCatalog/index.tsx b/src/components/NaviCatalog/index.tsx
 import { find, findIndex, propEq, last } from 'ramda'

 import { URL_QUERY } from '@/constant'
 import {
  buildLog,
  nilOrEmpty,
  getQueryFromUrl,
  markRoute,
  findDeepMatch,
 } from '@/utils'

 import { findDeepMatch } from '@/utils/helper'
 import { buildLog } from '@/utils/logger'
 import { nilOrEmpty } from '@/utils/validator'
 import { getQueryFromUrl, markRoute } from '@/utils/route'

 import type { TMenuItem, TMenuMode } from './spec'
 import { ROOT_MENU, CHILD_MENU } from './constant'
diff --git a/src/components/PostItem/ListView.tsx b/src/components/PostItem/ListView.tsx

 import type { TPost } from '@/spec'
 import { ICON_CMD } from '@/config'
 import { cutRest, parseDomain } from '@/utils'
 import { cutRest } from '@/utils/helper'
 import { parseDomain } from '@/utils/route'

 import InlineTags from '@/components/InlineTags'

diff --git a/src/components/Switcher/Tabs/TabIcon.tsx b/src/components/Switcher/Tabs/TabIcon.tsx
 import React, { FC, useCallback } from 'react'
 import { FC, useCallback } from 'react'
 import dynamic from 'next/dynamic'

 import type { TTabItem } from '@/spec'
 import LocalIcon from './LocalIcon'
 import { Wrapper, Icon } from '../styles/tabs/tab_icon'

 type TProps = {
  active: boolean
 }

 export const LocalIcon = dynamic(() => import('./LocalIcon'), {
  ssr: false,
 })

 const TabIcon: FC<TProps> = ({ item, clickableRef, active }) => {
  const { localIcon, icon } = item

diff --git a/src/components/Switcher/Tabs/TabItem.tsx b/src/components/Switcher/Tabs/TabItem.tsx
 import { FC, useEffect, useCallback, useRef, memo } from 'react'

 import type { TSIZE_SM, TTabItem } from '@/spec'
 import { buildLog, isString, Trans } from '@/utils'
 import { Trans } from '@/utils/i18n'
 import { isString } from '@/utils/validator'
 import { buildLog } from '@/utils/logger'

 import TabIcon from './TabIcon'
 import {
diff --git a/src/components/ThemeSelector/styles/index.ts b/src/components/ThemeSelector/styles/index.ts
 import styled from 'styled-components'

 import type { TActive, TThemeName } from '@/spec'
 import { theme, themeCoverMap, themeCoverIndexMap, css } from '@/utils'
 import { theme, themeCoverMap, themeCoverIndexMap } from '@/utils/themes'
 import css from '@/utils/css'

 type TDot = TActive & { name: TThemeName }
 export const Dot = styled.div<TDot>`
diff --git a/src/components/Tooltip/RealTooltip.tsx b/src/components/Tooltip/RealTooltip.tsx
 import { hideAll } from 'tippy.js'

 import type { TTooltipPlacement } from '@/spec'
 import { css, buildLog, isDescendant, isString } from '@/utils'
 import { useOutsideClick } from '@/hooks'

 import css from '@/utils/css'
 import { buildLog } from '@/utils/logger'
 import { isString } from '@/utils/validator'
 import { isDescendant } from '@/utils/dom'

 import useOutsideClick from '@/hooks/useOutsideClick'

 import ConfirmFooter from './ConfirmFooter'
 import { FOOTER_BEHAVIOR } from './constant'
diff --git a/src/components/UserBrief/NumbersPad.js b/src/components/UserBrief/NumbersPad.js
 import React from 'react'

 import { prettyNum } from '@/utils'
 import { prettyNum } from '@/utils/helper'
 import { Wrapper, Section, Title, Number } from './styles/numbers_pad'

 const NumbersPad = ({ user, listFollowers, listFollowings }) => (
diff --git a/src/components/UserBrief/SocialIcons.js b/src/components/UserBrief/SocialIcons.js
 import { contains } from 'ramda'

 import { ICON_CMD } from '@/config'
 import { nilOrEmpty, SOCIAL_LISTS } from '@/utils'
 import SOCIAL_LISTS from '@/utils/social'
 import { nilOrEmpty } from '@/utils/validator'

 import Tooltip from '@/components/Tooltip'
 import { Wrapper, Linker, SocialIcon } from './styles/social_icons'
diff --git a/src/containers/Route/index.js b/src/containers/Route/index.js
 import React from 'react'
 import { useRouter } from 'next/router'

 import { pluggedIn } from '@/utils'
 import { pluggedIn } from '@/utils/mobx'
 import { useInit } from './logic'

 const RouteContainer = ({ route }) => {
diff --git a/src/containers/Route/logic.js b/src/containers/Route/logic.js
 import { useEffect } from 'react'
 import { Global, buildLog, parseURL } from '@/utils'

 import { parseURL } from '@/utils/route'
 import { Global } from '@/utils/helper'
 import { buildLog } from '@/utils/logger'

 /* eslint-disable-next-line */
 const log = buildLog('L:Route')
diff --git a/src/containers/content/ArticleContent/logic.ts b/src/containers/content/ArticleContent/logic.ts
 import { useEffect } from 'react'

 import { EVENT, ERR } from '@/constant'
 import { asyncSuit, buildLog, errRescue, isElementInViewport } from '@/utils'
 import { isElementInViewport } from '@/utils/dom'
 import { errRescue } from '@/utils/helper'
 import { buildLog } from '@/utils/logger'
 import asyncSuit from '@/utils/async'

 import type { TStore } from './store'
 import S from './schema'
diff --git a/src/containers/content/ArticleContent/styles/desktop_view/index.tsx b/src/containers/content/ArticleContent/styles/desktop_view/index.tsx
 import styled from 'styled-components'

 import type { TTestable, TMetric } from '@/spec'
 import { theme, css, WIDTH } from '@/utils'
 import css from '@/utils/css'
 import { theme } from '@/utils/themes'
 import { WIDTH } from '@/utils/css/metric'

 export const Wrapper = styled.article.attrs(({ testid }: TTestable) => ({
  'data-test-id': testid,
diff --git a/src/containers/content/CommunityContent/logic.ts b/src/containers/content/CommunityContent/logic.ts

 import type { TThread } from '@/spec'
 import { ERR, EVENT, ARTICLE_THREAD } from '@/constant'
 import { send, asyncSuit, buildLog, errRescue, thread2Subpath } from '@/utils'

 import { send, errRescue } from '@/utils/helper'
 import { thread2Subpath } from '@/utils/route'
 import asyncSuit from '@/utils/async'
 import { buildLog } from '@/utils/logger'

 import type { TStore } from './store'

diff --git a/src/containers/content/CoolGuideContent/FilterBar.tsx b/src/containers/content/CoolGuideContent/FilterBar.tsx
 import { FC, Fragment, memo } from 'react'

 import { ICON_CMD } from '@/config'
 import { mockNaviCatalogMenu } from '@/utils'
 import { mockNaviCatalogMenu } from '@/utils/mock'

 import Sticky from '@/components/Sticky'
 import NaviIntro from '@/components/NaviIntro'
diff --git a/src/containers/content/CoolGuideContent/logic.ts b/src/containers/content/CoolGuideContent/logic.ts
 import { useEffect } from 'react'

 import { ERR } from '@/constant'
 import { asyncSuit, buildLog, errRescue } from '@/utils'
 import { errRescue } from '@/utils/helper'
 import asyncSuit from '@/utils/async'
 import { buildLog } from '@/utils/logger'

 import type { TStore } from './store'

diff --git a/src/containers/content/DiscoveryContent/CommunityCard.js b/src/containers/content/DiscoveryContent/CommunityCard.js
 import { contains } from 'ramda'

 import { NON_FILL_COMMUNITY } from '@/constant'
 import { prettyNum, cutRest } from '@/utils'
 import { prettyNum, cutRest } from '@/utils/helper'

 import TrendLine from '@/components/TrendLine'
 import { CommunityHolder } from '@/components/Loading'
diff --git a/src/containers/content/DiscoveryContent/logic.js b/src/containers/content/DiscoveryContent/logic.js
 import { isEmpty } from 'ramda'

 import { EVENT, ERR } from '@/constant'
 import {
  asyncSuit,
  buildLog,
  pagedFilter,
  errRescue,
  updateEditing,
 } from '@/utils'

 import { errRescue } from '@/utils/helper'
 import { pagedFilter } from '@/utils/graphql'
 import asyncSuit from '@/utils/async'
 import { buildLog } from '@/utils/logger'
 import { updateEditing } from '@/utils/mobx'

 import S from './schema'

diff --git a/src/containers/content/HaveADrinkContent/index.tsx b/src/containers/content/HaveADrinkContent/index.tsx
 import dynamic from 'next/dynamic'

 import type { TMetric } from '@/spec'
 import { pluggedIn, buildLog, scrollToTop, lockPage, unlockPage } from '@/utils'
 import { useShortcut } from '@/hooks'
 import { scrollToTop, lockPage, unlockPage } from '@/utils/dom'
 import { buildLog } from '@/utils/logger'
 import { pluggedIn } from '@/utils/mobx'

 import useShortcut from '@/hooks/useShortcut'

 import type { TStore } from './store'
 import Header from './Header'
diff --git a/src/containers/content/HaveADrinkContent/logic.ts b/src/containers/content/HaveADrinkContent/logic.ts
 import { useEffect } from 'react'

 import { ERR } from '@/constant'
 import { asyncSuit, buildLog, errRescue } from '@/utils'

 import { errRescue } from '@/utils/helper'
 import asyncSuit from '@/utils/async'
 import { buildLog } from '@/utils/logger'

 import { ANIMATE_TIMER_CLASS } from './constant'
 import type { TStore } from './store'
diff --git a/src/containers/content/MeetupsContent/logic.ts b/src/containers/content/MeetupsContent/logic.ts
 import { useEffect } from 'react'

 import { ERR } from '@/constant'
 import { asyncSuit, buildLog, errRescue } from '@/utils'

 import { errRescue } from '@/utils/helper'
 import asyncSuit from '@/utils/async'
 import { buildLog } from '@/utils/logger'

 import type { TStore } from './store'

diff --git a/src/containers/content/MembershipContent/logic.ts b/src/containers/content/MembershipContent/logic.ts

 import { SENIOR_AMOUNT_THRESHOLD } from '@/config'
 import { PAYMENT_USAGE } from '@/constant'
 import { asyncSuit, buildLog } from '@/utils'
 import asyncSuit from '@/utils/async'
 import { buildLog } from '@/utils/logger'

 import type { TStore } from './store'
 import type { TPackage } from './spec'
diff --git a/src/containers/content/MembershipContent/styles/illustrations/index.ts b/src/containers/content/MembershipContent/styles/illustrations/index.ts
 import styled, { css as styledCss } from 'styled-components'

 import type { TActive } from '@/spec'
 import { animate, css } from '@/utils'
 import css from '@/utils/css'
 import animate from '@/utils/animations'
 import Img from '@/Img'

 export const Wrapper = styled.div<TActive>`
diff --git a/src/containers/content/MembershipContent/styles/illustrations/ufo.ts b/src/containers/content/MembershipContent/styles/illustrations/ufo.ts
 import styled, { css as styledCss } from 'styled-components'

 import type { TTestable, TActive } from '@/spec'
 import { animate, css } from '@/utils'
 import css from '@/utils/css'
 import animate from '@/utils/animations'

 import {
  Star1 as Star1Base,
diff --git a/src/containers/content/RecipesContent/tempData.js b/src/containers/content/RecipesContent/tempData.js
 import { ICON_BASE } from '@/config'
 import{uid}from '@/utils'
 import uid from '@/utils/uid'

 const menu = [
  {
diff --git a/src/containers/content/SubscribeContent/Actions/Detail.js b/src/containers/content/SubscribeContent/Actions/Detail.js

 import { ICON_CMD } from '@/config'

 import{useCopyToClipboard}from '@/hooks'
 import useCopyToClipboard from 'react-use/lib/useCopyToClipboard'
 import EmailSubscriber from '@/components/EmailSubscriber'
 import { Br, SpaceGrow } from '@/components/Common'
 // TODO: extract to Email Subscriber
diff --git a/src/containers/content/SubscribeContent/styles/index.ts b/src/containers/content/SubscribeContent/styles/index.ts
 import styled from 'styled-components'

 import type { TTestable } from '@/spec'
 import { css, theme, WIDTH } from '@/utils'
 import Sticky from '@/components/Sticky'

 import { theme } from '@/utils/themes'
 import css from '@/utils/css'
 import { WIDTH } from '@/utils/css/metric'

 export const Wrapper = styled.div.attrs(({ testid }: TTestable) => ({
  'data-test-id': testid,
 }))<TTestable>`
diff --git a/src/containers/content/UserContent/logic.ts b/src/containers/content/UserContent/logic.ts

 import type { TID, TThread, TUser } from '@/spec'
 import { TYPE, EVENT, ERR } from '@/constant'
 import { asyncSuit, buildLog, send, errRescue } from '@/utils'

 import asyncSuit from '@/utils/async'
 import { send, errRescue } from '@/utils/helper'
 import { buildLog } from '@/utils/logger'

 import type { TStore } from './store'
Original file line number	Diff line number	Diff line change
Expand Up		@@ -87,9 +87,24 @@ jobs:
		- name: (Frontend) Build Project
		working-directory: ./frontend_server
		run: npm run build.ci
		- name:(Frontend) Check Bundle Size
		- name:check /etc/hosts
		working-directory: ./frontend_server
		run: BUNDLEWATCH_GITHUB_TOKEN=${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }} npm run size.check
		- name: (Frontend) Run e2e Tests
		run: echo "#>>>>#"; cat /etc/hosts; pwd; echo "#>>>>#"
		# - name: (Frontend) Check Bundle Size
		# working-directory: ./frontend_server
		# run: BUNDLEWATCH_GITHUB_TOKEN=${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }} npm run size.check
		# - name: (Frontend) Run e2e Tests
		# working-directory: ./frontend_server
		# run: npm run test:ci
		cypress-run:
		name: run cypress
		runs-on: ubuntu-latest
		steps:
		- name: Cypress run
		working-directory: ./frontend_server
		run: npm run test:ci
		uses: cypress-io/github-action@v2
		with:
		browser: chrome
		# build: npm run build
		start: npm run ci
		wait-on: http://localhost:3000
Original file line number	Diff line number	Diff line change
Expand Up		@@ -6,7 +6,7 @@
		"dev": "cross-env NODE_ENV=dev node server.js",
		"prod": "cross-env NODE_ENV=production run-p server",
		"local": "cross-env NODE_ENV=local node server",
		"ci": "cross-env NODE_ENV=ci node server --inspect",
		"ci": "cross-env NODE_ENV=ci node server",
		"server": "npm run clean && node server.js",
		"build": "next build",
		"build:clean": "run-s dist clean",
Expand DownExpand Up		@@ -149,7 +149,7 @@
		"bundlewatch": "^0.2.7",
		"commitizen": "3.1.2",
		"coveralls": "3.0.14",
		"cypress": "4.2.0",
		"cypress": "^8.1.0",
		"cz-conventional-changelog": "^3.0.0",
		"enzyme": "3.11.0",
		"enzyme-adapter-react-16": "1.15.2",
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -8,7 +8,8 @@ import React from 'react'
		import T from 'prop-types'
		import { isEmpty } from 'ramda'

		import { buildLog, hasValue } from '@/utils'
		import { buildLog } from '@/utils/logger'
		import { hasValue } from '@/utils/validator'
		import { SIZE } from '@/constant'
		import Maybe from '@/components/Maybe'

Expand Down
Original file line number	Diff line number	Diff line change
		@@ -1,6 +1,6 @@
		import React from 'react'

		import{useScript}from '@/hooks'
		import useScript from '@/hooks/useScript'

		import { Wrapper, Holder } from './styles/belt'

Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -10,7 +10,7 @@ import usePortal from 'react-useportal'
		import { ICON_CMD } from '@/config'
		import { toggleGlobalBlur } from '@/utils/dom'
		import { buildLog } from '@/utils/logger'
		import{useShortcut}from '@/hooks'
		import useShortcut from '@/hooks/useShortcut'

		import ViewportTracker from '@/components/ViewportTracker'
		import Belt from './Belt'
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -8,13 +8,11 @@ import { FC, useState, useCallback, useEffect, memo } from 'react'
		import { find, findIndex, propEq, last } from 'ramda'

		import { URL_QUERY } from '@/constant'
		import {
		buildLog,
		nilOrEmpty,
		getQueryFromUrl,
		markRoute,
		findDeepMatch,
		} from '@/utils'

		import { findDeepMatch } from '@/utils/helper'
		import { buildLog } from '@/utils/logger'
		import { nilOrEmpty } from '@/utils/validator'
		import { getQueryFromUrl, markRoute } from '@/utils/route'

		import type { TMenuItem, TMenuMode } from './spec'
		import { ROOT_MENU, CHILD_MENU } from './constant'
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -3,7 +3,8 @@ import TimeAgo from 'timeago-react'

		import type { TPost } from '@/spec'
		import { ICON_CMD } from '@/config'
		import { cutRest, parseDomain } from '@/utils'
		import { cutRest } from '@/utils/helper'
		import { parseDomain } from '@/utils/route'

		import InlineTags from '@/components/InlineTags'

Expand Down
Original file line number	Diff line number	Diff line change
		@@ -1,7 +1,7 @@
		import React, { FC, useCallback } from 'react'
		import { FC, useCallback } from 'react'
		import dynamic from 'next/dynamic'

		import type { TTabItem } from '@/spec'
		import LocalIcon from './LocalIcon'
		import { Wrapper, Icon } from '../styles/tabs/tab_icon'

		type TProps = {
Expand All		@@ -12,6 +12,10 @@ type TProps = {
		active: boolean
		}

		export const LocalIcon = dynamic(() => import('./LocalIcon'), {
		ssr: false,
		})

		const TabIcon: FC<TProps> = ({ item, clickableRef, active }) => {
		const { localIcon, icon } = item

Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -7,7 +7,9 @@
		import { FC, useEffect, useCallback, useRef, memo } from 'react'

		import type { TSIZE_SM, TTabItem } from '@/spec'
		import { buildLog, isString, Trans } from '@/utils'
		import { Trans } from '@/utils/i18n'
		import { isString } from '@/utils/validator'
		import { buildLog } from '@/utils/logger'

		import TabIcon from './TabIcon'
		import {
Expand Down
Original file line number	Diff line number	Diff line change
		@@ -1,7 +1,8 @@
		import styled from 'styled-components'

		import type { TActive, TThemeName } from '@/spec'
		import { theme, themeCoverMap, themeCoverIndexMap, css } from '@/utils'
		import { theme, themeCoverMap, themeCoverIndexMap } from '@/utils/themes'
		import css from '@/utils/css'

		type TDot = TActive & { name: TThemeName }
		export const Dot = styled.div<TDot>`
Expand Down