Issue: Replace `··` with `↹`eslintprettier/prettier

Question

I'm getting an error: Replace ·· with ↹eslintprettier/prettier, but only in some cases, like here:

export const getTotalHabitableArea = (
    checklist: FormattedChecklistType,
    isFullChecklist: boolean,
) => {
    if (!checklist) return null
    return isFullChecklist
        ? checklist?.indoorSpaces.floors.reduce(
                (acc, current) => Number(acc) + Number(current.floorHabitableArea || 0),
                0,
          )
        : checklist?.indoorSpaces.totalHabitableArea
}

That's .perttierrc:

{
  "tabWidth": 2,
  "endOfLine": "auto",
  "proseWrap": "never",
  "semi": false,
  "singleQuote": true,
  "useTabs": true,
  "trailingComma": "all",
  "printWidth": 80
}

That's elsint config:

module.exports = {
    settings: {
        'import/resolver': {
            typescript: {}, // load alias settings from tsconfig.json into ESLint
            node: {
                extensions: ['.js', '.jsx', '.ts', '.tsx'],
                moduleDirectory: ['node_modules', 'src/'],
            },
        },
    },
    extends: [
        'eslint:recommended',
        'next',
        'prettier',
        'turbo',
        'plugin:import/recommended',
        'plugin:import/typescript',
        'plugin:prettier/recommended',
    ],
    plugins: [
        '@typescript-eslint',
        'formatjs',
        'prettier',
        'react',
        'simple-import-sort',
    ],
    rules: {
        '@next/next/no-html-link-for-pages': 'off',
        'no-case-declarations': 'off',
        'no-prototype-builtins': 'off',
        'no-unused-vars': 'off', // in favor of @typescript-eslint/no-unused-vars
        'react-hooks/exhaustive-deps': 'off',
        'react/jsx-key': 'off',
        '@typescript-eslint/no-unused-vars': 'error',
        'formatjs/no-offset': 'error',
        'simple-import-sort/exports': 'error',
        'simple-import-sort/imports': 'error',
        'arrow-body-style': ['error', 'as-needed'],
        'formatjs/enforce-id': [
            'error',
            {
                idInterpolationPattern: '[sha512:contenthash:base64:6]', //i18n
            },
        ],
        'no-console': ['error', { allow: ['warn', 'error', 'info', 'debug'] }],
        'react/self-closing-comp': ['error', { component: true, html: true }],
        'simple-import-sort/imports': [
            'error',
            {
                groups: [
                    // `react` first, `next` second
                    ['^react$', '^react-intl', '^next'],
                    // packages starting with a character
                    ['^[a-z]'],
                    // 'common' packages
                    ['^common'],
                    // UI packages
                    ['^ui'],
                    // modules
                    ['^modules'],
                    // store
                    ['^store'],
                    // store
                    ['^hooks'],
                    // Packages starting with `@`
                    ['^@'],
                    // Packages starting with `~`
                    ['^~'],
                    // Imports starting with `../`
                    ['^\\.\\.(?!/?$)', '^\\.\\./?$'],
                    // Imports starting with `./`
                    ['^\\./(?=.*/)(?!/?$)', '^\\.(?!/?$)', '^\\./?$'],
                    // Style imports
                    ['^.+\\.s?css$'],
                    // Side effect imports
                    ['^\\u0000'],
                ],
            },
        ],
    },
}

I tried changing useTabs to become false, and also tried to change some of the options in the eslint-config, but also without result. Not sure what exactly is in the conflict. I have the auto-formatting thing enabled, and it looks like when I save, the error disappears for a second but then it returns again.