fix(billing): fix CI lint errors for styled component prefix and file naming

- Rename BillingLineChartContainer/BillingPieChartContainer to Styled* prefix
- Rename billing-analytics.utils.ts to billingAnalyticsUtils.ts (camelCase)

Made-with: Cursor

packages/twenty-front/src/modules/billing/components/BillingChartContainers.tsx

@@ -1,11 +1,11 @@
 import { styled } from '@linaria/react';
 
-export const BillingLineChartContainer = styled.div`
+export const StyledBillingLineChartContainer = styled.div`
   height: 200px;
   width: 100%;
 `;
 
-export const BillingPieChartContainer = styled.div`
+export const StyledBillingPieChartContainer = styled.div`
   height: 220px;
   width: 100%;
 `;

packages/twenty-front/src/modules/billing/components/SettingsBillingAnalyticsSection.tsx

@@ -1,7 +1,7 @@
 import { BillingChartTooltip } from '@/billing/components/BillingChartTooltip';
 import {
-  BillingLineChartContainer,
-  BillingPieChartContainer,
+  StyledBillingLineChartContainer,
+  StyledBillingPieChartContainer,
 } from '@/billing/components/BillingChartContainers';
 import { SettingsBillingLabelValueItem } from '@/billing/components/internal/SettingsBillingLabelValueItem';
 import { SubscriptionInfoContainer } from '@/billing/components/SubscriptionInfoContainer';
@@ -11,7 +11,7 @@ import {
   getExecutionTypeLabel,
   getPeriodDates,
   getPeriodOptions,
-} from '@/billing/utils/billing-analytics.utils';
+} from '@/billing/utils/billingAnalyticsUtils';
 import { useNumberFormat } from '@/localization/hooks/useNumberFormat';
 import { CHART_MOTION_CONFIG } from '@/page-layout/widgets/graph/constants/ChartMotionConfig';
 import { useLineChartTheme } from '@/page-layout/widgets/graph/graph-widget-line-chart/hooks/useLineChartTheme';
@@ -209,7 +209,7 @@ export const SettingsBillingAnalyticsSection = () => {
             }
           />
           <SubscriptionInfoContainer>
-            <BillingPieChartContainer>
+            <StyledBillingPieChartContainer>
               <ResponsivePie
                 data={pieData}
                 margin={{ top: 20, right: 80, bottom: 20, left: 80 }}
@@ -233,7 +233,7 @@ export const SettingsBillingAnalyticsSection = () => {
                   />
                 )}
               />
-            </BillingPieChartContainer>
+            </StyledBillingPieChartContainer>
           </SubscriptionInfoContainer>
         </Section>
       )}
@@ -255,7 +255,7 @@ export const SettingsBillingAnalyticsSection = () => {
             }
           />
           <SubscriptionInfoContainer>
-            <BillingLineChartContainer>
+            <StyledBillingLineChartContainer>
               <ResponsiveLine
                 data={lineData}
                 margin={{ top: 10, right: 20, bottom: 30, left: 50 }}
@@ -307,7 +307,7 @@ export const SettingsBillingAnalyticsSection = () => {
                   />
                 )}
               />
-            </BillingLineChartContainer>
+            </StyledBillingLineChartContainer>
           </SubscriptionInfoContainer>
         </Section>
       )}

packages/twenty-front/src/pages/settings/SettingsUsageUserDetail.tsx

@@ -1,7 +1,7 @@
 import { BillingChartTooltip } from '@/billing/components/BillingChartTooltip';
 import {
-  BillingLineChartContainer,
-  BillingPieChartContainer,
+  StyledBillingLineChartContainer,
+  StyledBillingPieChartContainer,
 } from '@/billing/components/BillingChartContainers';
 import { SettingsBillingLabelValueItem } from '@/billing/components/internal/SettingsBillingLabelValueItem';
 import { SubscriptionInfoContainer } from '@/billing/components/SubscriptionInfoContainer';
@@ -11,7 +11,7 @@ import {
   getExecutionTypeLabel,
   getPeriodDates,
   getPeriodOptions,
-} from '@/billing/utils/billing-analytics.utils';
+} from '@/billing/utils/billingAnalyticsUtils';
 import { useNumberFormat } from '@/localization/hooks/useNumberFormat';
 import { CHART_MOTION_CONFIG } from '@/page-layout/widgets/graph/constants/ChartMotionConfig';
 import { useLineChartTheme } from '@/page-layout/widgets/graph/graph-widget-line-chart/hooks/useLineChartTheme';
@@ -239,7 +239,7 @@ export const SettingsUsageUserDetail = () => {
               }
             />
             <SubscriptionInfoContainer>
-              <BillingLineChartContainer>
+              <StyledBillingLineChartContainer>
                 <ResponsiveLine
                   data={lineData}
                   margin={{ top: 10, right: 20, bottom: 30, left: 50 }}
@@ -292,7 +292,7 @@ export const SettingsUsageUserDetail = () => {
                     />
                   )}
                 />
-              </BillingLineChartContainer>
+              </StyledBillingLineChartContainer>
             </SubscriptionInfoContainer>
           </Section>
         )}
@@ -314,7 +314,7 @@ export const SettingsUsageUserDetail = () => {
               }
             />
             <SubscriptionInfoContainer>
-              <BillingPieChartContainer>
+              <StyledBillingPieChartContainer>
                 <ResponsivePie
                   data={pieData}
                   margin={{ top: 20, right: 80, bottom: 20, left: 80 }}
@@ -338,7 +338,7 @@ export const SettingsUsageUserDetail = () => {
                     />
                   )}
                 />
-              </BillingPieChartContainer>
+              </StyledBillingPieChartContainer>
             </SubscriptionInfoContainer>
           </Section>
         )}