React components and Redux modules for embedded Webex Teams
Clone or download
Jenkins
Latest commit a511954 Dec 17, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci chore(circleci): add integration env vars to circle builds Dec 7, 2018
.vscode chore(vscode): update jest debugger Mar 14, 2018
__mocks__ chore: use identity-obj-proxy for jest css styles Jun 13, 2017
packages/node_modules feat(widget-recents): recents widget space filter Dec 15, 2018
samples feat(samples): add download icon Jun 5, 2018
scripts chore(webpack): update webpack post css loader Dec 13, 2018
test/journeys test(journeys): added a click event after each test; commented out as… Dec 15, 2018
.babelrc chore(tooling): remove browser from babel env Aug 15, 2018
.editorconfig feat(tooling): Add jest, stylelint and initial circle config Jan 4, 2017
.env.default chore(tooling): Add netlify deploy script May 3, 2018
.eslintignore chore(tooling): Add es and cjs builds to correct scripts Jun 28, 2017
.eslintrc.js tooling: Update eslint from yml to js, update eslint rules Dec 4, 2017
.gitattributes feat(react-component-utils): Add sdk version to metrics Mar 22, 2017
.gitignore chore(gitignore): add .cache files Nov 21, 2018
.npmrc chore(tooling): add package-lock.json Jul 31, 2018
.nvmrc chore(tooling): update to node 8.11.3 Jul 31, 2018
CHANGELOG.md chore(release): 0.1.397 Dec 17, 2018
CONTRIBUTING.md fix: remove extra eslint-disable and fix errors Dec 5, 2017
Jenkinsfile chore(jenkinsfile): remove pinned firefox version Dec 14, 2018
Jenkinsfile.jssdk chore(Jenkins): manually set npm version at 6.4.1 Oct 12, 2018
Jenkinsfile.tab chore(Jenkins): manually set npm version at 6.4.1 Oct 12, 2018
Jenkinsfile.tap chore(Jenkins): manually set npm version at 6.4.1 Oct 12, 2018
LICENSE docs(general): update README and LICENSE May 16, 2017
README.md docs(README): add basic usage guide Sep 10, 2018
jest.config.json feat(widget-recents): implement new IA for spaces list Oct 19, 2018
package-lock.json chore(release): 0.1.397 Dec 17, 2018
package.json chore(release): 0.1.397 Dec 17, 2018
postcss.config.js chore(eslint): Enable eslint on all js files and fix errors Dec 5, 2017
public-key.pem feat(tooling): Add public key to repo Dec 19, 2017
stylelint.config.js fix(tooling): Chnage stylelint config to js Dec 4, 2017
tsconfig.json chore(tsconfig): add ignores for es and cjs compiled directories Oct 17, 2018
wdio.conf.js test(journeys): moved space filter test to run after recents for the … Dec 15, 2018
webpack.config.babel.js feat(tooling): Fix bad builds, add split package builds Jan 4, 2017

README.md

react-ciscospark

CircleCI license Conventional Commits

Cisco Spark for React

The Cisco Spark for React library allows developers to easily incorporate Spark functionality into an application.

Table of Contents

Background

This library allows React developers to quickly and easily create a Cisco Spark experience within their apps. Here we provide basic components (e.g. buttons, text fields, icons) that reflect the styles and aesthetics of Spark, along with more complex, complete widgets, such as the Spark Space Widget.

The basic components are just presentational React https://github.com/facebook/react components, while our widgets leverage Redux https://github.com/reactjs/redux and the Spark Javascript SDK https://github.com/webex/spark-js-sdk.

Widgets

While many of our components are purely presentational, some have extended functionality that provide a piece of the full Cisco Spark experience. These fully self contained elements are called Widgets and are available here:

Usage

A functional demo of both Space and Recents widgets can be loaded by simply running:

$ npm start

Install

Build From Source

  1. Clone this repo using a git client (e.g. git clone https://github.com/webex/react-ciscospark.git)
  2. Run npm install from the root of the repo. You will want to run this every time you pull down any new updates.
  3. From the root of the repo, run the following to build the widget:
    npm run build
  4. The built bundles are located at packages/node_modules/@ciscospark/PACKAGE_NAME/dist.

Version

Once a widget is bundled, the version number is available in the following ways:

  • A comment at the top of each bundled file
  • Programmatic access after a widget has been registered: window.ciscospark.widgetFn.{widgetName}.version (e.g. window.ciscospark.widgetFn.spaceWidget.version)
  • Access after a widget has been instantiated: window.ciscospark.widget({widgetEl}).version (e.g. window.ciscospark.widget(document.getElementById('myWidget')).version)

Development

Coding Style

We follow our Cisco Spark Web Styleguide when developing any web based libraries and tools. Please check it out and do your best to follow our norms when contributing to this codebase.

Code Verification

As a best practice, we provide a Sub-resource Integrity (SRI) hash for all of our CDN hosted distributable files. A manifest listing all of the files with associated integrity hashes can be found for the latest build, where {NAME} is the name of the widget at https://code.s4d.io/widget-{NAME}/production/manifest.json.

Manifest Example

{
  "version": "0.1.215",
  "files": [
     {
       "name": "bundle.js",
       "url": "https://code.s4d.io/widget-space/archives/0.1.120/bundle.js",
       "signature": "kfVRBKftbb3OQ4VmYOqstb9V0abqXJzY1L0Ww/zsbiF+bGaDkgiLWqztTCh43uMsUtzEgpF0M29pr67gSlZLSOq6iUgBg9zGhiVoVqlxEUGqxdOXkeDLRTOr16KkBtAObBidWauyNOvA+6FAC71UP2yFTXIadV7z1W7tIwt+wOfGqqaBwzMCuXl1bS4Va5Fj+s2SLsRfuDrSG0gPbG499bl0v6QkWKvkYPjW4v/BffyJNFJsu2rubkPXSCEk5yU4UpOJqsQPJ+sx4s9QFgMtWbNZ+cqnBuPFPBrr5E31lOS3eJwR9Jx139ZTpcBxP19qM6zV9ategsil7w1dIN1HVbU6H/byLHTLjf39kCOsNJk6yo+B9FiD2By8wSDi4ykD6MJEH7OqOxsb49/FsgALSmJB1iIexU4xQWE3HhupEtlvv+YCQtUE0IBMVEmjauhLzJ0gBemOvzo7eMeWEsrTSSMtePS+wp9UT7uvmz7l/UIBeIuhT87YKAt0AHgE3C0pE/JOh3JofshVZ++mC1A+bjSl/+Y41mU8BclWYnGfXDwkYevzi5SxklS77eD1J/4Q+DXUkDNAR9DQe/UHZ8nrnW+GlUATwHaqhW4883p/j9zGuGEzcEQeUDHBMl23c0z3hUIXfYfhn7dExyHzTzMZQaKFD5Dl7+CgmL5V6FHY3Iw=",
       "integrity": "sha384-3bMDdbkrYdS5m4SA7/gzkh7/G9ppEV0BVyPs2TZqbny/z9aPaw4D3DHS1+Wg9phW"
    }
  ]
}

To find the SRI hash for a specific build of the widgets, you can use the following URL, replacing {VERSION} with the specific version you are looking for: https://code.s4d.io/widget-space/archives/{VERSION}/manifest.json.

Additionally, for those who want an additional layer of verification, a signature has been provided that is signed by a private key. You can use our public key to verify this signature. Here is example of the verification process using the nodeJS built-in cryto library:

const crypto = require('crypto');
function verifySignature({
  data,
  signature,
  publicKey
}) {
  // Verify that we signed correctly using public key
  const verify = crypto.createVerify('RSA-SHA384');
  verify.write(data);
  verify.end();

  // True if signature is verified
  return verify.verify(publicKey, signature, 'base64');
}

Contributing

See CONTRIBUTING for details.

License

© 2017 Cisco Systems, Inc. and/or its affiliates. All Rights Reserved.

See LICENSE for details.