-
Notifications
You must be signed in to change notification settings - Fork 2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added the skeleton packages for the Odie-based Jetpackcom support UI …
…app.
- Loading branch information
Showing
5 changed files
with
240 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| ### The Odie bot interface for Jetpack.com |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,29 @@ | ||
| import OdieAssistantProvider, { | ||
| OdieAssistant, | ||
| EllipsisMenu, | ||
| useOdieAssistantContext, | ||
| } from '@automattic/odie-client'; | ||
|
|
||
| const OdieBot = () => { | ||
| const { clearChat } = useOdieAssistantContext(); | ||
| return ( | ||
| <OdieAssistantProvider botNameSlug="jetpack-support-chat"> | ||
| <div className="custom-class"> | ||
| <EllipsisMenu popoverClassName="menu-class" position="bottom"> | ||
| <span | ||
| role="button" | ||
| tabIndex={ 0 } | ||
| onClick={ () => clearChat() } | ||
| onKeyPress={ () => clearChat() } | ||
| className="menu-item-class" | ||
| > | ||
| Start a New Chat | ||
| </span> | ||
| </EllipsisMenu> | ||
| </div> | ||
| <OdieAssistant /> | ||
| </OdieAssistantProvider> | ||
| ); | ||
| }; | ||
|
|
||
| window.JetpackSupportBot = OdieBot(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| { | ||
| "name": "@automattic/jetpackme-support", | ||
| "version": "1.0.0", | ||
| "description": "A Jetpack.com Odie bot interface application.", | ||
| "homepage": "https://github.com/Automattic/wp-calypso", | ||
| "license": "GPL-2.0-or-later", | ||
| "author": "Automattic Inc.", | ||
| "sideEffects": [ | ||
| "*.css", | ||
| "*.scss", | ||
| "./config.js" | ||
| ], | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "git+https://github.com/Automattic/wp-calypso.git", | ||
| "directory": "apps/help-center" | ||
| }, | ||
| "publishConfig": { | ||
| "access": "public" | ||
| }, | ||
| "bugs": "https://github.com/Automattic/wp-calypso/issues", | ||
| "types": "dist/types", | ||
| "scripts": { | ||
| "clean": "rm -rf dist", | ||
| "teamcity:build-app": "yarn run build", | ||
| "build": "NODE_ENV=production yarn dev", | ||
| "build:app": "calypso-build", | ||
| "dev": "yarn run calypso-apps-builder --localPath dist --remotePath /home/wpcom/public_html/widgets.wp.com/help-center", | ||
| "prepack": "yarn run clean && yarn run build", | ||
| "watch": "tsc --build ./tsconfig.json --watch", | ||
| "translate": "rm -rf dist/strings && wp-babel-makepot './dist/*.{js,jsx,ts,tsx}' --ignore '**/node_modules/**,**/test/**,**/*.d.ts' --base './dist' --dir './dist/strings' --output './dist/help-center.pot' && build-app-languages --stringsFilePath='./dist/help-center.pot' --outputPath='./dist/languages' --outputFormat='JS'" | ||
| }, | ||
| "dependencies": { | ||
| "@automattic/components": "workspace:^", | ||
| "@automattic/i18n-utils": "workspace:^", | ||
| "@automattic/odie-client": "workspace:^", | ||
| "@wordpress/components": "^28.2.0", | ||
| "react": "^18.2.0", | ||
| "react-dom": "^18.2.0" | ||
| }, | ||
| "devDependencies": { | ||
| "@automattic/calypso-apps-builder": "workspace:^", | ||
| "@automattic/calypso-build": "workspace:^", | ||
| "@automattic/calypso-typescript-config": "workspace:^", | ||
| "@automattic/wp-babel-makepot": "workspace:^", | ||
| "@wordpress/dependency-extraction-webpack-plugin": "5.9.0", | ||
| "@wordpress/readable-js-assets-webpack-plugin": "3.0.0", | ||
| "autoprefixer": "^10.4.20", | ||
| "copy-webpack-plugin": "^10.2.4", | ||
| "typescript": "^5.3.3", | ||
| "webpack": "^5.91.0" | ||
| }, | ||
| "peerDependencies": { | ||
| "@wordpress/data": "^10.2.0", | ||
| "postcss": "*" | ||
| }, | ||
| "private": true | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,100 @@ | ||
| const path = require( 'path' ); | ||
| const FileConfig = require( '@automattic/calypso-build/webpack/file-loader' ); | ||
| const SassConfig = require( '@automattic/calypso-build/webpack/sass' ); | ||
| const TranspileConfig = require( '@automattic/calypso-build/webpack/transpile' ); | ||
| const { shouldTranspileDependency } = require( '@automattic/calypso-build/webpack/util' ); | ||
| const getBaseWebpackConfig = require( '@automattic/calypso-build/webpack.config.js' ); | ||
| const ReadableJsAssetsWebpackPlugin = require( '@wordpress/readable-js-assets-webpack-plugin' ); | ||
| const autoprefixerPlugin = require( 'autoprefixer' ); | ||
| const webpack = require( 'webpack' ); | ||
| const cacheIdentifier = require( '../../build-tools/babel/babel-loader-cache-identifier' ); | ||
| const GenerateChunksMapPlugin = require( '../../build-tools/webpack/generate-chunks-map-plugin' ); | ||
| const isDevelopment = process.env.NODE_ENV !== 'production'; | ||
| const extraPath = 'fallback'; | ||
| const cachePath = path.resolve( '.cache', extraPath ); | ||
|
|
||
| /* Arguments to this function replicate webpack's so this config can be used on the command line, | ||
| * with individual options overridden by command line args. | ||
| * @see {@link https://webpack.js.org/configuration/configuration-types/#exporting-a-function} | ||
| * @see {@link https://webpack.js.org/api/cli/} | ||
| * @param {Object} env environment options | ||
| * @param {string} env.source plugin slugs, comma separated list | ||
| * @param {Object} argv options map | ||
| * @param {string} argv.entry entry path | ||
| * @returns {Object} webpack config | ||
| */ | ||
| function getWebpackConfig( env = { source: '' }, argv = {} ) { | ||
| env.WP = true; | ||
| const outputPath = path.join( __dirname, 'dist' ); | ||
|
|
||
| const webpackConfig = getBaseWebpackConfig( env, argv ); | ||
|
|
||
| return { | ||
| ...webpackConfig, | ||
| mode: isDevelopment ? 'development' : 'production', | ||
| entry: { | ||
| 'jetpackme-support': path.join( __dirname, 'index.js' ), | ||
| }, | ||
| output: { | ||
| ...webpackConfig.output, | ||
| path: outputPath, | ||
| filename: '[name].min.js', // dynamic filename | ||
| library: 'jetpackme-support', | ||
| }, | ||
| optimization: { | ||
| ...webpackConfig.optimization, | ||
| // disable module concatenation so that instances of `__()` are not renamed | ||
| concatenateModules: false, | ||
| }, | ||
| module: { | ||
| rules: [ | ||
| TranspileConfig.loader( { | ||
| workerCount: 2, | ||
| configFile: path.resolve( '../../babel.config.js' ), | ||
| cacheDirectory: path.resolve( cachePath, 'babel-client' ), | ||
| cacheIdentifier, | ||
| cacheCompression: false, | ||
| exclude: /node_modules\//, | ||
| } ), | ||
| TranspileConfig.loader( { | ||
| workerCount: 2, | ||
| presets: [ require.resolve( '@automattic/calypso-babel-config/presets/dependencies' ) ], | ||
| cacheDirectory: path.resolve( cachePath, 'babel-client' ), | ||
| cacheIdentifier, | ||
| cacheCompression: false, | ||
| include: shouldTranspileDependency, | ||
| } ), | ||
| SassConfig.loader( { | ||
| includePaths: [ __dirname ], | ||
| postCssOptions: { | ||
| // Do not use postcss.config.js. This ensure we have the final say on how PostCSS is used in calypso. | ||
| // This is required because Calypso imports `@automattic/notifications` and that package defines its | ||
| // own `postcss.config.js` that they use for their webpack bundling process. | ||
| config: false, | ||
| plugins: [ autoprefixerPlugin() ], | ||
| }, | ||
| prelude: `@use '${ require.resolve( | ||
| 'calypso/assets/stylesheets/shared/_utils.scss' | ||
| ) }' as *;`, | ||
| } ), | ||
| FileConfig.loader(), | ||
| ], | ||
| }, | ||
| plugins: [ | ||
| new webpack.DefinePlugin( { | ||
| 'process.env.NODE_DEBUG': JSON.stringify( process.env.NODE_DEBUG || false ), | ||
| } ), | ||
| new GenerateChunksMapPlugin( { | ||
| output: path.resolve( './dist/chunks-map.json' ), | ||
| } ), | ||
| ...SassConfig.plugins( { | ||
| filename: '[name].min.css', | ||
| chunkFilename: '[contenthash].css', | ||
| minify: ! isDevelopment, | ||
| } ), | ||
| new ReadableJsAssetsWebpackPlugin(), | ||
| ], | ||
| }; | ||
| } | ||
|
|
||
| module.exports = getWebpackConfig; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters