From 70b88de51af14791843af8baf1976d3b42d1e3b0 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Tue, 3 Jul 2018 15:49:35 -0300 Subject: [PATCH 1/6] Do not rerun relay compiler on its own changes --- config/watcher.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/config/watcher.ts b/config/watcher.ts index 305193045..0d3bf23c1 100644 --- a/config/watcher.ts +++ b/config/watcher.ts @@ -15,7 +15,7 @@ const config: Config = { "core/client/stream/**/*.graphql", "core/client/server/**/*.graphql", ], - ignore: ["core/**/*.d.ts"], + ignore: ["core/**/*.d.ts", "core/**/*.graphql.ts"], executor: new CommandExecutor("npm run compile:relay-stream", { runOnInit: true, }), From 1a14c131051dde2572b95e63f57ebca1b8a23617 Mon Sep 17 00:00:00 2001 From: Kiwi Date: Wed, 4 Jul 2018 14:01:08 -0300 Subject: [PATCH 2/6] Use JSDocs comments (#1727) --- scripts/watcher/CommandExecutor.ts | 6 +++--- scripts/watcher/LongRunningExecutor.ts | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/scripts/watcher/CommandExecutor.ts b/scripts/watcher/CommandExecutor.ts index 60cf15e6a..fddba0b8b 100644 --- a/scripts/watcher/CommandExecutor.ts +++ b/scripts/watcher/CommandExecutor.ts @@ -5,13 +5,13 @@ import { Executor } from "./types"; interface CommandExecutorOptions { args?: ReadonlyArray; - // If true, allow spawning multiple processes. + /** If true, allow spawning multiple processes. */ spawnMutiple?: boolean; - // Specify the period in which the process is started at max once. + /** Specify the period in which the process is started at max once. */ debounce?: number | false; - // If true, will run command upon initialization. + /** If true, will run command upon initialization. */ runOnInit?: boolean; } diff --git a/scripts/watcher/LongRunningExecutor.ts b/scripts/watcher/LongRunningExecutor.ts index cffe6f7db..7019c1fb3 100644 --- a/scripts/watcher/LongRunningExecutor.ts +++ b/scripts/watcher/LongRunningExecutor.ts @@ -6,7 +6,7 @@ import { Executor } from "./types"; interface LongRunningExecutorOptions { args?: ReadonlyArray; - // Specify the period in which the process is restarted at max once. + /** Specify the period in which the process is restarted at max once. */ debounce?: number; } From c9c99623bc50820a308697fe224711643784628f Mon Sep 17 00:00:00 2001 From: Kiwi Date: Wed, 4 Jul 2018 14:12:43 -0300 Subject: [PATCH 3/6] [next] Remove nodemon (#1725) * Remove old nodemon configs * Remove nodemon --- config/nodemon/relay-stream.json | 8 ---- config/nodemon/server.json | 10 ----- package-lock.json | 77 -------------------------------- package.json | 3 +- 4 files changed, 1 insertion(+), 97 deletions(-) delete mode 100644 config/nodemon/relay-stream.json delete mode 100644 config/nodemon/server.json diff --git a/config/nodemon/relay-stream.json b/config/nodemon/relay-stream.json deleted file mode 100644 index dc9556823..000000000 --- a/config/nodemon/relay-stream.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "exec": "npm-run-all compile:relay-stream", - "ext": "ts,tsx,graphql", - "watch": [ - "./src/core/client/stream", - "./src/core/**/*.graphql" - ] -} diff --git a/config/nodemon/server.json b/config/nodemon/server.json deleted file mode 100644 index 08472086e..000000000 --- a/config/nodemon/server.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "exec": "npm run start:development", - "ext": "ts,graphql", - "watch": [ - "./src" - ], - "ignore": [ - "./src/client" - ] -} diff --git a/package-lock.json b/package-lock.json index b3622a48d..6038504da 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9820,12 +9820,6 @@ "integrity": "sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==", "dev": true }, - "ignore-by-default": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/ignore-by-default/-/ignore-by-default-1.0.1.tgz", - "integrity": "sha1-SMptcvbGo68Aqa1K5odr44ieKwk=", - "dev": true - }, "immutable": { "version": "3.7.6", "resolved": "https://registry.npmjs.org/immutable/-/immutable-3.7.6.tgz", @@ -12790,50 +12784,6 @@ "which": "^1.3.0" } }, - "nodemon": { - "version": "1.17.5", - "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-1.17.5.tgz", - "integrity": "sha512-FG2mWJU1Y58a9ktgMJ/RZpsiPz3b7ge77t/okZHEa4NbrlXGKZ8s1A6Q+C7+JPXohAfcPALRwvxcAn8S874pmw==", - "dev": true, - "requires": { - "chokidar": "^2.0.2", - "debug": "^3.1.0", - "ignore-by-default": "^1.0.1", - "minimatch": "^3.0.4", - "pstree.remy": "^1.1.0", - "semver": "^5.5.0", - "supports-color": "^5.2.0", - "touch": "^3.1.0", - "undefsafe": "^2.0.2", - "update-notifier": "^2.3.0" - }, - "dependencies": { - "debug": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz", - "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==", - "dev": true, - "requires": { - "ms": "2.0.0" - } - }, - "has-flag": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", - "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=", - "dev": true - }, - "supports-color": { - "version": "5.4.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.4.0.tgz", - "integrity": "sha512-zjaXglF5nnWpsq470jSv6P9DwPvgLkuapYmfDm3JWOm0vkNTVF2tI4UrN2r6jH1qM/uc/WtxYY1hYoA2dOKj5w==", - "dev": true, - "requires": { - "has-flag": "^3.0.0" - } - } - } - }, "nopt": { "version": "1.0.10", "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz", @@ -15936,15 +15886,6 @@ "integrity": "sha512-+AqO1Ae+N/4r7Rvchrdm432afjT9hqJRyBN3DQv9At0tPz4hIFSGKbq64fN9dVoCow4oggIIax5/iONx0r9hZw==", "dev": true }, - "pstree.remy": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.0.tgz", - "integrity": "sha512-q5I5vLRMVtdWa8n/3UEzZX7Lfghzrg9eG2IKk2ENLSofKRCXVqMvMUHxCKgXNaqH/8ebhBxrqftHWnyTFweJ5Q==", - "dev": true, - "requires": { - "ps-tree": "^1.1.0" - } - }, "public-encrypt": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.2.tgz", @@ -18801,15 +18742,6 @@ "integrity": "sha1-LmhELZ9k7HILjMieZEOsbKqVACk=", "dev": true }, - "touch": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/touch/-/touch-3.1.0.tgz", - "integrity": "sha512-WBx8Uy5TLtOSRtIq+M03/sKDrXCLHxwDcquSP2c43Le03/9serjQBIztjRz6FkJez9D/hleyAXTBGLwwZUw9lA==", - "dev": true, - "requires": { - "nopt": "~1.0.10" - } - }, "tough-cookie": { "version": "2.4.3", "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.4.3.tgz", @@ -19684,15 +19616,6 @@ "integrity": "sha512-keqHubrlpvT6G2wH0OEfSW4mquYRcbe/J8NMmveoQOjUqmo+hXtO+ORCpWhdbZ7k72UtY61BL7haGxW6enBnjw==", "dev": true }, - "undefsafe": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.2.tgz", - "integrity": "sha1-Il9rngM3Zj4Njnz9aG/Cg2zKznY=", - "dev": true, - "requires": { - "debug": "^2.2.0" - } - }, "unherit": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/unherit/-/unherit-1.1.1.tgz", diff --git a/package.json b/package.json index 5f615b41f..707d65836 100644 --- a/package.json +++ b/package.json @@ -102,7 +102,6 @@ "html-webpack-plugin": "^3.2.0", "jest": "^23.2.0", "loader-utils": "^1.1.0", - "nodemon": "^1.17.5", "npm-run-all": "^4.1.3", "postcss-flexbugs-fixes": "^3.3.1", "postcss-font-magician": "^2.2.1", @@ -141,4 +140,4 @@ "webpack-hot-client": "^4.0.3", "webpack-manifest-plugin": "^2.0.3" } -} \ No newline at end of file +} From 37cb23dd59b47f0e4a9b1b2830b9292f2b018f4d Mon Sep 17 00:00:00 2001 From: Kiwi Date: Thu, 5 Jul 2018 12:04:38 -0300 Subject: [PATCH 4/6] [next] Jest implementation for React Components (#1733) * Make jest testing work with custom path and css modules * Add first test * feat: added unit tests to ci * fix: updated package-lock.json * Update cssTransform.js * Update cssTransform.js * Fix test in ci --- .circleci/config.yml | 17 ++ config/jest.config.js | 9 +- config/jest/cssTransform.js | 96 +++++++- package-lock.json | 229 ++++++++++-------- package.json | 9 +- scripts/test.js | 2 +- .../client/stream/components/Comment.spec.tsx | 28 +++ .../__snapshots__/Comment.spec.tsx.snap | 33 +++ 8 files changed, 308 insertions(+), 115 deletions(-) create mode 100644 src/core/client/stream/components/Comment.spec.tsx create mode 100644 src/core/client/stream/components/__snapshots__/Comment.spec.tsx.snap diff --git a/.circleci/config.yml b/.circleci/config.yml index 908210e13..bd7493f6b 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -43,6 +43,20 @@ jobs: name: Perform linting command: npm run lint + # unit_tests will run the unit tests. + unit_tests: + <<: *job_defaults + steps: + - checkout + - attach_workspace: + at: ~/coralproject/talk + - run: + name: Compile schemas and types + command: npm run compile + - run: + name: Perform testing + command: npm run test + # build will build the static assets and server typescript files. build: <<: *job_defaults @@ -74,6 +88,9 @@ workflows: - lint: requires: - npm_dependencies + - unit_tests: + requires: + - npm_dependencies - build: requires: - npm_dependencies diff --git a/config/jest.config.js b/config/jest.config.js index 682a2c8a4..ed9b641ae 100644 --- a/config/jest.config.js +++ b/config/jest.config.js @@ -8,7 +8,7 @@ module.exports = { setupFiles: ["/config/polyfills.js"], testMatch: [ "**/__tests__/**/*.{js,jsx,mjs,ts,tsx}", - "**/*.(spec|test).{js,jsx,mjs,ts,tsx}", + "**/*.spec.{js,jsx,mjs,ts,tsx}", ], testEnvironment: "node", testURL: "http://localhost", @@ -22,7 +22,12 @@ module.exports = { "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs|ts|tsx)$", ], moduleNameMapper: { - "^react-native$": "react-native-web", + "^talk-admin/(.*)$": "/src/core/client/admin/$1", + "^talk-ui/(.*)$": "/src/core/client/ui/$1", + "^talk-stream/(.*)$": "/src/core/client/stream/$1", + "^talk-framework/(.*)$": "/src/core/client/framework/$1", + "^talk-common/(.*)$": "/src/core/common/$1", + "^talk-server/(.*)$": "/src/core/server/$1", }, moduleFileExtensions: [ "web.js", diff --git a/config/jest/cssTransform.js b/config/jest/cssTransform.js index 606cc276b..90b6bfa63 100644 --- a/config/jest/cssTransform.js +++ b/config/jest/cssTransform.js @@ -1,14 +1,94 @@ "use strict"; -// This is a custom Jest transformer turning style imports into empty objects. -// http://facebook.github.io/jest/docs/en/webpack.html +// Adapted version of https://github.com/Connormiha/jest-css-modules-transform +// Copyright https://github.com/Connormiha/jest-css-modules-transform/graphs/contributors +// This oututs `module.exports = cssObject` instead of `module.exports = { default: cssObject }`; + +const { sep: pathSep, resolve } = require("path"); +const postcss = require("postcss"); +const postcssNested = postcss([require("postcss-nested")]); + +const REG_EXP_NAME_BREAK_CHAR = /[\s,.{/#[:]/; + +const getCSSSelectors = (css, path) => { + const end = css.length; + let i = 0; + let char; + let bracketsCount = 0; + const result = {}; + + while (i < end) { + if (i === -1) { + throw Error(`Parse error ${path}`); + } + if (css.indexOf("/*", i) === i) { + i = css.indexOf("*/", i + 2); + // Unclosed comment. Break to avoid infinity loop + if (i === -1) { + // Don't parse, but save collected result + return result; + } + continue; + } + char = css[i]; + if (char === "{") { + bracketsCount++; + i++; + continue; + } + if (char === "}") { + bracketsCount--; + i++; + continue; + } + if (char === '"' || char === "'") { + do { + i = css.indexOf(char, i + 1); + // Syntax error since this line. Don't parse, but save collected result + if (i === -1) { + return result; + } + } while (css[i - 1] === "\\"); + i++; + continue; + } + if (bracketsCount > 0) { + i++; + continue; + } + if (char === "." || char === "#") { + i++; + const startWord = i; + while (!REG_EXP_NAME_BREAK_CHAR.test(css[i])) { + i++; + } + const word = css.slice(startWord, i); + result[word] = word; + continue; + } + if (css.indexOf("@keyframes", i) === i) { + i += 10; + while (REG_EXP_NAME_BREAK_CHAR.test(css[i])) { + i++; + } + const startWord = i; + while (!REG_EXP_NAME_BREAK_CHAR.test(css[i])) { + i++; + } + const word = css.slice(startWord, i); + result[word] = word; + continue; + } + i++; + } + return result; +}; module.exports = { - process() { - return "module.exports = {};"; - }, - getCacheKey() { - // The output is always the same. - return "cssTransform"; + process(src, path, config) { + const filename = path.slice(path.lastIndexOf(pathSep) + 1); + const textCSS = postcssNested.process(src).css; + const exprt = JSON.stringify(getCSSSelectors(textCSS, path)); + return `module.exports = ${exprt}`; }, }; diff --git a/package-lock.json b/package-lock.json index 6038504da..c6dd91c93 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1628,13 +1628,17 @@ } }, "@types/react-relay": { - "version": "1.3.6", - "resolved": "https://registry.npmjs.org/@types/react-relay/-/react-relay-1.3.6.tgz", - "integrity": "sha512-X0qv3nGlE4TStFLLKxgj+6MgHZEExB1N/RDcVcyCauAojV5byD0c6VhuqAluYaTKaL2FBuxdtDL405IhIIjEbQ==", + "version": "github:coralproject/patched#ba4c8d01bb737e5f073534b32d870294e39cc5a8", + "from": "github:coralproject/patched#types/react-relay", + "dev": true + }, + "@types/react-test-renderer": { + "version": "16.0.1", + "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-16.0.1.tgz", + "integrity": "sha512-kmNh8g67Ck/y/vp6KX+4JTJXiTGLZBylNhu+R7sm7zcvsrnIGVO6J1zew5inVg428j9f8yHpl68RcYOZXVborQ==", "dev": true, "requires": { - "@types/react": "*", - "@types/relay-runtime": "*" + "@types/react": "*" } }, "@types/recompose": { @@ -7635,17 +7639,17 @@ } }, "expect": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/expect/-/expect-23.2.0.tgz", - "integrity": "sha1-U6fhNeNv4n51hnsReP8IqqzCsN0=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/expect/-/expect-23.3.0.tgz", + "integrity": "sha1-7LBRrcvcQKxNtXbBYGfxL9sTzGE=", "dev": true, "requires": { "ansi-styles": "^3.2.0", "jest-diff": "^23.2.0", "jest-get-type": "^22.1.0", "jest-matcher-utils": "^23.2.0", - "jest-message-util": "^23.2.0", - "jest-regex-util": "^23.0.0" + "jest-message-util": "^23.3.0", + "jest-regex-util": "^23.3.0" }, "dependencies": { "ansi-styles": { @@ -10835,13 +10839,13 @@ "dev": true }, "jest": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest/-/jest-23.2.0.tgz", - "integrity": "sha1-govzGgltRdzwaCTR6gMBOve8/CA=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest/-/jest-23.3.0.tgz", + "integrity": "sha1-E1XNeS84zyD7pNoC3dt8oU2UhLU=", "dev": true, "requires": { "import-local": "^1.0.0", - "jest-cli": "^23.2.0" + "jest-cli": "^23.3.0" }, "dependencies": { "ansi-regex": { @@ -10865,9 +10869,9 @@ } }, "jest-cli": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-23.2.0.tgz", - "integrity": "sha1-O1Q6PaUUXdiTeTEBcoI3n8aWxFs=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-23.3.0.tgz", + "integrity": "sha1-MH6b53M0Q7eJqCedaUBU0FGp5eI=", "dev": true, "requires": { "ansi-escapes": "^3.0.0", @@ -10882,18 +10886,18 @@ "istanbul-lib-instrument": "^1.10.1", "istanbul-lib-source-maps": "^1.2.4", "jest-changed-files": "^23.2.0", - "jest-config": "^23.2.0", - "jest-environment-jsdom": "^23.2.0", + "jest-config": "^23.3.0", + "jest-environment-jsdom": "^23.3.0", "jest-get-type": "^22.1.0", "jest-haste-map": "^23.2.0", - "jest-message-util": "^23.2.0", - "jest-regex-util": "^23.0.0", - "jest-resolve-dependencies": "^23.2.0", - "jest-runner": "^23.2.0", - "jest-runtime": "^23.2.0", - "jest-snapshot": "^23.2.0", - "jest-util": "^23.2.0", - "jest-validate": "^23.2.0", + "jest-message-util": "^23.3.0", + "jest-regex-util": "^23.3.0", + "jest-resolve-dependencies": "^23.3.0", + "jest-runner": "^23.3.0", + "jest-runtime": "^23.3.0", + "jest-snapshot": "^23.3.0", + "jest-util": "^23.3.0", + "jest-validate": "^23.3.0", "jest-watcher": "^23.2.0", "jest-worker": "^23.2.0", "micromatch": "^3.1.10", @@ -10938,23 +10942,23 @@ } }, "jest-config": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-23.2.0.tgz", - "integrity": "sha1-0vtVb9WioZw561bROdzKXa0qHIg=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-23.3.0.tgz", + "integrity": "sha1-u01Ttw+VAPr933GNImq7U7E7gyM=", "dev": true, "requires": { "babel-core": "^6.0.0", "babel-jest": "^23.2.0", "chalk": "^2.0.1", "glob": "^7.1.1", - "jest-environment-jsdom": "^23.2.0", - "jest-environment-node": "^23.2.0", + "jest-environment-jsdom": "^23.3.0", + "jest-environment-node": "^23.3.0", "jest-get-type": "^22.1.0", - "jest-jasmine2": "^23.2.0", - "jest-regex-util": "^23.0.0", + "jest-jasmine2": "^23.3.0", + "jest-regex-util": "^23.3.0", "jest-resolve": "^23.2.0", - "jest-util": "^23.2.0", - "jest-validate": "^23.2.0", + "jest-util": "^23.3.0", + "jest-validate": "^23.3.0", "pretty-format": "^23.2.0" }, "dependencies": { @@ -11003,24 +11007,24 @@ } }, "jest-environment-jsdom": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-23.2.0.tgz", - "integrity": "sha1-NjRgOgipdbDKimWDIPVqVKjgRVg=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-23.3.0.tgz", + "integrity": "sha1-GQRX+RyeYVRUxBhgVgZdtu16Tio=", "dev": true, "requires": { "jest-mock": "^23.2.0", - "jest-util": "^23.2.0", + "jest-util": "^23.3.0", "jsdom": "^11.5.1" } }, "jest-environment-node": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-23.2.0.tgz", - "integrity": "sha1-tv5BNy44IJO7bz2b32wcTsClDxg=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-23.3.0.tgz", + "integrity": "sha1-Ho3yHIR6pdA7dlc/DcFvzeUDTDI=", "dev": true, "requires": { "jest-mock": "^23.2.0", - "jest-util": "^23.2.0" + "jest-util": "^23.3.0" } }, "jest-get-type": { @@ -11056,21 +11060,21 @@ } }, "jest-jasmine2": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-23.2.0.tgz", - "integrity": "sha1-qmcM2x5NX47HdMlN2l4QX+M9i7Q=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-23.3.0.tgz", + "integrity": "sha1-qHBrqsI8ihMNWqjvVGSp1JCW0bU=", "dev": true, "requires": { "chalk": "^2.0.1", "co": "^4.6.0", - "expect": "^23.2.0", + "expect": "^23.3.0", "is-generator-fn": "^1.0.0", "jest-diff": "^23.2.0", "jest-each": "^23.2.0", "jest-matcher-utils": "^23.2.0", - "jest-message-util": "^23.2.0", - "jest-snapshot": "^23.2.0", - "jest-util": "^23.2.0", + "jest-message-util": "^23.3.0", + "jest-snapshot": "^23.3.0", + "jest-util": "^23.3.0", "pretty-format": "^23.2.0" } }, @@ -11095,9 +11099,9 @@ } }, "jest-message-util": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-23.2.0.tgz", - "integrity": "sha1-WR6BSP/2nPibBBSAnHIXVuvv50Q=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-23.3.0.tgz", + "integrity": "sha1-vAexHOxpcftd2d4t+2DrwiFQwWA=", "dev": true, "requires": { "@babel/code-frame": "^7.0.0-beta.35", @@ -11114,9 +11118,9 @@ "dev": true }, "jest-regex-util": { - "version": "23.0.0", - "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-23.0.0.tgz", - "integrity": "sha1-3Vwf3gxG9DcTFM8Q96dRoj9Oj3Y=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-23.3.0.tgz", + "integrity": "sha1-X4ZylUfCeFxAAs6qj4Sf6MpHG8U=", "dev": true }, "jest-resolve": { @@ -11131,31 +11135,31 @@ } }, "jest-resolve-dependencies": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-23.2.0.tgz", - "integrity": "sha1-bfjVcJxkBmOc0H9Uv/B04BtcBFg=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-23.3.0.tgz", + "integrity": "sha1-hETTsLEoi4CGTYgB/1C0Sk1pXR0=", "dev": true, "requires": { - "jest-regex-util": "^23.0.0", - "jest-snapshot": "^23.2.0" + "jest-regex-util": "^23.3.0", + "jest-snapshot": "^23.3.0" } }, "jest-runner": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-23.2.0.tgz", - "integrity": "sha1-DZGWfqgvcrDHBZEJJghtIFXOda8=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-23.3.0.tgz", + "integrity": "sha1-BMfkWKYXUBpIddsNf/vg48vUO/s=", "dev": true, "requires": { "exit": "^0.1.2", "graceful-fs": "^4.1.11", - "jest-config": "^23.2.0", + "jest-config": "^23.3.0", "jest-docblock": "^23.2.0", "jest-haste-map": "^23.2.0", - "jest-jasmine2": "^23.2.0", + "jest-jasmine2": "^23.3.0", "jest-leak-detector": "^23.2.0", - "jest-message-util": "^23.2.0", - "jest-runtime": "^23.2.0", - "jest-util": "^23.2.0", + "jest-message-util": "^23.3.0", + "jest-runtime": "^23.3.0", + "jest-util": "^23.3.0", "jest-worker": "^23.2.0", "source-map-support": "^0.5.6", "throat": "^4.0.0" @@ -11173,9 +11177,9 @@ } }, "jest-runtime": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-23.2.0.tgz", - "integrity": "sha1-YtywF2ahxMZGltwJAgnnbOGq3Lw=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-23.3.0.tgz", + "integrity": "sha1-SGWqtM7/gvnOxjNf164UIswd598=", "dev": true, "requires": { "babel-core": "^6.0.0", @@ -11185,14 +11189,14 @@ "exit": "^0.1.2", "fast-json-stable-stringify": "^2.0.0", "graceful-fs": "^4.1.11", - "jest-config": "^23.2.0", + "jest-config": "^23.3.0", "jest-haste-map": "^23.2.0", - "jest-message-util": "^23.2.0", - "jest-regex-util": "^23.0.0", + "jest-message-util": "^23.3.0", + "jest-regex-util": "^23.3.0", "jest-resolve": "^23.2.0", - "jest-snapshot": "^23.2.0", - "jest-util": "^23.2.0", - "jest-validate": "^23.2.0", + "jest-snapshot": "^23.3.0", + "jest-util": "^23.3.0", + "jest-validate": "^23.3.0", "micromatch": "^3.1.10", "realpath-native": "^1.0.0", "slash": "^1.0.0", @@ -11208,30 +11212,35 @@ "dev": true }, "jest-snapshot": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-23.2.0.tgz", - "integrity": "sha1-x6PQFxd7utYMillYac+QqHguan4=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-23.3.0.tgz", + "integrity": "sha1-/E6fgeRUMtEFB+J/ULzmD0TYFCQ=", "dev": true, "requires": { + "babel-traverse": "^6.0.0", + "babel-types": "^6.0.0", "chalk": "^2.0.1", "jest-diff": "^23.2.0", "jest-matcher-utils": "^23.2.0", + "jest-message-util": "^23.3.0", + "jest-resolve": "^23.2.0", "mkdirp": "^0.5.1", "natural-compare": "^1.4.0", - "pretty-format": "^23.2.0" + "pretty-format": "^23.2.0", + "semver": "^5.5.0" } }, "jest-util": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-23.2.0.tgz", - "integrity": "sha1-YrdwdXaW2W4JSgS48cNzylClqy4=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-23.3.0.tgz", + "integrity": "sha1-efNbsMMBAO9hHZY+5riPjthzqB0=", "dev": true, "requires": { "callsites": "^2.0.0", "chalk": "^2.0.1", "graceful-fs": "^4.1.11", "is-ci": "^1.0.10", - "jest-message-util": "^23.2.0", + "jest-message-util": "^23.3.0", "mkdirp": "^0.5.1", "slash": "^1.0.0", "source-map": "^0.6.0" @@ -11246,9 +11255,9 @@ } }, "jest-validate": { - "version": "23.2.0", - "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-23.2.0.tgz", - "integrity": "sha1-Z8i5CeEa8XAXZSOIlMZ6wykbGV4=", + "version": "23.3.0", + "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-23.3.0.tgz", + "integrity": "sha1-1Jvqaq2YwwrNLLtUJDR5igzBP3Y=", "dev": true, "requires": { "chalk": "^2.0.1", @@ -15831,13 +15840,13 @@ "dev": true }, "prompts": { - "version": "0.1.9", - "resolved": "https://registry.npmjs.org/prompts/-/prompts-0.1.9.tgz", - "integrity": "sha512-RMRvwAUDVUMhP/z3YfDW6igMwT0UnL+w3XCUUNxxHjgwJnVEdHWYJVjM7hQMPub8HCk12xZYAqWlbgLBnqebwg==", + "version": "0.1.10", + "resolved": "https://registry.npmjs.org/prompts/-/prompts-0.1.10.tgz", + "integrity": "sha512-/MPwms6+g/m6fvXZlQyOL4m4ziDim2+Wc6CdWVjp+nVCkzEkK2N4rR74m/bbGf+dkta+/SBpo1FfES8Wgrk/Fw==", "dev": true, "requires": { - "clorox": "^1.0.1", - "sisteransi": "^0.1.0" + "clorox": "^1.0.3", + "sisteransi": "^0.1.1" } }, "prop-types": { @@ -16360,6 +16369,12 @@ "shallowequal": "^1.0.2" } }, + "react-is": { + "version": "16.4.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.4.1.tgz", + "integrity": "sha512-xpb0PpALlFWNw/q13A+1aHeyJyLYCg0/cCHPUA43zYluZuIPHaHL3k8OBsTgQtxqW0FhyDEMvi8fZ/+7+r4OSQ==", + "dev": true + }, "react-lifecycles-compat": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", @@ -16460,6 +16475,18 @@ } } }, + "react-test-renderer": { + "version": "16.4.1", + "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.4.1.tgz", + "integrity": "sha512-wyyiPxRZOTpKnNIgUBOB6xPLTpIzwcQMIURhZvzUqZzezvHjaGNsDPBhMac5fIY3Jf5NuKxoGvV64zDSOECPPQ==", + "dev": true, + "requires": { + "fbjs": "^0.8.16", + "object-assign": "^4.1.1", + "prop-types": "^15.6.0", + "react-is": "^16.4.1" + } + }, "read-pkg": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz", @@ -16509,9 +16536,9 @@ } }, "realpath-native": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/realpath-native/-/realpath-native-1.0.0.tgz", - "integrity": "sha512-XJtlRJ9jf0E1H1SLeJyQ9PGzQD7S65h1pRXEcAeK48doKOnKxcgPeNohJvD5u/2sI9J1oke6E8bZHS/fmW1UiQ==", + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/realpath-native/-/realpath-native-1.0.1.tgz", + "integrity": "sha512-W14EcXuqUvKP8dkWkD7B95iMy77lpMnlFXbbk409bQtNCbeu0kvRE5reo+yIZ3JXxg6frbGsz2DLQ39lrCB40g==", "dev": true, "requires": { "util.promisify": "^1.0.0" @@ -17755,9 +17782,9 @@ } }, "sisteransi": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-0.1.0.tgz", - "integrity": "sha512-kHXcIr0Z9FM6d7pwFDDIMQKGndIEtIF1oBSMXWtItpx4mrH1jhANVNT35GVekBekXl6J+5i7lJMIGq3Gm7pIdA==", + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-0.1.1.tgz", + "integrity": "sha512-PmGOd02bM9YO5ifxpw36nrNMBTptEtfRl4qUYl9SndkolplkrZZOW7PGHjrZL53QvMVj9nQ+TKqUnRsw4tJa4g==", "dev": true }, "slash": { diff --git a/package.json b/package.json index 707d65836..820605d35 100644 --- a/package.json +++ b/package.json @@ -5,10 +5,11 @@ "scripts": { "start": "node dist/index.js", "test": "node scripts/test.js --env=jsdom", - "build": "npm-run-all --parallel compile:* && npm-run-all --parallel build:*", + "build": "npm-run-all compile --parallel build:*", "build:client": "node ./scripts/build.js", "build:server": "tsc -p ./src/tsconfig.json", "watch": "NODE_ENV=development ts-node ./scripts/watcher/bin/watcher.ts ./config/watcher.ts", + "compile": "npm-run-all --parallel compile:*", "compile:css-types": "tcm src/core/client/", "compile:relay-stream": "relay-compiler --src ./src/core/client/stream --schema $(ts-node ./scripts/schemaPath.ts tenant) --language typescript --artifactDirectory ./src/core/client/stream/__generated__ --no-watchman", "start:development": "NODE_ENV=development ts-node --project ./src/tsconfig.json -r tsconfig-paths/register ./src/index.ts", @@ -72,7 +73,8 @@ "@types/passport": "^0.4.5", "@types/query-string": "^6.1.0", "@types/react-dom": "^16.0.6", - "@types/react-relay": "^1.3.6", + "@types/react-relay": "github:coralproject/patched#types/react-relay", + "@types/react-test-renderer": "^16.0.1", "@types/recompose": "^0.26.1", "@types/relay-runtime": "github:coralproject/patched#types/relay-runtime", "@types/uuid": "^3.4.3", @@ -100,7 +102,7 @@ "fluent-react": "^0.7.0", "graphql-playground-middleware-express": "^1.7.0", "html-webpack-plugin": "^3.2.0", - "jest": "^23.2.0", + "jest": "^23.3.0", "loader-utils": "^1.1.0", "npm-run-all": "^4.1.3", "postcss-flexbugs-fixes": "^3.3.1", @@ -115,6 +117,7 @@ "react-dom": "^16.4.0", "react-final-form": "^3.6.0", "react-relay": "github:coralproject/patched#react-relay", + "react-test-renderer": "^16.4.1", "recompose": "^0.27.1", "relay-compiler": "github:coralproject/patched#relay-compiler", "relay-compiler-language-typescript": "github:coralproject/patched#relay-compiler-language-typescript", diff --git a/scripts/test.js b/scripts/test.js index 1ac08fd2e..f08b18de6 100644 --- a/scripts/test.js +++ b/scripts/test.js @@ -19,11 +19,11 @@ const paths = require("../config/paths"); const jest = require("jest"); let argv = process.argv.slice(2); +argv.push("--config", paths.appJestConfig); // Watch unless on CI or in coverage mode if (!process.env.CI && argv.indexOf("--coverage") < 0) { argv.push("--watch"); - argv.push("--config", paths.appJestConfig); } jest.run(argv); diff --git a/src/core/client/stream/components/Comment.spec.tsx b/src/core/client/stream/components/Comment.spec.tsx new file mode 100644 index 000000000..6008bfc3b --- /dev/null +++ b/src/core/client/stream/components/Comment.spec.tsx @@ -0,0 +1,28 @@ +import React from "react"; +import { createRenderer } from "react-test-renderer/shallow"; +import Comment from "./Comment"; + +it("renders username and body", () => { + const props = { + author: { + username: "Marvin", + }, + body: "Woof", + }; + const renderer = createRenderer(); + renderer.render(); + expect(renderer.getRenderOutput()).toMatchSnapshot(); +}); + +it("renders with gutterBottom", () => { + const props = { + author: { + username: "Marvin", + }, + body: "Woof", + gutterBottom: true, + }; + const renderer = createRenderer(); + renderer.render(); + expect(renderer.getRenderOutput()).toMatchSnapshot(); +}); diff --git a/src/core/client/stream/components/__snapshots__/Comment.spec.tsx.snap b/src/core/client/stream/components/__snapshots__/Comment.spec.tsx.snap new file mode 100644 index 000000000..4b009e257 --- /dev/null +++ b/src/core/client/stream/components/__snapshots__/Comment.spec.tsx.snap @@ -0,0 +1,33 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`renders username and body 1`] = ` +
+ + Marvin + + + Woof + +
+`; + +exports[`renders with gutterBottom 1`] = ` +
+ + Marvin + + + Woof + +
+`; From 4fe85b8dbc7f9bca82128851c94f7d7a70d8c0d2 Mon Sep 17 00:00:00 2001 From: Kiwi Date: Fri, 6 Jul 2018 16:08:10 -0300 Subject: [PATCH 5/6] Adapt files.exclude (#1736) --- .prettierignore | 1 + .vscode/settings.json | 8 +++----- 2 files changed, 4 insertions(+), 5 deletions(-) create mode 100644 .prettierignore diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 000000000..3c3629e64 --- /dev/null +++ b/.prettierignore @@ -0,0 +1 @@ +node_modules diff --git a/.vscode/settings.json b/.vscode/settings.json index 195b73de5..4dd5d1b72 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -9,12 +9,10 @@ "**/.hg": true, "**/CVS": true, "**/.DS_Store": true, - "node_modules": true, - "dist": true, - ".vscode": true, - "package-lock.json": true + ".vs": true }, + "tslint.exclude": "**/node_modules/**", "tslint.autoFixOnSave": true, "tslint.jsEnable": true, "typescript.tsdk": "node_modules/typescript/lib" -} \ No newline at end of file +} From b77f9b8eaf14f021918276e388a0856b674a6419 Mon Sep 17 00:00:00 2001 From: okbel Date: Fri, 6 Jul 2018 23:44:29 -0300 Subject: [PATCH 6/6] Permalink ui --- package-lock.json | 161 ++++++++++++++++-- package.json | 3 + src/core/client/stream/components/Comment.css | 10 +- src/core/client/stream/components/Comment.tsx | 18 +- .../client/stream/components/Permalink.tsx | 0 src/core/client/ui/components/Input/Input.css | 11 ++ src/core/client/ui/components/Input/Input.tsx | 14 ++ src/core/client/ui/components/Input/index.ts | 2 + .../client/ui/components/Tooltip/Tooltip.css | 14 ++ .../client/ui/components/Tooltip/Tooltip.tsx | 11 ++ .../client/ui/components/Tooltip/index.ts | 2 + src/core/client/ui/components/index.ts | 2 + 12 files changed, 230 insertions(+), 18 deletions(-) create mode 100644 src/core/client/stream/components/Permalink.tsx create mode 100644 src/core/client/ui/components/Input/Input.css create mode 100644 src/core/client/ui/components/Input/Input.tsx create mode 100644 src/core/client/ui/components/Input/index.ts create mode 100644 src/core/client/ui/components/Tooltip/Tooltip.css create mode 100644 src/core/client/ui/components/Tooltip/Tooltip.tsx create mode 100644 src/core/client/ui/components/Tooltip/index.ts diff --git a/package-lock.json b/package-lock.json index c6dd91c93..c8a6caf98 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1612,7 +1612,6 @@ "version": "16.4.2", "resolved": "https://registry.npmjs.org/@types/react/-/react-16.4.2.tgz", "integrity": "sha512-oVcVteCDNiVc/fkDjowRfAZQDEOR76j3CJ3FvwXNvfV6zJguhghy1lMgpAzYox+9AZsWch+JPV6Imml3wvIUeg==", - "dev": true, "requires": { "csstype": "^2.2.0" } @@ -1641,6 +1640,14 @@ "@types/react": "*" } }, + "@types/react-tooltip": { + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/@types/react-tooltip/-/react-tooltip-3.3.5.tgz", + "integrity": "sha512-wpWzjtMWBPymIoYjqZTeWX1v5dJe4V1akmcTM6iZwSS/cL8jdi6dFt4BoLXDOxgL5tEe/9yVBlQD+MAYvexBfw==", + "requires": { + "@types/react": "*" + } + }, "@types/recompose": { "version": "0.26.1", "resolved": "https://registry.npmjs.org/@types/recompose/-/recompose-0.26.1.tgz", @@ -2050,6 +2057,14 @@ "acorn": "^5.0.0" } }, + "add-dom-event-listener": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/add-dom-event-listener/-/add-dom-event-listener-1.0.2.tgz", + "integrity": "sha1-j67SxBAIchzxEdodMNmVuFvkK+0=", + "requires": { + "object-assign": "4.x" + } + }, "address": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/address/-/address-1.0.3.tgz", @@ -4166,7 +4181,6 @@ "version": "6.26.0", "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz", "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=", - "dev": true, "requires": { "core-js": "^2.4.0", "regenerator-runtime": "^0.11.0" @@ -5076,8 +5090,7 @@ "classnames": { "version": "2.2.6", "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz", - "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==", - "dev": true + "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==" }, "clean-css": { "version": "4.1.11", @@ -5369,12 +5382,25 @@ "integrity": "sha512-MAAAIOdi2s4Gl6rZ76PNcUa9IOYB+5ICdT41o5uMRf09aEu/F9RK+qhe8RjXNPwcTjGV7KU7h2P/fljThFVqyQ==", "dev": true }, + "component-classes": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/component-classes/-/component-classes-1.2.6.tgz", + "integrity": "sha1-xkI5TDYYpNiwuJGe/Mu9kw5c1pE=", + "requires": { + "component-indexof": "0.0.3" + } + }, "component-emitter": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz", "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY=", "dev": true }, + "component-indexof": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/component-indexof/-/component-indexof-0.0.3.tgz", + "integrity": "sha1-EdCRMSI5648yyPJa6csAL/6NPCQ=" + }, "compressible": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.14.tgz", @@ -5881,6 +5907,15 @@ "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=", "dev": true }, + "css-animation": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/css-animation/-/css-animation-1.4.1.tgz", + "integrity": "sha1-W4gTEl3g+7uwu+G0cq6EIhRpt6g=", + "requires": { + "babel-runtime": "6.x", + "component-classes": "^1.2.5" + } + }, "css-color-names": { "version": "0.0.4", "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz", @@ -6248,8 +6283,7 @@ "csstype": { "version": "2.5.5", "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.5.5.tgz", - "integrity": "sha512-EGMjeoiN3aqEX5u/cyH5mSdGBDGdLcCQvcEcBWNGFSPXKd9uOTIeVG91YQ22OxI44DKpvI+4C7VUSmEpsHWJaA==", - "dev": true + "integrity": "sha512-EGMjeoiN3aqEX5u/cyH5mSdGBDGdLcCQvcEcBWNGFSPXKd9uOTIeVG91YQ22OxI44DKpvI+4C7VUSmEpsHWJaA==" }, "currently-unhandled": { "version": "0.4.1", @@ -7019,6 +7053,11 @@ "webfontloader": "^1.6.28" } }, + "dom-align": { + "version": "1.8.0", + "resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.8.0.tgz", + "integrity": "sha512-B85D4ef2Gj5lw0rK0KM2+D5/pH7yqNxg2mB+E8uzFaolpm7RQmsxEfjyEuNiF8UBBkffumYDeKRzTzc3LePP+w==" + }, "dom-converter": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.1.4.tgz", @@ -11305,8 +11344,7 @@ "js-tokens": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", - "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=", - "dev": true + "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=" }, "js-yaml": { "version": "3.12.0", @@ -11829,6 +11867,11 @@ "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz", "integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg==" }, + "lodash._getnative": { + "version": "3.9.1", + "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz", + "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=" + }, "lodash._reinterpolate": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz", @@ -11899,6 +11942,16 @@ "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=", "dev": true }, + "lodash.isarguments": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz", + "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=" + }, + "lodash.isarray": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz", + "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=" + }, "lodash.isempty": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz", @@ -12050,7 +12103,6 @@ "version": "1.3.1", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz", "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=", - "dev": true, "requires": { "js-tokens": "^3.0.0" } @@ -12939,8 +12991,7 @@ "object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", - "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", - "dev": true + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" }, "object-copy": { "version": "0.1.0", @@ -15853,7 +15904,6 @@ "version": "15.6.2", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz", "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==", - "dev": true, "requires": { "loose-envify": "^1.3.1", "object-assign": "^4.1.1" @@ -16082,6 +16132,81 @@ "strip-json-comments": "~2.0.1" } }, + "rc-align": { + "version": "2.4.3", + "resolved": "https://registry.npmjs.org/rc-align/-/rc-align-2.4.3.tgz", + "integrity": "sha512-h5KgyB5IXYR7iKpYFcMr54cuQ2eozPCZ11kbXPG5+6CWvmyJ+c0R/yjndVndiNk2G3MKcTMbJNdDv5DIckLAxQ==", + "requires": { + "babel-runtime": "^6.26.0", + "dom-align": "^1.7.0", + "prop-types": "^15.5.8", + "rc-util": "^4.0.4" + } + }, + "rc-animate": { + "version": "2.4.4", + "resolved": "https://registry.npmjs.org/rc-animate/-/rc-animate-2.4.4.tgz", + "integrity": "sha512-DjJLTUQj7XKKcuS8cczN0uOLfuSmgrVXFGieP1SZc87xUUTFGh8B/KjNmEtlfvxkSrSuVfb2rrEPER4SqKUtEA==", + "requires": { + "babel-runtime": "6.x", + "css-animation": "^1.3.2", + "prop-types": "15.x" + } + }, + "rc-tooltip": { + "version": "3.7.2", + "resolved": "https://registry.npmjs.org/rc-tooltip/-/rc-tooltip-3.7.2.tgz", + "integrity": "sha512-vsF29ohlfgr7lEP12aJ5j4U/4hzqSBYjWQo8I09re+q95v1o4nDjH1q/B3qFkf9aml2FbgdkJw9KYz/zXUgApA==", + "requires": { + "babel-runtime": "6.x", + "prop-types": "^15.5.8", + "rc-trigger": "^2.2.2" + } + }, + "rc-trigger": { + "version": "2.5.4", + "resolved": "https://registry.npmjs.org/rc-trigger/-/rc-trigger-2.5.4.tgz", + "integrity": "sha512-clgXOdazDW2qg4vTZSAExpvOuojPNuMoamG+SxAm5Ih+rpVcrtEiDlDZWY4yUHyfEWJZBzgbrr4np/z2FK6RfA==", + "requires": { + "babel-runtime": "6.x", + "classnames": "^2.2.6", + "prop-types": "15.x", + "rc-align": "^2.4.0", + "rc-animate": "2.x", + "rc-util": "^4.4.0" + } + }, + "rc-util": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/rc-util/-/rc-util-4.5.1.tgz", + "integrity": "sha512-PdCmHyBBodZdw6Oaikt0l+/R79IcRXpYkTrqD/Rbl4ZdoOi61t5TtEe40Q+A7rkWG5U1xjcN+h8j9H6GdtnICw==", + "requires": { + "add-dom-event-listener": "1.x", + "babel-runtime": "6.x", + "prop-types": "^15.5.10", + "shallowequal": "^0.2.2" + }, + "dependencies": { + "lodash.keys": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz", + "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=", + "requires": { + "lodash._getnative": "^3.0.0", + "lodash.isarguments": "^3.0.0", + "lodash.isarray": "^3.0.0" + } + }, + "shallowequal": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-0.2.2.tgz", + "integrity": "sha1-HjL9W8q2rWiKSBLLDMBO/HXHAU4=", + "requires": { + "lodash.keys": "^3.1.2" + } + } + } + }, "react": { "version": "16.4.1", "resolved": "https://registry.npmjs.org/react/-/react-16.4.1.tgz", @@ -16487,6 +16612,15 @@ "react-is": "^16.4.1" } }, + "react-tooltip": { + "version": "3.6.1", + "resolved": "https://registry.npmjs.org/react-tooltip/-/react-tooltip-3.6.1.tgz", + "integrity": "sha512-4NVjHNIx1ZazFYBNP044DHW0cr95Qaq0DSwWbrEQ7VyE8AxemHDjp0DoYvV8wilK9vR9jMlSwDW6ebRgbk3aHw==", + "requires": { + "classnames": "^2.2.5", + "prop-types": "^15.6.0" + } + }, "read-pkg": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz", @@ -16673,8 +16807,7 @@ "regenerator-runtime": { "version": "0.11.1", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz", - "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==", - "dev": true + "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==" }, "regenerator-transform": { "version": "0.12.4", diff --git a/package.json b/package.json index 820605d35..e8082799a 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "author": "", "license": "Apache-2.0", "dependencies": { + "@types/react-tooltip": "^3.3.5", "apollo-server-express": "^1.3.6", "bunyan": "^1.8.12", "convict": "^4.3.0", @@ -45,6 +46,8 @@ "mongodb": "^3.0.10", "passport": "^0.4.0", "performance-now": "^2.1.0", + "rc-tooltip": "^3.7.2", + "react-tooltip": "^3.6.1", "subscriptions-transport-ws": "^0.9.11", "uuid": "^3.2.1" }, diff --git a/src/core/client/stream/components/Comment.css b/src/core/client/stream/components/Comment.css index d43780d8f..8e5301ecd 100644 --- a/src/core/client/stream/components/Comment.css +++ b/src/core/client/stream/components/Comment.css @@ -3,9 +3,17 @@ } .gutterBottom { - margin-bottom: calc(2px * $spacing-unit); + margin-bottom: calc(2 px * $spacing-unit); } .author { font-weight: $font-weight-medium; } + +.shareButton { + padding: 10px 0; +} + +.input { + margin-right: 5px; +} diff --git a/src/core/client/stream/components/Comment.tsx b/src/core/client/stream/components/Comment.tsx index c1b3f9303..1f4e11b1c 100644 --- a/src/core/client/stream/components/Comment.tsx +++ b/src/core/client/stream/components/Comment.tsx @@ -1,9 +1,7 @@ import cn from "classnames"; import React from "react"; import { StatelessComponent } from "react"; - -import { Typography } from "talk-ui/components"; - +import { Button, Input, Tooltip, Typography } from "talk-ui/components"; import * as styles from "./Comment.css"; export interface CommentProps { @@ -25,6 +23,20 @@ const Comment: StatelessComponent = props => { {props.author && props.author.username} {props.body} +
+ + + + + +
); }; diff --git a/src/core/client/stream/components/Permalink.tsx b/src/core/client/stream/components/Permalink.tsx new file mode 100644 index 000000000..e69de29bb diff --git a/src/core/client/ui/components/Input/Input.css b/src/core/client/ui/components/Input/Input.css new file mode 100644 index 000000000..4d2e9e88a --- /dev/null +++ b/src/core/client/ui/components/Input/Input.css @@ -0,0 +1,11 @@ +.root { + font-family: "Source Sans Pro"; + font-weight: 400; + font-size: 16px; + letter-spacing: calc(0.57em / 16); + background: #ffffff; + border: 1px solid #979797; + box-sizing: border-box; + border-radius: 1px; + padding: 5px 20px; +} diff --git a/src/core/client/ui/components/Input/Input.tsx b/src/core/client/ui/components/Input/Input.tsx new file mode 100644 index 000000000..261b3b1af --- /dev/null +++ b/src/core/client/ui/components/Input/Input.tsx @@ -0,0 +1,14 @@ +import cn from "classnames"; +import React, { InputHTMLAttributes, StatelessComponent } from "react"; + +import * as styles from "./Input.css"; + +interface InnerProps extends InputHTMLAttributes { + classes?: typeof styles; +} + +const Input: StatelessComponent = ({ className, ...rest }) => { + return ; +}; + +export default Input; diff --git a/src/core/client/ui/components/Input/index.ts b/src/core/client/ui/components/Input/index.ts new file mode 100644 index 000000000..ae0d7a775 --- /dev/null +++ b/src/core/client/ui/components/Input/index.ts @@ -0,0 +1,2 @@ +export * from "./Input"; +export { default } from "./Input"; diff --git a/src/core/client/ui/components/Tooltip/Tooltip.css b/src/core/client/ui/components/Tooltip/Tooltip.css new file mode 100644 index 000000000..e3de3d8fe --- /dev/null +++ b/src/core/client/ui/components/Tooltip/Tooltip.css @@ -0,0 +1,14 @@ +.root { + background: #ffffff !important; + border: 1px solid #c9cacb; + box-sizing: border-box; + box-shadow: 1px 0px 4px rgba(0, 0, 0, 0.25); + border-radius: 1px; + color: #222 !important; + display: flex !important; + + &:after, + &::before { + border-top-color: transparent !important; + } +} diff --git a/src/core/client/ui/components/Tooltip/Tooltip.tsx b/src/core/client/ui/components/Tooltip/Tooltip.tsx new file mode 100644 index 000000000..dffda088a --- /dev/null +++ b/src/core/client/ui/components/Tooltip/Tooltip.tsx @@ -0,0 +1,11 @@ +import React from "react"; +import ReactTooltip from "react-tooltip"; +import * as styles from "./Tooltip.css"; + +class Tooltip extends React.Component { + public render() { + return ; + } +} + +export default Tooltip; diff --git a/src/core/client/ui/components/Tooltip/index.ts b/src/core/client/ui/components/Tooltip/index.ts new file mode 100644 index 000000000..9474b3888 --- /dev/null +++ b/src/core/client/ui/components/Tooltip/index.ts @@ -0,0 +1,2 @@ +export * from "./Tooltip"; +export { default } from "./Tooltip"; diff --git a/src/core/client/ui/components/index.ts b/src/core/client/ui/components/index.ts index 54643cb2a..6e1fcd8a6 100644 --- a/src/core/client/ui/components/index.ts +++ b/src/core/client/ui/components/index.ts @@ -2,3 +2,5 @@ export { default as BaseButton } from "./BaseButton"; export { default as Button } from "./Button"; export { default as Center } from "./Center"; export { default as Typography } from "./Typography"; +export { default as Tooltip } from "./Tooltip"; +export { default as Input } from "./Input";