Remove spending report feature flag (#3611)

* Remove feature flag

* notes

* defualt show spending graph

* VRT

packages/desktop-client/e2e/reports.test.js

@@ -30,7 +30,7 @@ test.describe.parallel('Reports', () => {
   test('loads net worth and cash flow reports', async () => {
     const reports = await reportsPage.getAvailableReportList();
 
-    expect(reports).toEqual(['Net Worth', 'Cash Flow']);
+    expect(reports).toEqual(['Net Worth', 'Cash Flow', 'Monthly Spending']);
     await expect(page).toMatchThemeScreenshots();
   });
 

packages/desktop-client/src/components/reports/Overview.tsx

@@ -80,7 +80,6 @@ export function Overview() {
   sessionStorage.setItem('url', location.pathname);
 
   const isDashboardsFeatureEnabled = useFeatureFlag('dashboards');
-  const spendingReportFeatureFlag = useFeatureFlag('spendingReport');
 
   const baseLayout = widgets
     .map(widget => ({
@@ -103,25 +102,7 @@ export function Overview() {
       return true;
     });
 
-  const layout =
-    spendingReportFeatureFlag &&
-    !isDashboardsFeatureEnabled &&
-    !baseLayout.find(({ type }) => type === 'spending-card')
-      ? [
-          ...baseLayout,
-          {
-            i: 'spending',
-            type: 'spending-card' as const,
-            x: 0,
-            y: Math.max(...baseLayout.map(({ y }) => y), 0) + 2,
-            w: 4,
-            h: 2,
-            minW: 3,
-            minH: 2,
-            meta: null,
-          },
-        ]
-      : baseLayout;
+  const layout = baseLayout;
 
   const closeNotifications = () => {
     dispatch(removeNotification('import'));
@@ -407,14 +388,10 @@ export function Overview() {
                               name: 'net-worth-card' as const,
                               text: t('Net worth graph'),
                             },
-                            ...(spendingReportFeatureFlag
-                              ? [
-                                  {
-                                    name: 'spending-card' as const,
-                                    text: t('Spending analysis'),
-                                  },
-                                ]
-                              : []),
+                            {
+                              name: 'spending-card' as const,
+                              text: t('Spending analysis'),
+                            },
                             {
                               name: 'markdown-card' as const,
                               text: t('Text widget'),

packages/desktop-client/src/components/reports/reports/SpendingCard.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useMemo } from 'react';
-import { Trans, useTranslation } from 'react-i18next';
+import { useTranslation } from 'react-i18next';
 
 import * as monthUtils from 'loot-core/src/shared/months';
 import { amountToCurrency } from 'loot-core/src/shared/util';
@@ -20,8 +20,6 @@ import { calculateSpendingReportTimeRange } from '../reportRanges';
 import { createSpendingSpreadsheet } from '../spreadsheets/spending-spreadsheet';
 import { useReport } from '../useReport';
 
-import { MissingReportCard } from './MissingReportCard';
-
 type SpendingCardProps = {
   widgetId: string;
   isEditing?: boolean;
@@ -70,17 +68,6 @@ export function SpendingCard({
     data.intervalData[todayDay][selection] -
       data.intervalData[todayDay].compare;
 
-  const spendingReportFeatureFlag = useFeatureFlag('spendingReport');
-
-  if (!spendingReportFeatureFlag) {
-    return (
-      <MissingReportCard isEditing={isEditing} onRemove={onRemove}>
-        <Trans>
-          The experimental spending report feature has not been enabled.
-        </Trans>
-      </MissingReportCard>
-    );
-  }
   return (
     <ReportCard
       isEditing={isEditing}

packages/desktop-client/src/components/settings/Experimental.tsx

@@ -92,13 +92,6 @@ export function ExperimentalFeatures() {
       primaryAction={
         expanded ? (
           <View style={{ gap: '1em' }}>
-            <FeatureToggle
-              flag="spendingReport"
-              feedbackLink="https://github.com/actualbudget/actual/issues/2820"
-            >
-              <Trans>Monthly spending report</Trans>
-            </FeatureToggle>
-
             <TrackingBudgetFeature />
 
             <FeatureToggle flag="goalTemplatesEnabled">

packages/desktop-client/src/hooks/useFeatureFlag.ts

@@ -5,7 +5,6 @@ import { useSyncedPref } from './useSyncedPref';
 const DEFAULT_FEATURE_FLAG_STATE: Record<FeatureFlag, boolean> = {
   reportBudget: false,
   goalTemplatesEnabled: false,
-  spendingReport: false,
   dashboards: false,
   actionTemplating: false,
   upcomingLengthAdjustment: false,

packages/loot-core/migrations/1722804019000_create_dashboard_table.js

@@ -17,7 +17,8 @@ export default async function runMigration(db) {
       INSERT INTO dashboard (id, type, width, height, x, y)
       VALUES
         ('${uuidv4()}','net-worth-card', 8, 2, 0, 0),
-        ('${uuidv4()}', 'cash-flow-card', 4, 2, 8, 0);
+        ('${uuidv4()}', 'cash-flow-card', 4, 2, 8, 0),
+        ('${uuidv4()}', 'spending-card', 4, 2, 0, 2);
     `);
 
     // Add custom reports to the dashboard

packages/loot-core/src/shared/dashboard.ts

@@ -17,4 +17,12 @@ export const DEFAULT_DASHBOARD_STATE: NewWidget[] = [
     y: 0,
     meta: null,
   },
+  {
+    type: 'spending-card',
+    width: 4,
+    height: 2,
+    x: 0,
+    y: 2,
+    meta: null,
+  },
 ];

packages/loot-core/src/types/prefs.d.ts

@@ -2,7 +2,6 @@ export type FeatureFlag =
   | 'dashboards'
   | 'reportBudget'
   | 'goalTemplatesEnabled'
-  | 'spendingReport'
   | 'actionTemplating'
   | 'upcomingLengthAdjustment';
 

upcoming-release-notes/3611.md

@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [carkom]
+---
+
+Removing feature flag from spending reports.