fix: disable autoResetHiddenColumns when useConditionallyHiddenColumns (#2851)

https://linear.app/unleash/issue/2-563/fix-issue-with-useconditionallyhiddencolumns-and-react-table

It seems like we should add `autoResetHiddenColumns: false` to
`useTable` whenever we use `useConditionallyHiddenColumns`.

Basically the thought is that, if we're controlling column visibility in
our own way, we should not want other things to change that state
unpredictably, otherwise this may make React go _brrrrrr_. And it can be
very hard to pinpoint what exactly may be causing React to go _brrrrrr_.


![image](https://user-images.githubusercontent.com/14320932/211332339-95918c5c-e3ea-40e9-b8b4-756a798a4702.png)

First detected this issue apparently randomly while developing the new
SA table. Around 10-20 page refreshes would eventually trigger it. Was
not easy to find, but hopefully this fixes it permanently. At least I
haven't been able to reproduce it since. Maybe someone has a better idea
of where the issue could be or if this is a pretty good guess. Doesn't
seem like this change hurts us anyways.

I love React, `useEffect` and these very to-the-point error messages.
Very fun and productive.

Reference: https://react-table-v7.tanstack.com/docs/api/useTable

frontend/src/component/admin/apiToken/ApiTokenTable/ApiTokenTable.tsx

@@ -52,6 +52,7 @@ export const ApiTokenTable = () => {
             data: tokens as any,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             disableSortRemove: true,
         },
         useGlobalFilter,

frontend/src/component/admin/groups/GroupForm/GroupFormUsersTable/GroupFormUsersTable.tsx

@@ -92,6 +92,7 @@ export const GroupFormUsersTable: VFC<IGroupFormUsersTableProps> = ({
             columns: columns as any[],
             data: users as any[],
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/admin/projectRoles/ProjectRoles/ProjectRoleList/ProjectRoleList.tsx

@@ -165,6 +165,7 @@ const ProjectRoleList = () => {
             initialState,
             sortTypes,
             autoResetGlobalFilter: false,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             defaultColumn: {

frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountModal/ServiceAccountTokens/ServiceAccountTokens.tsx

@@ -229,6 +229,7 @@ export const ServiceAccountTokens = ({
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountsTable.tsx

@@ -168,6 +168,7 @@ export const ServiceAccountsTable = () => {
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/admin/users/UsersList/UsersList.tsx

@@ -206,6 +206,7 @@ const UsersList = () => {
             initialState,
             sortTypes,
             autoResetGlobalFilter: false,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             defaultColumn: {

frontend/src/component/archive/ArchiveTable/ArchiveTable.tsx

@@ -217,6 +217,7 @@ export const ArchiveTable = ({
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             disableSortRemove: true,
             autoResetSortBy: false,
         },

frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/ChangeRequestsTabs.tsx

@@ -178,6 +178,7 @@ export const ChangeRequestsTabs = ({
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             disableSortRemove: true,
             autoResetSortBy: false,
             defaultColumn: {

frontend/src/component/feature/FeatureToggleList/FeatureToggleListTable.tsx

@@ -204,6 +204,7 @@ export const FeatureToggleListTable: VFC = () => {
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureMetricsTable/FeatureMetricsTable.tsx

@@ -35,6 +35,7 @@ export const FeatureMetricsTable = ({
             initialState,
             columns: COLUMNS as any,
             data: metrics as any,
+            autoResetHiddenColumns: false,
             disableSortRemove: true,
             defaultColumn: { Cell: TextCell },
         },

frontend/src/component/feature/FeatureView/FeatureVariants/FeatureEnvironmentVariants/EnvironmentVariantsCard/EnvironmentVariantsTable/EnvironmentVariantsTable.tsx

@@ -138,6 +138,7 @@ export const EnvironmentVariantsTable = ({
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/feature/FeatureView/FeatureVariants/FeatureVariantsList/FeatureVariantsList.tsx

@@ -199,6 +199,7 @@ export const FeatureVariantsList = () => {
             data: data as any[],
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetGlobalFilter: false,
             autoResetSortBy: false,
             disableSortRemove: true,

frontend/src/component/playground/Playground/PlaygroundResultsTable/PlaygroundResultsTable.tsx

@@ -170,6 +170,7 @@ export const PlaygroundResultsTable = ({
             data: data as any,
             sortTypes,
             autoResetGlobalFilter: false,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/project/Project/ProjectFeatureToggles/ProjectFeatureToggles.tsx

@@ -421,6 +421,7 @@ export const ProjectFeatureToggles = ({
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             disableSortRemove: true,
             autoResetSortBy: false,
             getRowId,

frontend/src/component/project/Project/ProjectHealth/ReportTable/ReportTable.tsx

@@ -84,6 +84,7 @@ export const ReportTable = ({ projectId, features }: IReportTableProps) => {
             initialState,
             sortTypes,
             autoResetGlobalFilter: false,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
         },

frontend/src/component/project/ProjectAccess/ProjectAccessTable/ProjectAccessTable.tsx

@@ -297,6 +297,7 @@ export const ProjectAccessTable: VFC = () => {
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/project/ProjectAccess/ProjectGroupView/ProjectGroupView.tsx

@@ -146,6 +146,7 @@ export const ProjectGroupView: VFC<IProjectGroupViewProps> = ({
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,

frontend/src/component/segments/SegmentTable.tsx

@@ -62,6 +62,7 @@ export const SegmentTable = () => {
             data: data as any,
             sortTypes,
             autoResetGlobalFilter: false,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             defaultColumn: {

frontend/src/component/user/Profile/PersonalAPITokensTab/PersonalAPITokensTab.tsx

@@ -192,6 +192,7 @@ export const PersonalAPITokensTab = () => {
             data,
             initialState,
             sortTypes,
+            autoResetHiddenColumns: false,
             autoResetSortBy: false,
             disableSortRemove: true,
             disableMultiSort: true,