feat(sdk)!: sunset ex.ReactApp (#6179)

The Wing library ecosystem is steadily growing, and we now have a dedicated [winglib](https://github.com/winglang/winglibs) for React, which you can use with: ``` bring react; ``` Huge thanks to @meirdev for contributing this winglib! It supports both the `sim` and `tf-aws` targets. To lighten our maintenance load (and build times), this PR removes the built-in `ex.ReactApp` class from the core Wing SDK. Closes #6139 There is a known limitation that the `react` winglib does not yet support customizing the domain on AWS using `cloud.Domain` - see #6178. (contributions are welcome!) If you have any trouble with the dedicated winglib, please let us know by opening a GitHub issue or sending a message on the Wing slack - we're happy to help. BREAKING CHANGE: `ex.ReactApp` and related types have been removed from the Wing SDK. We recommend using the dedicated [react winglib](https://www.npmjs.com/package/@winglibs/react) instead. ## Checklist - [x] Title matches [Winglang's style guide](https://www.winglang.io/contributing/start-here/pull_requests#how-are-pull-request-titles-formatted) - [x] Description explains motivation and solution - [x] Tests added (always) - [ ] Docs updated (only required for features) - [ ] Added `pr/e2e-full` label if this feature requires end-to-end testing *By submitting this pull request, I confirm that my contribution is made under the terms of the [Wing Cloud Contribution License](https://github.com/winglang/wing/blob/main/CONTRIBUTION_LICENSE.md)*.
winglang · Apr 9, 2024 · 6bd05c6 · 6bd05c6
1 parent 246e814
commit 6bd05c6
Show file tree

Hide file tree

Showing 55 changed files with 9 additions and 3,161 deletions.
diff --git a/apps/wing-console/console/design-system/src/utils/icon-utils.ts b/apps/wing-console/console/design-system/src/utils/icon-utils.ts
@@ -58,9 +58,6 @@ export const getResourceIconComponent = (
     case "@winglang/sdk.cloud.Website": {
       return solid ? SolidGlobeAltIcon : GlobeAltIcon;
     }
-    case "@winglang/sdk.ex.ReactApp": {
-      return ReactIcon;
-    }
     case "@winglang/sdk.cloud.Counter": {
       return solid ? SolidCalculatorIcon : CalculatorIcon;
     }
@@ -233,13 +230,6 @@ export const getResourceIconColors = (options: {
         options.forceDarken && colors.violet.forceDarken,
       ];
     }
-    case "@winglang/sdk.ex.ReactApp": {
-      return [
-        colors.sky.default,
-        options.darkenOnGroupHover && colors.sky.groupHover,
-        options.forceDarken && colors.sky.forceDarken,
-      ];
-    }
     default: {
       let color: Colors =
         options.color && colors[options.color] ? options.color : "slate";

diff --git a/apps/wing-console/console/server/src/router/index.ts b/apps/wing-console/console/server/src/router/index.ts
@@ -8,7 +8,6 @@ import { createCounterRouter } from "./counter.js";
 import { createEndpointRouter } from "./endpoint.js";
 import { createFunctionRouter } from "./function.js";
 import { createQueueRouter } from "./queue.js";
-import { createReactAppRouter } from "./react-app.js";
 import { createRedisRouter } from "./redis.js";
 import { createTableRouter } from "./table.js";
 import { createTestRouter } from "./test.js";
@@ -32,7 +31,6 @@ export const mergeAllRouters = () => {
     createUpdaterRouter(),
     createRedisRouter(),
     createWebsiteRouter(),
-    createReactAppRouter(),
     createConfigRouter(),
     createEndpointRouter(),
   );

diff --git a/apps/wing-console/console/server/src/router/react-app.ts b/apps/wing-console/console/server/src/router/react-app.ts
diff --git a/apps/wing-console/console/server/src/wingsdk.ts b/apps/wing-console/console/server/src/wingsdk.ts
@@ -4,7 +4,6 @@ import type {
   TableSchema as TableSchema_,
   WebsiteSchema as WebsiteSchema_,
   EndpointSchema as EndpointSchema_,
-  ReactAppSchema as ReactAppSchema_,
 } from "@winglang/sdk/lib/target-sim/schema-resources.js";
 
 export {
@@ -42,6 +41,3 @@ export type WebsiteSchema = BaseResourceSchema & {
 export type EndpointSchema = BaseResourceSchema & {
   props: EndpointSchema_;
 };
-export type ReactAppSchema = BaseResourceSchema & {
-  props: ReactAppSchema_;
-};
diff --git a/apps/wing-console/console/ui/src/features/react-app-interaction-view.tsx b/apps/wing-console/console/ui/src/features/react-app-interaction-view.tsx
diff --git a/apps/wing-console/console/ui/src/features/resource-interaction-view.tsx b/apps/wing-console/console/ui/src/features/resource-interaction-view.tsx
@@ -6,7 +6,6 @@ import { CounterInteractionView } from "./counter-interaction-view.js";
 import { EndpointInteractionView } from "./endpoint-interaction-view.js";
 import { FunctionInteractionView } from "./function-interaction-view.js";
 import { QueueInteractionView } from "./queue-interaction-view.js";
-import { ReactAppInteractionView } from "./react-app-interaction-view.js";
 import { RedisInteractionView } from "./redis-interaction-view.js";
 import { ScheduleInteractionView } from "./schedule-interaction-view.js";
 import { TableInteractionView } from "./table-interaction-view.js";
@@ -50,9 +49,6 @@ export const ResourceInteractionView = memo(
         case "@winglang/sdk.ex.Redis": {
           return <RedisInteractionView resourcePath={resourcePath} />;
         }
-        case "@winglang/sdk.ex.ReactApp": {
-          return <ReactAppInteractionView resourcePath={resourcePath} />;
-        }
         case "@winglang/sdk.cloud.Website": {
           return <WebsiteInteractionView resourcePath={resourcePath} />;
         }

diff --git a/apps/wing-console/console/ui/src/services/use-react-app.ts b/apps/wing-console/console/ui/src/services/use-react-app.ts
diff --git a/docs/docs/04-standard-library/aws/api-reference.md b/docs/docs/04-standard-library/aws/api-reference.md
@@ -668,52 +668,6 @@ The cloud.Queue.
 
 
 
-### ReactApp <a name="ReactApp" id="@winglang/sdk.aws.ReactApp"></a>
-
-A helper class for working with AWS react apps.
-
-#### Initializers <a name="Initializers" id="@winglang/sdk.aws.ReactApp.Initializer"></a>
-
-```wing
-bring aws;
-
-new aws.ReactApp();
-```
-
-| **Name** | **Type** | **Description** |
-| --- | --- | --- |
-
----
-
-
-#### Static Functions <a name="Static Functions" id="Static Functions"></a>
-
-| **Name** | **Description** |
-| --- | --- |
-| <code><a href="#@winglang/sdk.aws.ReactApp.from">from</a></code> | If the bucket is an AWS Bucket, return a helper interface for working with it. |
-
----
-
-##### `from` <a name="from" id="@winglang/sdk.aws.ReactApp.from"></a>
-
-```wing
-bring aws;
-
-aws.ReactApp.from(react: ReactApp);
-```
-
-If the bucket is an AWS Bucket, return a helper interface for working with it.
-
-###### `react`<sup>Required</sup> <a name="react" id="@winglang/sdk.aws.ReactApp.from.parameter.react"></a>
-
-- *Type:* <a href="#@winglang/sdk.ex.ReactApp">ReactApp</a>
-
-The ex.ReactApp.
-
----
-
-
-
 ### Table <a name="Table" id="@winglang/sdk.aws.Table"></a>
 
 A helper class for working with AWS tables.
@@ -854,122 +808,6 @@ The cloud.Bucket.
 
 ## Structs <a name="Structs" id="Structs"></a>
 
-### AwsReactAppProps <a name="AwsReactAppProps" id="@winglang/sdk.aws.AwsReactAppProps"></a>
-
-Options for AWS `ReactApp`.
-
-#### Initializer <a name="Initializer" id="@winglang/sdk.aws.AwsReactAppProps.Initializer"></a>
-
-```wing
-bring aws;
-
-let AwsReactAppProps = aws.AwsReactAppProps{ ... };
-```
-
-#### Properties <a name="Properties" id="Properties"></a>
-
-| **Name** | **Type** | **Description** |
-| --- | --- | --- |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.projectPath">projectPath</a></code> | <code>str</code> | The path to the React app root folder- can be absolute or relative to the wing folder. |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.buildCommand">buildCommand</a></code> | <code>str</code> | A command for building the React app. |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.buildDir">buildDir</a></code> | <code>str</code> | The path to the React app build folder- relative to the `projectPath`. |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.localPort">localPort</a></code> | <code>num</code> | A port to start a local build of the React app on. |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.startCommand">startCommand</a></code> | <code>str</code> | A command for starting React app locally. |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.useBuildCommand">useBuildCommand</a></code> | <code>bool</code> | In sim, if `true` - will use the start command, and if `false` - the build command. |
-| <code><a href="#@winglang/sdk.aws.AwsReactAppProps.property.domain">domain</a></code> | <code><a href="#@winglang/sdk.aws.Domain">Domain</a></code> | The website's custom domain object. |
-
----
-
-##### `projectPath`<sup>Required</sup> <a name="projectPath" id="@winglang/sdk.aws.AwsReactAppProps.property.projectPath"></a>
-
-```wing
-projectPath: str;
-```
-
-- *Type:* str
-
-The path to the React app root folder- can be absolute or relative to the wing folder.
-
----
-
-##### `buildCommand`<sup>Optional</sup> <a name="buildCommand" id="@winglang/sdk.aws.AwsReactAppProps.property.buildCommand"></a>
-
-```wing
-buildCommand: str;
-```
-
-- *Type:* str
-- *Default:* "npm run build"
-
-A command for building the React app.
-
----
-
-##### `buildDir`<sup>Optional</sup> <a name="buildDir" id="@winglang/sdk.aws.AwsReactAppProps.property.buildDir"></a>
-
-```wing
-buildDir: str;
-```
-
-- *Type:* str
-- *Default:* "/build"
-
-The path to the React app build folder- relative to the `projectPath`.
-
----
-
-##### `localPort`<sup>Optional</sup> <a name="localPort" id="@winglang/sdk.aws.AwsReactAppProps.property.localPort"></a>
-
-```wing
-localPort: num;
-```
-
-- *Type:* num
-- *Default:* 3001
-
-A port to start a local build of the React app on.
-
----
-
-##### `startCommand`<sup>Optional</sup> <a name="startCommand" id="@winglang/sdk.aws.AwsReactAppProps.property.startCommand"></a>
-
-```wing
-startCommand: str;
-```
-
-- *Type:* str
-- *Default:* "npm run start"
-
-A command for starting React app locally.
-
----
-
-##### `useBuildCommand`<sup>Optional</sup> <a name="useBuildCommand" id="@winglang/sdk.aws.AwsReactAppProps.property.useBuildCommand"></a>
-
-```wing
-useBuildCommand: bool;
-```
-
-- *Type:* bool
-- *Default:* false
-
-In sim, if `true` - will use the start command, and if `false` - the build command.
-
----
-
-##### `domain`<sup>Optional</sup> <a name="domain" id="@winglang/sdk.aws.AwsReactAppProps.property.domain"></a>
-
-```wing
-domain: Domain;
-```
-
-- *Type:* <a href="#@winglang/sdk.aws.Domain">Domain</a>
-- *Default:* undefined
-
-The website's custom domain object.
-
----
-
 ### AwsWebsiteProps <a name="AwsWebsiteProps" id="@winglang/sdk.aws.AwsWebsiteProps"></a>
 
 Options for AWS `Website`.
@@ -1411,46 +1249,6 @@ AWS Queue url.
 
 ---
 
-### IAwsReactApp <a name="IAwsReactApp" id="@winglang/sdk.aws.IAwsReactApp"></a>
-
-- *Implemented By:* <a href="#@winglang/sdk.aws.IAwsReactApp">IAwsReactApp</a>
-
-A shared interface for AWS react app.
-
-
-#### Properties <a name="Properties" id="Properties"></a>
-
-| **Name** | **Type** | **Description** |
-| --- | --- | --- |
-| <code><a href="#@winglang/sdk.aws.IAwsReactApp.property.bucketArn">bucketArn</a></code> | <code>str</code> | AWS Bucket arn. |
-| <code><a href="#@winglang/sdk.aws.IAwsReactApp.property.bucketName">bucketName</a></code> | <code>str</code> | AWS Bucket name. |
-
----
-
-##### `bucketArn`<sup>Required</sup> <a name="bucketArn" id="@winglang/sdk.aws.IAwsReactApp.property.bucketArn"></a>
-
-```wing
-bucketArn: str;
-```
-
-- *Type:* str
-
-AWS Bucket arn.
-
----
-
-##### `bucketName`<sup>Required</sup> <a name="bucketName" id="@winglang/sdk.aws.IAwsReactApp.property.bucketName"></a>
-
-```wing
-bucketName: str;
-```
-
-- *Type:* str
-
-AWS Bucket name.
-
----
-
 ### IAwsTable <a name="IAwsTable" id="@winglang/sdk.aws.IAwsTable"></a>
 
 - *Implemented By:* <a href="#@winglang/sdk.aws.IAwsTable">IAwsTable</a>

diff --git a/docs/docs/04-standard-library/cloud/website.md b/docs/docs/04-standard-library/cloud/website.md
@@ -279,7 +279,7 @@ File's content type.
 
 ### WebsiteDomainOptions <a name="WebsiteDomainOptions" id="@winglang/sdk.cloud.WebsiteDomainOptions"></a>
 
-Options for `Website`, and `ReactApp`.
+Options for `Website`.
 
 #### Initializer <a name="Initializer" id="@winglang/sdk.cloud.WebsiteDomainOptions.Initializer"></a>