[AI-skills]: Claude Sonnet 4.6 not able to add Reveal to application

[wnvko]

Description

AI agent was not able to correctly add Reveal to a view in my application.

Steps to reproduce

Add skills to a react application in the .github/skills folder. Ask Claude Sonnet 4.6 to do this:
I have this back end here https://samples.revealbi.io/upmedia-backend/reveal-api/
I want to show the data from this back end in my application in master-view. Add in this view Reveal component and show related endpoint data.

Result

Application fails with this error
[plugin:vite:import-analysis] Missing "./reveal-view.css" specifier in "@revealbi/ui" package
D:/Downloads/_react/src/main.tsx:7:7
6 | import { routes } from "./app/app-routes";
7 | import "react-app-polyfill/ie11";
8 | import "@revealbi/ui/reveal-view.css";
| ^
9 | const basename = import.meta.env.VITE_BASENAME || "/";
10 | Number.isNaN = Number.isNaN || function(value) {
at e (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:6651:8)
at n (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:6663:14)
at o (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:6691:10)
at resolveExportsOrImports (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:32827:45)
at resolveDeepImport (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:32841:22)
at tryNodeResolve (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:32716:70)
at ResolveIdContext.handler (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:32555:16)
at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
at async EnvironmentPluginContainer.resolveId (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:28717:19)
at async TransformPluginContext.resolve (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:28929:13)
at async normalizeUrl (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:27111:22)
at async file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:27177:32
at async Promise.all (index 7)
at async TransformPluginContext.transform (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:27145:4)
at async EnvironmentPluginContainer.transform (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:28797:14)
at async loadAndTransform (file:///D:/Downloads/_react/node_modules/vite/dist/node/chunks/config.js:22670:26)

Expected result

Reveal component should be added to the view and application should start with no errors.

Attachments

This is my master-view component

import { useEffect } from 'react';
import { RevealView } from '@revealbi/ui-react';
import styles from './master-view.module.css';
import createClassTransformer from '../style-utils';
import '/src/app/base-view-styles.css';

export default function MasterView() {
  const classes = createClassTransformer(styles);

  useEffect(() => {
    // Initialize Reveal SDK
    const initReveal = async () => {
      const { RevealSdkSettings } = await import('@revealbi/ui');

      // Set the base URL for the Reveal server
      RevealSdkSettings.setBaseUrl('https://samples.revealbi.io/upmedia-backend/reveal-api/');
    };

    initReveal();
  }, []);

  return (
    <>
      <div className={classes("row-layout master-view-container")}>
        <RevealView
          dashboardId="Sales"
          style={{ height: '100%', width: '100%' }}
        />
      </div>
    </>
  );
}