Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Import with param-case package name instead of PascalCase component name #28

Merged
merged 1 commit into from
Jul 13, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/cli/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,11 @@
"dependencies": {
"@craco/craco": "^5.6.4",
"chalk": "^4.1.0",
"change-case": "^4.1.1",
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

pros: a single import; cons: more dependencies than necessary.

I could explicitly install each case if that's preferred?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

since it's just used once, and I doubt its code will change, I would literally copy paste the implementations of those two functions (and license) into the bottom of cli.ts. But, your call.

"execa": "^4.0.2",
"find-up": "^4.1.0",
"fs-extra": "^9.0.1",
"meow": "^7.0.1",
"pascal-case": "^3.1.1",
"resolve-as-bin": "^2.1.0"
},
"devDependencies": {
Expand Down
17 changes: 12 additions & 5 deletions packages/cli/src/cli.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,12 @@ import findUp from 'find-up';
import * as fs from 'fs-extra';
import * as path from 'path';
import chalk from 'chalk';
import { pascalCase as toPascalCase } from 'pascal-case';
import {
pascalCase as toPascalCase,
paramCase as toParamCase,
} from 'change-case';
import resolveAsBin from 'resolve-as-bin';
import generate from './generateComponentImports';
import generateComponentImports from './generateComponentImports';

// Makes the script crash on unhandled rejections instead of silently
// ignoring them. In the future, promise rejections that are not handled will
Expand Down Expand Up @@ -186,7 +189,10 @@ function app(name: string) {
function widget(name: string) {
const modularRoot = getModularRoot();

const newWidgetPath = path.join(modularRoot, 'widgets', name);
const newWidgetPackageName = toParamCase(name);
const newWidgetComponentName = toPascalCase(name);

const newWidgetPath = path.join(modularRoot, 'widgets', newWidgetPackageName);
const templatePath = path.join(__dirname, '..', 'template');

// create a new widget source folder
Expand All @@ -210,7 +216,8 @@ function widget(name: string) {
filePath,
fs
.readFileSync(filePath, 'utf8')
.replace(/Component\$\$/g, toPascalCase(name)),
.replace(/PackageName\$\$/g, newWidgetPackageName)
.replace(/ComponentName\$\$/g, newWidgetComponentName),
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Basically, it's no longer Component$$ which is rewritten, but instead ComponentName$$ and PackageName$$. This means we still get a sensible component name, but the package name is param-case (kebab-case, dash-case, etc.)

);
}

Expand All @@ -226,7 +233,7 @@ function widget(name: string) {
function map(modularRoot = getModularRoot()) {
fs.writeFileSync(
path.join(modularRoot, 'app/src/widgets.js'),
generate(path.join(modularRoot, 'widgets')),
generateComponentImports(path.join(modularRoot, 'widgets')),
);
}

Expand Down
43 changes: 30 additions & 13 deletions packages/cli/src/generateComponentImports.ts
Original file line number Diff line number Diff line change
@@ -1,22 +1,39 @@
import * as fs from 'fs-extra';
import { pascalCase as toPascalCase } from 'pascal-case';
import * as path from 'path';

// given a path, generate a map like { name: () => import(name) }
export default function scriptContent(dirPath: string): string {
const dirs = fs
.readdirSync(dirPath, { withFileTypes: true })
.filter((entry) => entry.isDirectory());
interface PackageJson {
name: string;
private?: boolean;
}

// Given a directory of widgets, generate a map like:
// { 'package-name': lazy(() => import('package-name')) }
export default function generateComponentImports(
widgetsDirectoryPath: string,
): string {
const packageNames = fs
.readdirSync(widgetsDirectoryPath, { withFileTypes: true })
// Get individual widget directories.
.filter((entry) => entry.isDirectory())
// Get widget `package.json`s.
.map(
(dir) =>
fs.readJSONSync(
path.join(widgetsDirectoryPath, dir.name, 'package.json'),
) as PackageJson,
)
// Remove widgets which are marked as private (and therefore are not published yet.)
.filter((packageJson) => packageJson.private !== true)
// Get package names.
.map((packageJson) => packageJson.name);

// todo - read from meta.json inside these folders and filter out those which aren't ready to be published yet
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I decided to use package.name#private. Let me know if re-use in this way is problematic.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good idea, let's do this.

return `// DO NOT EDIT THIS FILE.
${dirs.length > 0 ? `import {lazy} from 'react';` : ''}
${packageNames.length > 0 ? `import { lazy } from 'react';` : ''}

export default {
${dirs
${packageNames
.map(
(dir) =>
`'${toPascalCase(dir.name)}': lazy(() => import('${toPascalCase(
dir.name,
)}'))`,
(packageName) => `'${packageName}': lazy(() => import('${packageName}'))`,
)
.join(',\n ')}
}
Expand Down
4 changes: 2 additions & 2 deletions packages/cli/template/widgets/starter/index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react';

export default function Component$$() {
return <div>This is Component$$</div>;
export default function ComponentName$$() {
return <div>This is ComponentName$$</div>;
}
2 changes: 1 addition & 1 deletion packages/cli/template/widgets/starter/package.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "Component$$",
"name": "PackageName$$",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
Expand Down
107 changes: 107 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1986,6 +1986,14 @@ callsites@^3.0.0:
resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==

camel-case@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-4.1.1.tgz#1fc41c854f00e2f7d0139dfeba1542d6896fe547"
integrity sha512-7fa2WcG4fYFkclIvEmxBbTvmibwF2/agfEBc6q3lOpVu0A13ltLsA+Hr/8Hp6kp5f+G7hKi6t8lys6XxP+1K6Q==
dependencies:
pascal-case "^3.1.1"
tslib "^1.10.0"

camelcase-keys@^6.2.2:
version "6.2.2"
resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-6.2.2.tgz#5e755d6ba51aa223ec7d3d52f25778210f9dc3c0"
Expand All @@ -2010,6 +2018,15 @@ caniuse-lite@^1.0.30001043:
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001062.tgz#d814b648338504b315222ace6f1a533d9a55e390"
integrity sha512-ei9ZqeOnN7edDrb24QfJ0OZicpEbsWxv7WusOiQGz/f2SfvBgHHbOEwBJ8HKGVSyx8Z6ndPjxzR6m0NQq+0bfw==

capital-case@^1.0.3:
version "1.0.3"
resolved "https://registry.yarnpkg.com/capital-case/-/capital-case-1.0.3.tgz#339bd77e8fab6cf75111d4fca509b3edf7c117c8"
integrity sha512-OlUSJpUr7SY0uZFOxcwnDOU7/MpHlKTZx2mqnDYQFrDudXLFm0JJ9wr/l4csB+rh2Ug0OPuoSO53PqiZBqno9A==
dependencies:
no-case "^3.0.3"
tslib "^1.10.0"
upper-case-first "^2.0.1"

capture-exit@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/capture-exit/-/capture-exit-2.0.0.tgz#fb953bfaebeb781f62898239dabb426d08a509a4"
Expand Down Expand Up @@ -2055,6 +2072,24 @@ chalk@^4.1.0:
ansi-styles "^4.1.0"
supports-color "^7.1.0"

change-case@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/change-case/-/change-case-4.1.1.tgz#d5005709275952e7963fed7b91e4f9fdb6180afa"
integrity sha512-qRlUWn/hXnX1R1LBDF/RelJLiqNjKjUqlmuBVSEIyye8kq49CXqkZWKmi8XeUAdDXWFOcGLUMZ+aHn3Q5lzUXw==
dependencies:
camel-case "^4.1.1"
capital-case "^1.0.3"
constant-case "^3.0.3"
dot-case "^3.0.3"
header-case "^2.0.3"
no-case "^3.0.3"
param-case "^3.0.3"
pascal-case "^3.1.1"
path-case "^3.0.3"
sentence-case "^3.0.3"
snake-case "^3.0.3"
tslib "^1.10.0"

char-regex@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf"
Expand Down Expand Up @@ -2217,6 +2252,15 @@ confusing-browser-globals@^1.0.9:
resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.9.tgz#72bc13b483c0276801681871d4898516f8f54fdd"
integrity sha512-KbS1Y0jMtyPgIxjO7ZzMAuUpAKMt1SzCL9fsrKsX6b0zJPTaT0SiSPmewwVZg9UAO83HVIlEhZF84LIjZ0lmAw==

constant-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/constant-case/-/constant-case-3.0.3.tgz#ac910a99caf3926ac5112f352e3af599d8c5fc0a"
integrity sha512-FXtsSnnrFYpzDmvwDGQW+l8XK3GV1coLyBN0eBz16ZUzGaZcT2ANVCJmLeuw2GQgxKHQIe9e0w2dzkSfaRlUmA==
dependencies:
no-case "^3.0.3"
tslib "^1.10.0"
upper-case "^2.0.1"

contains-path@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/contains-path/-/contains-path-0.1.0.tgz#fe8cf184ff6670b6baef01a9d4861a5cbec4120a"
Expand Down Expand Up @@ -2490,6 +2534,14 @@ domexception@^2.0.1:
dependencies:
webidl-conversions "^5.0.0"

dot-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.3.tgz#21d3b52efaaba2ea5fda875bb1aa8124521cf4aa"
integrity sha512-7hwEmg6RiSQfm/GwPL4AAWXKy3YNNZA3oFv2Pdiey0mwkRCPZ9x6SZbkLcn8Ma5PYeVokzoD4Twv2n7LKp5WeA==
dependencies:
no-case "^3.0.3"
tslib "^1.10.0"

ecc-jsbn@~0.1.1:
version "0.1.2"
resolved "https://registry.yarnpkg.com/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz#3a83a904e54353287874c564b7549386849a98c9"
Expand Down Expand Up @@ -3326,6 +3378,14 @@ has@^1.0.3:
dependencies:
function-bind "^1.1.1"

header-case@^2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/header-case/-/header-case-2.0.3.tgz#8a7407d16edfd5c970f8ebb116e6383f855b5a72"
integrity sha512-LChe/V32mnUQnTwTxd3aAlNMk8ia9tjCDb/LjYtoMrdAPApxLB+azejUk5ERZIZdIqvinwv6BAUuFXH/tQPdZA==
dependencies:
capital-case "^1.0.3"
tslib "^1.10.0"

hosted-git-info@^2.1.4:
version "2.8.8"
resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.8.tgz#7539bd4bc1e0e0a895815a2e0262420b12858488"
Expand Down Expand Up @@ -4925,6 +4985,14 @@ pad@^3.2.0:
dependencies:
wcwidth "^1.0.1"

param-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.3.tgz#4be41f8399eff621c56eebb829a5e451d9801238"
integrity sha512-VWBVyimc1+QrzappRs7waeN2YmoZFCGXWASRYX1/rGHtXqEcrGEIDm+jqIwFa2fRXNgQEwrxaYuIrX0WcAguTA==
dependencies:
dot-case "^3.0.3"
tslib "^1.10.0"

parent-module@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
Expand Down Expand Up @@ -4967,6 +5035,14 @@ pascalcase@^0.1.1:
resolved "https://registry.yarnpkg.com/pascalcase/-/pascalcase-0.1.1.tgz#b363e55e8006ca6fe21784d2db22bd15d7917f14"
integrity sha1-s2PlXoAGym/iF4TS2yK9FdeRfxQ=

path-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/path-case/-/path-case-3.0.3.tgz#d48119aed52c4712e036ca40c6b15984f909554f"
integrity sha512-UMFU6UETFpCNWbIWNczshPrnK/7JAXBP2NYw80ojElbQ2+JYxdqWDBkvvqM93u4u6oLmuJ/tPOf2tM8KtXv4eg==
dependencies:
dot-case "^3.0.3"
tslib "^1.10.0"

path-dirname@^1.0.0:
version "1.0.2"
resolved "https://registry.yarnpkg.com/path-dirname/-/path-dirname-1.0.2.tgz#cc33d24d525e099a5388c0336c6e32b9160609e0"
Expand Down Expand Up @@ -5573,6 +5649,15 @@ semver@^7.2.1, semver@^7.3.2:
resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.2.tgz#604962b052b81ed0786aae84389ffba70ffd3938"
integrity sha512-OrOb32TeeambH6UrhtShmF7CRDqhL6/5XpPNp2DuRH6+9QLw/orhp72j87v8Qa1ScDkvrrBNpZcDejAirJmfXQ==

sentence-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/sentence-case/-/sentence-case-3.0.3.tgz#47576e4adff7abf42c63c815b0543c9d2f85a930"
integrity sha512-ZPr4dgTcNkEfcGOMFQyDdJrTU9uQO1nb1cjf+nuzb6FxgMDgKddZOM29qEsB7jvsZSMruLRcL2KfM4ypKpa0LA==
dependencies:
no-case "^3.0.3"
tslib "^1.10.0"
upper-case-first "^2.0.1"

set-blocking@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
Expand Down Expand Up @@ -5672,6 +5757,14 @@ slice-ansi@^4.0.0:
astral-regex "^2.0.0"
is-fullwidth-code-point "^3.0.0"

snake-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/snake-case/-/snake-case-3.0.3.tgz#c598b822ab443fcbb145ae8a82c5e43526d5bbee"
integrity sha512-WM1sIXEO+rsAHBKjGf/6R1HBBcgbncKS08d2Aqec/mrDSpU80SiOU41hO7ny6DToHSyrlwTYzQBIK1FPSx4Y3Q==
dependencies:
dot-case "^3.0.3"
tslib "^1.10.0"

snapdragon-node@^2.0.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
Expand Down Expand Up @@ -6248,6 +6341,20 @@ upath@^1.1.1:
resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894"
integrity sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==

upper-case-first@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/upper-case-first/-/upper-case-first-2.0.1.tgz#32ab436747d891cc20ab1e43d601cb4d0a7fbf4a"
integrity sha512-105J8XqQ+9RxW3l9gHZtgve5oaiR9TIwvmZAMAIZWRHe00T21cdvewKORTlOJf/zXW6VukuTshM+HXZNWz7N5w==
dependencies:
tslib "^1.10.0"

upper-case@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/upper-case/-/upper-case-2.0.1.tgz#6214d05e235dc817822464ccbae85822b3d8665f"
integrity sha512-laAsbea9SY5osxrv7S99vH9xAaJKrw5Qpdh4ENRLcaxipjKsiaBwiAsxfa8X5mObKNTQPsupSq0J/VIxsSJe3A==
dependencies:
tslib "^1.10.0"

uri-js@^4.2.2:
version "4.2.2"
resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.2.2.tgz#94c540e1ff772956e2299507c010aea6c8838eb0"
Expand Down