# Framework linter 

Gadget has a built-in framework linter that will alert you to Gadget-specific issues in your project.

Lint rules are classified into 2 categories: errors and warnings. Errors must be fixed, warnings are optional.

Linter errors and warnings will only be reported in the Gadget editor.

## Disabling rules 

You can disable rules using [ESLint configuration comments](https://eslint.org/docs/latest/use/configure/rules#disabling-rules).

For example, you can disable warnings for an entire file using:

```typescript
/* eslint-disable */
import { MyAppClient } from "@gadget-client/my-app-name";

export const api = new MyAppClient({ environment: "development" });
```

You can also disable lint rules per line:

```typescript
export const api = new Client({ environment: "development" }); // eslint-disable-line

// eslint-disable-next-line
export const api = new Client({ environment: "development" });
```

## Errors 

These rules relate to errors in your Gadget project and must be fixed.

### gadget/no-action-file-imports 

Importing from action files is not allowed.

To fix these errors:

*   call the action using your `api` client in the action context
*   create utility files for any shared functions, variables, or clients, and import from the utility file.

```typescript
// error - do not import from action files
import { run as runCreateProduct } from "../models/product/actions/create";

export const run: ActionRun = async ({ api }) => {
  // not allowed
  await runCreateProduct();
};
```

Fix this issue by calling actions with the `api` client included in your [context param](https://docs.gadget-canary.xyz/guides/actions/code#action-context):

```typescript
export const run: ActionRun = async ({ api }) => {
  // call actions using api client in action/route context param
  await api.product.create();
};
```

### gadget/web-isolated-imports 

Importing from outside the `web/` directory is not allowed for code files within the `web/` directory. This is restricted on hosted Gadget apps for security reasons.

To fix these errors:

*   Use the `@gadgetinc/react` package to access your Gadget API client in your web code
*   Refactor shared utilities to be defined within the `web/` directory

## Warnings 

These rules relate to possible problems in your Gadget project.

### gadget/no-client-static-environment-usage 

Recommend dynamic environment selection when initializing Gadget API clients.

This is an example of a static environment used to set up an API client:

```typescript
import { MyAppClient } from "@gadget-client/my-app-name";

export const api = new MyAppClient({ environment: "Development" });
```

And this is how a client can be initialized dynamically:

```typescript
import { MyAppClient } from "@gadget-client/my-app-name";

export const api = new MyAppClient({ environment: window.gadgetConfig.environment });
```

### gadget/no-hardcoded-shopify-shops 

See [Accessing the Shopify API](https://docs.gadget-canary.xyz/guides/plugins/shopify/building-shopify-apps#accessing-the-shopify-api) for more detailed information on when to use the shopify connection's `current` property.

Typically you should avoid hardcoding Shopify shops when using the shopify client in actions.

```typescript
export const run: ActionRun = async ({ api, connections }) => {
  const client = await connections.shopify.forShopId(params.shopId);
};
```

Instead, use the shopify connection's `current` property:

```typescript
export const run: ActionRun = async ({ api, connections }) => {
  const client = await connections.shopify.current;
};
```