feat/enable pop over on actions (#2)

christian-pernillo-telus · Christian Pernillo · web-flow · commit af10cdbb32d6 · 2020-10-13T15:24:42.000-07:00
* feat(actions): Adding actions renderer

* feat(actions): Adding actions renderer

* feat(actions): Render prop to able of render elements inside the actions

* feat(general): Disabling travis and GH workflows

Co-authored-by: Christian Pernillo &lt;christian.pernillo@telusinternational.com&gt;
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -1,24 +1,24 @@
-name: CI
+# name: CI
 
-on:
-  push:
-    branches: [develop, master]
-  pull_request:
-    branches: [develop]
+# on:
+#   push:
+#     branches: [develop, master]
+#   pull_request:
+#     branches: [develop]
 
-jobs:
-  build:
-    runs-on: ubuntu-latest
+# jobs:
+#   build:
+#     runs-on: ubuntu-latest
 
-    steps:
-      - uses: actions/checkout@v2
-      - name: Setup Node JS
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12.x
-      - run: yarn install --ignore-engines
-      - run: yarn lint:nofix
-      - run: yarn test
+#     steps:
+#       - uses: actions/checkout@v2
+#       - name: Setup Node JS
+#         uses: actions/setup-node@v1
+#         with:
+#           node-version: 12.x
+#       - run: yarn install --ignore-engines
+#       - run: yarn lint:nofix
+#       - run: yarn test
       # 💀💀💀💀cannot run coveralls since GH won't pass COVERALLS_REPO_TOKEN to forks; so any PRs from external contributors would fail
       # - run: yarn coveralls
       #   env:
diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml
@@ -1,34 +1,34 @@
-name: Docs
+# name: Docs
 
-on:
-  push:
-    branches: [develop]
-    paths:
-      - 'docs/**'
-      - package.json
-      - README.md
+# on:
+#   push:
+#     branches: [develop]
+#     paths:
+#       - 'docs/**'
+#       - package.json
+#       - README.md
 
-jobs:
-  build-docs:
-    runs-on: ubuntu-latest
+# jobs:
+#   build-docs:
+#     runs-on: ubuntu-latest
 
-    steps:
-      - uses: actions/checkout@v2
-        with:
-          persist-credentials: false
-      - name: Setup Node JS
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12.x
-      - name: Build Docs 📚
-        run: |
-          # un-ignore bundle.js
-          mv docs/.gitignore .gitignore
-          yarn install --ignore-engines
-          yarn build:docs
-      - name: Deploy Pages 🚀
-        uses: JamesIves/github-pages-deploy-action@releases/v3
-        with:
-          ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }}
-          BRANCH: gh-pages
-          FOLDER: docs
+#     steps:
+#       - uses: actions/checkout@v2
+#         with:
+#           persist-credentials: false
+#       - name: Setup Node JS
+#         uses: actions/setup-node@v1
+#         with:
+#           node-version: 12.x
+#       - name: Build Docs 📚
+#         run: |
+#           # un-ignore bundle.js
+#           mv docs/.gitignore .gitignore
+#           yarn install --ignore-engines
+#           yarn build:docs
+#       - name: Deploy Pages 🚀
+#         uses: JamesIves/github-pages-deploy-action@releases/v3
+#         with:
+#           ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }}
+#           BRANCH: gh-pages
+#           FOLDER: docs
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -1,24 +1,24 @@
-name: Release
+# name: Release
 
-on:
-  push:
-    branches: [master]
+# on:
+#   push:
+#     branches: [master]
 
-jobs:
-  build-release:
-    runs-on: ubuntu-latest
+# jobs:
+#   build-release:
+#     runs-on: ubuntu-latest
 
-    steps:
-      - uses: actions/checkout@v2
-      - name: Setup Node JS
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12.x
-      - run: yarn install --ignore-engines
-      - run: yarn lint:nofix
-      - run: yarn test
-      - name: Release to npm 🚀
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-        run: npx semantic-release
+#     steps:
+#       - uses: actions/checkout@v2
+#       - name: Setup Node JS
+#         uses: actions/setup-node@v1
+#         with:
+#           node-version: 12.x
+#       - run: yarn install --ignore-engines
+#       - run: yarn lint:nofix
+#       - run: yarn test
+#       - name: Release to npm 🚀
+#         env:
+#           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+#           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+#         run: npx semantic-release
diff --git a/.github/workflows/semantic-pr.yml b/.github/workflows/semantic-pr.yml
@@ -1,21 +1,21 @@
-name: Semantic Pull Request
+# name: Semantic Pull Request
 
-on:
-  pull_request_target:
-    types:
-      - opened
-      - edited
-      - synchronize
+# on:
+#   pull_request_target:
+#     types:
+#       - opened
+#       - edited
+#       - synchronize
 
-jobs:
-  prlint:
-    runs-on: ubuntu-latest
+# jobs:
+#   prlint:
+#     runs-on: ubuntu-latest
 
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v2
+#     steps:
+#       - name: Checkout
+#         uses: actions/checkout@v2
 
-      - name: semantic-pull-request
-        uses: amannn/action-semantic-pull-request@v1.2.0
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+#       - name: semantic-pull-request
+#         uses: amannn/action-semantic-pull-request@v1.2.0
+#         env:
+#           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.travis.yml b/.travis.yml
@@ -1,18 +1,18 @@
-language: node_js
-cache:
-  yarn: true
-  directories:
-    - node_modules
-git:
-  depth: 3
-jobs:
-  include:
-    - stage: test
-      node_js: '10'
-      install:
-        - yarn install --ignore-engines
-      script:
-        - yarn coveralls
-      branches:
-        except:
-          - /^v\d+\.\d+\.\d+$/
+# language: node_js
+# cache:
+#   yarn: true
+#   directories:
+#     - node_modules
+# git:
+#   depth: 3
+# jobs:
+#   include:
+#     - stage: test
+#       node_js: '10'
+#       install:
+#         - yarn install --ignore-engines
+#       script:
+#         - yarn coveralls
+#       branches:
+#         except:
+#           - /^v\d+\.\d+\.\d+$/
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "react-dropdown-tree-select",
-  "version": "0.0.0-semantic-release",
+  "name": "@telus/telus-react-dropdown-tree-select",
+  "version": "1.0.0",
   "description": "Lightweight, customizable and fast Dropdown Tree Select component for React",
   "keywords": [
     "react",
@@ -20,7 +20,10 @@
   ],
   "main": "dist/react-dropdown-tree-select.js",
   "types": "dist/react-dropdown-tree-select.d.ts",
-  "repository": "https://github.com/dowjones/react-dropdown-tree-select.git",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/telus/react-dropdown-tree-select.git"
+  },
   "author": "Hrusikesh Panda <hrusikesh.panda@dowjones.com>",
   "license": "MIT",
   "scripts": {
@@ -193,5 +196,12 @@
       "pre-commit": "lint-staged",
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
     }
+  },
+  "bugs": {
+    "url": "https://github.com/telus/react-dropdown-tree-select/issues"
+  },
+  "homepage": "https://github.com/telus/react-dropdown-tree-select#readme",
+  "directories": {
+    "doc": "docs"
   }
 }
diff --git a/src/index.js b/src/index.js
@@ -38,6 +38,7 @@ class DropdownTreeSelect extends Component {
     className: PropTypes.string,
     onChange: PropTypes.func,
     onAction: PropTypes.func,
+    actionRenderer: PropTypes.func,
     onNodeToggle: PropTypes.func,
     onFocus: PropTypes.func,
     onBlur: PropTypes.func,
@@ -342,6 +343,7 @@ class DropdownTreeSelect extends Component {
                   keepChildrenOnSearch={this.props.keepChildrenOnSearch}
                   searchModeOn={this.state.searchModeOn}
                   onAction={this.onAction}
+                  actionRenderer={this.props.actionRenderer}
                   onCheckboxChange={this.onCheckboxChange}
                   onNodeToggle={this.onNodeToggle}
                   mode={mode}
diff --git a/src/tree-node/action.js b/src/tree-node/action.js
@@ -8,11 +8,19 @@ class Action extends PureComponent {
     className: PropTypes.string,
     actionData: PropTypes.object,
     onAction: PropTypes.func,
+    actionRenderer: PropTypes.func,
     readOnly: PropTypes.bool,
   }
 
   static defaultProps = {
     onAction: () => {},
+    actionRenderer: (title, className, text, readOnly, handleClick) => {
+      return (
+        <i title={title} className={className} onClick={!readOnly ? handleClick : undefined}>
+          {text}
+        </i>
+      )
+    },
   }
 
   handleClick = () => {
@@ -23,13 +31,8 @@ class Action extends PureComponent {
   }
 
   render() {
-    const { title, className, text, readOnly } = this.props
-
-    return (
-      <i title={title} className={className} onClick={!readOnly ? this.handleClick : undefined}>
-        {text}
-      </i>
-    )
+    const { title, className, text, readOnly, actionRenderer } = this.props
+    return <div className="action-wrapper">{actionRenderer(title, className, text, readOnly)}</div>
   }
 }
 
diff --git a/src/tree-node/actions.js b/src/tree-node/actions.js
@@ -8,6 +8,7 @@ class Actions extends PureComponent {
   static propTypes = {
     id: PropTypes.string.isRequired,
     actions: PropTypes.array,
+    actionRenderer: PropTypes.func,
   }
 
   render() {
diff --git a/src/tree-node/index.js b/src/tree-node/index.js
@@ -65,6 +65,7 @@ class TreeNode extends PureComponent {
     searchModeOn: PropTypes.bool,
     onNodeToggle: PropTypes.func,
     onAction: PropTypes.func,
+    actionRenderer: PropTypes.func,
     onCheckboxChange: PropTypes.func,
     mode: PropTypes.oneOf(['multiSelect', 'simpleSelect', 'radioSelect', 'hierarchical']),
     showPartiallySelected: PropTypes.bool,
@@ -103,6 +104,7 @@ class TreeNode extends PureComponent {
       value,
       disabled,
       actions,
+      actionRenderer,
       onAction,
       searchModeOn,
       onNodeToggle,
@@ -133,7 +135,7 @@ class TreeNode extends PureComponent {
           readOnly={readOnly}
           clientId={clientId}
         />
-        <Actions actions={actions} onAction={onAction} id={_id} readOnly={readOnly} />
+        <Actions actions={actions} actionRenderer={actionRenderer} onAction={onAction} id={_id} readOnly={readOnly} />
       </li>
     )
   }
diff --git a/src/tree/index.js b/src/tree/index.js
@@ -23,6 +23,7 @@ class Tree extends Component {
     onChange: PropTypes.func,
     onNodeToggle: PropTypes.func,
     onAction: PropTypes.func,
+    actionRenderer: PropTypes.func,
     onCheckboxChange: PropTypes.func,
     mode: PropTypes.oneOf(['multiSelect', 'simpleSelect', 'radioSelect', 'hierarchical']),
     showPartiallySelected: PropTypes.bool,
@@ -78,6 +79,7 @@ class Tree extends Component {
       showPartiallySelected,
       readOnly,
       onAction,
+      actionRenderer,
       onChange,
       onCheckboxChange,
       onNodeToggle,
@@ -98,6 +100,7 @@ class Tree extends Component {
             onCheckboxChange={onCheckboxChange}
             onNodeToggle={onNodeToggle}
             onAction={onAction}
+            actionRenderer={actionRenderer}
             mode={mode}
             showPartiallySelected={showPartiallySelected}
             readOnly={readOnly}

Original file line number	Diff line number	Diff line change
`@@ -8,6 +8,7 @@ class Actions extends PureComponent {`
`8`	`8`	`static propTypes = {`
`9`	`9`	`id: PropTypes.string.isRequired,`
`10`	`10`	`actions: PropTypes.array,`
	`11`	`+ actionRenderer: PropTypes.func,`
`11`	`12`	`}`
`12`	`13`
`13`	`14`	`render() {`