> ## Documentation Index
> Fetch the complete documentation index at: https://docs.prophecy.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Add data sources

> Use the Environment tab to quickly add tables and files to your pipeline

export const WistiaVideo = ({mediaId, autoplay = true, muted = true, loop = true}) => {
  const containerRef = React.useRef(null);
  const playerRef = React.useRef(null);
  const wistiaPlayerRef = React.useRef(null);
  const initWistia = () => {
    if (!containerRef.current || playerRef.current) return;
    const container = containerRef.current;
    const playerId = `wistia_${mediaId}_${Math.random().toString(36).substr(2, 9)}`;
    container.innerHTML = '';
    const embedDiv = document.createElement('div');
    embedDiv.className = `wistia_embed wistia_async_${mediaId}`;
    embedDiv.id = playerId;
    container.appendChild(embedDiv);
    if (window._wq) {
      window._wq.push({
        id: playerId,
        onReady: video => {
          wistiaPlayerRef.current = video;
          if (loop) {
            video.bind('end', () => {
              video.play();
            });
          }
        },
        options: {
          autoPlay: autoplay,
          muted: muted,
          videoFoam: true
        }
      });
    }
    playerRef.current = playerId;
  };
  React.useEffect(() => {
    if (window._wq) {
      initWistia();
      return;
    }
    const script = document.createElement('script');
    script.src = 'https://fast.wistia.com/assets/external/E-v1.js';
    script.async = true;
    script.onload = () => {
      window._wq = window._wq || [];
      initWistia();
      window.dispatchEvent(new Event('wistia-loaded'));
    };
    document.head.appendChild(script);
    const checkWistia = () => {
      if (window._wq) {
        initWistia();
        window.removeEventListener('wistia-loaded', checkWistia);
      }
    };
    window.addEventListener('wistia-loaded', checkWistia);
    return () => {
      window.removeEventListener('wistia-loaded', checkWistia);
      if (playerRef.current && window.Wistia && window.Wistia.api) {
        const player = window.Wistia.api(playerRef.current);
        if (player) {
          player.remove();
        }
      }
    };
  }, [mediaId, autoplay, muted, loop]);
  return <div ref={containerRef} className="aspect-video w-full rounded-xl" style={{
    position: 'relative'
  }} />;
};

The easiest way to add data sources to your pipeline is through the **Environment** tab in the left sidebar. This method automatically configures the gem settings, so you can start using the data immediately without manually creating and configuring Source and Table gems.

## Add data from the Environment tab

The Environment tab displays all tables and files available through [connections](/data-analysis/environment/connections/connections) defined in your attached fabric. You can browse by connection type or use the search bar to find specific datasets.

<Steps>
  <Step title="Open the Environment tab">
    1. Open your pipeline in the [Studio](/data-analysis/development/studio/studio).
    2. Click the **Environment** tab in the left sidebar.
    3. Expand the connection that contains your data source.
  </Step>

  <Step title="Add the data source to your pipeline">
    You can add data to your pipeline using either method:

    * **Drag and drop**: Drag the table or file onto the canvas.
    * **Add button**: Hover over the table or file and click **Add**.
  </Step>
</Steps>

<Frame>
  <WistiaVideo mediaId="5mkx7k0nbi" />
</Frame>

The gem appears on your canvas with all configuration settings already applied. The gem type depends on where your data is stored:

* **Table gems**: For datasets from your [SQL warehouse](/data-analysis/environment/fabrics/prophecy-fabrics)
* **Source gems**: For tables or files from external systems

## Modify gem configuration

After adding a data source from the Environment tab, you can adjust any configuration settings:

1. Click the gem on the canvas to open its configuration panel.
2. Modify location paths, schema definitions, format properties, or connection settings as needed.
3. Save your changes.

<Note>
  Changes you make to the gem configuration only affect that specific gem instance. The original
  data source remains unchanged.
</Note>

## Alternative: Create gems from scratch

If you need to create a gem manually, you can add Source, Target, or Table gems directly from the canvas:

1. Click **Source/Target** in the gem drawer at the top of the canvas.
2. Select the gem type from the dropdown.
3. Click the gem to open the configuration panel.
4. Configure all settings manually, including selecting connections, defining paths, and setting up schemas.

<Warning>
  Creating gems from scratch requires you to configure all settings manually. This approach is more
  time-consuming and error-prone than using the Environment tab, which automatically applies the
  correct configuration based on your existing connections.
</Warning>