Merge pull request #1435 from ChainSafe/dev

Release latest fixes and updates

.github/workflows/lingui-extract-files.yml

@@ -16,7 +16,6 @@ jobs:
       with:
         ref: ${{ github.event.pull_request.head.ref }}
         ssh-key: ${{ secrets.LINGUI_GH_ACTION_COMMIT_KEY }}
-
     - name: set user
       run: |
         git config --global user.name 'GitHub Actions'
@@ -32,6 +31,7 @@ jobs:
       run: yarn install --immutable
 
     - name: lingui-extract and commit
+      if: ${{ github.actor != 'weblate' }}
       run: |
         (cd packages/files-ui && yarn extract --clean)
         git add packages/files-ui/src/locales/*

.github/workflows/lingui-extract-gaming.yml

@@ -16,7 +16,6 @@ jobs:
       with:
         ref: ${{ github.event.pull_request.head.ref }}
         ssh-key: ${{ secrets.LINGUI_GH_ACTION_COMMIT_KEY }}
-
     - name: set user
       run: |
         git config --global user.name 'GitHub Actions'
@@ -31,7 +30,8 @@ jobs:
     - name: install packages
       run: yarn install --immutable
 
-    - name: lingui-extract
+    - name: lingui-extract and commit
+      if: ${{ github.actor != 'weblate' }}
       run: |
         (cd packages/gaming-ui && yarn extract --clean)
         git add packages/gaming-ui/src/locales/*

.github/workflows/lingui-extract-storage.yml

@@ -16,7 +16,6 @@ jobs:
       with:
         ref: ${{ github.event.pull_request.head.ref }}
         ssh-key: ${{ secrets.LINGUI_GH_ACTION_COMMIT_KEY }}
-
     - name: set user
       run: |
         git config --global user.name 'GitHub Actions'
@@ -29,13 +28,10 @@ jobs:
         key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
 
     - name: install packages
-      env:
-        GITHUB_PACKAGES_AUTH_TOKEN: ${{ secrets.GH_PKG_AUTH_TOKEN }}
       run: yarn install --immutable
 
-    - name: lingui-extract
-      env:
-        GITHUB_PACKAGES_AUTH_TOKEN: ${{ secrets.GH_PKG_AUTH_TOKEN }}
+    - name: lingui-extract and commit
+      if: ${{ github.actor != 'weblate' }}
       run: |
         (cd packages/storage-ui && yarn extract --clean)
         git add packages/storage-ui/src/locales/*

.github/workflows/test-files.yml

@@ -11,7 +11,7 @@ on:
 jobs:
   cypress-run:
     runs-on: ubuntu-latest
-    container: cypress/browsers:node14.16.0-chrome90-ff88
+    container: cypress/browsers:node14.17.0-chrome91-ff89
     steps:
       - name: Checkout
         uses: actions/checkout@v2

packages/common-components/src/TagsInput/TagsInput.tsx

@@ -7,7 +7,7 @@ import {
 } from "@chainsafe/common-theme"
 import clsx from "clsx"
 import AsyncSelect from "react-select/async"
-import { Typography } from ".."
+import { Typography } from "../Typography"
 import { Styles, ValueType, ActionMeta, ActionTypes } from "react-select"
 
 const useStyles = makeStyles(

packages/common-components/src/ToggleHiddenText/ToggleHiddenText.tsx

@@ -0,0 +1,68 @@
+import { createStyles, ITheme, makeStyles } from "@chainsafe/common-theme"
+import React, { ReactNode, useCallback, useMemo, useState } from "react"
+import clsx from "clsx"
+import { EyeClosedSvg } from "../Icons/icons/EyeClosed.icon"
+import { EyeOpenSvg } from "../Icons/icons/EyeOpen.icon"
+
+const useStyles = makeStyles(({ constants, overrides }: ITheme) =>
+  createStyles({
+    root: {
+      display: "inline-flex",
+      flexDirection: "row",
+      justifyContent: "flex-start",
+      alignItems: "center",
+      marginLeft: constants.generalUnit,
+      ...overrides?.ToggleHiddenText?.root
+    },
+    icon: {
+      marginRight: constants.generalUnit,
+      cursor: "pointer",
+      ...overrides?.ToggleHiddenText?.icon
+    }
+  })
+)
+
+interface IToggleHiddenText {
+  children: ReactNode
+  iconPosition?: "left" | "right"
+  hiddenLength?: number
+  className?: string
+}
+
+const ToggleHiddenText = ({ className, iconPosition = "left", hiddenLength = 6, children }: IToggleHiddenText) => {
+  const classes = useStyles()
+  const [hidden, setHidden] = useState(true)
+  const hiddenKey = useMemo(() => new Array(hiddenLength).fill("●"), [hiddenLength])
+
+  const EyeClosed = useCallback(() => <EyeClosedSvg
+    className={classes.icon}
+    onClick={() => setHidden(false)}
+  />
+  , [classes.icon])
+
+  const EyeOpen = useCallback(() => <EyeOpenSvg
+    className={classes.icon}
+    onClick={() => setHidden(true)}
+  />
+  , [classes.icon])
+
+  return (
+    <span className={clsx(classes.root, className)} >
+      {
+        hidden
+          ? <>
+            {iconPosition === "left" && <EyeClosed />}
+            <span>{hiddenKey}</span>
+            {iconPosition === "right" && <EyeClosed />}
+          </>
+          : <>
+            {iconPosition === "left" && <EyeOpen />}
+            {children}
+            {iconPosition === "right" && <EyeOpen />}
+          </>
+      }
+    </span>
+  )
+}
+
+export default ToggleHiddenText

packages/common-components/src/ToggleHiddenText/index.ts

@@ -0,0 +1,2 @@
+export { default as ToggleHiddenText } from "./ToggleHiddenText"
+export * from "./ToggleHiddenText"

packages/common-components/src/index.ts

@@ -32,6 +32,7 @@ export * from "./Table"
 export * from "./Tabs"
 export * from "./TagsInput"
 export * from "./Toaster"
+export * from "./ToggleHiddenText"
 export * from "./TextInput"
 export * from "./TreeView"
 export * from "./Typography"

packages/common-theme/src/Overrides/ToggleHiddenText.ts

@@ -0,0 +1,4 @@
+export interface IToggleHiddenText {
+  root?: Record<string, any>
+  icon?: Record<string, any>
+}

packages/common-theme/src/Overrides/index.ts

@@ -24,6 +24,7 @@ import { ITextInputOverride } from "./TextInput"
 import { IToasterOverride } from "./Toaster"
 import { ITypographyOverride } from "./Typography"
 import { ITagsInputOverride } from "./TagsInput"
+import { IToggleHiddenText } from "./ToggleHiddenText"
 
 export interface IComponentOverrides {
   Avatar?: IAvatarOverride
@@ -50,6 +51,7 @@ export interface IComponentOverrides {
   Tabs?: ITabsOverride
   TextInput?: ITextInputOverride
   Toaster?: IToasterOverride
+  ToggleHiddenText?: IToggleHiddenText
   Typography?: ITypographyOverride
   TagsInput?: ITagsInputOverride
 }

packages/files-ui/cypress.json

@@ -1,4 +1,5 @@
 {
     "integrationFolder": "cypress/tests",
-    "video": false
+    "video": false,
+    "experimentalSessionSupport": true
 }

packages/files-ui/cypress/fixtures/filesTestData.ts

@@ -0,0 +1 @@
+export const folderName = "Testing"

packages/files-ui/cypress/plugins/index.ts

@@ -8,7 +8,6 @@
 // You can read more here:
 // https://on.cypress.io/plugins-guide
 // ***********************************************************
-import { existsSync, readFileSync } from "fs"
 
 // This function is called when a project is opened or re-opened (e.g. due to
 // the project's config changing)
@@ -21,16 +20,6 @@ export default (on: any) => {
   // `on` is used to hook into various events Cypress emits
   // `config` is the resolved Cypress config
 
-  on("task", {
-    readFileMaybe(filename: string) {
-      if (existsSync(filename)) {
-        return readFileSync(filename, "utf8")
-      }
-
-      return null
-    }
-  })
-
   on("before:browser:launch", (browser: Cypress.Browser, launchOptions: Cypress.BrowserLaunchOptions) => {
     if (browser.name === "chrome" && browser.isHeadless) {
       // fullPage screenshot size is 1280x720 on non-retina screens