Merge pull request #1352 from thematters/develop

Release: v3.11.0

.env.dev

@@ -8,9 +8,9 @@
 
 NEXT_PUBLIC_SITE_DOMAIN=https://web-develop.matters.news
 NEXT_PUBLIC_ASSET_DOMAIN=https://assets-develop.matters.news
-NEXT_PUBLIC_API_URL=https://server-stage.matters.news/graphql
-NEXT_PUBLIC_WS_URL=wss://server-stage.matters.news/graphql
-NEXT_PUBLIC_OAUTH_URL=https://server-stage.matters.news/oauth
+NEXT_PUBLIC_API_URL=https://server-develop.matters.news/graphql
+NEXT_PUBLIC_WS_URL=wss://server-develop.matters.news/graphql
+NEXT_PUBLIC_OAUTH_URL=https://server-develop.matters.news/oauth
 NEXT_PUBLIC_SEGMENT_KEY=3gE20MjzN9qncFqlKV0pDvNO7Cp2gWU3
 NEXT_PUBLIC_FB_APP_ID=823885921293850
 NEXT_PUBLIC_SENTRY_DSN=https://[email protected]/2

package.json

@@ -1,14 +1,14 @@
 {
   "name": "matters-web",
-  "version": "3.10.2",
+  "version": "3.11.0",
   "description": "codebase of Matters' website",
   "sideEffects": false,
-  "author": "",
+  "author": "Matters <[email protected]>",
   "engines": {
     "node": ">=12.16",
     "npm": ">=6.14"
   },
-  "license": "ISC",
+  "license": "Apache-2.0",
   "scripts": {
     "dev": "PORT=\"${PORT:-3000}\"; next -p $PORT",
     "start": "PORT=\"${PORT:-3000}\"; next start -p $PORT",
@@ -41,7 +41,7 @@
     "@reach/alert": "^0.10.5",
     "@reach/dialog": "^0.10.5",
     "@reach/visually-hidden": "^0.10.4",
-    "@sentry/browser": "^5.19.1",
+    "@sentry/browser": "^5.20.0",
     "@stripe/react-stripe-js": "^1.1.2",
     "@stripe/stripe-js": "^1.8.0",
     "@tippyjs/react": "^4.0.4",
@@ -56,17 +56,17 @@
     "apollo-utilities": "^1.3.4",
     "autosize": "^4.0.2",
     "classnames": "^2.2.6",
-    "date-fns": "^2.14.0",
+    "date-fns": "^2.15.0",
     "express": "^4.17.1",
     "fingerprintjs2": "^2.1.0",
-    "firebase": "^7.15.5",
-    "formik": "^2.1.4",
+    "firebase": "^7.17.0",
+    "formik": "^2.1.5",
     "graphql": "^14.7.0",
-    "graphql-tag": "^2.10.3",
+    "graphql-tag": "^2.10.4",
     "helmet": "^3.23.3",
     "isomorphic-unfetch": "^3.0.0",
     "jump.js": "^1.0.2",
-    "lodash": "^4.17.15",
+    "lodash": "^4.17.19",
     "next": "^9.4.4",
     "next-with-apollo": "^5.1.0",
     "nprogress": "^0.2.0",
@@ -78,32 +78,32 @@
     "react-beautiful-dnd": "^13.0.0",
     "react-copy-to-clipboard": "^5.0.2",
     "react-dom": "^16.13.1",
-    "react-focus-lock": "^2.4.0",
+    "react-focus-lock": "^2.4.1",
     "react-remove-scroll": "^2.3.0",
     "react-spring": "^9.0.0-rc.3",
     "react-use-gesture": "^7.0.15",
     "react-virtualized": "^9.21.2",
     "react-waypoint": "^9.0.3",
-    "subscriptions-transport-ws": "^0.9.16",
+    "subscriptions-transport-ws": "^0.9.17",
     "use-debounce": "^3.4.3",
     "validator": "^13.1.1"
   },
   "devDependencies": {
     "@babel/plugin-proposal-optional-chaining": "^7.10.4",
     "@svgr/webpack": "^5.4.0",
-    "@testing-library/react": "^10.4.4",
+    "@testing-library/react": "^10.4.7",
     "@types/autosize": "^3.0.7",
     "@types/classnames": "^2.2.10",
-    "@types/express": "^4.17.4",
+    "@types/express": "^4.17.7",
     "@types/fingerprintjs2": "^2.0.0",
     "@types/grecaptcha": "^3.0.1",
     "@types/helmet": "0.0.47",
-    "@types/jest": "^26.0.3",
+    "@types/jest": "^26.0.5",
     "@types/jump.js": "^1.0.3",
-    "@types/lodash": "^4.14.157",
+    "@types/lodash": "^4.14.158",
     "@types/nprogress": "0.2.0",
     "@types/pulltorefreshjs": "^0.1.3",
-    "@types/react": "^16.9.41",
+    "@types/react": "^16.9.43",
     "@types/react-beautiful-dnd": "^13.0.0",
     "@types/react-copy-to-clipboard": "^4.3.0",
     "@types/react-dom": "^16.9.8",
@@ -113,11 +113,11 @@
     "@types/styled-jsx": "^2.2.8",
     "@types/validator": "^13.1.0",
     "@zeit/next-bundle-analyzer": "^0.1.2",
-    "apollo": "^2.28.3",
+    "apollo": "^2.30.1",
     "babel-jest": "^26.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-polyfill": "^6.26.0",
-    "chromedriver": "^83.0.0",
+    "chromedriver": "^84.0.1",
     "cucumber": "^6.0.5",
     "cucumber-pretty": "^6.0.0",
     "cz-conventional-changelog": "^3.2.0",
@@ -132,7 +132,7 @@
     "next-compose-plugins": "^2.2.0",
     "next-offline": "^5.0.0-beta.10",
     "next-optimized-images": "^2.6.1",
-    "nightwatch": "^1.3.6",
+    "nightwatch": "^1.3.7",
     "nightwatch-api": "^3.0.1",
     "postcss-calc": "^7.0.2",
     "postcss-color-function": "^4.1.0",
@@ -153,7 +153,7 @@
     "tslint-config-prettier": "^1.18.0",
     "tslint-react": "^4.2.0",
     "tslint-react-hooks": "^2.2.2",
-    "typescript": "^3.9.6"
+    "typescript": "^3.9.7"
   },
   "prettier": {
     "singleQuote": true,

src/common/enums/errorCode.ts

@@ -43,6 +43,7 @@ export const ERROR_CODES = {
 
   // TAG
   DUPLICATE_TAG: 'DUPLICATE_TAG',
+  NOT_ALLOW_ADD_TAG: 'NOT_ALLOW_ADD_TAG',
 
   // Verification Code
   CODE_INVALID: 'CODE_INVALID',

src/common/enums/route.ts

@@ -12,8 +12,6 @@ type ROUTE_KEY =
   | 'HOME'
   | 'FOLLOW'
   | 'AUTHORS'
-  | 'TOPICS'
-  | 'ICYMI'
   | 'SEARCH'
   | 'TAGS'
   | 'TAG_DETAIL'
@@ -58,12 +56,14 @@ export const ROUTES: Array<{
   pathname: string
   handler?: (req: Request, res: Response, next: NextFunction) => any
 }> = [
+  /**
+   * Public
+   */
   { key: 'HOME', pathname: '/' },
   { key: 'FOLLOW', pathname: '/follow' },
   { key: 'AUTHORS', pathname: '/authors' },
-  { key: 'TOPICS', pathname: '/topics' },
-  { key: 'ICYMI', pathname: '/icymi' },
   { key: 'SEARCH', pathname: '/search' },
+
   // experient page for recommendation engine testing
   { key: 'RECOMMENDATION', pathname: '/recommendation' },
 
@@ -80,6 +80,22 @@ export const ROUTES: Array<{
   // Article
   { key: 'ARTICLE_DETAIL', pathname: '/[userName]/[mediaHash]' },
 
+  // Auth
+  { key: 'LOGIN', pathname: '/login' },
+  { key: 'SIGNUP', pathname: '/signup' },
+  { key: 'FORGET', pathname: '/forget' },
+
+  // Misc
+  { key: 'HELP', pathname: '/help' },
+  { key: 'MIGRATION', pathname: '/migration' },
+  { key: 'ABOUT', pathname: '/about' },
+  { key: 'GUIDE', pathname: '/guide' },
+  { key: 'COMMUNITY', pathname: '/community' },
+  { key: 'TOS', pathname: '/tos' },
+
+  /**
+   * Protected
+   */
   // Me
   { key: 'ME_DRAFTS', pathname: '/me/drafts' },
   { key: 'ME_BOOKMARKS', pathname: '/me/bookmarks' },
@@ -107,11 +123,6 @@ export const ROUTES: Array<{
   // Draft
   { key: 'ME_DRAFT_DETAIL', pathname: '/me/drafts/[draftId]' },
 
-  // Auth
-  { key: 'LOGIN', pathname: '/login' },
-  { key: 'SIGNUP', pathname: '/signup' },
-  { key: 'FORGET', pathname: '/forget' },
-
   // OAuth
   { key: 'OAUTH_AUTHORIZE', pathname: '/oauth/authorize' },
   { key: 'OAUTH_CALLBACK_SUCCESS', pathname: '/oauth/[provider]/success' },
@@ -120,14 +131,6 @@ export const ROUTES: Array<{
   // Pay
   { key: 'PAY_CALLBACK_SUCCESS', pathname: '/pay/[provider]/success' },
   { key: 'PAY_CALLBACK_FAILURE', pathname: '/pay/[provider]/failure' },
-
-  // Misc
-  { key: 'HELP', pathname: '/help' },
-  { key: 'MIGRATION', pathname: '/migration' },
-  { key: 'ABOUT', pathname: '/about' },
-  { key: 'GUIDE', pathname: '/guide' },
-  { key: 'COMMUNITY', pathname: '/community' },
-  { key: 'TOS', pathname: '/tos' },
 ]
 
 export const UrlFragments = {

src/common/enums/text.ts

@@ -71,6 +71,7 @@ export const TEXT = {
     draft: '草稿',
     DUPLICATE_TAG: '標籤名稱已被使用',
     edit: '編輯',
+    editArticle: '編輯作品',
     editComment: '編輯評論',
     editTag: '編輯標籤',
     editUserProfile: '編輯資料',
@@ -152,6 +153,7 @@ export const TEXT = {
     NETWORK_ERROR: '網路錯誤，請用力刷新',
     newPassword: '新密碼',
     nextStep: '下一步',
+    NOT_ALLOW_ADD_TAG: '無法添加',
     NOT_ENOUGH_MAT: '沒有足夠的 MAT 以讚賞',
     NOTICE_NOT_FOUND: '通知不存在',
     notification: '通知',
@@ -234,6 +236,8 @@ export const TEXT = {
     tagDescriptionPlaceholder: '輸入一段標籤描述…',
     tagEdited: '標籤已更新',
     tagName: '標籤名稱',
+    tagAddArticle: '添加我的作品',
+    tagAddSelectedArticle: '添加精選內容',
     term: '用戶協議',
     termAndPrivacy: '用戶協議與隱私政策',
     termHint: '我們的用戶協議和隱私政策發生了更改，請閱讀並同意後繼續使用。',
@@ -342,6 +346,7 @@ export const TEXT = {
     draft: '草稿',
     DUPLICATE_TAG: '标签名称已被使用',
     edit: '编辑',
+    editArticle: '編輯作品',
     editComment: '编辑评论',
     editTag: '编辑标签',
     editUserProfile: '编辑资料',
@@ -423,6 +428,7 @@ export const TEXT = {
     NETWORK_ERROR: '网络不给力，请用力刷新',
     newPassword: '新密码',
     nextStep: '下一步',
+    NOT_ALLOW_ADD_TAG: '无法添加',
     NOT_ENOUGH_MAT: '没有足够的 MAT 以赞赏',
     NOTICE_NOT_FOUND: '通知不存在',
     notification: '通知',
@@ -506,6 +512,8 @@ export const TEXT = {
     tagDescriptionPlaceholder: '输入一段话题描述…',
     tagEdited: '标签已更新',
     tagName: '标签名称',
+    tagAddArticle: '添加我的作品',
+    tagAddSelectedArticle: '添加精选內容',
     term: '用户协议',
     termAndPrivacy: '用户协议与隐私政策',
     termHint: '我们的用户协议和隐私政策发生了更改，请阅读并同意后继续使用。',

src/common/styles/layouts/grids.css

@@ -8,9 +8,9 @@
  * Row
  */
 .l-row {
+  lost-center: 100%;
   margin-right: 1rem;
   margin-left: 1rem;
-  lost-center: 100%;
 
   @media (--sm-up) {
     & {

src/common/utils/analytics.ts

@@ -25,6 +25,8 @@ type EventArgs =
   | ['load_more', LoadMoreProp]
   | ['share', ShareProp]
   | ['purchase', PurchaseProp]
+  | ['view_add_credit_dialog', ViewDialogProp]
+  | ['view_donation_dialog', ViewDialogProp]
 
 type ClickFeedProp =
   | ArticleFeedProp
@@ -70,6 +72,10 @@ interface PurchaseProp {
   message?: string
 }
 
+interface ViewDialogProp {
+  step: string
+}
+
 interface ArticleFeedProp {
   type: ArticleFeedType
 

src/common/utils/types/index.ts

@@ -54,6 +54,7 @@ export default gql`
   enum FollowFeedType {
     article
     comment
+    tag
   }
 
   enum ViewMode {

src/common/utils/withApollo.ts

@@ -43,7 +43,6 @@ const persistedQueryLink = createPersistedQueryLink({
 const httpLink = ({ headers }: { [key: string]: any }) =>
   createUploadLink({
     uri: process.env.NEXT_PUBLIC_API_URL,
-    credentials: 'include',
     headers,
     fetchOptions: {
       agent,
@@ -67,8 +66,17 @@ const errorLink = onError(({ graphQLErrors, networkError }) => {
   }
 })
 
-const authLink = setContext((_, { headers }) => {
+const authLink = setContext((operation, { headers }) => {
+  const operationName = operation.operationName || ''
+
+  if (process.env.NODE_ENV !== 'production') {
+    console.log(`\x1b[32m[GraphQL operation]\x1b[0m`, operationName)
+  }
+
+  const isPublicOperation = /Public$/.test(operationName)
+
   return {
+    credentials: isPublicOperation ? 'omit' : 'include',
     headers: {
       ...headers,
       'x-client-name': 'web',
@@ -122,9 +130,9 @@ export default withApollo(({ ctx, headers, initialState }) => {
     link: ApolloLink.from([
       persistedQueryLink,
       errorLink,
-      authLink,
       sentryLink,
       agentHashLink,
+      authLink,
       httpLink({ headers }),
     ]),
     cache,

src/components/ArticleDigest/DropdownActions/ArchiveArticle/Dialog.tsx

@@ -12,7 +12,7 @@ import { ArchiveArticleArticle } from './__generated__/ArchiveArticleArticle'
 
 const ARCHIVE_ARTICLE = gql`
   mutation ArchiveArticle($id: ID!) {
-    archiveArticle(input: { id: $id }) {
+    editArticle(input: { id: $id, state: archived }) {
       id
       articleState: state
       sticky
@@ -36,7 +36,7 @@ const ArchiveArticleDialog = ({
   const [archiveArticle] = useMutation<ArchiveArticle>(ARCHIVE_ARTICLE, {
     variables: { id: article.id },
     optimisticResponse: {
-      archiveArticle: {
+      editArticle: {
         id: article.id,
         articleState: 'archived' as any,
         sticky: false,

src/components/ArticleDigest/DropdownActions/EditButton.tsx

@@ -0,0 +1,13 @@
+import { IconEdit, Menu, TextIcon, Translate } from '~/components'
+
+const EditArticleButton = ({ editArticle }: { editArticle: () => void }) => {
+  return (
+    <Menu.Item onClick={editArticle}>
+      <TextIcon icon={<IconEdit size="md" />} size="md" spacing="base">
+        <Translate id="editArticle" />
+      </TextIcon>
+    </Menu.Item>
+  )
+}
+
+export default EditArticleButton