@localstack/appinspector-ui 1.0.0-dev-86989eb5 → 1.0.0-dev-f61f6d86

package/README.md

@@ -1,123 +1,9 @@
-# LocalStack AppInspector Frontend
+# LocalStack AppInspector UI
 
-## Setup
+This package is used internally in different LocalStack products as an interface for App Inspector.
 
-### Installation
+## Installation
 
 ```sh
-npm install
+npm install @localstack/appinspector-ui
 ```
-
-### Environment Variables
-
-The following environment variables are available:
-
-- `VITE_LOCALSTACK_API_MOCK`: Set to `true` to use the mock API client.
-
-Run `cp .env.example .env` to create a `.env` file, and customize it as needed.
-
-## Development
-
-Spin up component development:
-
-```sh
-npx storybook dev
-# npm run storybook
-```
-
-Spin up the end-to-end development:
-
-```sh
-npx vite
-# npm run dev
-```
-
-## Testing
-
-Run the component tests:
-
-```sh
-npx vitest --project=storybook
-# npm run test:storybook
-```
-
-Run the end-to-end tests:
-
-```sh
-npx playwright test
-# npm run test:playwright
-```
-
-Start the end-to-end interactive UI mode:
-
-```sh
-npx playwright test --ui
-# npm run test:playwright:ui
-```
-
-Update the end-to-end snapshots:
-
-```sh
-npx playwright test --update-snapshots
-```
-
-Auto generate end-to-end tests with Codegen:
-
-```sh
-npx playwright codegen
-```
-
-Show the end-to-end test results:
-
-```sh
-npx playwright show-report
-```
-
-### Snapshot testing
-
-Snapshot testing is platform-dependent, meaning that snapshots for darwin (our computers) will likely differ from snapshots for linux (GitHub Actions).
-
-The following script will update the snapshots for linux using docker:
-
-```sh
-npm run test:playwright:update-playwright-snapshots
-```
-
-### Testing on LocalStack Web
-
-To try the integration in LocalStack Web, make sure to have the `localstack-web` repository alongside with this one, as seen here:
-
-```
-Code/
-  localstack-appinspector-ui/
-  localstack-web/
-```
-
-You can clone it with, and make sure to switch to the `integrate-studio-ui-prototype` branch name.
-
-```sh
-git clone https://github.com/localstack/localstack-web.git
-git checkout integrate-studio-ui-prototype
-```
-
-Now, install Husky globally:
-
-```sh
-npm install -g husky
-```
-
-Then, run the following script:
-
-```sh
-make install-to-localstack-web
-```
-
-This will build and package App Inspector UI and install it in `localstack-web`'s related workspace dependencies. Now, you can go to `localstack-web` and run `make start-staged`.
-
-Additionally, you can also run the following command to start a watcher:
-
-```sh
-make install-to-localstack-web-dev
-```
-
-This will start a watcher that will rebuild the App Inspector UI and install it in `localstack-web`'s related workspace dependencies.

package/dist/index.js

@@ -2901,12 +2901,11 @@ var buildSpansEndpoint = (request) => {
 };
 var createApiClient = ({ localstackEndpoint }) => {
   return {
-    deleteSpans: async (request) => {
+    deleteSpans: async () => {
       return makeRequest({
         endpoint: API_ENDPOINTS.SPANS,
         localstackEndpoint,
         request: {
-          body: JSON.stringify(request),
           method: "DELETE"
         }
       });
@@ -3000,9 +2999,20 @@ var SpansListPage = () => {
     const url = resolveLink({ to: "trace-graph", traceId: span.trace_id });
     navigate(`${url}?spanId=${span.span_id}`);
   }, [navigate, resolveLink]);
-  const clearSpans = useCallback3(() => {
-    setSpans([]);
-  }, []);
+  const clearSpans = useCallback3(async () => {
+    setLoading(true);
+    try {
+      await api.deleteSpans();
+      setSpans([]);
+      setFetchError(void 0);
+      await fetchSpans();
+    } catch (error) {
+      console.error("Failed to delete spans:", error);
+      setFetchError(error instanceof Error ? error : new Error("Failed to delete spans", { cause: error }));
+    } finally {
+      setLoading(false);
+    }
+  }, [api, fetchSpans]);
   return /* @__PURE__ */ jsx127(
     Box5,
     {
@@ -3029,7 +3039,7 @@ var SpansListPage = () => {
             {
               filterWriteOperations,
               onClearSpans: () => {
-                clearSpans();
+                void clearSpans();
               },
               onFilterWriteOperationsChange: (value) => {
                 setFilterWriteOperations(value);