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

# Insights

export const CodemodInsightsDemo = () => {
  return <div style={{
    position: 'relative',
    paddingBottom: 'calc(62.5% + 41px)',
    height: 0,
    width: '100%'
  }}>
      <iframe src="https://demo.arcade.software/UZzKJGji28rC3ZEAHtiD?embed&amp;embed_mobile=inline&amp;embed_desktop=inline&amp;show_copy_link=true" title="Using Codemod Insights" frameBorder="0" loading="lazy" allowFullScreen allow="clipboard-write" style={{
    position: 'absolute',
    top: 0,
    left: 0,
    width: '100%',
    height: '100%',
    colorScheme: 'light'
  }} />
    </div>;
};

In large codebases, tracking migrations, old/new APIs, security anti-patterns, and trends can be incredibly useful. Engineers and engineering leaders in progressive software teams can stay on top of these changes using **Codemod Insights**.

With Codemod Insights, you can generate customized dashboards and widgets that provide helpful insights about your code's posture. This way, you can make informed decisions and track code changes that scale over time.

<Frame>
  <CodemodInsightsDemo />
</Frame>

## Using Codemod Insights

<Steps>
  <Step title="Create a dashboard">
    Dashboards help you keep your insights' widgets organized.

    For example, you can create a dashboard called `i18n migration` to organize all widgets related to your i18n migration.

    To create a new dashboard, go to `Insights -> Create Dashboard`.

    <Frame>
      <img src="https://mintcdn.com/codemodcom/NBnj32UUWpJh93CD/images/insights/create-dashboard.png?fit=max&auto=format&n=NBnj32UUWpJh93CD&q=85&s=eb2bcddb3858503b9b89c3bef7cb0e28" alt="Creating a new dashboard" width="3024" height="1906" data-path="images/insights/create-dashboard.png" />
    </Frame>
  </Step>

  <Step title="Create a widget">
    Once you're in your new dashboard, you can create a new widget.

    Widgets help you get useful insights about a variety of patterns in your codebase.

    Currently, you can create `Timeseries chart`, `Single number`, or `Table` widgets.

    <Frame>
      <img src="https://mintcdn.com/codemodcom/NBnj32UUWpJh93CD/images/insights/create-widget.png?fit=max&auto=format&n=NBnj32UUWpJh93CD&q=85&s=2ca3b5c27afc96228c9c5ae824aa5602" alt="Creating a new widget" width="3024" height="1910" data-path="images/insights/create-widget.png" />
    </Frame>
  </Step>

  <Step title="Setting up your widget">
    Widgets allow you to track and visualize insights by running queries over your codebase. Each query represents an [`ast-grep` YAML rule](https://ast-grep.github.io/reference/yaml.html) that is applied to your repository.

    Start by specifying a code pattern you would like to track and visualize. You can generate ast-grep rules with the help of AI [using Codemod Studio](/codemod-studio#using-codemod-ai).

    For each quer, you can specify:

    * `ast-grep` rule ([generate rules easily with codemod studio](/codemod-studio#using-codemod-ai))
    * match type, can be occurrence counts or file counts
    * target repository
    * query label
    * group options
    * date/commit hash (for Single number and Table widgets)

    <Frame>
      <video autoPlay muted loop playsInline className="w-full" src="https://mintcdn.com/codemodcom/NBnj32UUWpJh93CD/images/insights/setting-up-widget.mp4?fit=max&auto=format&n=NBnj32UUWpJh93CD&q=85&s=e38ca66ea47ffadd7e533b3200e77b86" data-path="images/insights/setting-up-widget.mp4" />
    </Frame>

    <Tip>
      When configuring widgets, you can add multiple queries to extend the information a widget provides. Additionally, you can aggregate the results of multiple queries by specifying a formula. To refer to a query's value in a formula, use the query's name (alphabetical order index).

      <Frame>
        <img src="https://mintcdn.com/codemodcom/NBnj32UUWpJh93CD/images/insights/query-formula.png?fit=max&auto=format&n=NBnj32UUWpJh93CD&q=85&s=3eb950fe6a6434b740b6b2769fa968af" alt="Writing formulas" width="2288" height="1248" data-path="images/insights/query-formula.png" />
      </Frame>
    </Tip>
  </Step>
</Steps>
