chore: add react & styled-components to react macro, as most are implied.

hack/bazel/js/react.bzl

@@ -1,6 +1,13 @@
 load("@npm//@bazel/typescript:index.bzl", "ts_library")
 load("//hack/bazel:utils.bzl", "render_deps")
 
+DEFAULT_DEPS = [
+    "react",
+    "styled-components",
+    "@types/react",
+    "@types/styled-components",
+]
+
 def react_library(name, deps = [], **kwargs):
     ts_library(
         name = name,
@@ -15,6 +22,6 @@ def react_library(name, deps = [], **kwargs):
                 "*.stories.tsx",
             ]),
         ),
-        deps = render_deps(deps),
+        deps = render_deps(deps + DEFAULT_DEPS),
         **kwargs
     )

hack/bazel/utils.bzl

@@ -1,3 +1,11 @@
+def _append_once(targetList, item):
+    if item not in targetList:
+        targetList.append(item)
+
+def _extend_once(targetList, items):
+    for item in items:
+        _append_once(targetList, item)
+
 def render_deps(deps = []):
     output_deps = []
 
@@ -5,18 +13,18 @@ def render_deps(deps = []):
 
     for dep in deps:
         if dep.startswith("//src/rpc"):
-            output_deps.append(dep + ":ts")
-            output_deps.append(dep + ":ts_proto")
+            _append_once(output_deps, dep + ":ts")
+            _append_once(output_deps, dep + ":ts_proto")
             if has_added_grpc_deps == False:
-                output_deps.extend([
+                _extend_once(output_deps, [
                     "@npm//google-protobuf",
                     "@npm//@types/google-protobuf",
                     "@npm//@improbable-eng/grpc-web",
                 ])
                 has_added_grpc_deps = True
         elif dep.startswith("//") or dep.startswith("@npm//"):
-            output_deps.append(dep)
+            _append_once(output_deps, dep)
         else:
-            output_deps.append("@npm//" + dep)
+            _append_once(output_deps, "@npm//" + dep)
 
     return output_deps

src/common/utils/BUILD.bazel

@@ -7,12 +7,8 @@ react_library(
     name = "utils",
     deps = [
         "chroma-js",
-        "react",
-        "styled-components",
         "//src/rpc/shared",
         "@types/chroma-js",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/common/utils/withContext/BUILD.bazel

@@ -5,7 +5,5 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "withContext",
     deps = [
-        "react",
-        "@types/react",
     ],
 )

src/design-system/atoms/avatar/BUILD.bazel

@@ -5,10 +5,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "avatar",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/colors",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/branding/BUILD.bazel

@@ -5,8 +5,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "branding",
     deps = [
-        "react",
         "//src/design-system/atoms/colors",
-        "@types/react",
     ],
 )

src/design-system/atoms/breakpoints/BUILD.bazel

@@ -5,10 +5,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "breakpoints",
     deps = [
-        "react",
-        "styled-components",
         "//src/common/utils/withContext",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/button/BUILD.bazel

@@ -6,13 +6,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "button",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/fonts",
         "//src/design-system/atoms/typography",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/design-system/atoms/colors/BUILD.bazel

@@ -6,10 +6,6 @@ react_library(
     name = "colors",
     deps = [
         "chroma-js",
-        "react",
-        "styled-components",
         "@types/chroma-js",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/dot-overlay/BUILD.bazel

@@ -5,9 +5,5 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "dot-overlay",
     deps = [
-        "react",
-        "styled-components",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/fader/BUILD.bazel

@@ -5,9 +5,5 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "fader",
     deps = [
-        "react",
-        "styled-components",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/fonts/BUILD.bazel

@@ -6,9 +6,5 @@ react_library(
     name = "fonts",
     deps = [
         "next",
-        "react",
-        "styled-components",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/halfsies/BUILD.bazel

@@ -5,10 +5,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "halfsies",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/hero/BUILD.bazel

@@ -5,9 +5,5 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "hero",
     deps = [
-        "react",
-        "styled-components",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/key-events/BUILD.bazel

@@ -5,7 +5,5 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "key-events",
     deps = [
-        "react",
-        "@types/react",
     ],
 )

src/design-system/atoms/popover/BUILD.bazel

@@ -5,14 +5,10 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "popover",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/key-events",
         "//src/design-system/atoms/timings",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/role/BUILD.bazel

@@ -7,16 +7,12 @@ react_library(
     name = "role",
     deps = [
         "chroma-js",
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
         "//src/design-system/shared-types",
         "//src/rpc/shared",
         "@types/chroma-js",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/design-system/atoms/space/BUILD.bazel

@@ -5,7 +5,5 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "space",
     deps = [
-        "styled-components",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/sparkle/BUILD.bazel

@@ -5,10 +5,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "sparkle",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/colors",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/tab-view/BUILD.bazel

@@ -6,13 +6,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "tab-view",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/design-system/atoms/text-input/BUILD.bazel

@@ -5,10 +5,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "text-input",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/colors",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/atoms/typist/BUILD.bazel

@@ -6,8 +6,6 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "typist",
     deps = [
-        "react",
-        "@types/react",
     ],
 )
 

src/design-system/atoms/typography/BUILD.bazel

@@ -5,9 +5,7 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "typography",
     deps = [
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/demo-discord/BUILD.bazel

@@ -5,12 +5,8 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "demo-discord",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/typist",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/demo-picker/BUILD.bazel

@@ -5,11 +5,7 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "demo-picker",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/role",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/error-banner/BUILD.bazel

@@ -5,12 +5,8 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "error-banner",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/typography",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/footer/BUILD.bazel

@@ -5,13 +5,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "footer",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
         "//src/design-system/atoms/typography",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/guild-nav/BUILD.bazel

@@ -6,16 +6,12 @@ react_library(
     name = "guild-nav",
     deps = [
         "next",
-        "react",
         "react-icons",
         "react-tooltip",
-        "styled-components",
         "//src/common/utils",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
         "//src/design-system/molecules/nav-slug",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/nav-slug/BUILD.bazel

@@ -5,12 +5,8 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "nav-slug",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/avatar",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/picker-category/BUILD.bazel

@@ -5,13 +5,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "picker-category",
     deps = [
-        "react",
         "react-tooltip",
-        "styled-components",
         "//src/design-system/atoms/role",
         "//src/design-system/atoms/typography",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/preauth-greeting/BUILD.bazel

@@ -5,13 +5,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "preauth-greeting",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/avatar",
         "//src/design-system/atoms/space",
         "//src/design-system/atoms/typography",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/preauth-secret-code/BUILD.bazel

@@ -6,16 +6,12 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "preauth-secret-code",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/button",
         "//src/design-system/atoms/fader",
         "//src/design-system/atoms/space",
         "//src/design-system/atoms/text-input",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/design-system/molecules/reset-submit/BUILD.bazel

@@ -6,13 +6,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "reset-submit",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/button",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/design-system/molecules/server-masthead/BUILD.bazel

@@ -7,16 +7,12 @@ react_library(
     name = "server-masthead",
     deps = [
         "next",
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/avatar",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
         "//src/design-system/atoms/typography",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )
 

src/design-system/molecules/user-avatar-group/BUILD.bazel

@@ -5,13 +5,9 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "user-avatar-group",
     deps = [
-        "react",
-        "styled-components",
         "//src/design-system/atoms/avatar",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/colors",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/molecules/user-popover/BUILD.bazel

@@ -6,15 +6,11 @@ react_library(
     name = "user-popover",
     deps = [
         "next",
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/timings",
         "//src/design-system/molecules/user-avatar-group",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/organisms/app-shell/BUILD.bazel

@@ -5,15 +5,11 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "app-shell",
     deps = [
-        "react",
         "react-custom-scrollbars",
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/molecules/footer",
         "//src/design-system/organisms/masthead",
         "//src/design-system/shared-types",
-        "@types/react",
         "@types/react-custom-scrollbars",
-        "@types/styled-components",
     ],
 )

src/design-system/organisms/help-why-no-roles/BUILD.bazel

@@ -6,15 +6,11 @@ react_library(
     name = "help-why-no-roles",
     deps = [
         "chroma-js",
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/halfsies",
         "//src/design-system/atoms/sparkle",
         "//src/design-system/shared-types",
         "@types/chroma-js",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/organisms/landing/BUILD.bazel

@@ -5,9 +5,7 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "landing",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/halfsies",
@@ -15,7 +13,5 @@ react_library(
         "//src/design-system/atoms/typography",
         "//src/design-system/molecules/demo-discord",
         "//src/design-system/molecules/demo-picker",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/organisms/masthead/BUILD.bazel

@@ -6,9 +6,7 @@ react_library(
     name = "masthead",
     deps = [
         "next",
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/branding",
         "//src/design-system/atoms/breakpoints",
         "//src/design-system/atoms/button",
@@ -20,7 +18,5 @@ react_library(
         "//src/design-system/molecules/user-avatar-group",
         "//src/design-system/molecules/user-popover",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/organisms/preauth/BUILD.bazel

@@ -5,15 +5,11 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "role-picker",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/design-system/atoms/button",
         "//src/design-system/atoms/space",
         "//src/design-system/molecules/preauth-greeting",
         "//src/design-system/molecules/preauth-secret-code",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )

src/design-system/organisms/role-picker/BUILD.bazel

@@ -6,9 +6,7 @@ package(default_visibility = ["//visibility:public"])
 react_library(
     name = "role-picker",
     deps = [
-        "react",
         "react-icons",
-        "styled-components",
         "//src/common/utils",
         "//src/design-system/atoms/colors",
         "//src/design-system/atoms/fader",
@@ -17,8 +15,6 @@ react_library(
         "//src/design-system/molecules/reset-submit",
         "//src/design-system/molecules/server-masthead",
         "//src/design-system/shared-types",
-        "@types/react",
-        "@types/styled-components",
     ],
 )