From 2ff658803054abb35508026339ed5578de00e4f1 Mon Sep 17 00:00:00 2001 From: Katalina Date: Fri, 12 Mar 2021 18:04:49 -0500 Subject: [PATCH] Refactor node packages to yarn workspaces & ditch next.js for CRA. (#161) * chore: restructure project into yarn workspaces, remove next * fix tests, remove webapp from terraform * remove more ui deployment bits * remove pages, fix FUNDING.yml * remove isomorphism * remove next providers * fix linting issues * feat: start basis of new web ui system on CRA * chore: move types to @roleypoly/types package * chore: move src/common/utils to @roleypoly/misc-utils * chore: remove roleypoly/ path remappers * chore: renmove vercel config * chore: re-add worker-types to api package * chore: fix type linting scope for api * fix(web): craco should include all of packages dir * fix(ci): change api webpack path for wrangler * chore: remove GAR actions from CI * chore: update codeql job * chore: test better github dar matcher in lint-staged --- .babelrc.js | 3 +- .github/FUNDING.yml | 2 +- .github/workflows/build.yml | 11 +- .github/workflows/codeql-analysis.yml | 44 +- .github/workflows/deploy.yml | 122 +- .github/workflows/gar-cleanup.yml | 45 - .gitignore | 1 + README.md | 14 +- docker-compose.yaml | 13 +- hack/dockerfiles/ui.Dockerfile | 24 - jest.config.js | 6 - next-env.d.ts | 2 - next.config.js | 7 - package.json | 110 +- .../api}/.gitignore | 0 .../api}/bindings.d.ts | 0 .../api}/handlers/bot-join.ts | 0 .../api}/handlers/create-roleypoly-data.ts | 2 +- .../api}/handlers/get-picker-data.ts | 7 +- .../api}/handlers/get-session.ts | 2 +- .../api}/handlers/get-slug.ts | 2 +- .../api}/handlers/login-bounce.ts | 0 .../api}/handlers/login-callback.ts | 7 +- .../api}/handlers/revoke-session.ts | 2 +- .../api}/handlers/update-roles.ts | 4 +- {src/backend-worker => packages/api}/index.ts | 0 packages/api/package.json | 19 + .../backend-worker => packages/api}/router.ts | 0 .../api}/tsconfig.json | 0 .../api}/utils/api-tools.ts | 4 +- .../api}/utils/bounce.ts | 0 .../api}/utils/config.ts | 0 .../api}/utils/guild.ts | 4 +- .../api}/utils/kv.ts | 0 .../api}/webpack.config.js | 6 - .../api/worker.config.js | 0 {src => packages}/backend-emulator/kv.js | 0 {src => packages}/backend-emulator/main.js | 23 +- packages/backend-emulator/package.json | 17 + packages/design-system/.storybook/main.js | 8 + packages/design-system/.storybook/manager.js | 6 + .../.storybook/mocks/next_link.tsx | 8 + .../.storybook/preview-head.html | 39 + packages/design-system/.storybook/preview.js | 10 + packages/design-system/.storybook/theme.js | 34 + .../design-system/Intro.stories.mdx | 6 +- {src => packages}/design-system/README.md | 0 .../atoms/avatar/Avatar.stories.tsx | 0 .../atoms/avatar/Avatar.styled.ts | 2 +- .../design-system/atoms/avatar/Avatar.tsx | 0 .../atoms/avatar/avatarUtils.tsx | 0 .../design-system/atoms/avatar/index.ts | 0 .../atoms/branding/Branding.stories.tsx | 0 .../design-system/atoms/branding/Branding.tsx | 2 +- .../atoms/branding/BrandingOld.tsx | 0 .../branding/DynamicBranding.stories.tsx | 2 +- .../atoms/branding/DynamicBranding.tsx | 0 .../atoms/branding/FlagBranding.stories.tsx | 0 .../atoms/branding/FlagBranding.tsx | 0 .../design-system/atoms/branding/index.ts | 0 .../atoms/breakpoints/BreakpointProvider.tsx | 0 .../atoms/breakpoints/Breakpoints.stories.tsx | 0 .../atoms/breakpoints/Breakpoints.ts | 0 .../atoms/breakpoints/Context.ts | 2 +- .../atoms/breakpoints/DebugTool.tsx | 0 .../design-system/atoms/breakpoints/index.ts | 0 .../atoms/button/Button.spec.tsx | 0 .../atoms/button/Button.stories.tsx | 0 .../atoms/button/Button.styled.ts | 6 +- .../design-system/atoms/button/Button.tsx | 0 .../design-system/atoms/button/index.ts | 0 .../atoms/collapse/Collapse.stories.tsx | 2 +- .../design-system/atoms/collapse/Collapse.tsx | 0 .../design-system/atoms/collapse/index.ts | 0 .../atoms/colors/colors.stories.tsx | 2 +- .../design-system/atoms/colors/colors.tsx | 0 .../design-system/atoms/colors/index.ts | 0 .../design-system/atoms/colors/withColors.tsx | 0 .../atoms/dot-overlay/DotOverlay.stories.tsx | 0 .../atoms/dot-overlay/DotOverlay.tsx | 0 .../design-system/atoms/dot-overlay/index.ts | 0 .../atoms/fader/Fader.stories.tsx | 2 +- .../design-system/atoms/fader/Fader.tsx | 0 .../design-system/atoms/fader/index.ts | 0 .../feature-gate/FeatureGate.stories.tsx | 2 +- .../atoms/feature-gate/FeatureGate.tsx | 4 +- .../design-system/atoms/feature-gate/index.ts | 0 .../atoms/fonts/fonts.stories.tsx | 5 +- packages/design-system/atoms/fonts/fonts.tsx | 10 + .../design-system/atoms/fonts/index.ts | 0 .../atoms/halfsies/Halfsies.stories.tsx | 0 .../design-system/atoms/halfsies/Halfsies.tsx | 2 +- .../design-system/atoms/halfsies/index.ts | 0 .../design-system/atoms/hero/Hero.stories.tsx | 0 .../design-system/atoms/hero/Hero.tsx | 0 .../design-system/atoms/hero/index.ts | 0 .../atoms/horizontal-switch/BUILD.bazel | 0 .../HorizontalSwitch.stories.tsx | 0 .../HorizontalSwitch.styled.ts | 4 +- .../horizontal-switch/HorizontalSwitch.tsx | 0 .../atoms/horizontal-switch/index.tsx | 0 .../atoms/key-events/KeyEvents.ts | 0 .../design-system/atoms/key-events/index.ts | 0 .../atoms/popover/Popover.stories.tsx | 2 +- .../atoms/popover/Popover.styled.ts | 6 +- .../design-system/atoms/popover/Popover.tsx | 2 +- .../design-system/atoms/popover/index.ts | 0 .../design-system/atoms/role/Role.spec.tsx | 2 +- .../design-system/atoms/role/Role.stories.tsx | 4 +- .../design-system/atoms/role/Role.styled.tsx | 4 +- .../design-system/atoms/role/Role.tsx | 6 +- .../design-system/atoms/role/index.ts | 0 .../atoms/space/Space.stories.tsx | 0 .../design-system/atoms/space/Space.tsx | 0 .../design-system/atoms/space/index.ts | 0 .../design-system/atoms/sparkle/Shapes.tsx | 0 .../atoms/sparkle/Sparkle.stories.tsx | 4 +- .../design-system/atoms/sparkle/Sparkle.tsx | 2 +- .../design-system/atoms/sparkle/index.ts | 0 .../atoms/tab-view/TabView.spec.tsx | 0 .../atoms/tab-view/TabView.stories.tsx | 0 .../atoms/tab-view/TabView.styled.ts | 6 +- .../design-system/atoms/tab-view/TabView.tsx | 0 .../design-system/atoms/tab-view/index.ts | 0 .../atoms/text-input/TextInput.stories.tsx | 2 +- .../atoms/text-input/TextInput.tsx | 2 +- .../design-system/atoms/text-input/index.ts | 0 .../design-system/atoms/timings/index.ts | 0 .../design-system/atoms/timings/timings.ts | 0 .../atoms/typist/Typist.spec.tsx | 0 .../atoms/typist/Typist.stories.tsx | 0 .../design-system/atoms/typist/Typist.tsx | 0 .../design-system/atoms/typist/index.ts | 0 .../design-system/atoms/typography/index.ts | 0 .../design-system/atoms/typography/mdx.tsx | 0 .../atoms/typography/typography.stories.tsx | 0 .../atoms/typography/typography.tsx | 4 +- .../design-system/fixtures}/storyData.ts | 2 +- .../demo-discord/DemoDiscord.stories.tsx | 0 .../demo-discord/DemoDiscord.styled.ts | 2 +- .../molecules/demo-discord/DemoDiscord.tsx | 4 +- .../molecules/demo-discord/index.ts | 0 .../demo-picker/DemoPicker.stories.tsx | 0 .../molecules/demo-picker/DemoPicker.tsx | 6 +- .../molecules/demo-picker/index.ts | 0 .../EditorCategory.stories.tsx | 6 +- .../editor-category/EditorCategory.styled.ts | 0 .../editor-category/EditorCategory.tsx | 18 +- .../molecules/editor-category/index.ts | 0 .../error-banner/ErrorBanner.stories.tsx | 0 .../error-banner/ErrorBanner.styled.ts | 6 +- .../molecules/error-banner/ErrorBanner.tsx | 0 .../molecules/error-banner/index.ts | 0 .../design-system/molecules/footer/Flags.tsx | 0 .../molecules/footer/Footer.stories.tsx | 0 .../molecules/footer/Footer.styled.ts | 4 +- .../design-system/molecules/footer/Footer.tsx | 2 +- .../design-system/molecules/footer/index.ts | 0 .../molecules/guild-nav/GuildNav.stories.tsx | 4 +- .../molecules/guild-nav/GuildNav.styled.ts | 4 +- .../molecules/guild-nav/GuildNav.tsx | 17 +- .../molecules/guild-nav/index.ts | 0 .../molecules/help-page-base/BUILD.bazel | 0 .../help-page-base/HelpPageBase.stories.tsx | 0 .../molecules/help-page-base/HelpPageBase.tsx | 2 +- .../molecules/help-page-base/index.ts | 0 .../help-page-base/storyDecorator.tsx | 2 +- .../molecules/nav-slug/NavSlug.stories.tsx | 2 +- .../molecules/nav-slug/NavSlug.styled.ts | 0 .../molecules/nav-slug/NavSlug.tsx | 4 +- .../design-system/molecules/nav-slug/index.ts | 0 .../PickerCategory.stories.tsx | 6 +- .../picker-category/PickerCategory.styled.tsx | 0 .../picker-category/PickerCategory.tsx | 12 +- .../molecules/picker-category/index.ts | 0 .../PreauthGreeting.stories.tsx | 2 +- .../preauth-greeting/PreauthGreeting.tsx | 8 +- .../molecules/preauth-greeting/index.ts | 0 .../reset-submit/ResetSubmit.spec.tsx | 2 +- .../reset-submit/ResetSubmit.stories.tsx | 0 .../reset-submit/ResetSubmit.styled.ts | 2 +- .../molecules/reset-submit/ResetSubmit.tsx | 4 +- .../molecules/reset-submit/index.ts | 0 .../role-search/RoleSearch.stories.tsx | 2 +- .../molecules/role-search/RoleSearch.tsx | 8 +- .../molecules/role-search/index.ts | 0 .../ServerListingCard.stories.tsx | 2 +- .../ServerListingCard.styled.ts | 8 +- .../server-listing-card/ServerListingCard.tsx | 6 +- .../molecules/server-listing-card/index.ts | 0 .../server-masthead/ServerMasthead.spec.tsx | 2 +- .../ServerMasthead.stories.tsx | 2 +- .../server-masthead/ServerMasthead.styled.ts | 4 +- .../server-masthead/ServerMasthead.tsx | 11 +- .../molecules/server-masthead/index.ts | 0 .../UserAvatarGroup.stories.tsx | 4 +- .../UserAvatarGroup.styled.ts | 4 +- .../user-avatar-group/UserAvatarGroup.tsx | 4 +- .../molecules/user-avatar-group/index.ts | 0 .../user-popover/UserPopover.stories.tsx | 4 +- .../user-popover/UserPopover.styled.ts | 4 +- .../molecules/user-popover/UserPopover.tsx | 15 +- .../molecules/user-popover/index.ts | 0 .../organisms/app-shell/AppShell.stories.tsx | 2 +- .../organisms/app-shell/AppShell.styled.tsx | 4 +- .../organisms/app-shell/AppShell.tsx | 8 +- .../organisms/app-shell/index.ts | 0 .../organisms/editor/EditorShell.stories.tsx | 2 +- .../organisms/editor/EditorShell.styled.ts | 2 +- .../organisms/editor/EditorShell.tsx | 4 +- .../design-system/organisms/editor/index.ts | 0 .../help-why-no-roles/WhyNoRoles.stories.tsx | 0 .../help-why-no-roles/WhyNoRoles.styled.ts | 4 +- .../help-why-no-roles/WhyNoRoles.tsx | 10 +- .../organisms/help-why-no-roles/index.ts | 0 .../organisms/landing/Landing.stories.tsx | 0 .../organisms/landing/Landing.styled.ts | 4 +- .../organisms/landing/Landing.tsx | 12 +- .../design-system/organisms/landing/index.ts | 0 .../organisms/masthead/Authed.tsx | 23 +- .../organisms/masthead/Guest.tsx | 34 + .../organisms/masthead/Masthead.stories.tsx | 2 +- .../organisms/masthead/Masthead.styled.tsx | 6 +- .../design-system/organisms/masthead/index.ts | 0 .../organisms/preauth/Preauth.stories.tsx | 2 +- .../organisms/preauth/Preauth.tsx | 11 +- .../design-system/organisms/preauth/index.ts | 0 .../organisms/role-picker/RolePicker.spec.tsx | 16 +- .../role-picker/RolePicker.stories.tsx | 2 +- .../role-picker/RolePicker.styled.tsx | 2 +- .../organisms/role-picker/RolePicker.tsx | 33 +- .../organisms/role-picker/index.ts | 0 .../server-setup/ServerSetup.stories.tsx | 4 +- .../server-setup/ServerSetup.styled.ts | 0 .../organisms/server-setup/ServerSetup.tsx | 43 +- .../organisms/server-setup/index.ts | 0 .../ServersListing.stories.tsx | 2 +- .../servers-listing/ServersListing.styled.ts | 2 +- .../servers-listing/ServersListing.tsx | 18 +- .../organisms/servers-listing/index.ts | 0 packages/design-system/package.json | 45 + .../auth-login/AuthLogin.stories.tsx | 2 +- .../templates/auth-login/AuthLogin.tsx | 6 +- .../templates/auth-login/index.ts | 0 .../templates/errors/Errors.stories.tsx | 0 .../design-system/templates/errors/Errors.tsx | 12 +- .../templates/errors/errorStrings.ts | 2 +- .../design-system/templates/errors/index.ts | 0 .../templates/help-page/HelpPage.stories.tsx | 0 .../templates/help-page/HelpPage.tsx | 4 +- .../templates/help-page/index.ts | 0 .../templates/landing/Landing.stories.tsx | 0 .../templates/landing/Landing.tsx | 9 + .../design-system/templates/landing/index.ts | 0 .../role-picker/RolePicker.stories.tsx | 2 +- .../templates/role-picker/RolePicker.tsx | 6 +- .../templates/role-picker/index.ts | 0 .../server-setup/ServerSetup.stories.tsx | 2 +- .../templates/server-setup/ServerSetup.tsx | 4 +- .../templates/server-setup/index.ts | 0 .../templates/servers/Servers.stories.tsx | 2 +- .../templates/servers/Servers.tsx | 6 +- .../design-system/templates/servers/index.ts | 0 packages/design-system/tsconfig.json | 7 + .../misc-utils}/ReactifyNewlines.spec.tsx | 0 .../misc-utils}/ReactifyNewlines.tsx | 0 .../featureFlags/react/FeatureFlags.tsx | 0 .../misc-utils}/featureFlags/react/index.ts | 0 .../featureFlags/react/storyDecorator.tsx | 0 .../misc-utils}/hasPermission.spec.ts | 4 +- .../misc-utils}/hasPermission.ts | 2 +- .../misc-utils}/isBrowser.ts | 0 packages/misc-utils/package.json | 11 + .../misc-utils}/sortBy.spec.ts | 0 .../utils => packages/misc-utils}/sortBy.ts | 0 .../withContext/contextTestHelpers.tsx | 0 .../misc-utils}/withContext/index.ts | 0 .../misc-utils}/withContext/withContext.tsx | 0 {src/common => packages}/types/Category.ts | 0 {src/common => packages}/types/Guild.ts | 0 {src/common => packages}/types/Role.ts | 0 {src/common => packages}/types/Session.ts | 0 {src/common => packages}/types/User.ts | 0 {src/common => packages}/types/demoData.ts | 0 {src/common => packages}/types/index.ts | 0 packages/types/package.json | 4 + packages/web/.gitignore | 23 + packages/web/README.md | 46 + packages/web/craco.config.js | 24 + packages/web/package.json | 55 + packages/web/public/favicon.ico | Bin 0 -> 3870 bytes packages/web/public/index.html | 70 + packages/web/public/logo192.png | Bin 0 -> 5347 bytes packages/web/public/logo512.png | Bin 0 -> 9664 bytes packages/web/public/manifest.json | 25 + packages/web/public/robots.txt | 3 + packages/web/src/app-router/AppRouter.tsx | 22 + packages/web/src/app-router/index.ts | 1 + packages/web/src/index.tsx | 10 + packages/web/src/pages/landing.tsx | 8 + packages/web/src/react-app-env.d.ts | 1 + packages/web/tsconfig.json | 20 + packages/web/yarn.lock | 11439 ++++++++++++++++ src/common/utils/isomorphicFetch.ts | 53 - .../atoms/feature-gate/BUILD.bazel | 10 - src/design-system/atoms/fonts/fonts.tsx | 29 - .../organisms/masthead/Guest.tsx | 39 - .../templates/landing/Landing.tsx | 10 - src/pages/README.md | 3 - src/pages/_app.tsx | 15 - src/pages/_document.tsx | 30 - src/pages/auth/login.tsx | 70 - src/pages/help/why-no-roles.tsx | 13 - src/pages/index.tsx | 20 - src/pages/machinery/error.tsx | 17 - src/pages/machinery/logout.tsx | 56 - src/pages/machinery/new-session.tsx | 57 - src/pages/s/[id].tsx | 159 - src/pages/s/[id]/edit.tsx | 10 - src/pages/s/[id]/setup.tsx | 33 - src/pages/servers.tsx | 17 - src/providers/appShellData.tsx | 27 - terraform/cloudflare-origin-cert.tf | 20 - terraform/webapp.tf | 60 - terraform/weblb.tf | 125 - tsconfig.json | 5 +- vercel.json | 12 - yarn.lock | 6222 ++++++--- 328 files changed, 16624 insertions(+), 3525 deletions(-) delete mode 100644 .github/workflows/gar-cleanup.yml delete mode 100644 hack/dockerfiles/ui.Dockerfile delete mode 100644 next-env.d.ts delete mode 100644 next.config.js rename {src/backend-worker => packages/api}/.gitignore (100%) rename {src/backend-worker => packages/api}/bindings.d.ts (100%) rename {src/backend-worker => packages/api}/handlers/bot-join.ts (100%) rename {src/backend-worker => packages/api}/handlers/create-roleypoly-data.ts (99%) rename {src/backend-worker => packages/api}/handlers/get-picker-data.ts (93%) rename {src/backend-worker => packages/api}/handlers/get-session.ts (83%) rename {src/backend-worker => packages/api}/handlers/get-slug.ts (94%) rename {src/backend-worker => packages/api}/handlers/login-bounce.ts (100%) rename {src/backend-worker => packages/api}/handlers/login-callback.ts (97%) rename {src/backend-worker => packages/api}/handlers/revoke-session.ts (94%) rename {src/backend-worker => packages/api}/handlers/update-roles.ts (99%) rename {src/backend-worker => packages/api}/index.ts (100%) create mode 100644 packages/api/package.json rename {src/backend-worker => packages/api}/router.ts (100%) rename {src/backend-worker => packages/api}/tsconfig.json (100%) rename {src/backend-worker => packages/api}/utils/api-tools.ts (97%) rename {src/backend-worker => packages/api}/utils/bounce.ts (100%) rename {src/backend-worker => packages/api}/utils/config.ts (100%) rename {src/backend-worker => packages/api}/utils/guild.ts (97%) rename {src/backend-worker => packages/api}/utils/kv.ts (100%) rename {src/backend-worker => packages/api}/webpack.config.js (74%) rename src/backend-worker/roleypoly.config.js => packages/api/worker.config.js (100%) rename {src => packages}/backend-emulator/kv.js (100%) rename {src => packages}/backend-emulator/main.js (89%) create mode 100644 packages/backend-emulator/package.json create mode 100644 packages/design-system/.storybook/main.js create mode 100644 packages/design-system/.storybook/manager.js create mode 100644 packages/design-system/.storybook/mocks/next_link.tsx create mode 100644 packages/design-system/.storybook/preview-head.html create mode 100644 packages/design-system/.storybook/preview.js create mode 100644 packages/design-system/.storybook/theme.js rename {src => packages}/design-system/Intro.stories.mdx (78%) rename {src => packages}/design-system/README.md (100%) rename {src => packages}/design-system/atoms/avatar/Avatar.stories.tsx (100%) rename {src => packages}/design-system/atoms/avatar/Avatar.styled.ts (95%) rename {src => packages}/design-system/atoms/avatar/Avatar.tsx (100%) rename {src => packages}/design-system/atoms/avatar/avatarUtils.tsx (100%) rename {src => packages}/design-system/atoms/avatar/index.ts (100%) rename {src => packages}/design-system/atoms/branding/Branding.stories.tsx (100%) rename {src => packages}/design-system/atoms/branding/Branding.tsx (99%) rename {src => packages}/design-system/atoms/branding/BrandingOld.tsx (100%) rename {src => packages}/design-system/atoms/branding/DynamicBranding.stories.tsx (96%) rename {src => packages}/design-system/atoms/branding/DynamicBranding.tsx (100%) rename {src => packages}/design-system/atoms/branding/FlagBranding.stories.tsx (100%) rename {src => packages}/design-system/atoms/branding/FlagBranding.tsx (100%) rename {src => packages}/design-system/atoms/branding/index.ts (100%) rename {src => packages}/design-system/atoms/breakpoints/BreakpointProvider.tsx (100%) rename {src => packages}/design-system/atoms/breakpoints/Breakpoints.stories.tsx (100%) rename {src => packages}/design-system/atoms/breakpoints/Breakpoints.ts (100%) rename {src => packages}/design-system/atoms/breakpoints/Context.ts (90%) rename {src => packages}/design-system/atoms/breakpoints/DebugTool.tsx (100%) rename {src => packages}/design-system/atoms/breakpoints/index.ts (100%) rename {src => packages}/design-system/atoms/button/Button.spec.tsx (100%) rename {src => packages}/design-system/atoms/button/Button.stories.tsx (100%) rename {src => packages}/design-system/atoms/button/Button.styled.ts (91%) rename {src => packages}/design-system/atoms/button/Button.tsx (100%) rename {src => packages}/design-system/atoms/button/index.ts (100%) rename {src => packages}/design-system/atoms/collapse/Collapse.stories.tsx (77%) rename {src => packages}/design-system/atoms/collapse/Collapse.tsx (100%) rename {src => packages}/design-system/atoms/collapse/index.ts (100%) rename {src => packages}/design-system/atoms/colors/colors.stories.tsx (98%) rename {src => packages}/design-system/atoms/colors/colors.tsx (100%) rename {src => packages}/design-system/atoms/colors/index.ts (100%) rename {src => packages}/design-system/atoms/colors/withColors.tsx (100%) rename {src => packages}/design-system/atoms/dot-overlay/DotOverlay.stories.tsx (100%) rename {src => packages}/design-system/atoms/dot-overlay/DotOverlay.tsx (100%) rename {src => packages}/design-system/atoms/dot-overlay/index.ts (100%) rename {src => packages}/design-system/atoms/fader/Fader.stories.tsx (90%) rename {src => packages}/design-system/atoms/fader/Fader.tsx (100%) rename {src => packages}/design-system/atoms/fader/index.ts (100%) rename {src => packages}/design-system/atoms/feature-gate/FeatureGate.stories.tsx (81%) rename {src => packages}/design-system/atoms/feature-gate/FeatureGate.tsx (89%) rename {src => packages}/design-system/atoms/feature-gate/index.ts (100%) rename {src => packages}/design-system/atoms/fonts/fonts.stories.tsx (96%) create mode 100644 packages/design-system/atoms/fonts/fonts.tsx rename {src => packages}/design-system/atoms/fonts/index.ts (100%) rename {src => packages}/design-system/atoms/halfsies/Halfsies.stories.tsx (100%) rename {src => packages}/design-system/atoms/halfsies/Halfsies.tsx (82%) rename {src => packages}/design-system/atoms/halfsies/index.ts (100%) rename {src => packages}/design-system/atoms/hero/Hero.stories.tsx (100%) rename {src => packages}/design-system/atoms/hero/Hero.tsx (100%) rename {src => packages}/design-system/atoms/hero/index.ts (100%) rename {src => packages}/design-system/atoms/horizontal-switch/BUILD.bazel (100%) rename {src => packages}/design-system/atoms/horizontal-switch/HorizontalSwitch.stories.tsx (100%) rename {src => packages}/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts (80%) rename {src => packages}/design-system/atoms/horizontal-switch/HorizontalSwitch.tsx (100%) rename {src => packages}/design-system/atoms/horizontal-switch/index.tsx (100%) rename {src => packages}/design-system/atoms/key-events/KeyEvents.ts (100%) rename {src => packages}/design-system/atoms/key-events/index.ts (100%) rename {src => packages}/design-system/atoms/popover/Popover.stories.tsx (93%) rename {src => packages}/design-system/atoms/popover/Popover.styled.ts (89%) rename {src => packages}/design-system/atoms/popover/Popover.tsx (94%) rename {src => packages}/design-system/atoms/popover/index.ts (100%) rename {src => packages}/design-system/atoms/role/Role.spec.tsx (85%) rename {src => packages}/design-system/atoms/role/Role.stories.tsx (92%) rename {src => packages}/design-system/atoms/role/Role.styled.tsx (94%) rename {src => packages}/design-system/atoms/role/Role.tsx (93%) rename {src => packages}/design-system/atoms/role/index.ts (100%) rename {src => packages}/design-system/atoms/space/Space.stories.tsx (100%) rename {src => packages}/design-system/atoms/space/Space.tsx (100%) rename {src => packages}/design-system/atoms/space/index.ts (100%) rename {src => packages}/design-system/atoms/sparkle/Shapes.tsx (100%) rename {src => packages}/design-system/atoms/sparkle/Sparkle.stories.tsx (76%) rename {src => packages}/design-system/atoms/sparkle/Sparkle.tsx (95%) rename {src => packages}/design-system/atoms/sparkle/index.ts (100%) rename {src => packages}/design-system/atoms/tab-view/TabView.spec.tsx (100%) rename {src => packages}/design-system/atoms/tab-view/TabView.stories.tsx (100%) rename {src => packages}/design-system/atoms/tab-view/TabView.styled.ts (83%) rename {src => packages}/design-system/atoms/tab-view/TabView.tsx (100%) rename {src => packages}/design-system/atoms/tab-view/index.ts (100%) rename {src => packages}/design-system/atoms/text-input/TextInput.stories.tsx (92%) rename {src => packages}/design-system/atoms/text-input/TextInput.tsx (96%) rename {src => packages}/design-system/atoms/text-input/index.ts (100%) rename {src => packages}/design-system/atoms/timings/index.ts (100%) rename {src => packages}/design-system/atoms/timings/timings.ts (100%) rename {src => packages}/design-system/atoms/typist/Typist.spec.tsx (100%) rename {src => packages}/design-system/atoms/typist/Typist.stories.tsx (100%) rename {src => packages}/design-system/atoms/typist/Typist.tsx (100%) rename {src => packages}/design-system/atoms/typist/index.ts (100%) rename {src => packages}/design-system/atoms/typography/index.ts (100%) rename {src => packages}/design-system/atoms/typography/mdx.tsx (100%) rename {src => packages}/design-system/atoms/typography/typography.stories.tsx (100%) rename {src => packages}/design-system/atoms/typography/typography.tsx (92%) rename {src/common/types => packages/design-system/fixtures}/storyData.ts (99%) rename {src => packages}/design-system/molecules/demo-discord/DemoDiscord.stories.tsx (100%) rename {src => packages}/design-system/molecules/demo-discord/DemoDiscord.styled.ts (94%) rename {src => packages}/design-system/molecules/demo-discord/DemoDiscord.tsx (92%) rename {src => packages}/design-system/molecules/demo-discord/index.ts (100%) rename {src => packages}/design-system/molecules/demo-picker/DemoPicker.stories.tsx (100%) rename {src => packages}/design-system/molecules/demo-picker/DemoPicker.tsx (86%) rename {src => packages}/design-system/molecules/demo-picker/index.ts (100%) rename {src => packages}/design-system/molecules/editor-category/EditorCategory.stories.tsx (82%) rename {src => packages}/design-system/molecules/editor-category/EditorCategory.styled.ts (100%) rename {src => packages}/design-system/molecules/editor-category/EditorCategory.tsx (87%) rename {src => packages}/design-system/molecules/editor-category/index.ts (100%) rename {src => packages}/design-system/molecules/error-banner/ErrorBanner.stories.tsx (100%) rename {src => packages}/design-system/molecules/error-banner/ErrorBanner.styled.ts (75%) rename {src => packages}/design-system/molecules/error-banner/ErrorBanner.tsx (100%) rename {src => packages}/design-system/molecules/error-banner/index.ts (100%) rename {src => packages}/design-system/molecules/footer/Flags.tsx (100%) rename {src => packages}/design-system/molecules/footer/Footer.stories.tsx (100%) rename {src => packages}/design-system/molecules/footer/Footer.styled.ts (81%) rename {src => packages}/design-system/molecules/footer/Footer.tsx (92%) rename {src => packages}/design-system/molecules/footer/index.ts (100%) rename {src => packages}/design-system/molecules/guild-nav/GuildNav.stories.tsx (72%) rename {src => packages}/design-system/molecules/guild-nav/GuildNav.styled.ts (76%) rename {src => packages}/design-system/molecules/guild-nav/GuildNav.tsx (70%) rename {src => packages}/design-system/molecules/guild-nav/index.ts (100%) rename {src => packages}/design-system/molecules/help-page-base/BUILD.bazel (100%) rename {src => packages}/design-system/molecules/help-page-base/HelpPageBase.stories.tsx (100%) rename {src => packages}/design-system/molecules/help-page-base/HelpPageBase.tsx (87%) rename {src => packages}/design-system/molecules/help-page-base/index.ts (100%) rename {src => packages}/design-system/molecules/help-page-base/storyDecorator.tsx (72%) rename {src => packages}/design-system/molecules/nav-slug/NavSlug.stories.tsx (81%) rename {src => packages}/design-system/molecules/nav-slug/NavSlug.styled.ts (100%) rename {src => packages}/design-system/molecules/nav-slug/NavSlug.tsx (86%) rename {src => packages}/design-system/molecules/nav-slug/index.ts (100%) rename {src => packages}/design-system/molecules/picker-category/PickerCategory.stories.tsx (87%) rename {src => packages}/design-system/molecules/picker-category/PickerCategory.styled.tsx (100%) rename {src => packages}/design-system/molecules/picker-category/PickerCategory.tsx (84%) rename {src => packages}/design-system/molecules/picker-category/index.ts (100%) rename {src => packages}/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx (82%) rename {src => packages}/design-system/molecules/preauth-greeting/PreauthGreeting.tsx (76%) rename {src => packages}/design-system/molecules/preauth-greeting/index.ts (100%) rename {src => packages}/design-system/molecules/reset-submit/ResetSubmit.spec.tsx (90%) rename {src => packages}/design-system/molecules/reset-submit/ResetSubmit.stories.tsx (100%) rename {src => packages}/design-system/molecules/reset-submit/ResetSubmit.styled.ts (78%) rename {src => packages}/design-system/molecules/reset-submit/ResetSubmit.tsx (84%) rename {src => packages}/design-system/molecules/reset-submit/index.ts (100%) rename {src => packages}/design-system/molecules/role-search/RoleSearch.stories.tsx (81%) rename {src => packages}/design-system/molecules/role-search/RoleSearch.tsx (85%) rename {src => packages}/design-system/molecules/role-search/index.ts (100%) rename {src => packages}/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx (82%) rename {src => packages}/design-system/molecules/server-listing-card/ServerListingCard.styled.ts (86%) rename {src => packages}/design-system/molecules/server-listing-card/ServerListingCard.tsx (88%) rename {src => packages}/design-system/molecules/server-listing-card/index.ts (100%) rename {src => packages}/design-system/molecules/server-masthead/ServerMasthead.spec.tsx (90%) rename {src => packages}/design-system/molecules/server-masthead/ServerMasthead.stories.tsx (86%) rename {src => packages}/design-system/molecules/server-masthead/ServerMasthead.styled.ts (84%) rename {src => packages}/design-system/molecules/server-masthead/ServerMasthead.tsx (75%) rename {src => packages}/design-system/molecules/server-masthead/index.ts (100%) rename {src => packages}/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx (74%) rename {src => packages}/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts (80%) rename {src => packages}/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx (86%) rename {src => packages}/design-system/molecules/user-avatar-group/index.ts (100%) rename {src => packages}/design-system/molecules/user-popover/UserPopover.stories.tsx (71%) rename {src => packages}/design-system/molecules/user-popover/UserPopover.styled.ts (82%) rename {src => packages}/design-system/molecules/user-popover/UserPopover.tsx (62%) rename {src => packages}/design-system/molecules/user-popover/index.ts (100%) rename {src => packages}/design-system/organisms/app-shell/AppShell.stories.tsx (84%) rename {src => packages}/design-system/organisms/app-shell/AppShell.styled.tsx (81%) rename {src => packages}/design-system/organisms/app-shell/AppShell.tsx (79%) rename {src => packages}/design-system/organisms/app-shell/index.ts (100%) rename {src => packages}/design-system/organisms/editor/EditorShell.stories.tsx (79%) rename {src => packages}/design-system/organisms/editor/EditorShell.styled.ts (72%) rename {src => packages}/design-system/organisms/editor/EditorShell.tsx (87%) rename {src => packages}/design-system/organisms/editor/index.ts (100%) rename {src => packages}/design-system/organisms/help-why-no-roles/WhyNoRoles.stories.tsx (100%) rename {src => packages}/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts (88%) rename {src => packages}/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx (86%) rename {src => packages}/design-system/organisms/help-why-no-roles/index.ts (100%) rename {src => packages}/design-system/organisms/landing/Landing.stories.tsx (100%) rename {src => packages}/design-system/organisms/landing/Landing.styled.ts (80%) rename {src => packages}/design-system/organisms/landing/Landing.tsx (71%) rename {src => packages}/design-system/organisms/landing/index.ts (100%) rename {src => packages}/design-system/organisms/masthead/Authed.tsx (80%) create mode 100644 packages/design-system/organisms/masthead/Guest.tsx rename {src => packages}/design-system/organisms/masthead/Masthead.stories.tsx (83%) rename {src => packages}/design-system/organisms/masthead/Masthead.styled.tsx (89%) rename {src => packages}/design-system/organisms/masthead/index.ts (100%) rename {src => packages}/design-system/organisms/preauth/Preauth.stories.tsx (92%) rename {src => packages}/design-system/organisms/preauth/Preauth.tsx (78%) rename {src => packages}/design-system/organisms/preauth/index.ts (100%) rename {src => packages}/design-system/organisms/role-picker/RolePicker.spec.tsx (68%) rename {src => packages}/design-system/organisms/role-picker/RolePicker.stories.tsx (96%) rename {src => packages}/design-system/organisms/role-picker/RolePicker.styled.tsx (90%) rename {src => packages}/design-system/organisms/role-picker/RolePicker.tsx (84%) rename {src => packages}/design-system/organisms/role-picker/index.ts (100%) rename {src => packages}/design-system/organisms/server-setup/ServerSetup.stories.tsx (81%) rename {src => packages}/design-system/organisms/server-setup/ServerSetup.styled.ts (100%) rename {src => packages}/design-system/organisms/server-setup/ServerSetup.tsx (69%) rename {src => packages}/design-system/organisms/server-setup/index.ts (100%) rename {src => packages}/design-system/organisms/servers-listing/ServersListing.stories.tsx (80%) rename {src => packages}/design-system/organisms/servers-listing/ServersListing.styled.ts (87%) rename {src => packages}/design-system/organisms/servers-listing/ServersListing.tsx (56%) rename {src => packages}/design-system/organisms/servers-listing/index.ts (100%) create mode 100644 packages/design-system/package.json rename {src => packages}/design-system/templates/auth-login/AuthLogin.stories.tsx (85%) rename {src => packages}/design-system/templates/auth-login/AuthLogin.tsx (57%) rename {src => packages}/design-system/templates/auth-login/index.ts (100%) rename {src => packages}/design-system/templates/errors/Errors.stories.tsx (100%) rename {src => packages}/design-system/templates/errors/Errors.tsx (66%) rename {src => packages}/design-system/templates/errors/errorStrings.ts (96%) rename {src => packages}/design-system/templates/errors/index.ts (100%) rename {src => packages}/design-system/templates/help-page/HelpPage.stories.tsx (100%) rename {src => packages}/design-system/templates/help-page/HelpPage.tsx (64%) rename {src => packages}/design-system/templates/help-page/index.ts (100%) rename {src => packages}/design-system/templates/landing/Landing.stories.tsx (100%) create mode 100644 packages/design-system/templates/landing/Landing.tsx rename {src => packages}/design-system/templates/landing/index.ts (100%) rename {src => packages}/design-system/templates/role-picker/RolePicker.stories.tsx (95%) rename {src => packages}/design-system/templates/role-picker/RolePicker.tsx (76%) rename {src => packages}/design-system/templates/role-picker/index.ts (100%) rename {src => packages}/design-system/templates/server-setup/ServerSetup.stories.tsx (83%) rename {src => packages}/design-system/templates/server-setup/ServerSetup.tsx (71%) rename {src => packages}/design-system/templates/server-setup/index.ts (100%) rename {src => packages}/design-system/templates/servers/Servers.stories.tsx (78%) rename {src => packages}/design-system/templates/servers/Servers.tsx (57%) rename {src => packages}/design-system/templates/servers/index.ts (100%) create mode 100644 packages/design-system/tsconfig.json rename {src/common/utils => packages/misc-utils}/ReactifyNewlines.spec.tsx (100%) rename {src/common/utils => packages/misc-utils}/ReactifyNewlines.tsx (100%) rename {src/common/utils => packages/misc-utils}/featureFlags/react/FeatureFlags.tsx (100%) rename {src/common/utils => packages/misc-utils}/featureFlags/react/index.ts (100%) rename {src/common/utils => packages/misc-utils}/featureFlags/react/storyDecorator.tsx (100%) rename {src/common/utils => packages/misc-utils}/hasPermission.spec.ts (91%) rename {src/common/utils => packages/misc-utils}/hasPermission.ts (97%) rename {src/common/utils => packages/misc-utils}/isBrowser.ts (100%) create mode 100644 packages/misc-utils/package.json rename {src/common/utils => packages/misc-utils}/sortBy.spec.ts (100%) rename {src/common/utils => packages/misc-utils}/sortBy.ts (100%) rename {src/common/utils => packages/misc-utils}/withContext/contextTestHelpers.tsx (100%) rename {src/common/utils => packages/misc-utils}/withContext/index.ts (100%) rename {src/common/utils => packages/misc-utils}/withContext/withContext.tsx (100%) rename {src/common => packages}/types/Category.ts (100%) rename {src/common => packages}/types/Guild.ts (100%) rename {src/common => packages}/types/Role.ts (100%) rename {src/common => packages}/types/Session.ts (100%) rename {src/common => packages}/types/User.ts (100%) rename {src/common => packages}/types/demoData.ts (100%) rename {src/common => packages}/types/index.ts (100%) create mode 100644 packages/types/package.json create mode 100644 packages/web/.gitignore create mode 100644 packages/web/README.md create mode 100644 packages/web/craco.config.js create mode 100644 packages/web/package.json create mode 100644 packages/web/public/favicon.ico create mode 100644 packages/web/public/index.html create mode 100644 packages/web/public/logo192.png create mode 100644 packages/web/public/logo512.png create mode 100644 packages/web/public/manifest.json create mode 100644 packages/web/public/robots.txt create mode 100644 packages/web/src/app-router/AppRouter.tsx create mode 100644 packages/web/src/app-router/index.ts create mode 100644 packages/web/src/index.tsx create mode 100644 packages/web/src/pages/landing.tsx create mode 100644 packages/web/src/react-app-env.d.ts create mode 100644 packages/web/tsconfig.json create mode 100644 packages/web/yarn.lock delete mode 100644 src/common/utils/isomorphicFetch.ts delete mode 100644 src/design-system/atoms/feature-gate/BUILD.bazel delete mode 100644 src/design-system/atoms/fonts/fonts.tsx delete mode 100644 src/design-system/organisms/masthead/Guest.tsx delete mode 100644 src/design-system/templates/landing/Landing.tsx delete mode 100644 src/pages/README.md delete mode 100644 src/pages/_app.tsx delete mode 100644 src/pages/_document.tsx delete mode 100644 src/pages/auth/login.tsx delete mode 100644 src/pages/help/why-no-roles.tsx delete mode 100644 src/pages/index.tsx delete mode 100644 src/pages/machinery/error.tsx delete mode 100644 src/pages/machinery/logout.tsx delete mode 100644 src/pages/machinery/new-session.tsx delete mode 100644 src/pages/s/[id].tsx delete mode 100644 src/pages/s/[id]/edit.tsx delete mode 100644 src/pages/s/[id]/setup.tsx delete mode 100644 src/pages/servers.tsx delete mode 100644 src/providers/appShellData.tsx delete mode 100644 terraform/cloudflare-origin-cert.tf delete mode 100644 terraform/webapp.tf delete mode 100644 terraform/weblb.tf delete mode 100644 vercel.json diff --git a/.babelrc.js b/.babelrc.js index ae078bb..0a1cd16 100644 --- a/.babelrc.js +++ b/.babelrc.js @@ -1,4 +1,3 @@ module.exports = { - presets: ['next/babel'], - plugins: [['styled-components', { ssr: true }]], + plugins: ['styled-components'], }; diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml index 887cd19..7a3c845 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -1,7 +1,7 @@ # These are supported funding model platforms github: kayteh -patreon: kata +patreon: roleypoly open_collective: # Replace with a single Open Collective username ko_fi: roleypoly tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 2a50287..638046c 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -98,7 +98,7 @@ jobs: - run: | wrangler init - echo 'webpack_config = "src/backend-worker/webpack.config.js"' | tee -a wrangler.toml + echo 'webpack_config = "packages/api/webpack.config.js"' | tee -a wrangler.toml wrangler build if: steps.check.outputs.skip == '0' @@ -119,7 +119,6 @@ jobs: strategy: matrix: dockerfile: - - ui - bot steps: - uses: actions/checkout@master @@ -182,12 +181,6 @@ jobs: if: github.ref == 'refs/heads/main' runs-on: ubuntu-latest steps: - - name: Get UI digest - uses: actions/download-artifact@v2 - with: - name: ui-digest - path: .digests/ui - - name: Get Bot digest uses: actions/download-artifact@v2 with: @@ -197,7 +190,7 @@ jobs: - name: Set digests as addressable id: digests env: - IMAGES: ui bot + IMAGES: bot run: | set_digest_output() { echo ::set-output name=$1::@$(cat .digests/$1/digest.txt) diff --git a/.github/workflows/codeql-analysis.yml b/.github/workflows/codeql-analysis.yml index 2185fbf..71cbd24 100644 --- a/.github/workflows/codeql-analysis.yml +++ b/.github/workflows/codeql-analysis.yml @@ -1,24 +1,25 @@ -name: 'CodeQL' +name: 'Code Scanning - Action' on: push: - branches: [main] pull_request: - # The branches below must be a subset of the branches above - branches: [main] schedule: - - cron: '23 22 * * 4' + # ┌───────────── minute (0 - 59) + # │ ┌───────────── hour (0 - 23) + # │ │ ┌───────────── day of the month (1 - 31) + # │ │ │ ┌───────────── month (1 - 12 or JAN-DEC) + # │ │ │ │ ┌───────────── day of the week (0 - 6 or SUN-SAT) + # │ │ │ │ │ + # │ │ │ │ │ + # │ │ │ │ │ + # * * * * * + - cron: '30 1 * * 0' jobs: - analyze: - name: Analyze + CodeQL-Build: + # CodeQL runs on ubuntu-latest, windows-latest, and macos-latest runs-on: ubuntu-latest - strategy: - fail-fast: false - matrix: - language: ['go', 'javascript'] - steps: - name: Checkout repository uses: actions/checkout@v2 @@ -26,24 +27,21 @@ jobs: # Initializes the CodeQL tools for scanning. - name: Initialize CodeQL uses: github/codeql-action/init@v1 - with: - languages: ${{ matrix.language }} - # If you wish to specify custom queries, you can do so here or in a config file. - # By default, queries listed here will override any specified in a config file. - # Prefix the list here with "+" to use these queries and those in the config file. - # queries: ./path/to/local/query, your-org/your-repo/queries@main + # Override language selection by uncommenting this and choosing your languages + # with: + # languages: go, javascript, csharp, python, cpp, java - # Autobuild attempts to build any compiled languages (C/C++, C#, or Java). - # If this step fails, then you should remove it and run the build manually (see below) + # Autobuild attempts to build any compiled languages (C/C++, C#, or Java). + # If this step fails, then you should remove it and run the build manually (see below). - name: Autobuild uses: github/codeql-action/autobuild@v1 # ℹ️ Command-line programs to run using the OS shell. # 📚 https://git.io/JvXDl - # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines - # and modify them (or add more) to build your code if your project - # uses a compiled language + # ✏️ If the Autobuild fails above, remove it and uncomment the following + # three lines and modify them (or add more) to build your code if your + # project uses a compiled language #- run: | # make bootstrap diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 14f6613..98a5eb0 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -7,10 +7,6 @@ on: description: 'One of: stage, prod' required: true default: stage - ui_tag: - description: 'tag/digest reference to a UI container build' - required: false - default: ':main' bot_tag: description: 'tag/digest reference to a UI container build' required: false @@ -21,115 +17,9 @@ on: default: '' # Empty will try using current main branch hash jobs: - docker_sync: - name: Docker Sync - runs-on: ubuntu-latest - outputs: - ui_tag: ${{ steps.tags.outputs.ui_tag }} - steps: - - uses: actions/checkout@master - - - uses: docker/setup-buildx-action@v1 - id: buildx - with: - install: true - - - name: Set up Cloud SDK - uses: google-github-actions/setup-gcloud@master - with: - project_id: ${{ secrets.GCS_PROJECT_ID }} - service_account_key: ${{ secrets.GCS_TF_KEY }} - export_default_credentials: true - - - name: Login to GHCR - uses: docker/login-action@v1 - with: - registry: ghcr.io - username: roleypoly - password: ${{ secrets.GHCR_PAT }} - - - name: Login to GAR US - uses: docker/login-action@v1 - with: - registry: us-docker.pkg.dev - username: _json_key - password: ${{ secrets.GAR_JSON_KEY }} - - - name: Login to GAR Europe - uses: docker/login-action@v1 - with: - registry: europe-docker.pkg.dev - username: _json_key - password: ${{ secrets.GAR_JSON_KEY }} - - - name: Login to GAR Asia - uses: docker/login-action@v1 - with: - registry: asia-docker.pkg.dev - username: _json_key - password: ${{ secrets.GAR_JSON_KEY }} - - - name: Retag - id: tags - run: | - retag_push() { - docker tag $1 $2 - docker push $2 - } - - get_digest() { - # Finds the digest for any GAR-pushed artifact - docker inspect $1 --format='{{json .RepoDigests}}' | jq -r '[.[] | match("docker.pkg.*(sha256:.*)"; "g")] | .[0] | .captures | .[0] | .string' - } - - UI_IMAGE_SRC=ghcr.io/roleypoly/ui${{github.event.inputs.ui_tag}} - UI_IMAGE_DEST_BASE=docker.pkg.dev/roleypoly/roleypoly/ui:${{github.event.inputs.environment}} - - docker pull $UI_IMAGE_SRC - retag_push $UI_IMAGE_SRC us-$UI_IMAGE_DEST_BASE - retag_push $UI_IMAGE_SRC europe-$UI_IMAGE_DEST_BASE - retag_push $UI_IMAGE_SRC asia-$UI_IMAGE_DEST_BASE - echo ::set-output name=ui_tag::@$(get_digest $UI_IMAGE_SRC) - - deploy_metadata: - name: Make Deployment Metadata - runs-on: ubuntu-latest - outputs: - url: ${{steps.metadata.outputs.url}} - env: ${{steps.metadata.outputs.env}} - steps: - - name: Create deployment metadata - id: metadata - run: | - ENV_URL= - ENV_NAME= - - if [[ "${{github.event.inputs.environment}}" == "prod" ]]; then - ENV_URL="https://next.roleypoly.com" - ENV_NAME=Production - elif [[ "${{github.event.inputs.environment}}" == "stage" ]]; then - ENV_URL="https://stage.roleypoly.com" - ENV_NAME=Staging - else - ENV_URL="https://web-${{github.event.inputs.environment}}.roleypoly.com" - ENV_NAME=Preview-${{github.event.inputs.environment}} - fi - - echo "url=$ENV_URL" - echo "env=$ENV_NAME" - - echo ::set-output name=url::$ENV_URL - echo ::set-output name=env::$ENV_NAME - deploy_terraform: name: Deploy Terraform runs-on: ubuntu-latest - needs: - - docker_sync - - deploy_metadata - environment: - name: ${{ needs.deploy_metadata.outputs.env }} - url: ${{ needs.deploy_metadata.outputs.url }} steps: - uses: actions/checkout@master @@ -170,7 +60,7 @@ jobs: working-directory: ./terraform run: | echo \ - '{"ui_tag": "${{needs.docker_sync.outputs.ui_tag}}", "bot_tag": "${{github.event.inputs.bot_tag}}", "api_path_to_worker": "./worker-dist/backend-worker.js"}' \ + '{"bot_tag": "${{github.event.inputs.bot_tag}}", "api_path_to_worker": "./worker-dist/backend-worker.js"}' \ | jq . \ | tee tags.auto.tfvars.json @@ -199,9 +89,8 @@ jobs: DATA='{ "embeds": [ { - "title": "Roleypoly ${{ needs.deploy_metadata.outputs.env }} Deployment Success", - "description": "Roleypoly was successfully deployed to ${{ needs.deploy_metadata.outputs.env }} at '$(date)'", - "url": "${{ needs.deploy_metadata.outputs.url }}", + "title": "Roleypoly Deployment Success", + "description": "Roleypoly was successfully deployed at '$(date)'", "color": 4634182, "author": { "name": "Deployment Notification", @@ -222,9 +111,8 @@ jobs: DATA='{ "embeds": [ { - "title": "Roleypoly ${{ needs.deploy_metadata.outputs.env }} Deployment Failed", - "description": "Roleypoly failed to be deployed to ${{ needs.deploy_metadata.outputs.env }} at '$(date)'", - "url": "${{ needs.deploy_metadata.outputs.url }}", + "title": "Roleypoly Deployment Failed", + "description": "Roleypoly failed to be deployed at '$(date)'", "color": 15291219, "author": { "name": "Deployment Notification", diff --git a/.github/workflows/gar-cleanup.yml b/.github/workflows/gar-cleanup.yml deleted file mode 100644 index 1f4bc62..0000000 --- a/.github/workflows/gar-cleanup.yml +++ /dev/null @@ -1,45 +0,0 @@ -name: GAR Cleanup - -on: - schedule: - - cron: '30 6 * * *' - workflow_dispatch: {} - workflow_run: - workflows: ['Deploy'] - types: - - completed - -jobs: - docker_cleanup: - name: Cleanup Deployed Images - runs-on: ubuntu-latest - strategy: - matrix: - region: [us, europe, asia] - fail-fast: false - steps: - - name: Set up Cloud SDK - uses: google-github-actions/setup-gcloud@master - with: - project_id: ${{ secrets.GCS_PROJECT_ID }} - service_account_key: ${{ secrets.GCS_TF_KEY }} - export_default_credentials: true - - - name: Delete stale artifacts - run: | - flags="--format=json --location=${{matrix.region}} --repository=roleypoly" - - packagesToPrune=$(gcloud artifacts packages list $flags | jq -r '.[].name') - - for package in $packagesToPrune; do - tagsToKeep=$(gcloud artifacts tags list --package=$package $flags | jq -r '.[].version') - versionsToCheck=$(gcloud artifacts versions list --package=$package $flags | jq -r '.[].name') - - for version in $versionsToCheck; do - if [[ "$tagsToKeep" =~ .*"$version".* ]]; then - continue - fi - - gcloud artifacts versions delete $version --package=$package $flags --quiet - done - done diff --git a/.gitignore b/.gitignore index aa9032d..c3e292c 100644 --- a/.gitignore +++ b/.gitignore @@ -6,3 +6,4 @@ storybook-static worker wrangler.toml .devdbs +dist diff --git a/README.md b/README.md index 8eba69b..eb3b78c 100644 --- a/README.md +++ b/README.md @@ -41,8 +41,8 @@ This is the fastest way to start. You must be using MacOS or Linux (WSL2 is ok!) - Setup `.env` using [`.env.example`][envexample] as a template and guide. - When setting up your Discord Application, be sure to set `http://localhost:6609/login-callback` as the OAuth2 callback URL. - Run: `yarn install` -- Run both: `yarn ui` and `yarn worker` - - This starts the UI and API servers in hot-reload dev/emulation mode. All changes to TS/TSX files should be properly captured and reloaded for you! +- Run both: `yarn start` + - This starts the Web UI, Storybook, and API servers in hot-reload dev/emulation mode. All changes to TS/TSX files should be properly captured and reloaded for you! - Develop you a Roleypoly! #### Option 3 🐄🤠: Wrangler (No emulation) @@ -80,8 +80,8 @@ This is probably extremely painful and requires you to have a Cloudflare account - Setup `.env` using [`.env.example`][envexample] as a template and guide. - Run `yarn install` -- Run both `wrangler dev -e dev` and `yarn ui` - - This starts the UI and API servers in hot-reload dev mode. All changes to TS/TSX files should be properly captured and reloaded for you! +- Run both `wrangler dev -e dev` and `yarn start:web` + - This starts the Web UI and API servers in hot-reload dev mode. All changes to TS/TSX files should be properly captured and reloaded for you! - Develop you a Roleypoly - And get a beer or heated plant because oh no. @@ -92,7 +92,7 @@ For working with the [Roleypoly Design System](https://ui.roleypoly.com), use th Run: - `yarn` to install deps -- `yarn storybook` to open storybook +- `yarn start:design-system` to open storybook - `yarn test` to test ### Developing Web UI @@ -102,7 +102,7 @@ For working with the Next.js frontend components, use the below steps as referen Run: - `yarn` to install deps -- `yarn ui` to run Next.js dev server +- `yarn start:web` to run Next.js dev server - `yarn test` to test ### Developing API Components @@ -112,7 +112,7 @@ For working with the API, use the below steps as reference. Code lives in `src/b Run: - `yarn` to install deps -- `yarn worker` to start an emulated worker +- `yarn start:api` to start an emulated worker - `yarn test` to test [envexample]: .env.example diff --git a/docker-compose.yaml b/docker-compose.yaml index 3b032a7..2385ad6 100644 --- a/docker-compose.yaml +++ b/docker-compose.yaml @@ -2,20 +2,13 @@ version: '3.8' services: - worker: + dev: image: node:14 volumes: - '.:/src' ports: - 6609:6609 - working_dir: /src - command: yarn worker - - ui: - image: node:14 - volumes: - - '.:/src' - ports: - 6601:6601 + - 6006:6006 working_dir: /src - command: yarn ui + command: yarn start diff --git a/hack/dockerfiles/ui.Dockerfile b/hack/dockerfiles/ui.Dockerfile deleted file mode 100644 index e76de71..0000000 --- a/hack/dockerfiles/ui.Dockerfile +++ /dev/null @@ -1,24 +0,0 @@ -# -# Builder -# -FROM mhart/alpine-node:14 AS builder -WORKDIR /src - -COPY package.json yarn.lock ./ -RUN yarn install --frozen-lockfile --ignore-scripts - -COPY tsconfig.json .babelrc.js next.config.js next-env.d.ts ./ -COPY src src - -RUN yarn ui:build -RUN yarn install --frozen-lockfile --prod --ignore-scripts - -# -# Output layer -# -FROM mhart/alpine-node:slim-14 AS output - -COPY --from=builder /src . - -ENV PORT=6601 -ENTRYPOINT [ "/bin/sh", "-c", "/usr/bin/node node_modules/.bin/next start -p $PORT" ] diff --git a/jest.config.js b/jest.config.js index 96e97a9..d0732b9 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,14 +1,8 @@ -const { pathsToModuleNameMapper } = require('ts-jest/utils'); -const { compilerOptions } = require('./tsconfig.json'); - module.exports = { preset: 'ts-jest/presets/js-with-babel', testEnvironment: 'enzyme', reporters: ['default'], setupFilesAfterEnv: ['jest-enzyme', 'jest-styled-components', './hack/jestSetup.ts'], - moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, { - prefix: '/', - }), snapshotSerializers: ['enzyme-to-json/serializer'], globals: { 'ts-jest': { diff --git a/next-env.d.ts b/next-env.d.ts deleted file mode 100644 index 7b7aa2c..0000000 --- a/next-env.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -/// -/// diff --git a/next.config.js b/next.config.js deleted file mode 100644 index 7c1d7ba..0000000 --- a/next.config.js +++ /dev/null @@ -1,7 +0,0 @@ -module.exports = { - // target: 'serverless', - publicRuntimeConfig: { - apiPublicURI: process.env.API_PUBLIC_URI, - uiPublicURI: process.env.UI_PUBLIC_URI, - }, -}; diff --git a/package.json b/package.json index 9bb6c87..6dd9cf7 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,14 @@ }, "author": "Katalina Okano ", "license": "MIT", + "private": true, + "workspaces": [ + "packages/*" + ], "scripts": { + "build": "run-p -c build:*", + "build:design-system": "yarn workspace @roleypoly/design-system run build", + "build:web": "yarn workspace @roleypoly/web run build", "lint": "run-p -c lint:* --", "lint:eslint": "eslint", "lint:go": "go fmt ./...", @@ -20,111 +27,50 @@ "lint:stylelint": "cross-env stylelint '**/*.{ts,tsx}'", "lint:terraform": "terraform fmt -recursive -check ./terraform", "lint:types": "tsc --noEmit", - "now-build": "run-s storybook:build", + "lint:types-api": "yarn workspace @roleypoly/api run lint:types", "postinstall": "is-ci || husky install", - "storybook": "start-storybook -p 6006", - "storybook:build": "build-storybook", - "test": "jest", - "ui": "next dev -p 6601", - "ui:build": "next build", - "ui:prod": "cross-env next start -p ${PORT:-3000}", - "worker": "node src/backend-emulator/main.js" - }, - "dependencies": { - "chroma-js": "^2.1.0", - "isomorphic-unfetch": "^3.1.0", - "ksuid": "^2.0.0", - "lodash": "^4.17.20", - "next": "^10.0.5", - "nookies": "^2.5.0", - "react": "^17.0.1", - "react-custom-scrollbars": "^4.2.1", - "react-dom": "^17.0.1", - "react-icons": "^4.1.0", - "react-is": "^17.0.1", - "react-tooltip": "^4.2.15", - "styled-components": "^5.2.1", - "styled-normalize": "^8.0.7", - "swr": "^0.4.0" + "start": "run-p -c start:*", + "start:design-system": "yarn workspace @roleypoly/design-system start", + "start:web": "yarn workspace @roleypoly/web start", + "start:worker": "yarn workspace @roleypoly/api start", + "test": "jest" }, "devDependencies": { - "@babel/core": "^7.12.10", - "@cloudflare/workers-types": "^2.1.0", - "@icons/material": "^0.4.1", - "@peculiar/webcrypto": "^1.1.4", - "@storybook/addon-actions": "^6.1.14", - "@storybook/addon-essentials": "^6.1.14", - "@storybook/addon-links": "^6.1.14", - "@storybook/addons": "^6.1.14", - "@storybook/react": "^6.1.14", - "@storybook/theming": "^6.1.14", - "@types/chroma-js": "^2.1.3", "@types/enzyme": "^3.10.8", - "@types/enzyme-adapter-react-16": "^1.0.6", - "@types/express": "^4.17.11", - "@types/jest": "^26.0.20", - "@types/lodash": "^4.14.167", - "@types/minimist": "^1.2.1", - "@types/node": "^14.14.31", - "@types/react": "^17.0.0", - "@types/react-custom-scrollbars": "^4.0.7", - "@types/react-dom": "^17.0.0", - "@types/styled-components": "^5.1.7", - "@types/uuid": "^8.3.0", - "@typescript-eslint/eslint-plugin": "^4.13.0", - "@typescript-eslint/eslint-plugin-tslint": "^4.13.0", - "@typescript-eslint/parser": "^4.13.0", + "@types/lodash": "^4.14.168", "@wojtekmaj/enzyme-adapter-react-17": "^0.4.1", - "babel-jest": "^26.6.3", - "babel-loader": "^8.2.2", - "babel-plugin-styled-components": "^1.12.0", - "chokidar": "^3.5.1", - "dotenv": "^8.2.0", "enzyme": "^3.11.0", - "enzyme-to-json": "^3.6.1", - "eslint": "^7.20.0", - "eslint-config-prettier": "^7.1.0", - "eslint-plugin-import": "^2.22.1", - "eslint-plugin-jsdoc": "^32.2.0", - "eslint-plugin-react": "^7.22.0", - "husky": "^5.0.6", - "is-ci": "^2.0.0", - "jest": "^26.6.3", - "jest-cli": "^26.6.3", - "jest-environment-enzyme": "^7.1.2", + "enzyme-adapter-react-16": "^1.15.6", + "husky": "^5.1.3", + "is-ci": "^3.0.0", "jest-enzyme": "^7.1.2", - "jest-react-hooks-shallow": "^1.4.2", + "jest-react-hooks-shallow": "^1.5.1", "jest-styled-components": "^7.0.3", - "level": "^6.0.1", - "lint-staged": "^10.5.3", - "minimist": "^1.2.5", - "node-fetch": "^2.6.1", + "lint-staged": "^10.5.4", "npm-run-all": "^4.1.5", "prettier": "^2.2.1", "prettier-plugin-organize-imports": "^1.1.1", "prettier-plugin-pkg": "^0.8.0", "prettier-plugin-sh": "^0.6.0", - "stylelint": "^13.8.0", + "stylelint": "^13.12.0", "stylelint-config-prettier": "^8.0.2", - "stylelint-config-standard": "^20.0.0", + "stylelint-config-standard": "^21.0.0", "stylelint-config-styled-components": "^0.1.1", - "stylelint-prettier": "^1.1.2", - "ts-jest": "^26.4.4", - "ts-loader": "^8.0.14", - "tsconfig-paths-webpack-plugin": "^3.3.0", - "tslint": "^6.1.3", - "typescript": "^4.1.3", - "webpack": "^4.46.0" + "stylelint-prettier": "^1.2.0", + "ts-jest": "^26.5.3", + "typescript": "^4.2.3" }, "lint-staged": { "*.{ts,tsx,js,jsx}": [ - "stylelint --fix", "prettier --write" ], "*.go": [ "go fmt" ], - "*.{json,Dockerfile,sh,md,gitignore,env,mdx,yml,html}": [ + "*.{json,Dockerfile,sh,md,env,mdx,yml,html}": [ + "prettier --write" + ], + ".*/*.{json,Dockerfile,sh,md,env,mdx,yml,html}": [ "prettier --write" ], ".husky/pre-commit": [ diff --git a/src/backend-worker/.gitignore b/packages/api/.gitignore similarity index 100% rename from src/backend-worker/.gitignore rename to packages/api/.gitignore diff --git a/src/backend-worker/bindings.d.ts b/packages/api/bindings.d.ts similarity index 100% rename from src/backend-worker/bindings.d.ts rename to packages/api/bindings.d.ts diff --git a/src/backend-worker/handlers/bot-join.ts b/packages/api/handlers/bot-join.ts similarity index 100% rename from src/backend-worker/handlers/bot-join.ts rename to packages/api/handlers/bot-join.ts diff --git a/src/backend-worker/handlers/create-roleypoly-data.ts b/packages/api/handlers/create-roleypoly-data.ts similarity index 99% rename from src/backend-worker/handlers/create-roleypoly-data.ts rename to packages/api/handlers/create-roleypoly-data.ts index 1d32409..c119daa 100644 --- a/src/backend-worker/handlers/create-roleypoly-data.ts +++ b/packages/api/handlers/create-roleypoly-data.ts @@ -1,5 +1,5 @@ +import { CategoryType, Features, GuildData as GuildDataT } from '@roleypoly/types'; import KSUID from 'ksuid'; -import { CategoryType, Features, GuildData as GuildDataT } from 'roleypoly/common/types'; import { onlyRootUsers, respond } from '../utils/api-tools'; import { GuildData } from '../utils/kv'; diff --git a/src/backend-worker/handlers/get-picker-data.ts b/packages/api/handlers/get-picker-data.ts similarity index 93% rename from src/backend-worker/handlers/get-picker-data.ts rename to packages/api/handlers/get-picker-data.ts index 469d27e..f5317a1 100644 --- a/src/backend-worker/handlers/get-picker-data.ts +++ b/packages/api/handlers/get-picker-data.ts @@ -1,9 +1,4 @@ -import { - DiscordUser, - GuildSlug, - PresentableGuild, - SessionData, -} from 'roleypoly/common/types'; +import { DiscordUser, GuildSlug, PresentableGuild, SessionData } from '@roleypoly/types'; import { respond, withSession } from '../utils/api-tools'; import { getGuild, getGuildData, getGuildMemberRoles } from '../utils/guild'; diff --git a/src/backend-worker/handlers/get-session.ts b/packages/api/handlers/get-session.ts similarity index 83% rename from src/backend-worker/handlers/get-session.ts rename to packages/api/handlers/get-session.ts index c7af7c3..e597070 100644 --- a/src/backend-worker/handlers/get-session.ts +++ b/packages/api/handlers/get-session.ts @@ -1,4 +1,4 @@ -import { SessionData } from 'roleypoly/common/types'; +import { SessionData } from '@roleypoly/types'; import { respond, withSession } from '../utils/api-tools'; export const GetSession = withSession((session?: SessionData) => (): Response => { diff --git a/src/backend-worker/handlers/get-slug.ts b/packages/api/handlers/get-slug.ts similarity index 94% rename from src/backend-worker/handlers/get-slug.ts rename to packages/api/handlers/get-slug.ts index 1a44c56..b77d77e 100644 --- a/src/backend-worker/handlers/get-slug.ts +++ b/packages/api/handlers/get-slug.ts @@ -1,4 +1,4 @@ -import { GuildSlug } from 'roleypoly/common/types'; +import { GuildSlug } from '@roleypoly/types'; import { respond } from '../utils/api-tools'; import { getGuild } from '../utils/guild'; diff --git a/src/backend-worker/handlers/login-bounce.ts b/packages/api/handlers/login-bounce.ts similarity index 100% rename from src/backend-worker/handlers/login-bounce.ts rename to packages/api/handlers/login-bounce.ts diff --git a/src/backend-worker/handlers/login-callback.ts b/packages/api/handlers/login-callback.ts similarity index 97% rename from src/backend-worker/handlers/login-callback.ts rename to packages/api/handlers/login-callback.ts index 75abe7d..c553422 100644 --- a/src/backend-worker/handlers/login-callback.ts +++ b/packages/api/handlers/login-callback.ts @@ -1,10 +1,5 @@ +import { AuthTokenResponse, DiscordUser, GuildSlug, SessionData } from '@roleypoly/types'; import KSUID from 'ksuid'; -import { - AuthTokenResponse, - DiscordUser, - GuildSlug, - SessionData, -} from '../../common/types'; import { AuthType, discordFetch, diff --git a/src/backend-worker/handlers/revoke-session.ts b/packages/api/handlers/revoke-session.ts similarity index 94% rename from src/backend-worker/handlers/revoke-session.ts rename to packages/api/handlers/revoke-session.ts index 4e8504b..e9e4cbb 100644 --- a/src/backend-worker/handlers/revoke-session.ts +++ b/packages/api/handlers/revoke-session.ts @@ -1,4 +1,4 @@ -import { SessionData } from 'roleypoly/common/types'; +import { SessionData } from '@roleypoly/types'; import { formData, respond, userAgent, withSession } from '../utils/api-tools'; import { botClientID, botClientSecret } from '../utils/config'; import { Sessions } from '../utils/kv'; diff --git a/src/backend-worker/handlers/update-roles.ts b/packages/api/handlers/update-roles.ts similarity index 99% rename from src/backend-worker/handlers/update-roles.ts rename to packages/api/handlers/update-roles.ts index 9a9c94b..1ef0f45 100644 --- a/src/backend-worker/handlers/update-roles.ts +++ b/packages/api/handlers/update-roles.ts @@ -1,4 +1,3 @@ -import { difference, groupBy, keyBy, union } from 'lodash'; import { GuildData, Member, @@ -8,7 +7,8 @@ import { RoleUpdate, SessionData, TransactionType, -} from 'roleypoly/common/types'; +} from '@roleypoly/types'; +import { difference, groupBy, keyBy, union } from 'lodash'; import { AuthType, discordFetch, respond, withSession } from '../utils/api-tools'; import { botToken } from '../utils/config'; import { diff --git a/src/backend-worker/index.ts b/packages/api/index.ts similarity index 100% rename from src/backend-worker/index.ts rename to packages/api/index.ts diff --git a/packages/api/package.json b/packages/api/package.json new file mode 100644 index 0000000..de9e682 --- /dev/null +++ b/packages/api/package.json @@ -0,0 +1,19 @@ +{ + "name": "@roleypoly/api", + "version": "0.1.0", + "scripts": { + "build": "yarn workspace @roleypoly/worker-emulator build --basePath `pwd`", + "lint:types": "tsc --noEmit", + "start": "yarn workspace @roleypoly/worker-emulator start --basePath `pwd`" + }, + "devDependencies": { + "@cloudflare/workers-types": "^2.1.0", + "@roleypoly/misc-utils": "*", + "@roleypoly/types": "*", + "@roleypoly/worker-emulator": "*", + "ksuid": "^2.0.0", + "lodash": "^4.17.21", + "ts-loader": "^8.0.18", + "tsconfig-paths-webpack-plugin": "^3.3.0" + } +} diff --git a/src/backend-worker/router.ts b/packages/api/router.ts similarity index 100% rename from src/backend-worker/router.ts rename to packages/api/router.ts diff --git a/src/backend-worker/tsconfig.json b/packages/api/tsconfig.json similarity index 100% rename from src/backend-worker/tsconfig.json rename to packages/api/tsconfig.json diff --git a/src/backend-worker/utils/api-tools.ts b/packages/api/utils/api-tools.ts similarity index 97% rename from src/backend-worker/utils/api-tools.ts rename to packages/api/utils/api-tools.ts index d87d398..f251788 100644 --- a/src/backend-worker/utils/api-tools.ts +++ b/packages/api/utils/api-tools.ts @@ -1,8 +1,8 @@ -import { SessionData, UserGuildPermissions } from '../../common/types'; import { evaluatePermission, permissions as Permissions, -} from '../../common/utils/hasPermission'; +} from '@roleypoly/misc-utils/hasPermission'; +import { SessionData, UserGuildPermissions } from '@roleypoly/types'; import { Handler } from '../router'; import { rootUsers, uiPublicURI } from './config'; import { Sessions, WrappedKVNamespace } from './kv'; diff --git a/src/backend-worker/utils/bounce.ts b/packages/api/utils/bounce.ts similarity index 100% rename from src/backend-worker/utils/bounce.ts rename to packages/api/utils/bounce.ts diff --git a/src/backend-worker/utils/config.ts b/packages/api/utils/config.ts similarity index 100% rename from src/backend-worker/utils/config.ts rename to packages/api/utils/config.ts diff --git a/src/backend-worker/utils/guild.ts b/packages/api/utils/guild.ts similarity index 97% rename from src/backend-worker/utils/guild.ts rename to packages/api/utils/guild.ts index 70f57bb..a70addf 100644 --- a/src/backend-worker/utils/guild.ts +++ b/packages/api/utils/guild.ts @@ -1,3 +1,4 @@ +import { evaluatePermission, permissions } from '@roleypoly/misc-utils/hasPermission'; import { Features, Guild, @@ -5,8 +6,7 @@ import { OwnRoleInfo, Role, RoleSafety, -} from 'roleypoly/common/types'; -import { evaluatePermission, permissions } from 'roleypoly/common/utils/hasPermission'; +} from '@roleypoly/types'; import { AuthType, cacheLayer, discordFetch } from './api-tools'; import { botClientID, botToken } from './config'; import { GuildData, Guilds } from './kv'; diff --git a/src/backend-worker/utils/kv.ts b/packages/api/utils/kv.ts similarity index 100% rename from src/backend-worker/utils/kv.ts rename to packages/api/utils/kv.ts diff --git a/src/backend-worker/webpack.config.js b/packages/api/webpack.config.js similarity index 74% rename from src/backend-worker/webpack.config.js rename to packages/api/webpack.config.js index 1fe5214..cfe44fc 100644 --- a/src/backend-worker/webpack.config.js +++ b/packages/api/webpack.config.js @@ -1,5 +1,4 @@ const path = require('path'); -const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); const mode = process.env.NODE_ENV || 'production'; @@ -13,11 +12,6 @@ module.exports = { mode, resolve: { extensions: ['.ts', '.tsx', '.js'], - plugins: [ - new TsconfigPathsPlugin({ - configFile: path.resolve(__dirname, './tsconfig.json'), - }), - ], }, module: { rules: [ diff --git a/src/backend-worker/roleypoly.config.js b/packages/api/worker.config.js similarity index 100% rename from src/backend-worker/roleypoly.config.js rename to packages/api/worker.config.js diff --git a/src/backend-emulator/kv.js b/packages/backend-emulator/kv.js similarity index 100% rename from src/backend-emulator/kv.js rename to packages/backend-emulator/kv.js diff --git a/src/backend-emulator/main.js b/packages/backend-emulator/main.js similarity index 89% rename from src/backend-emulator/main.js rename to packages/backend-emulator/main.js index 360f4f4..8bb7777 100644 --- a/src/backend-emulator/main.js +++ b/packages/backend-emulator/main.js @@ -1,22 +1,29 @@ -require('dotenv').config(); +const path = require('path'); +require('dotenv').config({ path: path.resolve(__dirname, '../../.env') }); const vm = require('vm'); const http = require('http'); const fs = require('fs'); -const path = require('path'); const chokidar = require('chokidar'); const webpack = require('webpack'); const { Crypto } = require('@peculiar/webcrypto'); -const roleypolyConfig = require('../backend-worker/roleypoly.config'); const { KVShim } = require('./kv'); const crypto = new Crypto(); const fetch = require('node-fetch'); +const args = require('minimist')(process.argv.slice(2)); + +const basePath = args.basePath; +if (!basePath) { + throw new Error('--basePath is not set.'); +} + +const workerConfig = require(`${basePath}/worker.config.js`); const getKVs = (namespaces = []) => namespaces.reduce((acc, ns) => ({ ...acc, [ns]: new KVShim(ns) }), {}); const workerShims = { - ...roleypolyConfig.environment, - ...getKVs(roleypolyConfig.kv), + ...workerConfig.environment, + ...getKVs(workerConfig.kv), }; let listeners = []; @@ -133,7 +140,7 @@ const reload = () => { // Fork and re-run fork(async () => vm.runInContext( - fs.readFileSync(path.resolve(__dirname, '../backend-worker/dist/worker.js')), + fs.readFileSync(path.resolve(__dirname, `${basePath}/dist/worker.js`)), context(), { displayErrors: true, @@ -145,7 +152,7 @@ const reload = () => { const rebuild = () => new Promise((resolve, reject) => { - const webpackConfig = require('../backend-worker/webpack.config.js'); + const webpackConfig = require(`${basePath}/webpack.config.js`); webpackConfig.output.filename = 'worker.js'; webpack(webpackConfig).run((err, stats) => { if (err) { @@ -163,7 +170,7 @@ const rebuild = () => }); }); -const watcher = chokidar.watch(path.resolve(__dirname, '../backend-worker'), { +const watcher = chokidar.watch(path.resolve(__dirname, basePath), { ignoreInitial: true, ignore: '**/dist', }); diff --git a/packages/backend-emulator/package.json b/packages/backend-emulator/package.json new file mode 100644 index 0000000..3d5b6bc --- /dev/null +++ b/packages/backend-emulator/package.json @@ -0,0 +1,17 @@ +{ + "name": "@roleypoly/worker-emulator", + "version": "0.1.0", + "scripts": { + "build": "node main.js --build", + "start": "node main.js" + }, + "devDependencies": { + "@peculiar/webcrypto": "^1.1.6", + "chokidar": "^3.5.1", + "dotenv": "^8.2.0", + "level": "^6.0.1", + "minimist": "^1.2.5", + "node-fetch": "^2.6.1", + "webpack": "^4.x" + } +} diff --git a/packages/design-system/.storybook/main.js b/packages/design-system/.storybook/main.js new file mode 100644 index 0000000..9d2ffc3 --- /dev/null +++ b/packages/design-system/.storybook/main.js @@ -0,0 +1,8 @@ +const path = require('path'); +const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); +const { NormalModuleReplacementPlugin } = require('webpack'); + +module.exports = { + stories: ['../**/*.stories.mdx', '../**/*.stories.@(js|jsx|ts|tsx)'], + addons: ['@storybook/addon-links', '@storybook/addon-essentials'], +}; diff --git a/packages/design-system/.storybook/manager.js b/packages/design-system/.storybook/manager.js new file mode 100644 index 0000000..69a5b09 --- /dev/null +++ b/packages/design-system/.storybook/manager.js @@ -0,0 +1,6 @@ +import { addons } from '@storybook/addons'; +import { roleypolyTheme } from './theme'; + +addons.setConfig({ + theme: roleypolyTheme, +}); diff --git a/packages/design-system/.storybook/mocks/next_link.tsx b/packages/design-system/.storybook/mocks/next_link.tsx new file mode 100644 index 0000000..b921931 --- /dev/null +++ b/packages/design-system/.storybook/mocks/next_link.tsx @@ -0,0 +1,8 @@ +import * as React from 'react'; + +type Props = { + children: React.ReactNode; +}; +const Link = (props: Props) => <>{props.children}; + +export default Link; diff --git a/packages/design-system/.storybook/preview-head.html b/packages/design-system/.storybook/preview-head.html new file mode 100644 index 0000000..eacccaf --- /dev/null +++ b/packages/design-system/.storybook/preview-head.html @@ -0,0 +1,39 @@ + + diff --git a/packages/design-system/.storybook/preview.js b/packages/design-system/.storybook/preview.js new file mode 100644 index 0000000..d32ed34 --- /dev/null +++ b/packages/design-system/.storybook/preview.js @@ -0,0 +1,10 @@ +import { roleypolyTheme } from './theme'; +import { mdxComponents } from '../atoms/typography/mdx'; + +export const parameters = { + actions: { argTypesRegex: '^on[A-Z].*' }, + docs: { + theme: roleypolyTheme, + components: mdxComponents, + }, +}; diff --git a/packages/design-system/.storybook/theme.js b/packages/design-system/.storybook/theme.js new file mode 100644 index 0000000..4c73525 --- /dev/null +++ b/packages/design-system/.storybook/theme.js @@ -0,0 +1,34 @@ +import { create } from '@storybook/theming'; +import { palette } from '../atoms/colors'; + +export const roleypolyTheme = create({ + base: 'dark', + + colorPrimary: palette.green400, + colorSecondary: palette.taupe200, + + // UI + appBg: palette.taupe300, + appContentBg: palette.taupe200, + appBorderColor: palette.taupe100, + appBorderRadius: 0, + + // Typography + fontBase: 'system-ui, sans-serif', + fontCode: 'monospace', + + // Text colors + textColor: palette.grey600, + textInverseColor: palette.grey100, + + // Toolbar default and active colors + barTextColor: palette.taupe500, + barSelectedColor: palette.taupe600, + barBg: palette.taupe100, + + // Form colors + inputBg: 'rgba(0,0,0,0.24)', + inputBorder: palette.taupe100, + inputTextColor: palette.grey600, + inputBorderRadius: 0, +}); diff --git a/src/design-system/Intro.stories.mdx b/packages/design-system/Intro.stories.mdx similarity index 78% rename from src/design-system/Intro.stories.mdx rename to packages/design-system/Intro.stories.mdx index ffc9fae..079d8b3 100644 --- a/src/design-system/Intro.stories.mdx +++ b/packages/design-system/Intro.stories.mdx @@ -1,7 +1,7 @@ import { Meta } from '@storybook/addon-docs/blocks'; -import { Logotype } from 'roleypoly/design-system/atoms/branding'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { Logotype } from '@roleypoly/design-system/atoms/branding'; +import { Space } from '@roleypoly/design-system/atoms/space'; +import { palette } from '@roleypoly/design-system/atoms/colors'; diff --git a/src/design-system/README.md b/packages/design-system/README.md similarity index 100% rename from src/design-system/README.md rename to packages/design-system/README.md diff --git a/src/design-system/atoms/avatar/Avatar.stories.tsx b/packages/design-system/atoms/avatar/Avatar.stories.tsx similarity index 100% rename from src/design-system/atoms/avatar/Avatar.stories.tsx rename to packages/design-system/atoms/avatar/Avatar.stories.tsx diff --git a/src/design-system/atoms/avatar/Avatar.styled.ts b/packages/design-system/atoms/avatar/Avatar.styled.ts similarity index 95% rename from src/design-system/atoms/avatar/Avatar.styled.ts rename to packages/design-system/atoms/avatar/Avatar.styled.ts index 5be8979..2f829e0 100644 --- a/src/design-system/atoms/avatar/Avatar.styled.ts +++ b/packages/design-system/atoms/avatar/Avatar.styled.ts @@ -1,4 +1,4 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { palette } from '@roleypoly/design-system/atoms/colors'; import styled, { css } from 'styled-components'; import { AvatarProps } from './Avatar'; diff --git a/src/design-system/atoms/avatar/Avatar.tsx b/packages/design-system/atoms/avatar/Avatar.tsx similarity index 100% rename from src/design-system/atoms/avatar/Avatar.tsx rename to packages/design-system/atoms/avatar/Avatar.tsx diff --git a/src/design-system/atoms/avatar/avatarUtils.tsx b/packages/design-system/atoms/avatar/avatarUtils.tsx similarity index 100% rename from src/design-system/atoms/avatar/avatarUtils.tsx rename to packages/design-system/atoms/avatar/avatarUtils.tsx diff --git a/src/design-system/atoms/avatar/index.ts b/packages/design-system/atoms/avatar/index.ts similarity index 100% rename from src/design-system/atoms/avatar/index.ts rename to packages/design-system/atoms/avatar/index.ts diff --git a/src/design-system/atoms/branding/Branding.stories.tsx b/packages/design-system/atoms/branding/Branding.stories.tsx similarity index 100% rename from src/design-system/atoms/branding/Branding.stories.tsx rename to packages/design-system/atoms/branding/Branding.stories.tsx diff --git a/src/design-system/atoms/branding/Branding.tsx b/packages/design-system/atoms/branding/Branding.tsx similarity index 99% rename from src/design-system/atoms/branding/Branding.tsx rename to packages/design-system/atoms/branding/Branding.tsx index 267cc2a..c0db26e 100644 --- a/src/design-system/atoms/branding/Branding.tsx +++ b/packages/design-system/atoms/branding/Branding.tsx @@ -1,5 +1,5 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; import * as React from 'react'; -import { palette } from 'roleypoly/design-system/atoms/colors'; export type LogoProps = { fill: string; diff --git a/src/design-system/atoms/branding/BrandingOld.tsx b/packages/design-system/atoms/branding/BrandingOld.tsx similarity index 100% rename from src/design-system/atoms/branding/BrandingOld.tsx rename to packages/design-system/atoms/branding/BrandingOld.tsx diff --git a/src/design-system/atoms/branding/DynamicBranding.stories.tsx b/packages/design-system/atoms/branding/DynamicBranding.stories.tsx similarity index 96% rename from src/design-system/atoms/branding/DynamicBranding.stories.tsx rename to packages/design-system/atoms/branding/DynamicBranding.stories.tsx index 3222899..26a7193 100644 --- a/src/design-system/atoms/branding/DynamicBranding.stories.tsx +++ b/packages/design-system/atoms/branding/DynamicBranding.stories.tsx @@ -1,6 +1,6 @@ +import { Text } from '@roleypoly/design-system/atoms/typography'; import * as React from 'react'; import ReactTooltip from 'react-tooltip'; -import { Text } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { palette } from '../colors'; import { Logomark, Logotype } from './Branding'; diff --git a/src/design-system/atoms/branding/DynamicBranding.tsx b/packages/design-system/atoms/branding/DynamicBranding.tsx similarity index 100% rename from src/design-system/atoms/branding/DynamicBranding.tsx rename to packages/design-system/atoms/branding/DynamicBranding.tsx diff --git a/src/design-system/atoms/branding/FlagBranding.stories.tsx b/packages/design-system/atoms/branding/FlagBranding.stories.tsx similarity index 100% rename from src/design-system/atoms/branding/FlagBranding.stories.tsx rename to packages/design-system/atoms/branding/FlagBranding.stories.tsx diff --git a/src/design-system/atoms/branding/FlagBranding.tsx b/packages/design-system/atoms/branding/FlagBranding.tsx similarity index 100% rename from src/design-system/atoms/branding/FlagBranding.tsx rename to packages/design-system/atoms/branding/FlagBranding.tsx diff --git a/src/design-system/atoms/branding/index.ts b/packages/design-system/atoms/branding/index.ts similarity index 100% rename from src/design-system/atoms/branding/index.ts rename to packages/design-system/atoms/branding/index.ts diff --git a/src/design-system/atoms/breakpoints/BreakpointProvider.tsx b/packages/design-system/atoms/breakpoints/BreakpointProvider.tsx similarity index 100% rename from src/design-system/atoms/breakpoints/BreakpointProvider.tsx rename to packages/design-system/atoms/breakpoints/BreakpointProvider.tsx diff --git a/src/design-system/atoms/breakpoints/Breakpoints.stories.tsx b/packages/design-system/atoms/breakpoints/Breakpoints.stories.tsx similarity index 100% rename from src/design-system/atoms/breakpoints/Breakpoints.stories.tsx rename to packages/design-system/atoms/breakpoints/Breakpoints.stories.tsx diff --git a/src/design-system/atoms/breakpoints/Breakpoints.ts b/packages/design-system/atoms/breakpoints/Breakpoints.ts similarity index 100% rename from src/design-system/atoms/breakpoints/Breakpoints.ts rename to packages/design-system/atoms/breakpoints/Breakpoints.ts diff --git a/src/design-system/atoms/breakpoints/Context.ts b/packages/design-system/atoms/breakpoints/Context.ts similarity index 90% rename from src/design-system/atoms/breakpoints/Context.ts rename to packages/design-system/atoms/breakpoints/Context.ts index 0b6054d..33c610a 100644 --- a/src/design-system/atoms/breakpoints/Context.ts +++ b/packages/design-system/atoms/breakpoints/Context.ts @@ -1,5 +1,5 @@ +import { withContext } from '@roleypoly/misc-utils/withContext'; import * as React from 'react'; -import { withContext } from 'roleypoly/common/utils/withContext'; export type ScreenSize = { onSmallScreen: boolean; diff --git a/src/design-system/atoms/breakpoints/DebugTool.tsx b/packages/design-system/atoms/breakpoints/DebugTool.tsx similarity index 100% rename from src/design-system/atoms/breakpoints/DebugTool.tsx rename to packages/design-system/atoms/breakpoints/DebugTool.tsx diff --git a/src/design-system/atoms/breakpoints/index.ts b/packages/design-system/atoms/breakpoints/index.ts similarity index 100% rename from src/design-system/atoms/breakpoints/index.ts rename to packages/design-system/atoms/breakpoints/index.ts diff --git a/src/design-system/atoms/button/Button.spec.tsx b/packages/design-system/atoms/button/Button.spec.tsx similarity index 100% rename from src/design-system/atoms/button/Button.spec.tsx rename to packages/design-system/atoms/button/Button.spec.tsx diff --git a/src/design-system/atoms/button/Button.stories.tsx b/packages/design-system/atoms/button/Button.stories.tsx similarity index 100% rename from src/design-system/atoms/button/Button.stories.tsx rename to packages/design-system/atoms/button/Button.stories.tsx diff --git a/src/design-system/atoms/button/Button.styled.ts b/packages/design-system/atoms/button/Button.styled.ts similarity index 91% rename from src/design-system/atoms/button/Button.styled.ts rename to packages/design-system/atoms/button/Button.styled.ts index d0e7b1c..0b73250 100644 --- a/src/design-system/atoms/button/Button.styled.ts +++ b/packages/design-system/atoms/button/Button.styled.ts @@ -1,6 +1,6 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { fontCSS } from 'roleypoly/design-system/atoms/fonts'; -import { text300, text400 } from 'roleypoly/design-system/atoms/typography'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { fontCSS } from '@roleypoly/design-system/atoms/fonts'; +import { text300, text400 } from '@roleypoly/design-system/atoms/typography'; import styled, { css } from 'styled-components'; export const IconContainer = styled.div` diff --git a/src/design-system/atoms/button/Button.tsx b/packages/design-system/atoms/button/Button.tsx similarity index 100% rename from src/design-system/atoms/button/Button.tsx rename to packages/design-system/atoms/button/Button.tsx diff --git a/src/design-system/atoms/button/index.ts b/packages/design-system/atoms/button/index.ts similarity index 100% rename from src/design-system/atoms/button/index.ts rename to packages/design-system/atoms/button/index.ts diff --git a/src/design-system/atoms/collapse/Collapse.stories.tsx b/packages/design-system/atoms/collapse/Collapse.stories.tsx similarity index 77% rename from src/design-system/atoms/collapse/Collapse.stories.tsx rename to packages/design-system/atoms/collapse/Collapse.stories.tsx index d99f469..70611b0 100644 --- a/src/design-system/atoms/collapse/Collapse.stories.tsx +++ b/packages/design-system/atoms/collapse/Collapse.stories.tsx @@ -1,4 +1,4 @@ -import { SmallTitle } from 'roleypoly/design-system/atoms/typography'; +import { SmallTitle } from '@roleypoly/design-system/atoms/typography'; import { Collapse } from './Collapse'; export default { diff --git a/src/design-system/atoms/collapse/Collapse.tsx b/packages/design-system/atoms/collapse/Collapse.tsx similarity index 100% rename from src/design-system/atoms/collapse/Collapse.tsx rename to packages/design-system/atoms/collapse/Collapse.tsx diff --git a/src/design-system/atoms/collapse/index.ts b/packages/design-system/atoms/collapse/index.ts similarity index 100% rename from src/design-system/atoms/collapse/index.ts rename to packages/design-system/atoms/collapse/index.ts diff --git a/src/design-system/atoms/colors/colors.stories.tsx b/packages/design-system/atoms/colors/colors.stories.tsx similarity index 98% rename from src/design-system/atoms/colors/colors.stories.tsx rename to packages/design-system/atoms/colors/colors.stories.tsx index 49a21af..3dd591f 100644 --- a/src/design-system/atoms/colors/colors.stories.tsx +++ b/packages/design-system/atoms/colors/colors.stories.tsx @@ -1,6 +1,6 @@ +import { AmbientSmall } from '@roleypoly/design-system/atoms/typography'; import chroma from 'chroma-js'; import * as React from 'react'; -import { AmbientSmall } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { palette } from './colors'; diff --git a/src/design-system/atoms/colors/colors.tsx b/packages/design-system/atoms/colors/colors.tsx similarity index 100% rename from src/design-system/atoms/colors/colors.tsx rename to packages/design-system/atoms/colors/colors.tsx diff --git a/src/design-system/atoms/colors/index.ts b/packages/design-system/atoms/colors/index.ts similarity index 100% rename from src/design-system/atoms/colors/index.ts rename to packages/design-system/atoms/colors/index.ts diff --git a/src/design-system/atoms/colors/withColors.tsx b/packages/design-system/atoms/colors/withColors.tsx similarity index 100% rename from src/design-system/atoms/colors/withColors.tsx rename to packages/design-system/atoms/colors/withColors.tsx diff --git a/src/design-system/atoms/dot-overlay/DotOverlay.stories.tsx b/packages/design-system/atoms/dot-overlay/DotOverlay.stories.tsx similarity index 100% rename from src/design-system/atoms/dot-overlay/DotOverlay.stories.tsx rename to packages/design-system/atoms/dot-overlay/DotOverlay.stories.tsx diff --git a/src/design-system/atoms/dot-overlay/DotOverlay.tsx b/packages/design-system/atoms/dot-overlay/DotOverlay.tsx similarity index 100% rename from src/design-system/atoms/dot-overlay/DotOverlay.tsx rename to packages/design-system/atoms/dot-overlay/DotOverlay.tsx diff --git a/src/design-system/atoms/dot-overlay/index.ts b/packages/design-system/atoms/dot-overlay/index.ts similarity index 100% rename from src/design-system/atoms/dot-overlay/index.ts rename to packages/design-system/atoms/dot-overlay/index.ts diff --git a/src/design-system/atoms/fader/Fader.stories.tsx b/packages/design-system/atoms/fader/Fader.stories.tsx similarity index 90% rename from src/design-system/atoms/fader/Fader.stories.tsx rename to packages/design-system/atoms/fader/Fader.stories.tsx index c8a4021..b9bd46a 100644 --- a/src/design-system/atoms/fader/Fader.stories.tsx +++ b/packages/design-system/atoms/fader/Fader.stories.tsx @@ -1,6 +1,6 @@ +import { Button } from '@roleypoly/design-system/atoms/button'; import { action } from '@storybook/addon-actions'; import * as React from 'react'; -import { Button } from 'roleypoly/design-system/atoms/button'; import { FaderOpacity, FaderSlide } from './Fader'; export default { diff --git a/src/design-system/atoms/fader/Fader.tsx b/packages/design-system/atoms/fader/Fader.tsx similarity index 100% rename from src/design-system/atoms/fader/Fader.tsx rename to packages/design-system/atoms/fader/Fader.tsx diff --git a/src/design-system/atoms/fader/index.ts b/packages/design-system/atoms/fader/index.ts similarity index 100% rename from src/design-system/atoms/fader/index.ts rename to packages/design-system/atoms/fader/index.ts diff --git a/src/design-system/atoms/feature-gate/FeatureGate.stories.tsx b/packages/design-system/atoms/feature-gate/FeatureGate.stories.tsx similarity index 81% rename from src/design-system/atoms/feature-gate/FeatureGate.stories.tsx rename to packages/design-system/atoms/feature-gate/FeatureGate.stories.tsx index 9b5cd95..d9b9dc5 100644 --- a/src/design-system/atoms/feature-gate/FeatureGate.stories.tsx +++ b/packages/design-system/atoms/feature-gate/FeatureGate.stories.tsx @@ -1,5 +1,5 @@ +import { FeatureFlagDecorator } from '@roleypoly/misc-utils/featureFlags/react/storyDecorator'; import * as React from 'react'; -import { FeatureFlagDecorator } from 'roleypoly/common/utils/featureFlags/react/storyDecorator'; import { FeatureGate } from './FeatureGate'; export default { diff --git a/src/design-system/atoms/feature-gate/FeatureGate.tsx b/packages/design-system/atoms/feature-gate/FeatureGate.tsx similarity index 89% rename from src/design-system/atoms/feature-gate/FeatureGate.tsx rename to packages/design-system/atoms/feature-gate/FeatureGate.tsx index 5e53acb..2d50379 100644 --- a/src/design-system/atoms/feature-gate/FeatureGate.tsx +++ b/packages/design-system/atoms/feature-gate/FeatureGate.tsx @@ -1,8 +1,8 @@ -import * as React from 'react'; import { FeatureFlag, FeatureFlagsContext, -} from 'roleypoly/common/utils/featureFlags/react'; +} from '@roleypoly/misc-utils/featureFlags/react'; +import * as React from 'react'; export type FeatureGateProps = { featureFlag: FeatureFlag; diff --git a/src/design-system/atoms/feature-gate/index.ts b/packages/design-system/atoms/feature-gate/index.ts similarity index 100% rename from src/design-system/atoms/feature-gate/index.ts rename to packages/design-system/atoms/feature-gate/index.ts diff --git a/src/design-system/atoms/fonts/fonts.stories.tsx b/packages/design-system/atoms/fonts/fonts.stories.tsx similarity index 96% rename from src/design-system/atoms/fonts/fonts.stories.tsx rename to packages/design-system/atoms/fonts/fonts.stories.tsx index 6e491ca..9cc092c 100644 --- a/src/design-system/atoms/fonts/fonts.stories.tsx +++ b/packages/design-system/atoms/fonts/fonts.stories.tsx @@ -1,5 +1,8 @@ +import { + MediumTitle, + Text as TextBlock, +} from '@roleypoly/design-system/atoms/typography'; import * as React from 'react'; -import { MediumTitle, Text as TextBlock } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { UseFontStyled } from './fonts'; diff --git a/packages/design-system/atoms/fonts/fonts.tsx b/packages/design-system/atoms/fonts/fonts.tsx new file mode 100644 index 0000000..fe15b8d --- /dev/null +++ b/packages/design-system/atoms/fonts/fonts.tsx @@ -0,0 +1,10 @@ +import styled, { css } from 'styled-components'; + +export const fontCSS = css` + font-family: 'source-han-sans-japanese', 'Source Sans Pro', sans-serif, + 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol' !important; +`; + +export const UseFontStyled = styled.div` + ${fontCSS} +`; diff --git a/src/design-system/atoms/fonts/index.ts b/packages/design-system/atoms/fonts/index.ts similarity index 100% rename from src/design-system/atoms/fonts/index.ts rename to packages/design-system/atoms/fonts/index.ts diff --git a/src/design-system/atoms/halfsies/Halfsies.stories.tsx b/packages/design-system/atoms/halfsies/Halfsies.stories.tsx similarity index 100% rename from src/design-system/atoms/halfsies/Halfsies.stories.tsx rename to packages/design-system/atoms/halfsies/Halfsies.stories.tsx diff --git a/src/design-system/atoms/halfsies/Halfsies.tsx b/packages/design-system/atoms/halfsies/Halfsies.tsx similarity index 82% rename from src/design-system/atoms/halfsies/Halfsies.tsx rename to packages/design-system/atoms/halfsies/Halfsies.tsx index e5bba65..385e096 100644 --- a/src/design-system/atoms/halfsies/Halfsies.tsx +++ b/packages/design-system/atoms/halfsies/Halfsies.tsx @@ -1,4 +1,4 @@ -import { onTablet } from 'roleypoly/design-system/atoms/breakpoints'; +import { onTablet } from '@roleypoly/design-system/atoms/breakpoints'; import styled, { css } from 'styled-components'; export const HalfsiesContainer = styled.div` diff --git a/src/design-system/atoms/halfsies/index.ts b/packages/design-system/atoms/halfsies/index.ts similarity index 100% rename from src/design-system/atoms/halfsies/index.ts rename to packages/design-system/atoms/halfsies/index.ts diff --git a/src/design-system/atoms/hero/Hero.stories.tsx b/packages/design-system/atoms/hero/Hero.stories.tsx similarity index 100% rename from src/design-system/atoms/hero/Hero.stories.tsx rename to packages/design-system/atoms/hero/Hero.stories.tsx diff --git a/src/design-system/atoms/hero/Hero.tsx b/packages/design-system/atoms/hero/Hero.tsx similarity index 100% rename from src/design-system/atoms/hero/Hero.tsx rename to packages/design-system/atoms/hero/Hero.tsx diff --git a/src/design-system/atoms/hero/index.ts b/packages/design-system/atoms/hero/index.ts similarity index 100% rename from src/design-system/atoms/hero/index.ts rename to packages/design-system/atoms/hero/index.ts diff --git a/src/design-system/atoms/horizontal-switch/BUILD.bazel b/packages/design-system/atoms/horizontal-switch/BUILD.bazel similarity index 100% rename from src/design-system/atoms/horizontal-switch/BUILD.bazel rename to packages/design-system/atoms/horizontal-switch/BUILD.bazel diff --git a/src/design-system/atoms/horizontal-switch/HorizontalSwitch.stories.tsx b/packages/design-system/atoms/horizontal-switch/HorizontalSwitch.stories.tsx similarity index 100% rename from src/design-system/atoms/horizontal-switch/HorizontalSwitch.stories.tsx rename to packages/design-system/atoms/horizontal-switch/HorizontalSwitch.stories.tsx diff --git a/src/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts b/packages/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts similarity index 80% rename from src/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts rename to packages/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts index 8cc3454..4a5351d 100644 --- a/src/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts +++ b/packages/design-system/atoms/horizontal-switch/HorizontalSwitch.styled.ts @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled, { css } from 'styled-components'; export const Item = styled.div<{ selected: boolean }>` diff --git a/src/design-system/atoms/horizontal-switch/HorizontalSwitch.tsx b/packages/design-system/atoms/horizontal-switch/HorizontalSwitch.tsx similarity index 100% rename from src/design-system/atoms/horizontal-switch/HorizontalSwitch.tsx rename to packages/design-system/atoms/horizontal-switch/HorizontalSwitch.tsx diff --git a/src/design-system/atoms/horizontal-switch/index.tsx b/packages/design-system/atoms/horizontal-switch/index.tsx similarity index 100% rename from src/design-system/atoms/horizontal-switch/index.tsx rename to packages/design-system/atoms/horizontal-switch/index.tsx diff --git a/src/design-system/atoms/key-events/KeyEvents.ts b/packages/design-system/atoms/key-events/KeyEvents.ts similarity index 100% rename from src/design-system/atoms/key-events/KeyEvents.ts rename to packages/design-system/atoms/key-events/KeyEvents.ts diff --git a/src/design-system/atoms/key-events/index.ts b/packages/design-system/atoms/key-events/index.ts similarity index 100% rename from src/design-system/atoms/key-events/index.ts rename to packages/design-system/atoms/key-events/index.ts diff --git a/src/design-system/atoms/popover/Popover.stories.tsx b/packages/design-system/atoms/popover/Popover.stories.tsx similarity index 93% rename from src/design-system/atoms/popover/Popover.stories.tsx rename to packages/design-system/atoms/popover/Popover.stories.tsx index b873cf0..c61911c 100644 --- a/src/design-system/atoms/popover/Popover.stories.tsx +++ b/packages/design-system/atoms/popover/Popover.stories.tsx @@ -1,5 +1,5 @@ +import { Button } from '@roleypoly/design-system/atoms/button'; import * as React from 'react'; -import { Button } from 'roleypoly/design-system/atoms/button'; import { Popover as PopoverComponent } from './Popover'; export default { diff --git a/src/design-system/atoms/popover/Popover.styled.ts b/packages/design-system/atoms/popover/Popover.styled.ts similarity index 89% rename from src/design-system/atoms/popover/Popover.styled.ts rename to packages/design-system/atoms/popover/Popover.styled.ts index 819593d..8210e46 100644 --- a/src/design-system/atoms/popover/Popover.styled.ts +++ b/packages/design-system/atoms/popover/Popover.styled.ts @@ -1,6 +1,6 @@ -import { onSmallScreen, onTablet } from 'roleypoly/design-system/atoms/breakpoints'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { onSmallScreen, onTablet } from '@roleypoly/design-system/atoms/breakpoints'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled, { css } from 'styled-components'; type PopoverStyledProps = { diff --git a/src/design-system/atoms/popover/Popover.tsx b/packages/design-system/atoms/popover/Popover.tsx similarity index 94% rename from src/design-system/atoms/popover/Popover.tsx rename to packages/design-system/atoms/popover/Popover.tsx index 4e50540..579e0e3 100644 --- a/src/design-system/atoms/popover/Popover.tsx +++ b/packages/design-system/atoms/popover/Popover.tsx @@ -1,6 +1,6 @@ +import { globalOnKeyUp } from '@roleypoly/design-system/atoms/key-events'; import * as React from 'react'; import { IoMdClose } from 'react-icons/io'; -import { globalOnKeyUp } from 'roleypoly/design-system/atoms/key-events'; import { DefocusHandler, PopoverBase, diff --git a/src/design-system/atoms/popover/index.ts b/packages/design-system/atoms/popover/index.ts similarity index 100% rename from src/design-system/atoms/popover/index.ts rename to packages/design-system/atoms/popover/index.ts diff --git a/src/design-system/atoms/role/Role.spec.tsx b/packages/design-system/atoms/role/Role.spec.tsx similarity index 85% rename from src/design-system/atoms/role/Role.spec.tsx rename to packages/design-system/atoms/role/Role.spec.tsx index 0e086c1..f039507 100644 --- a/src/design-system/atoms/role/Role.spec.tsx +++ b/packages/design-system/atoms/role/Role.spec.tsx @@ -1,6 +1,6 @@ import { shallow } from 'enzyme'; import * as React from 'react'; -import { roleCategory } from 'roleypoly/common/types/storyData'; +import { roleCategory } from '../../fixtures/storyData'; import { Role } from './Role'; it('fires an OnClick handler when clicked', () => { diff --git a/src/design-system/atoms/role/Role.stories.tsx b/packages/design-system/atoms/role/Role.stories.tsx similarity index 92% rename from src/design-system/atoms/role/Role.stories.tsx rename to packages/design-system/atoms/role/Role.stories.tsx index e232b06..ab9b9fe 100644 --- a/src/design-system/atoms/role/Role.stories.tsx +++ b/packages/design-system/atoms/role/Role.stories.tsx @@ -1,7 +1,7 @@ +import { withColors } from '@roleypoly/design-system/atoms/colors/withColors'; import * as React from 'react'; -import { roleCategory } from 'roleypoly/common/types/storyData'; -import { withColors } from 'roleypoly/design-system/atoms/colors/withColors'; import styled from 'styled-components'; +import { roleCategory } from '../../fixtures/storyData'; import { Role as RoleComponent } from './Role'; export default { diff --git a/src/design-system/atoms/role/Role.styled.tsx b/packages/design-system/atoms/role/Role.styled.tsx similarity index 94% rename from src/design-system/atoms/role/Role.styled.tsx rename to packages/design-system/atoms/role/Role.styled.tsx index cdbc5be..dee7ef2 100644 --- a/src/design-system/atoms/role/Role.styled.tsx +++ b/packages/design-system/atoms/role/Role.styled.tsx @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled, { css } from 'styled-components'; export type StyledProps = { diff --git a/src/design-system/atoms/role/Role.tsx b/packages/design-system/atoms/role/Role.tsx similarity index 93% rename from src/design-system/atoms/role/Role.tsx rename to packages/design-system/atoms/role/Role.tsx index a08f979..24074ce 100644 --- a/src/design-system/atoms/role/Role.tsx +++ b/packages/design-system/atoms/role/Role.tsx @@ -1,9 +1,9 @@ +import { numberToChroma } from '@roleypoly/design-system/atoms/colors'; +import { evaluatePermission, permissions } from '@roleypoly/misc-utils/hasPermission'; +import { Role as RPCRole, RoleSafety } from '@roleypoly/types'; import chroma from 'chroma-js'; import * as React from 'react'; import { FaCheck, FaTimes } from 'react-icons/fa'; -import { Role as RPCRole, RoleSafety } from 'roleypoly/common/types'; -import { evaluatePermission, permissions } from 'roleypoly/common/utils/hasPermission'; -import { numberToChroma } from 'roleypoly/design-system/atoms/colors'; import * as styled from './Role.styled'; type Props = { diff --git a/src/design-system/atoms/role/index.ts b/packages/design-system/atoms/role/index.ts similarity index 100% rename from src/design-system/atoms/role/index.ts rename to packages/design-system/atoms/role/index.ts diff --git a/src/design-system/atoms/space/Space.stories.tsx b/packages/design-system/atoms/space/Space.stories.tsx similarity index 100% rename from src/design-system/atoms/space/Space.stories.tsx rename to packages/design-system/atoms/space/Space.stories.tsx diff --git a/src/design-system/atoms/space/Space.tsx b/packages/design-system/atoms/space/Space.tsx similarity index 100% rename from src/design-system/atoms/space/Space.tsx rename to packages/design-system/atoms/space/Space.tsx diff --git a/src/design-system/atoms/space/index.ts b/packages/design-system/atoms/space/index.ts similarity index 100% rename from src/design-system/atoms/space/index.ts rename to packages/design-system/atoms/space/index.ts diff --git a/src/design-system/atoms/sparkle/Shapes.tsx b/packages/design-system/atoms/sparkle/Shapes.tsx similarity index 100% rename from src/design-system/atoms/sparkle/Shapes.tsx rename to packages/design-system/atoms/sparkle/Shapes.tsx diff --git a/src/design-system/atoms/sparkle/Sparkle.stories.tsx b/packages/design-system/atoms/sparkle/Sparkle.stories.tsx similarity index 76% rename from src/design-system/atoms/sparkle/Sparkle.stories.tsx rename to packages/design-system/atoms/sparkle/Sparkle.stories.tsx index a9ea6e0..6eede0d 100644 --- a/src/design-system/atoms/sparkle/Sparkle.stories.tsx +++ b/packages/design-system/atoms/sparkle/Sparkle.stories.tsx @@ -1,6 +1,6 @@ +import { Button } from '@roleypoly/design-system/atoms/button'; +import { Hero } from '@roleypoly/design-system/atoms/hero'; import * as React from 'react'; -import { Button } from 'roleypoly/design-system/atoms/button'; -import { Hero } from 'roleypoly/design-system/atoms/hero'; import { SparkleOverlay } from './Sparkle'; export default { diff --git a/src/design-system/atoms/sparkle/Sparkle.tsx b/packages/design-system/atoms/sparkle/Sparkle.tsx similarity index 95% rename from src/design-system/atoms/sparkle/Sparkle.tsx rename to packages/design-system/atoms/sparkle/Sparkle.tsx index c8ceedf..a262005 100644 --- a/src/design-system/atoms/sparkle/Sparkle.tsx +++ b/packages/design-system/atoms/sparkle/Sparkle.tsx @@ -1,5 +1,5 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; import * as React from 'react'; -import { palette } from 'roleypoly/design-system/atoms/colors'; import styled from 'styled-components'; import { SparklePatternAlpha, SparklePatternBeta } from './Shapes'; diff --git a/src/design-system/atoms/sparkle/index.ts b/packages/design-system/atoms/sparkle/index.ts similarity index 100% rename from src/design-system/atoms/sparkle/index.ts rename to packages/design-system/atoms/sparkle/index.ts diff --git a/src/design-system/atoms/tab-view/TabView.spec.tsx b/packages/design-system/atoms/tab-view/TabView.spec.tsx similarity index 100% rename from src/design-system/atoms/tab-view/TabView.spec.tsx rename to packages/design-system/atoms/tab-view/TabView.spec.tsx diff --git a/src/design-system/atoms/tab-view/TabView.stories.tsx b/packages/design-system/atoms/tab-view/TabView.stories.tsx similarity index 100% rename from src/design-system/atoms/tab-view/TabView.stories.tsx rename to packages/design-system/atoms/tab-view/TabView.stories.tsx diff --git a/src/design-system/atoms/tab-view/TabView.styled.ts b/packages/design-system/atoms/tab-view/TabView.styled.ts similarity index 83% rename from src/design-system/atoms/tab-view/TabView.styled.ts rename to packages/design-system/atoms/tab-view/TabView.styled.ts index 8c5550c..ffc9f3b 100644 --- a/src/design-system/atoms/tab-view/TabView.styled.ts +++ b/packages/design-system/atoms/tab-view/TabView.styled.ts @@ -1,6 +1,6 @@ -import { onTablet } from 'roleypoly/design-system/atoms/breakpoints'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { onTablet } from '@roleypoly/design-system/atoms/breakpoints'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled, { css } from 'styled-components'; export const TabViewStyled = styled.div``; diff --git a/src/design-system/atoms/tab-view/TabView.tsx b/packages/design-system/atoms/tab-view/TabView.tsx similarity index 100% rename from src/design-system/atoms/tab-view/TabView.tsx rename to packages/design-system/atoms/tab-view/TabView.tsx diff --git a/src/design-system/atoms/tab-view/index.ts b/packages/design-system/atoms/tab-view/index.ts similarity index 100% rename from src/design-system/atoms/tab-view/index.ts rename to packages/design-system/atoms/tab-view/index.ts diff --git a/src/design-system/atoms/text-input/TextInput.stories.tsx b/packages/design-system/atoms/text-input/TextInput.stories.tsx similarity index 92% rename from src/design-system/atoms/text-input/TextInput.stories.tsx rename to packages/design-system/atoms/text-input/TextInput.stories.tsx index 4acc386..15e7404 100644 --- a/src/design-system/atoms/text-input/TextInput.stories.tsx +++ b/packages/design-system/atoms/text-input/TextInput.stories.tsx @@ -1,6 +1,6 @@ +import { SmallTitle } from '@roleypoly/design-system/atoms/typography'; import * as React from 'react'; import { FiKey } from 'react-icons/fi'; -import { SmallTitle } from 'roleypoly/design-system/atoms/typography'; import { TextInput, TextInputWithIcon } from './TextInput'; export default { diff --git a/src/design-system/atoms/text-input/TextInput.tsx b/packages/design-system/atoms/text-input/TextInput.tsx similarity index 96% rename from src/design-system/atoms/text-input/TextInput.tsx rename to packages/design-system/atoms/text-input/TextInput.tsx index 32a9600..2271081 100644 --- a/src/design-system/atoms/text-input/TextInput.tsx +++ b/packages/design-system/atoms/text-input/TextInput.tsx @@ -1,5 +1,5 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; import * as React from 'react'; -import { palette } from 'roleypoly/design-system/atoms/colors'; import styled from 'styled-components'; const StyledTextInput = styled.input` diff --git a/src/design-system/atoms/text-input/index.ts b/packages/design-system/atoms/text-input/index.ts similarity index 100% rename from src/design-system/atoms/text-input/index.ts rename to packages/design-system/atoms/text-input/index.ts diff --git a/src/design-system/atoms/timings/index.ts b/packages/design-system/atoms/timings/index.ts similarity index 100% rename from src/design-system/atoms/timings/index.ts rename to packages/design-system/atoms/timings/index.ts diff --git a/src/design-system/atoms/timings/timings.ts b/packages/design-system/atoms/timings/timings.ts similarity index 100% rename from src/design-system/atoms/timings/timings.ts rename to packages/design-system/atoms/timings/timings.ts diff --git a/src/design-system/atoms/typist/Typist.spec.tsx b/packages/design-system/atoms/typist/Typist.spec.tsx similarity index 100% rename from src/design-system/atoms/typist/Typist.spec.tsx rename to packages/design-system/atoms/typist/Typist.spec.tsx diff --git a/src/design-system/atoms/typist/Typist.stories.tsx b/packages/design-system/atoms/typist/Typist.stories.tsx similarity index 100% rename from src/design-system/atoms/typist/Typist.stories.tsx rename to packages/design-system/atoms/typist/Typist.stories.tsx diff --git a/src/design-system/atoms/typist/Typist.tsx b/packages/design-system/atoms/typist/Typist.tsx similarity index 100% rename from src/design-system/atoms/typist/Typist.tsx rename to packages/design-system/atoms/typist/Typist.tsx diff --git a/src/design-system/atoms/typist/index.ts b/packages/design-system/atoms/typist/index.ts similarity index 100% rename from src/design-system/atoms/typist/index.ts rename to packages/design-system/atoms/typist/index.ts diff --git a/src/design-system/atoms/typography/index.ts b/packages/design-system/atoms/typography/index.ts similarity index 100% rename from src/design-system/atoms/typography/index.ts rename to packages/design-system/atoms/typography/index.ts diff --git a/src/design-system/atoms/typography/mdx.tsx b/packages/design-system/atoms/typography/mdx.tsx similarity index 100% rename from src/design-system/atoms/typography/mdx.tsx rename to packages/design-system/atoms/typography/mdx.tsx diff --git a/src/design-system/atoms/typography/typography.stories.tsx b/packages/design-system/atoms/typography/typography.stories.tsx similarity index 100% rename from src/design-system/atoms/typography/typography.stories.tsx rename to packages/design-system/atoms/typography/typography.stories.tsx diff --git a/src/design-system/atoms/typography/typography.tsx b/packages/design-system/atoms/typography/typography.tsx similarity index 92% rename from src/design-system/atoms/typography/typography.tsx rename to packages/design-system/atoms/typography/typography.tsx index efc7669..cdf775c 100644 --- a/src/design-system/atoms/typography/typography.tsx +++ b/packages/design-system/atoms/typography/typography.tsx @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled, { css } from 'styled-components'; const reset = css` diff --git a/src/common/types/storyData.ts b/packages/design-system/fixtures/storyData.ts similarity index 99% rename from src/common/types/storyData.ts rename to packages/design-system/fixtures/storyData.ts index ffe00de..6684a17 100644 --- a/src/common/types/storyData.ts +++ b/packages/design-system/fixtures/storyData.ts @@ -11,7 +11,7 @@ import { Role, RoleSafety, RoleypolyUser, -} from '.'; +} from '@roleypoly/types'; export const roleCategory: Role[] = [ { diff --git a/src/design-system/molecules/demo-discord/DemoDiscord.stories.tsx b/packages/design-system/molecules/demo-discord/DemoDiscord.stories.tsx similarity index 100% rename from src/design-system/molecules/demo-discord/DemoDiscord.stories.tsx rename to packages/design-system/molecules/demo-discord/DemoDiscord.stories.tsx diff --git a/src/design-system/molecules/demo-discord/DemoDiscord.styled.ts b/packages/design-system/molecules/demo-discord/DemoDiscord.styled.ts similarity index 94% rename from src/design-system/molecules/demo-discord/DemoDiscord.styled.ts rename to packages/design-system/molecules/demo-discord/DemoDiscord.styled.ts index 0e5ffeb..552f009 100644 --- a/src/design-system/molecules/demo-discord/DemoDiscord.styled.ts +++ b/packages/design-system/molecules/demo-discord/DemoDiscord.styled.ts @@ -1,4 +1,4 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { palette } from '@roleypoly/design-system/atoms/colors'; import styled, { keyframes } from 'styled-components'; export const Base = styled.div` diff --git a/src/design-system/molecules/demo-discord/DemoDiscord.tsx b/packages/design-system/molecules/demo-discord/DemoDiscord.tsx similarity index 92% rename from src/design-system/molecules/demo-discord/DemoDiscord.tsx rename to packages/design-system/molecules/demo-discord/DemoDiscord.tsx index 71c18ec..b1f9699 100644 --- a/src/design-system/molecules/demo-discord/DemoDiscord.tsx +++ b/packages/design-system/molecules/demo-discord/DemoDiscord.tsx @@ -1,6 +1,6 @@ +import { Typist } from '@roleypoly/design-system/atoms/typist'; +import { demoData } from '@roleypoly/types/demoData'; import * as React from 'react'; -import { demoData } from 'roleypoly/common/types/demoData'; -import { Typist } from 'roleypoly/design-system/atoms/typist'; import { Base, InputBox, diff --git a/src/design-system/molecules/demo-discord/index.ts b/packages/design-system/molecules/demo-discord/index.ts similarity index 100% rename from src/design-system/molecules/demo-discord/index.ts rename to packages/design-system/molecules/demo-discord/index.ts diff --git a/src/design-system/molecules/demo-picker/DemoPicker.stories.tsx b/packages/design-system/molecules/demo-picker/DemoPicker.stories.tsx similarity index 100% rename from src/design-system/molecules/demo-picker/DemoPicker.stories.tsx rename to packages/design-system/molecules/demo-picker/DemoPicker.stories.tsx diff --git a/src/design-system/molecules/demo-picker/DemoPicker.tsx b/packages/design-system/molecules/demo-picker/DemoPicker.tsx similarity index 86% rename from src/design-system/molecules/demo-picker/DemoPicker.tsx rename to packages/design-system/molecules/demo-picker/DemoPicker.tsx index 5de52bc..fbc1f15 100644 --- a/src/design-system/molecules/demo-picker/DemoPicker.tsx +++ b/packages/design-system/molecules/demo-picker/DemoPicker.tsx @@ -1,7 +1,7 @@ +import { Role } from '@roleypoly/design-system/atoms/role'; +import { Role as RPCRole } from '@roleypoly/types'; +import { demoData } from '@roleypoly/types/demoData'; import * as React from 'react'; -import { Role as RPCRole } from 'roleypoly/common/types'; -import { demoData } from 'roleypoly/common/types/demoData'; -import { Role } from 'roleypoly/design-system/atoms/role'; import styled from 'styled-components'; const Container = styled.div` diff --git a/src/design-system/molecules/demo-picker/index.ts b/packages/design-system/molecules/demo-picker/index.ts similarity index 100% rename from src/design-system/molecules/demo-picker/index.ts rename to packages/design-system/molecules/demo-picker/index.ts diff --git a/src/design-system/molecules/editor-category/EditorCategory.stories.tsx b/packages/design-system/molecules/editor-category/EditorCategory.stories.tsx similarity index 82% rename from src/design-system/molecules/editor-category/EditorCategory.stories.tsx rename to packages/design-system/molecules/editor-category/EditorCategory.stories.tsx index 7cca233..9cb0133 100644 --- a/src/design-system/molecules/editor-category/EditorCategory.stories.tsx +++ b/packages/design-system/molecules/editor-category/EditorCategory.stories.tsx @@ -1,9 +1,5 @@ import * as React from 'react'; -import { - mockCategory, - roleCategory, - roleCategory2, -} from 'roleypoly/common/types/storyData'; +import { mockCategory, roleCategory, roleCategory2 } from '../../fixtures/storyData'; import { EditorCategory } from './EditorCategory'; export default { diff --git a/src/design-system/molecules/editor-category/EditorCategory.styled.ts b/packages/design-system/molecules/editor-category/EditorCategory.styled.ts similarity index 100% rename from src/design-system/molecules/editor-category/EditorCategory.styled.ts rename to packages/design-system/molecules/editor-category/EditorCategory.styled.ts diff --git a/src/design-system/molecules/editor-category/EditorCategory.tsx b/packages/design-system/molecules/editor-category/EditorCategory.tsx similarity index 87% rename from src/design-system/molecules/editor-category/EditorCategory.tsx rename to packages/design-system/molecules/editor-category/EditorCategory.tsx index 06ac030..262bb94 100644 --- a/src/design-system/molecules/editor-category/EditorCategory.tsx +++ b/packages/design-system/molecules/editor-category/EditorCategory.tsx @@ -1,14 +1,14 @@ +import { FaderOpacity } from '@roleypoly/design-system/atoms/fader'; +import { HorizontalSwitch } from '@roleypoly/design-system/atoms/horizontal-switch'; +import { Popover } from '@roleypoly/design-system/atoms/popover'; +import { Role } from '@roleypoly/design-system/atoms/role'; +import { Space } from '@roleypoly/design-system/atoms/space'; +import { TextInput, TextInputWithIcon } from '@roleypoly/design-system/atoms/text-input'; +import { Text } from '@roleypoly/design-system/atoms/typography'; +import { RoleSearch } from '@roleypoly/design-system/molecules/role-search'; +import { Category, CategoryType, Role as RoleType } from '@roleypoly/types'; import * as React from 'react'; import { GoSearch } from 'react-icons/go'; -import { Category, CategoryType, Role as RoleType } from 'roleypoly/common/types'; -import { FaderOpacity } from 'roleypoly/design-system/atoms/fader'; -import { HorizontalSwitch } from 'roleypoly/design-system/atoms/horizontal-switch'; -import { Popover } from 'roleypoly/design-system/atoms/popover'; -import { Role } from 'roleypoly/design-system/atoms/role'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { TextInput, TextInputWithIcon } from 'roleypoly/design-system/atoms/text-input'; -import { Text } from 'roleypoly/design-system/atoms/typography'; -import { RoleSearch } from 'roleypoly/design-system/molecules/role-search'; import { RoleContainer } from './EditorCategory.styled'; type Props = { diff --git a/src/design-system/molecules/editor-category/index.ts b/packages/design-system/molecules/editor-category/index.ts similarity index 100% rename from src/design-system/molecules/editor-category/index.ts rename to packages/design-system/molecules/editor-category/index.ts diff --git a/src/design-system/molecules/error-banner/ErrorBanner.stories.tsx b/packages/design-system/molecules/error-banner/ErrorBanner.stories.tsx similarity index 100% rename from src/design-system/molecules/error-banner/ErrorBanner.stories.tsx rename to packages/design-system/molecules/error-banner/ErrorBanner.stories.tsx diff --git a/src/design-system/molecules/error-banner/ErrorBanner.styled.ts b/packages/design-system/molecules/error-banner/ErrorBanner.styled.ts similarity index 75% rename from src/design-system/molecules/error-banner/ErrorBanner.styled.ts rename to packages/design-system/molecules/error-banner/ErrorBanner.styled.ts index b697f5f..ec41058 100644 --- a/src/design-system/molecules/error-banner/ErrorBanner.styled.ts +++ b/packages/design-system/molecules/error-banner/ErrorBanner.styled.ts @@ -1,6 +1,6 @@ -import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { text300, text500, text700 } from 'roleypoly/design-system/atoms/typography'; +import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { text300, text500, text700 } from '@roleypoly/design-system/atoms/typography'; import styled, { css } from 'styled-components'; export const ErrorWrapper = styled.div` diff --git a/src/design-system/molecules/error-banner/ErrorBanner.tsx b/packages/design-system/molecules/error-banner/ErrorBanner.tsx similarity index 100% rename from src/design-system/molecules/error-banner/ErrorBanner.tsx rename to packages/design-system/molecules/error-banner/ErrorBanner.tsx diff --git a/src/design-system/molecules/error-banner/index.ts b/packages/design-system/molecules/error-banner/index.ts similarity index 100% rename from src/design-system/molecules/error-banner/index.ts rename to packages/design-system/molecules/error-banner/index.ts diff --git a/src/design-system/molecules/footer/Flags.tsx b/packages/design-system/molecules/footer/Flags.tsx similarity index 100% rename from src/design-system/molecules/footer/Flags.tsx rename to packages/design-system/molecules/footer/Flags.tsx diff --git a/src/design-system/molecules/footer/Footer.stories.tsx b/packages/design-system/molecules/footer/Footer.stories.tsx similarity index 100% rename from src/design-system/molecules/footer/Footer.stories.tsx rename to packages/design-system/molecules/footer/Footer.stories.tsx diff --git a/src/design-system/molecules/footer/Footer.styled.ts b/packages/design-system/molecules/footer/Footer.styled.ts similarity index 81% rename from src/design-system/molecules/footer/Footer.styled.ts rename to packages/design-system/molecules/footer/Footer.styled.ts index 5703e4a..7a9cef0 100644 --- a/src/design-system/molecules/footer/Footer.styled.ts +++ b/packages/design-system/molecules/footer/Footer.styled.ts @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled from 'styled-components'; export const FooterWrapper = styled.div` diff --git a/src/design-system/molecules/footer/Footer.tsx b/packages/design-system/molecules/footer/Footer.tsx similarity index 92% rename from src/design-system/molecules/footer/Footer.tsx rename to packages/design-system/molecules/footer/Footer.tsx index 4b33e53..eaf82e2 100644 --- a/src/design-system/molecules/footer/Footer.tsx +++ b/packages/design-system/molecules/footer/Footer.tsx @@ -1,6 +1,6 @@ +import { AmbientLarge } from '@roleypoly/design-system/atoms/typography'; import * as React from 'react'; import { FaHeart } from 'react-icons/fa'; -import { AmbientLarge } from 'roleypoly/design-system/atoms/typography'; import { Flags } from './Flags'; import { FooterWrapper, HoverColor } from './Footer.styled'; diff --git a/src/design-system/molecules/footer/index.ts b/packages/design-system/molecules/footer/index.ts similarity index 100% rename from src/design-system/molecules/footer/index.ts rename to packages/design-system/molecules/footer/index.ts diff --git a/src/design-system/molecules/guild-nav/GuildNav.stories.tsx b/packages/design-system/molecules/guild-nav/GuildNav.stories.tsx similarity index 72% rename from src/design-system/molecules/guild-nav/GuildNav.stories.tsx rename to packages/design-system/molecules/guild-nav/GuildNav.stories.tsx index 6b794ea..03a1748 100644 --- a/src/design-system/molecules/guild-nav/GuildNav.stories.tsx +++ b/packages/design-system/molecules/guild-nav/GuildNav.stories.tsx @@ -1,6 +1,6 @@ +import { PopoverBase } from '@roleypoly/design-system/atoms/popover/Popover.styled'; import * as React from 'react'; -import { mastheadSlugs } from 'roleypoly/common/types/storyData'; -import { PopoverBase } from 'roleypoly/design-system/atoms/popover/Popover.styled'; +import { mastheadSlugs } from '../../fixtures/storyData'; import { GuildNav } from './GuildNav'; export default { diff --git a/src/design-system/molecules/guild-nav/GuildNav.styled.ts b/packages/design-system/molecules/guild-nav/GuildNav.styled.ts similarity index 76% rename from src/design-system/molecules/guild-nav/GuildNav.styled.ts rename to packages/design-system/molecules/guild-nav/GuildNav.styled.ts index a8de1f8..3a39576 100644 --- a/src/design-system/molecules/guild-nav/GuildNav.styled.ts +++ b/packages/design-system/molecules/guild-nav/GuildNav.styled.ts @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled from 'styled-components'; export const GuildNavItem = styled.a` diff --git a/src/design-system/molecules/guild-nav/GuildNav.tsx b/packages/design-system/molecules/guild-nav/GuildNav.tsx similarity index 70% rename from src/design-system/molecules/guild-nav/GuildNav.tsx rename to packages/design-system/molecules/guild-nav/GuildNav.tsx index d085a39..c6b36a4 100644 --- a/src/design-system/molecules/guild-nav/GuildNav.tsx +++ b/packages/design-system/molecules/guild-nav/GuildNav.tsx @@ -1,11 +1,10 @@ -import Link from 'next/link'; +import { NavSlug } from '@roleypoly/design-system/molecules/nav-slug'; +import { sortBy } from '@roleypoly/misc-utils/sortBy'; +import { GuildSlug, UserGuildPermissions } from '@roleypoly/types'; import * as React from 'react'; import Scrollbars from 'react-custom-scrollbars'; import { GoStar, GoZap } from 'react-icons/go'; import ReactTooltip from 'react-tooltip'; -import { GuildSlug, UserGuildPermissions } from 'roleypoly/common/types'; -import { sortBy } from 'roleypoly/common/utils/sortBy'; -import { NavSlug } from 'roleypoly/design-system/molecules/nav-slug'; import { GuildNavItem } from './GuildNav.styled'; type Props = { @@ -39,12 +38,10 @@ export const GuildNav = (props: Props) => ( {sortBy(props.guilds, 'name', (a: string, b: string) => a.toLowerCase() > b.toLowerCase() ? 1 : -1 ).map((guild) => ( - - - - - - + + + + ))} diff --git a/src/design-system/molecules/guild-nav/index.ts b/packages/design-system/molecules/guild-nav/index.ts similarity index 100% rename from src/design-system/molecules/guild-nav/index.ts rename to packages/design-system/molecules/guild-nav/index.ts diff --git a/src/design-system/molecules/help-page-base/BUILD.bazel b/packages/design-system/molecules/help-page-base/BUILD.bazel similarity index 100% rename from src/design-system/molecules/help-page-base/BUILD.bazel rename to packages/design-system/molecules/help-page-base/BUILD.bazel diff --git a/src/design-system/molecules/help-page-base/HelpPageBase.stories.tsx b/packages/design-system/molecules/help-page-base/HelpPageBase.stories.tsx similarity index 100% rename from src/design-system/molecules/help-page-base/HelpPageBase.stories.tsx rename to packages/design-system/molecules/help-page-base/HelpPageBase.stories.tsx diff --git a/src/design-system/molecules/help-page-base/HelpPageBase.tsx b/packages/design-system/molecules/help-page-base/HelpPageBase.tsx similarity index 87% rename from src/design-system/molecules/help-page-base/HelpPageBase.tsx rename to packages/design-system/molecules/help-page-base/HelpPageBase.tsx index 6e71227..d0de4c5 100644 --- a/src/design-system/molecules/help-page-base/HelpPageBase.tsx +++ b/packages/design-system/molecules/help-page-base/HelpPageBase.tsx @@ -1,5 +1,5 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; import * as React from 'react'; -import { palette } from 'roleypoly/design-system/atoms/colors'; import styled from 'styled-components'; export type HelpPageProps = { diff --git a/src/design-system/molecules/help-page-base/index.ts b/packages/design-system/molecules/help-page-base/index.ts similarity index 100% rename from src/design-system/molecules/help-page-base/index.ts rename to packages/design-system/molecules/help-page-base/index.ts diff --git a/src/design-system/molecules/help-page-base/storyDecorator.tsx b/packages/design-system/molecules/help-page-base/storyDecorator.tsx similarity index 72% rename from src/design-system/molecules/help-page-base/storyDecorator.tsx rename to packages/design-system/molecules/help-page-base/storyDecorator.tsx index a6c9426..9be79c8 100644 --- a/src/design-system/molecules/help-page-base/storyDecorator.tsx +++ b/packages/design-system/molecules/help-page-base/storyDecorator.tsx @@ -1,5 +1,5 @@ +import { Content } from '@roleypoly/design-system/organisms/app-shell/AppShell.styled'; import * as React from 'react'; -import { Content } from 'roleypoly/design-system/organisms/app-shell/AppShell.styled'; import { HelpPageBase } from './HelpPageBase'; export const HelpStoryWrapper = (storyFn: any): React.ReactNode => ( diff --git a/src/design-system/molecules/nav-slug/NavSlug.stories.tsx b/packages/design-system/molecules/nav-slug/NavSlug.stories.tsx similarity index 81% rename from src/design-system/molecules/nav-slug/NavSlug.stories.tsx rename to packages/design-system/molecules/nav-slug/NavSlug.stories.tsx index bfd1f34..95ef929 100644 --- a/src/design-system/molecules/nav-slug/NavSlug.stories.tsx +++ b/packages/design-system/molecules/nav-slug/NavSlug.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { guild } from 'roleypoly/common/types/storyData'; +import { guild } from '../../fixtures/storyData'; import { NavSlug } from './NavSlug'; export default { diff --git a/src/design-system/molecules/nav-slug/NavSlug.styled.ts b/packages/design-system/molecules/nav-slug/NavSlug.styled.ts similarity index 100% rename from src/design-system/molecules/nav-slug/NavSlug.styled.ts rename to packages/design-system/molecules/nav-slug/NavSlug.styled.ts diff --git a/src/design-system/molecules/nav-slug/NavSlug.tsx b/packages/design-system/molecules/nav-slug/NavSlug.tsx similarity index 86% rename from src/design-system/molecules/nav-slug/NavSlug.tsx rename to packages/design-system/molecules/nav-slug/NavSlug.tsx index 95f2b41..b1b74fb 100644 --- a/src/design-system/molecules/nav-slug/NavSlug.tsx +++ b/packages/design-system/molecules/nav-slug/NavSlug.tsx @@ -1,7 +1,7 @@ +import { Avatar, utils } from '@roleypoly/design-system/atoms/avatar'; +import { GuildSlug } from '@roleypoly/types'; import * as React from 'react'; import { GoOrganization } from 'react-icons/go'; -import { GuildSlug } from 'roleypoly/common/types'; -import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar'; import { SlugContainer, SlugName } from './NavSlug.styled'; type Props = { diff --git a/src/design-system/molecules/nav-slug/index.ts b/packages/design-system/molecules/nav-slug/index.ts similarity index 100% rename from src/design-system/molecules/nav-slug/index.ts rename to packages/design-system/molecules/nav-slug/index.ts diff --git a/src/design-system/molecules/picker-category/PickerCategory.stories.tsx b/packages/design-system/molecules/picker-category/PickerCategory.stories.tsx similarity index 87% rename from src/design-system/molecules/picker-category/PickerCategory.stories.tsx rename to packages/design-system/molecules/picker-category/PickerCategory.stories.tsx index 2514778..43766dd 100644 --- a/src/design-system/molecules/picker-category/PickerCategory.stories.tsx +++ b/packages/design-system/molecules/picker-category/PickerCategory.stories.tsx @@ -1,9 +1,5 @@ import * as React from 'react'; -import { - mockCategory, - roleCategory, - roleWikiData, -} from 'roleypoly/common/types/storyData'; +import { mockCategory, roleCategory, roleWikiData } from '../../fixtures/storyData'; import { PickerCategory } from './PickerCategory'; export default { diff --git a/src/design-system/molecules/picker-category/PickerCategory.styled.tsx b/packages/design-system/molecules/picker-category/PickerCategory.styled.tsx similarity index 100% rename from src/design-system/molecules/picker-category/PickerCategory.styled.tsx rename to packages/design-system/molecules/picker-category/PickerCategory.styled.tsx diff --git a/src/design-system/molecules/picker-category/PickerCategory.tsx b/packages/design-system/molecules/picker-category/PickerCategory.tsx similarity index 84% rename from src/design-system/molecules/picker-category/PickerCategory.tsx rename to packages/design-system/molecules/picker-category/PickerCategory.tsx index 07c4b1a..942a157 100644 --- a/src/design-system/molecules/picker-category/PickerCategory.tsx +++ b/packages/design-system/molecules/picker-category/PickerCategory.tsx @@ -1,13 +1,9 @@ +import { Role } from '@roleypoly/design-system/atoms/role'; +import { AmbientLarge, LargeText } from '@roleypoly/design-system/atoms/typography'; +import { sortBy } from '@roleypoly/misc-utils/sortBy'; +import { Category as RPCCategory, Role as RPCRole, RoleSafety } from '@roleypoly/types'; import * as React from 'react'; import ReactTooltip from 'react-tooltip'; -import { - Category as RPCCategory, - Role as RPCRole, - RoleSafety, -} from 'roleypoly/common/types'; -import { sortBy } from 'roleypoly/common/utils/sortBy'; -import { Role } from 'roleypoly/design-system/atoms/role'; -import { AmbientLarge, LargeText } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { Head, HeadSub, HeadTitle } from './PickerCategory.styled'; diff --git a/src/design-system/molecules/picker-category/index.ts b/packages/design-system/molecules/picker-category/index.ts similarity index 100% rename from src/design-system/molecules/picker-category/index.ts rename to packages/design-system/molecules/picker-category/index.ts diff --git a/src/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx b/packages/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx similarity index 82% rename from src/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx rename to packages/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx index 668b7e7..9ac97f7 100644 --- a/src/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx +++ b/packages/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { mastheadSlugs } from 'roleypoly/common/types/storyData'; +import { mastheadSlugs } from '../../fixtures/storyData'; import { PreauthGreeting } from './PreauthGreeting'; export default { diff --git a/src/design-system/molecules/preauth-greeting/PreauthGreeting.tsx b/packages/design-system/molecules/preauth-greeting/PreauthGreeting.tsx similarity index 76% rename from src/design-system/molecules/preauth-greeting/PreauthGreeting.tsx rename to packages/design-system/molecules/preauth-greeting/PreauthGreeting.tsx index 687f19d..ef6da19 100644 --- a/src/design-system/molecules/preauth-greeting/PreauthGreeting.tsx +++ b/packages/design-system/molecules/preauth-greeting/PreauthGreeting.tsx @@ -1,8 +1,8 @@ +import { Avatar, utils as avatarUtils } from '@roleypoly/design-system/atoms/avatar'; +import { Space } from '@roleypoly/design-system/atoms/space'; +import { AccentTitle } from '@roleypoly/design-system/atoms/typography'; +import { GuildSlug } from '@roleypoly/types'; import * as React from 'react'; -import { GuildSlug } from 'roleypoly/common/types'; -import { Avatar, utils as avatarUtils } from 'roleypoly/design-system/atoms/avatar'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { AccentTitle } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; type GreetingProps = { diff --git a/src/design-system/molecules/preauth-greeting/index.ts b/packages/design-system/molecules/preauth-greeting/index.ts similarity index 100% rename from src/design-system/molecules/preauth-greeting/index.ts rename to packages/design-system/molecules/preauth-greeting/index.ts diff --git a/src/design-system/molecules/reset-submit/ResetSubmit.spec.tsx b/packages/design-system/molecules/reset-submit/ResetSubmit.spec.tsx similarity index 90% rename from src/design-system/molecules/reset-submit/ResetSubmit.spec.tsx rename to packages/design-system/molecules/reset-submit/ResetSubmit.spec.tsx index 74437e3..3a2c27e 100644 --- a/src/design-system/molecules/reset-submit/ResetSubmit.spec.tsx +++ b/packages/design-system/molecules/reset-submit/ResetSubmit.spec.tsx @@ -1,6 +1,6 @@ +import { Button } from '@roleypoly/design-system/atoms/button'; import { shallow } from 'enzyme'; import * as React from 'react'; -import { Button } from 'roleypoly/design-system/atoms/button'; import { ResetSubmit } from './ResetSubmit'; const onReset = jest.fn(); diff --git a/src/design-system/molecules/reset-submit/ResetSubmit.stories.tsx b/packages/design-system/molecules/reset-submit/ResetSubmit.stories.tsx similarity index 100% rename from src/design-system/molecules/reset-submit/ResetSubmit.stories.tsx rename to packages/design-system/molecules/reset-submit/ResetSubmit.stories.tsx diff --git a/src/design-system/molecules/reset-submit/ResetSubmit.styled.ts b/packages/design-system/molecules/reset-submit/ResetSubmit.styled.ts similarity index 78% rename from src/design-system/molecules/reset-submit/ResetSubmit.styled.ts rename to packages/design-system/molecules/reset-submit/ResetSubmit.styled.ts index b21f6e8..fb626ce 100644 --- a/src/design-system/molecules/reset-submit/ResetSubmit.styled.ts +++ b/packages/design-system/molecules/reset-submit/ResetSubmit.styled.ts @@ -1,4 +1,4 @@ -import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints'; +import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints'; import styled from 'styled-components'; export const Buttons = styled.div` diff --git a/src/design-system/molecules/reset-submit/ResetSubmit.tsx b/packages/design-system/molecules/reset-submit/ResetSubmit.tsx similarity index 84% rename from src/design-system/molecules/reset-submit/ResetSubmit.tsx rename to packages/design-system/molecules/reset-submit/ResetSubmit.tsx index 4fc8f6a..0fe35b3 100644 --- a/src/design-system/molecules/reset-submit/ResetSubmit.tsx +++ b/packages/design-system/molecules/reset-submit/ResetSubmit.tsx @@ -1,7 +1,7 @@ +import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints'; +import { Button } from '@roleypoly/design-system/atoms/button'; import * as React from 'react'; import { MdRestore } from 'react-icons/md'; -import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints'; -import { Button } from 'roleypoly/design-system/atoms/button'; import styled from 'styled-components'; type Props = { diff --git a/src/design-system/molecules/reset-submit/index.ts b/packages/design-system/molecules/reset-submit/index.ts similarity index 100% rename from src/design-system/molecules/reset-submit/index.ts rename to packages/design-system/molecules/reset-submit/index.ts diff --git a/src/design-system/molecules/role-search/RoleSearch.stories.tsx b/packages/design-system/molecules/role-search/RoleSearch.stories.tsx similarity index 81% rename from src/design-system/molecules/role-search/RoleSearch.stories.tsx rename to packages/design-system/molecules/role-search/RoleSearch.stories.tsx index 89b3ada..39d30d7 100644 --- a/src/design-system/molecules/role-search/RoleSearch.stories.tsx +++ b/packages/design-system/molecules/role-search/RoleSearch.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { roleCategory } from 'roleypoly/common/types/storyData'; +import { roleCategory } from '../../fixtures/storyData'; import { RoleSearch } from './RoleSearch'; export default { diff --git a/src/design-system/molecules/role-search/RoleSearch.tsx b/packages/design-system/molecules/role-search/RoleSearch.tsx similarity index 85% rename from src/design-system/molecules/role-search/RoleSearch.tsx rename to packages/design-system/molecules/role-search/RoleSearch.tsx index 30c7bcc..397f8fb 100644 --- a/src/design-system/molecules/role-search/RoleSearch.tsx +++ b/packages/design-system/molecules/role-search/RoleSearch.tsx @@ -1,10 +1,10 @@ +import { Role } from '@roleypoly/design-system/atoms/role'; +import { Space } from '@roleypoly/design-system/atoms/space'; +import { TextInputWithIcon } from '@roleypoly/design-system/atoms/text-input'; +import { Role as RoleType } from '@roleypoly/types'; import Fuse from 'fuse.js'; import * as React from 'react'; import { GoSearch } from 'react-icons/go'; -import { Role as RoleType } from 'roleypoly/common/types'; -import { Role } from 'roleypoly/design-system/atoms/role'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { TextInputWithIcon } from 'roleypoly/design-system/atoms/text-input'; import styled from 'styled-components'; type Props = { diff --git a/src/design-system/molecules/role-search/index.ts b/packages/design-system/molecules/role-search/index.ts similarity index 100% rename from src/design-system/molecules/role-search/index.ts rename to packages/design-system/molecules/role-search/index.ts diff --git a/src/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx b/packages/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx similarity index 82% rename from src/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx rename to packages/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx index b67e35d..1ef9c86 100644 --- a/src/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx +++ b/packages/design-system/molecules/server-listing-card/ServerListingCard.stories.tsx @@ -1,4 +1,4 @@ -import { roleypolyGuild } from 'roleypoly/common/types/storyData'; +import { roleypolyGuild } from '../../fixtures/storyData'; import { ServerListingCard } from './ServerListingCard'; export default { diff --git a/src/design-system/molecules/server-listing-card/ServerListingCard.styled.ts b/packages/design-system/molecules/server-listing-card/ServerListingCard.styled.ts similarity index 86% rename from src/design-system/molecules/server-listing-card/ServerListingCard.styled.ts rename to packages/design-system/molecules/server-listing-card/ServerListingCard.styled.ts index 8b7a994..4d76752 100644 --- a/src/design-system/molecules/server-listing-card/ServerListingCard.styled.ts +++ b/packages/design-system/molecules/server-listing-card/ServerListingCard.styled.ts @@ -1,7 +1,7 @@ -import { onSmallScreen, onTablet } from 'roleypoly/design-system/atoms/breakpoints'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; -import { text200, text500 } from 'roleypoly/design-system/atoms/typography'; +import { onSmallScreen, onTablet } from '@roleypoly/design-system/atoms/breakpoints'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; +import { text200, text500 } from '@roleypoly/design-system/atoms/typography'; import styled, { css } from 'styled-components'; export const CardLine = styled.div<{ left?: boolean }>` diff --git a/src/design-system/molecules/server-listing-card/ServerListingCard.tsx b/packages/design-system/molecules/server-listing-card/ServerListingCard.tsx similarity index 88% rename from src/design-system/molecules/server-listing-card/ServerListingCard.tsx rename to packages/design-system/molecules/server-listing-card/ServerListingCard.tsx index 22b7bec..f3ea336 100644 --- a/src/design-system/molecules/server-listing-card/ServerListingCard.tsx +++ b/packages/design-system/molecules/server-listing-card/ServerListingCard.tsx @@ -1,8 +1,8 @@ +import { Avatar, utils } from '@roleypoly/design-system/atoms/avatar'; +import { Collapse } from '@roleypoly/design-system/atoms/collapse'; +import { GuildSlug, UserGuildPermissions } from '@roleypoly/types'; import * as React from 'react'; import { GoPerson, GoStar, GoZap } from 'react-icons/go'; -import { GuildSlug, UserGuildPermissions } from 'roleypoly/common/types'; -import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar'; -import { Collapse } from 'roleypoly/design-system/atoms/collapse'; import { CardBase, CardLine, diff --git a/src/design-system/molecules/server-listing-card/index.ts b/packages/design-system/molecules/server-listing-card/index.ts similarity index 100% rename from src/design-system/molecules/server-listing-card/index.ts rename to packages/design-system/molecules/server-listing-card/index.ts diff --git a/src/design-system/molecules/server-masthead/ServerMasthead.spec.tsx b/packages/design-system/molecules/server-masthead/ServerMasthead.spec.tsx similarity index 90% rename from src/design-system/molecules/server-masthead/ServerMasthead.spec.tsx rename to packages/design-system/molecules/server-masthead/ServerMasthead.spec.tsx index 757cc9f..9b88e05 100644 --- a/src/design-system/molecules/server-masthead/ServerMasthead.spec.tsx +++ b/packages/design-system/molecules/server-masthead/ServerMasthead.spec.tsx @@ -2,7 +2,7 @@ jest.unmock('./ServerMasthead'); import { shallow } from 'enzyme'; import * as React from 'react'; -import { mastheadSlugs } from 'roleypoly/common/types/storyData'; +import { mastheadSlugs } from '../../fixtures/storyData'; import { ServerMasthead } from './ServerMasthead'; import { Editable } from './ServerMasthead.styled'; diff --git a/src/design-system/molecules/server-masthead/ServerMasthead.stories.tsx b/packages/design-system/molecules/server-masthead/ServerMasthead.stories.tsx similarity index 86% rename from src/design-system/molecules/server-masthead/ServerMasthead.stories.tsx rename to packages/design-system/molecules/server-masthead/ServerMasthead.stories.tsx index 0b0d409..251c28f 100644 --- a/src/design-system/molecules/server-masthead/ServerMasthead.stories.tsx +++ b/packages/design-system/molecules/server-masthead/ServerMasthead.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { guild } from 'roleypoly/common/types/storyData'; +import { guild } from '../../fixtures/storyData'; import { ServerMasthead } from './ServerMasthead'; export default { diff --git a/src/design-system/molecules/server-masthead/ServerMasthead.styled.ts b/packages/design-system/molecules/server-masthead/ServerMasthead.styled.ts similarity index 84% rename from src/design-system/molecules/server-masthead/ServerMasthead.styled.ts rename to packages/design-system/molecules/server-masthead/ServerMasthead.styled.ts index 107d931..db04146 100644 --- a/src/design-system/molecules/server-masthead/ServerMasthead.styled.ts +++ b/packages/design-system/molecules/server-masthead/ServerMasthead.styled.ts @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled from 'styled-components'; export const Wrapper = styled.div` diff --git a/src/design-system/molecules/server-masthead/ServerMasthead.tsx b/packages/design-system/molecules/server-masthead/ServerMasthead.tsx similarity index 75% rename from src/design-system/molecules/server-masthead/ServerMasthead.tsx rename to packages/design-system/molecules/server-masthead/ServerMasthead.tsx index bed98af..53712d9 100644 --- a/src/design-system/molecules/server-masthead/ServerMasthead.tsx +++ b/packages/design-system/molecules/server-masthead/ServerMasthead.tsx @@ -1,9 +1,8 @@ -import Link from 'next/link'; +import { Avatar, utils } from '@roleypoly/design-system/atoms/avatar'; +import { AccentTitle, AmbientLarge } from '@roleypoly/design-system/atoms/typography'; +import { GuildSlug } from '@roleypoly/types'; import * as React from 'react'; import { GoPencil } from 'react-icons/go'; -import { GuildSlug } from 'roleypoly/common/types'; -import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar'; -import { AccentTitle, AmbientLarge } from 'roleypoly/design-system/atoms/typography'; import { Editable, Icon, Name, Wrapper } from './ServerMasthead.styled'; export type ServerMastheadProps = { @@ -26,12 +25,12 @@ export const ServerMasthead = (props: ServerMastheadProps) => { {props.guild.name} {props.editable && ( - +   Edit Server - + )} diff --git a/src/design-system/molecules/server-masthead/index.ts b/packages/design-system/molecules/server-masthead/index.ts similarity index 100% rename from src/design-system/molecules/server-masthead/index.ts rename to packages/design-system/molecules/server-masthead/index.ts diff --git a/src/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx b/packages/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx similarity index 74% rename from src/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx rename to packages/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx index fdafb00..973c986 100644 --- a/src/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx +++ b/packages/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx @@ -1,6 +1,6 @@ +import { Hero } from '@roleypoly/design-system/atoms/hero'; import * as React from 'react'; -import { user } from 'roleypoly/common/types/storyData'; -import { Hero } from 'roleypoly/design-system/atoms/hero'; +import { user } from '../../fixtures/storyData'; import { UserAvatarGroup } from './UserAvatarGroup'; export default { diff --git a/src/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts b/packages/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts similarity index 80% rename from src/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts rename to packages/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts index df35271..3ed5614 100644 --- a/src/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts +++ b/packages/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts @@ -1,5 +1,5 @@ -import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints'; -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints'; +import { palette } from '@roleypoly/design-system/atoms/colors'; import styled, { css } from 'styled-components'; export const Collapse = styled.div<{ preventCollapse: boolean }>` diff --git a/src/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx b/packages/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx similarity index 86% rename from src/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx rename to packages/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx index 7640749..9f7e60d 100644 --- a/src/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx +++ b/packages/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx @@ -1,6 +1,6 @@ +import { Avatar, utils } from '@roleypoly/design-system/atoms/avatar'; +import { DiscordUser } from '@roleypoly/types'; import * as React from 'react'; -import { DiscordUser } from 'roleypoly/common/types'; -import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar'; import { Collapse, Discriminator, Group, GroupText } from './UserAvatarGroup.styled'; type Props = { diff --git a/src/design-system/molecules/user-avatar-group/index.ts b/packages/design-system/molecules/user-avatar-group/index.ts similarity index 100% rename from src/design-system/molecules/user-avatar-group/index.ts rename to packages/design-system/molecules/user-avatar-group/index.ts diff --git a/src/design-system/molecules/user-popover/UserPopover.stories.tsx b/packages/design-system/molecules/user-popover/UserPopover.stories.tsx similarity index 71% rename from src/design-system/molecules/user-popover/UserPopover.stories.tsx rename to packages/design-system/molecules/user-popover/UserPopover.stories.tsx index 6d3aa69..a8eb7a5 100644 --- a/src/design-system/molecules/user-popover/UserPopover.stories.tsx +++ b/packages/design-system/molecules/user-popover/UserPopover.stories.tsx @@ -1,6 +1,6 @@ +import { PopoverBase } from '@roleypoly/design-system/atoms/popover/Popover.styled'; import * as React from 'react'; -import { user } from 'roleypoly/common/types/storyData'; -import { PopoverBase } from 'roleypoly/design-system/atoms/popover/Popover.styled'; +import { user } from '../../fixtures/storyData'; import { UserPopover as UserPopoverComponent } from './UserPopover'; export default { diff --git a/src/design-system/molecules/user-popover/UserPopover.styled.ts b/packages/design-system/molecules/user-popover/UserPopover.styled.ts similarity index 82% rename from src/design-system/molecules/user-popover/UserPopover.styled.ts rename to packages/design-system/molecules/user-popover/UserPopover.styled.ts index d8fc05b..ede63ff 100644 --- a/src/design-system/molecules/user-popover/UserPopover.styled.ts +++ b/packages/design-system/molecules/user-popover/UserPopover.styled.ts @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled from 'styled-components'; export const Base = styled.div` diff --git a/src/design-system/molecules/user-popover/UserPopover.tsx b/packages/design-system/molecules/user-popover/UserPopover.tsx similarity index 62% rename from src/design-system/molecules/user-popover/UserPopover.tsx rename to packages/design-system/molecules/user-popover/UserPopover.tsx index c747535..ce9e1de 100644 --- a/src/design-system/molecules/user-popover/UserPopover.tsx +++ b/packages/design-system/molecules/user-popover/UserPopover.tsx @@ -1,9 +1,8 @@ -import Link from 'next/link'; +import { CompletelyStylelessLink } from '@roleypoly/design-system/atoms/typography'; +import { UserAvatarGroup } from '@roleypoly/design-system/molecules/user-avatar-group'; +import { DiscordUser } from '@roleypoly/types'; import * as React from 'react'; import { GoGear, GoSignOut } from 'react-icons/go'; -import { DiscordUser } from 'roleypoly/common/types'; -import { CompletelyStylelessLink } from 'roleypoly/design-system/atoms/typography'; -import { UserAvatarGroup } from 'roleypoly/design-system/molecules/user-avatar-group'; import { Base, NavAction } from './UserPopover.styled'; type UserPopoverProps = { @@ -14,18 +13,18 @@ export const UserPopover = (props: UserPopoverProps) => ( - + Settings - + - + Log Out - + ); diff --git a/src/design-system/molecules/user-popover/index.ts b/packages/design-system/molecules/user-popover/index.ts similarity index 100% rename from src/design-system/molecules/user-popover/index.ts rename to packages/design-system/molecules/user-popover/index.ts diff --git a/src/design-system/organisms/app-shell/AppShell.stories.tsx b/packages/design-system/organisms/app-shell/AppShell.stories.tsx similarity index 84% rename from src/design-system/organisms/app-shell/AppShell.stories.tsx rename to packages/design-system/organisms/app-shell/AppShell.stories.tsx index d87d51d..4b3fca6 100644 --- a/src/design-system/organisms/app-shell/AppShell.stories.tsx +++ b/packages/design-system/organisms/app-shell/AppShell.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { mastheadSlugs, user } from 'roleypoly/common/types/storyData'; +import { mastheadSlugs, user } from '../../fixtures/storyData'; import { AppShell } from './AppShell'; export default { diff --git a/src/design-system/organisms/app-shell/AppShell.styled.tsx b/packages/design-system/organisms/app-shell/AppShell.styled.tsx similarity index 81% rename from src/design-system/organisms/app-shell/AppShell.styled.tsx rename to packages/design-system/organisms/app-shell/AppShell.styled.tsx index aa0e814..0ad40d9 100644 --- a/src/design-system/organisms/app-shell/AppShell.styled.tsx +++ b/packages/design-system/organisms/app-shell/AppShell.styled.tsx @@ -1,5 +1,5 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { fontCSS } from 'roleypoly/design-system/atoms/fonts'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { fontCSS } from '@roleypoly/design-system/atoms/fonts'; import styled, { createGlobalStyle } from 'styled-components'; export const Content = styled.div<{ small?: boolean }>` diff --git a/src/design-system/organisms/app-shell/AppShell.tsx b/packages/design-system/organisms/app-shell/AppShell.tsx similarity index 79% rename from src/design-system/organisms/app-shell/AppShell.tsx rename to packages/design-system/organisms/app-shell/AppShell.tsx index 8c4eea8..c724e4e 100644 --- a/src/design-system/organisms/app-shell/AppShell.tsx +++ b/packages/design-system/organisms/app-shell/AppShell.tsx @@ -1,9 +1,9 @@ +import { GlobalStyleColors } from '@roleypoly/design-system/atoms/colors'; +import { Footer } from '@roleypoly/design-system/molecules/footer'; +import * as Masthead from '@roleypoly/design-system/organisms/masthead'; +import { DiscordUser, GuildSlug } from '@roleypoly/types'; import * as React from 'react'; import { Scrollbars } from 'react-custom-scrollbars'; -import { DiscordUser, GuildSlug } from 'roleypoly/common/types'; -import { GlobalStyleColors } from 'roleypoly/design-system/atoms/colors'; -import { Footer } from 'roleypoly/design-system/molecules/footer'; -import * as Masthead from 'roleypoly/design-system/organisms/masthead'; import { Content, GlobalStyles } from './AppShell.styled'; export type AppShellProps = { diff --git a/src/design-system/organisms/app-shell/index.ts b/packages/design-system/organisms/app-shell/index.ts similarity index 100% rename from src/design-system/organisms/app-shell/index.ts rename to packages/design-system/organisms/app-shell/index.ts diff --git a/src/design-system/organisms/editor/EditorShell.stories.tsx b/packages/design-system/organisms/editor/EditorShell.stories.tsx similarity index 79% rename from src/design-system/organisms/editor/EditorShell.stories.tsx rename to packages/design-system/organisms/editor/EditorShell.stories.tsx index 7496717..8e3bda5 100644 --- a/src/design-system/organisms/editor/EditorShell.stories.tsx +++ b/packages/design-system/organisms/editor/EditorShell.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { guildEnum } from 'roleypoly/common/types/storyData'; +import { guildEnum } from '../../fixtures/storyData'; import { EditorShell } from './EditorShell'; export default { diff --git a/src/design-system/organisms/editor/EditorShell.styled.ts b/packages/design-system/organisms/editor/EditorShell.styled.ts similarity index 72% rename from src/design-system/organisms/editor/EditorShell.styled.ts rename to packages/design-system/organisms/editor/EditorShell.styled.ts index cb3cbe8..0493a14 100644 --- a/src/design-system/organisms/editor/EditorShell.styled.ts +++ b/packages/design-system/organisms/editor/EditorShell.styled.ts @@ -1,4 +1,4 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { palette } from '@roleypoly/design-system/atoms/colors'; import styled from 'styled-components'; export const CategoryContainer = styled.div` diff --git a/src/design-system/organisms/editor/EditorShell.tsx b/packages/design-system/organisms/editor/EditorShell.tsx similarity index 87% rename from src/design-system/organisms/editor/EditorShell.tsx rename to packages/design-system/organisms/editor/EditorShell.tsx index e527b6a..e41b9b0 100644 --- a/src/design-system/organisms/editor/EditorShell.tsx +++ b/packages/design-system/organisms/editor/EditorShell.tsx @@ -1,6 +1,6 @@ +import { Tab, TabView } from '@roleypoly/design-system/atoms/tab-view'; +import { PresentableGuild } from '@roleypoly/types'; import * as React from 'react'; -import { PresentableGuild } from 'roleypoly/common/types'; -import { Tab, TabView } from 'roleypoly/design-system/atoms/tab-view'; import { EditorCategory } from '../../molecules/editor-category'; import { CategoryContainer } from './EditorShell.styled'; diff --git a/src/design-system/organisms/editor/index.ts b/packages/design-system/organisms/editor/index.ts similarity index 100% rename from src/design-system/organisms/editor/index.ts rename to packages/design-system/organisms/editor/index.ts diff --git a/src/design-system/organisms/help-why-no-roles/WhyNoRoles.stories.tsx b/packages/design-system/organisms/help-why-no-roles/WhyNoRoles.stories.tsx similarity index 100% rename from src/design-system/organisms/help-why-no-roles/WhyNoRoles.stories.tsx rename to packages/design-system/organisms/help-why-no-roles/WhyNoRoles.stories.tsx diff --git a/src/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts b/packages/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts similarity index 88% rename from src/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts rename to packages/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts index 2ee13bb..cc43819 100644 --- a/src/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts +++ b/packages/design-system/organisms/help-why-no-roles/WhyNoRoles.styled.ts @@ -1,5 +1,5 @@ -import { Role } from 'roleypoly/common/types'; -import { numberToChroma, palette } from 'roleypoly/design-system/atoms/colors'; +import { numberToChroma, palette } from '@roleypoly/design-system/atoms/colors'; +import { Role } from '@roleypoly/types'; import styled, { css } from 'styled-components'; export const DiscordBase = styled.div` diff --git a/src/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx b/packages/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx similarity index 86% rename from src/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx rename to packages/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx index 81c2307..e008e6b 100644 --- a/src/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx +++ b/packages/design-system/organisms/help-why-no-roles/WhyNoRoles.tsx @@ -1,11 +1,11 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { HalfsiesContainer, HalfsiesItem } from '@roleypoly/design-system/atoms/halfsies'; +import { SparkleOverlay } from '@roleypoly/design-system/atoms/sparkle'; +import { Role } from '@roleypoly/types'; +import { demoData } from '@roleypoly/types/demoData'; import chroma from 'chroma-js'; import * as React from 'react'; import { FaCheck, FaTimes } from 'react-icons/fa'; -import { Role } from 'roleypoly/common/types'; -import { demoData } from 'roleypoly/common/types/demoData'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { HalfsiesContainer, HalfsiesItem } from 'roleypoly/design-system/atoms/halfsies'; -import { SparkleOverlay } from 'roleypoly/design-system/atoms/sparkle'; import { DiscordBase, DiscordRole } from './WhyNoRoles.styled'; const adminRoles: Role[] = [ diff --git a/src/design-system/organisms/help-why-no-roles/index.ts b/packages/design-system/organisms/help-why-no-roles/index.ts similarity index 100% rename from src/design-system/organisms/help-why-no-roles/index.ts rename to packages/design-system/organisms/help-why-no-roles/index.ts diff --git a/src/design-system/organisms/landing/Landing.stories.tsx b/packages/design-system/organisms/landing/Landing.stories.tsx similarity index 100% rename from src/design-system/organisms/landing/Landing.stories.tsx rename to packages/design-system/organisms/landing/Landing.stories.tsx diff --git a/src/design-system/organisms/landing/Landing.styled.ts b/packages/design-system/organisms/landing/Landing.styled.ts similarity index 80% rename from src/design-system/organisms/landing/Landing.styled.ts rename to packages/design-system/organisms/landing/Landing.styled.ts index eb72c48..f80cc45 100644 --- a/src/design-system/organisms/landing/Landing.styled.ts +++ b/packages/design-system/organisms/landing/Landing.styled.ts @@ -1,5 +1,5 @@ -import { onTablet } from 'roleypoly/design-system/atoms/breakpoints'; -import { text400 } from 'roleypoly/design-system/atoms/typography'; +import { onTablet } from '@roleypoly/design-system/atoms/breakpoints'; +import { text400 } from '@roleypoly/design-system/atoms/typography'; import styled, { css } from 'styled-components'; export const HeroText = styled.div` diff --git a/src/design-system/organisms/landing/Landing.tsx b/packages/design-system/organisms/landing/Landing.tsx similarity index 71% rename from src/design-system/organisms/landing/Landing.tsx rename to packages/design-system/organisms/landing/Landing.tsx index 87b4409..46e79e7 100644 --- a/src/design-system/organisms/landing/Landing.tsx +++ b/packages/design-system/organisms/landing/Landing.tsx @@ -1,10 +1,10 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { HalfsiesContainer, HalfsiesItem } from '@roleypoly/design-system/atoms/halfsies'; +import { Space } from '@roleypoly/design-system/atoms/space'; +import { LargeText, LargeTitle } from '@roleypoly/design-system/atoms/typography'; +import { DemoDiscord } from '@roleypoly/design-system/molecules/demo-discord'; +import { DemoPicker } from '@roleypoly/design-system/molecules/demo-picker'; import * as React from 'react'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { HalfsiesContainer, HalfsiesItem } from 'roleypoly/design-system/atoms/halfsies'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { LargeText, LargeTitle } from 'roleypoly/design-system/atoms/typography'; -import { DemoDiscord } from 'roleypoly/design-system/molecules/demo-discord'; -import { DemoPicker } from 'roleypoly/design-system/molecules/demo-picker'; import { DemoAlignment, DemoSubtitle, HeroCentering, HeroText } from './Landing.styled'; export const Landing = () => ( diff --git a/src/design-system/organisms/landing/index.ts b/packages/design-system/organisms/landing/index.ts similarity index 100% rename from src/design-system/organisms/landing/index.ts rename to packages/design-system/organisms/landing/index.ts diff --git a/src/design-system/organisms/masthead/Authed.tsx b/packages/design-system/organisms/masthead/Authed.tsx similarity index 80% rename from src/design-system/organisms/masthead/Authed.tsx rename to packages/design-system/organisms/masthead/Authed.tsx index 5d5e34a..7b176cc 100644 --- a/src/design-system/organisms/masthead/Authed.tsx +++ b/packages/design-system/organisms/masthead/Authed.tsx @@ -1,13 +1,12 @@ -import Link from 'next/link'; +import { DynamicLogomark } from '@roleypoly/design-system/atoms/branding'; +import { Popover } from '@roleypoly/design-system/atoms/popover'; +import { GuildNav } from '@roleypoly/design-system/molecules/guild-nav'; +import { NavSlug } from '@roleypoly/design-system/molecules/nav-slug'; +import { UserAvatarGroup } from '@roleypoly/design-system/molecules/user-avatar-group'; +import { UserPopover } from '@roleypoly/design-system/molecules/user-popover'; +import { DiscordUser, GuildSlug } from '@roleypoly/types'; import * as React from 'react'; import { GoOrganization } from 'react-icons/go'; -import { DiscordUser, GuildSlug } from 'roleypoly/common/types'; -import { DynamicLogomark } from 'roleypoly/design-system/atoms/branding'; -import { Popover } from 'roleypoly/design-system/atoms/popover'; -import { GuildNav } from 'roleypoly/design-system/molecules/guild-nav'; -import { NavSlug } from 'roleypoly/design-system/molecules/nav-slug'; -import { UserAvatarGroup } from 'roleypoly/design-system/molecules/user-avatar-group'; -import { UserPopover } from 'roleypoly/design-system/molecules/user-popover'; import { GuildPopoverHead, InteractionBase, @@ -33,11 +32,9 @@ export const Authed = (props: Props) => { - - - - - + + + { if (!props.disableGuildPicker) { diff --git a/packages/design-system/organisms/masthead/Guest.tsx b/packages/design-system/organisms/masthead/Guest.tsx new file mode 100644 index 0000000..b475fdc --- /dev/null +++ b/packages/design-system/organisms/masthead/Guest.tsx @@ -0,0 +1,34 @@ +import { DynamicLogotype } from '@roleypoly/design-system/atoms/branding'; +import { Button } from '@roleypoly/design-system/atoms/button'; +import * as React from 'react'; +import { FaSignInAlt } from 'react-icons/fa'; +import { + MastheadA, + MastheadAlignment, + MastheadBase, + MastheadLeft, + MastheadRight, +} from './Masthead.styled'; + +export const Guest = () => ( + + + + + + + + + + + + + + +); diff --git a/src/design-system/organisms/masthead/Masthead.stories.tsx b/packages/design-system/organisms/masthead/Masthead.stories.tsx similarity index 83% rename from src/design-system/organisms/masthead/Masthead.stories.tsx rename to packages/design-system/organisms/masthead/Masthead.stories.tsx index bba1b9b..60f5468 100644 --- a/src/design-system/organisms/masthead/Masthead.stories.tsx +++ b/packages/design-system/organisms/masthead/Masthead.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { guild, mastheadSlugs, user } from 'roleypoly/common/types/storyData'; +import { guild, mastheadSlugs, user } from '../../fixtures/storyData'; import { Authed } from './Authed'; import { Guest } from './Guest'; diff --git a/src/design-system/organisms/masthead/Masthead.styled.tsx b/packages/design-system/organisms/masthead/Masthead.styled.tsx similarity index 89% rename from src/design-system/organisms/masthead/Masthead.styled.tsx rename to packages/design-system/organisms/masthead/Masthead.styled.tsx index a466d96..67ed556 100644 --- a/src/design-system/organisms/masthead/Masthead.styled.tsx +++ b/packages/design-system/organisms/masthead/Masthead.styled.tsx @@ -1,6 +1,6 @@ -import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints'; -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { transitions } from 'roleypoly/design-system/atoms/timings'; +import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { transitions } from '@roleypoly/design-system/atoms/timings'; import styled, { css } from 'styled-components'; export const MastheadBase = styled.div` diff --git a/src/design-system/organisms/masthead/index.ts b/packages/design-system/organisms/masthead/index.ts similarity index 100% rename from src/design-system/organisms/masthead/index.ts rename to packages/design-system/organisms/masthead/index.ts diff --git a/src/design-system/organisms/preauth/Preauth.stories.tsx b/packages/design-system/organisms/preauth/Preauth.stories.tsx similarity index 92% rename from src/design-system/organisms/preauth/Preauth.stories.tsx rename to packages/design-system/organisms/preauth/Preauth.stories.tsx index f2dbadc..9b50bb7 100644 --- a/src/design-system/organisms/preauth/Preauth.stories.tsx +++ b/packages/design-system/organisms/preauth/Preauth.stories.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { guild } from 'roleypoly/common/types/storyData'; import styled from 'styled-components'; +import { guild } from '../../fixtures/storyData'; import { Preauth } from './Preauth'; export default { diff --git a/src/design-system/organisms/preauth/Preauth.tsx b/packages/design-system/organisms/preauth/Preauth.tsx similarity index 78% rename from src/design-system/organisms/preauth/Preauth.tsx rename to packages/design-system/organisms/preauth/Preauth.tsx index cf412e7..96c9780 100644 --- a/src/design-system/organisms/preauth/Preauth.tsx +++ b/packages/design-system/organisms/preauth/Preauth.tsx @@ -1,9 +1,8 @@ -import Link from 'next/link'; +import { Button } from '@roleypoly/design-system/atoms/button'; +import { PreauthGreeting } from '@roleypoly/design-system/molecules/preauth-greeting'; +import { GuildSlug } from '@roleypoly/types'; import * as React from 'react'; import { FaDiscord } from 'react-icons/fa'; -import { GuildSlug } from 'roleypoly/common/types'; -import { Button } from 'roleypoly/design-system/atoms/button'; -import { PreauthGreeting } from 'roleypoly/design-system/molecules/preauth-greeting'; import styled from 'styled-components'; export type PreauthProps = { @@ -33,7 +32,7 @@ export const Preauth = (props: PreauthProps) => { {props.guildSlug && } - + - + ); diff --git a/src/design-system/organisms/preauth/index.ts b/packages/design-system/organisms/preauth/index.ts similarity index 100% rename from src/design-system/organisms/preauth/index.ts rename to packages/design-system/organisms/preauth/index.ts diff --git a/src/design-system/organisms/role-picker/RolePicker.spec.tsx b/packages/design-system/organisms/role-picker/RolePicker.spec.tsx similarity index 68% rename from src/design-system/organisms/role-picker/RolePicker.spec.tsx rename to packages/design-system/organisms/role-picker/RolePicker.spec.tsx index d09c907..bcf6bc7 100644 --- a/src/design-system/organisms/role-picker/RolePicker.spec.tsx +++ b/packages/design-system/organisms/role-picker/RolePicker.spec.tsx @@ -1,8 +1,11 @@ -jest.unmock('roleypoly/design-system/atoms/role') - .unmock('roleypoly/design-system/atoms/button') - .unmock('roleypoly/design-system/molecules/picker-category') - .unmock('roleypoly/design-system/organisms/role-picker'); +jest.unmock('@roleypoly/design-system/atoms/role') + .unmock('@roleypoly/design-system/atoms/button') + .unmock('@roleypoly/design-system/molecules/picker-category') + .unmock('@roleypoly/design-system/organisms/role-picker'); +import { Role } from '@roleypoly/design-system/atoms/role'; +import { PickerCategory } from '@roleypoly/design-system/molecules/picker-category'; +import { ResetSubmit } from '@roleypoly/design-system/molecules/reset-submit'; import { shallow } from 'enzyme'; import * as React from 'react'; import { @@ -12,10 +15,7 @@ import { mockCategorySingle, roleCategory, roleCategory2, -} from 'roleypoly/common/types/storyData'; -import { Role } from 'roleypoly/design-system/atoms/role'; -import { PickerCategory } from 'roleypoly/design-system/molecules/picker-category'; -import { ResetSubmit } from 'roleypoly/design-system/molecules/reset-submit'; +} from '../../fixtures/storyData'; import { RolePicker, RolePickerProps } from './RolePicker'; it('unselects the rest of a category in single mode', () => { diff --git a/src/design-system/organisms/role-picker/RolePicker.stories.tsx b/packages/design-system/organisms/role-picker/RolePicker.stories.tsx similarity index 96% rename from src/design-system/organisms/role-picker/RolePicker.stories.tsx rename to packages/design-system/organisms/role-picker/RolePicker.stories.tsx index bf95622..e34367a 100644 --- a/src/design-system/organisms/role-picker/RolePicker.stories.tsx +++ b/packages/design-system/organisms/role-picker/RolePicker.stories.tsx @@ -5,7 +5,7 @@ import { member, roleCategory, roleCategory2, -} from 'roleypoly/common/types/storyData'; +} from '../../fixtures/storyData'; import { RolePicker, RolePickerProps } from './RolePicker'; const props: Partial = { diff --git a/src/design-system/organisms/role-picker/RolePicker.styled.tsx b/packages/design-system/organisms/role-picker/RolePicker.styled.tsx similarity index 90% rename from src/design-system/organisms/role-picker/RolePicker.styled.tsx rename to packages/design-system/organisms/role-picker/RolePicker.styled.tsx index b4dfc7f..ec40c58 100644 --- a/src/design-system/organisms/role-picker/RolePicker.styled.tsx +++ b/packages/design-system/organisms/role-picker/RolePicker.styled.tsx @@ -1,4 +1,4 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { palette } from '@roleypoly/design-system/atoms/colors'; import styled from 'styled-components'; export const Container = styled.div``; diff --git a/src/design-system/organisms/role-picker/RolePicker.tsx b/packages/design-system/organisms/role-picker/RolePicker.tsx similarity index 84% rename from src/design-system/organisms/role-picker/RolePicker.tsx rename to packages/design-system/organisms/role-picker/RolePicker.tsx index 5461317..63c75ab 100644 --- a/src/design-system/organisms/role-picker/RolePicker.tsx +++ b/packages/design-system/organisms/role-picker/RolePicker.tsx @@ -1,7 +1,11 @@ -import { isEqual, xor } from 'lodash'; -import NextLink from 'next/link'; -import * as React from 'react'; -import { GoInfo } from 'react-icons/go'; +import { FaderOpacity } from '@roleypoly/design-system/atoms/fader'; +import { Space } from '@roleypoly/design-system/atoms/space'; +import { Link } from '@roleypoly/design-system/atoms/typography'; +import { PickerCategory } from '@roleypoly/design-system/molecules/picker-category'; +import { ResetSubmit } from '@roleypoly/design-system/molecules/reset-submit'; +import { ServerMasthead } from '@roleypoly/design-system/molecules/server-masthead'; +import { ReactifyNewlines } from '@roleypoly/misc-utils/ReactifyNewlines'; +import { sortBy } from '@roleypoly/misc-utils/sortBy'; import { Category, CategoryType, @@ -9,15 +13,10 @@ import { GuildSlug, Member, Role, -} from 'roleypoly/common/types'; -import { ReactifyNewlines } from 'roleypoly/common/utils/ReactifyNewlines'; -import { sortBy } from 'roleypoly/common/utils/sortBy'; -import { FaderOpacity } from 'roleypoly/design-system/atoms/fader'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { Link } from 'roleypoly/design-system/atoms/typography'; -import { PickerCategory } from 'roleypoly/design-system/molecules/picker-category'; -import { ResetSubmit } from 'roleypoly/design-system/molecules/reset-submit'; -import { ServerMasthead } from 'roleypoly/design-system/molecules/server-masthead'; +} from '@roleypoly/types'; +import { isEqual, xor } from 'lodash'; +import * as React from 'react'; +import { GoInfo } from 'react-icons/go'; import { CategoryContainer, Container, @@ -139,13 +138,9 @@ export const RolePicker = (props: RolePickerProps) => { {props.editable && ( <> {' '} - + Add some roles! - + )} diff --git a/src/design-system/organisms/role-picker/index.ts b/packages/design-system/organisms/role-picker/index.ts similarity index 100% rename from src/design-system/organisms/role-picker/index.ts rename to packages/design-system/organisms/role-picker/index.ts diff --git a/src/design-system/organisms/server-setup/ServerSetup.stories.tsx b/packages/design-system/organisms/server-setup/ServerSetup.stories.tsx similarity index 81% rename from src/design-system/organisms/server-setup/ServerSetup.stories.tsx rename to packages/design-system/organisms/server-setup/ServerSetup.stories.tsx index 0d61e98..be8e037 100644 --- a/src/design-system/organisms/server-setup/ServerSetup.stories.tsx +++ b/packages/design-system/organisms/server-setup/ServerSetup.stories.tsx @@ -1,5 +1,5 @@ -import { UserGuildPermissions } from 'roleypoly/common/types'; -import { mastheadSlugs } from 'roleypoly/common/types/storyData'; +import { UserGuildPermissions } from '@roleypoly/types'; +import { mastheadSlugs } from '../../fixtures/storyData'; import { ServerSetup } from './ServerSetup'; export default { diff --git a/src/design-system/organisms/server-setup/ServerSetup.styled.ts b/packages/design-system/organisms/server-setup/ServerSetup.styled.ts similarity index 100% rename from src/design-system/organisms/server-setup/ServerSetup.styled.ts rename to packages/design-system/organisms/server-setup/ServerSetup.styled.ts diff --git a/src/design-system/organisms/server-setup/ServerSetup.tsx b/packages/design-system/organisms/server-setup/ServerSetup.tsx similarity index 69% rename from src/design-system/organisms/server-setup/ServerSetup.tsx rename to packages/design-system/organisms/server-setup/ServerSetup.tsx index 7aba5c4..f10a7b7 100644 --- a/src/design-system/organisms/server-setup/ServerSetup.tsx +++ b/packages/design-system/organisms/server-setup/ServerSetup.tsx @@ -1,15 +1,13 @@ -import Link from 'next/link'; -import { useRouter } from 'next/router'; +import { Avatar, utils } from '@roleypoly/design-system/atoms/avatar'; +import { Button } from '@roleypoly/design-system/atoms/button'; +import { DotOverlay } from '@roleypoly/design-system/atoms/dot-overlay'; +import { Hero } from '@roleypoly/design-system/atoms/hero'; +import { AccentTitle, SmallTitle } from '@roleypoly/design-system/atoms/typography'; +import { evaluatePermission } from '@roleypoly/misc-utils/hasPermission'; +import { GuildSlug, UserGuildPermissions } from '@roleypoly/types'; import * as React from 'react'; import { FaDiscord } from 'react-icons/fa'; import { GoArrowLeft } from 'react-icons/go'; -import { GuildSlug, UserGuildPermissions } from 'roleypoly/common/types'; -import { evaluatePermission } from 'roleypoly/common/utils/hasPermission'; -import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar'; -import { Button } from 'roleypoly/design-system/atoms/button'; -import { DotOverlay } from 'roleypoly/design-system/atoms/dot-overlay'; -import { Hero } from 'roleypoly/design-system/atoms/hero'; -import { AccentTitle, SmallTitle } from 'roleypoly/design-system/atoms/typography'; import { FlexLine, FlexWrap } from './ServerSetup.styled'; export type ServerSetupProps = { @@ -65,13 +63,11 @@ const adminMessage = (id: string) => ( @@ -86,20 +82,17 @@ const managerMessage = (id: string) => ( ); const userMessage = (name: string) => { - const router = useRouter(); return ( <> @@ -110,7 +103,7 @@ const userMessage = (name: string) => {