source: .idea/copilotDiffState.xml@ 8449b9c

<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
  <component name="CopilotDiffPersistence">
    <option name="pendingDiffs">
      <map>
        <entry key="$PROJECT_DIR$/frontend/src/pages/Dashboard/pages/Finance/components/FinanceSummaryCard.jsx">
          <value>
            <PendingDiffInfo>
              <option name="filePath" value="$PROJECT_DIR$/frontend/src/pages/Dashboard/pages/Finance/components/FinanceSummaryCard.jsx" />
              <option name="originalContent" value="import React from &quot;react&quot;;&#10;import FinanceLegend from &quot;./FinanceLegend.jsx&quot;;&#10;import FinancePieChart from &quot;./FinancePieChart.jsx&quot;;&#10;&#10;export default function FinanceSummaryCard({ segments }) {&#10;  return (&#10;    &lt;div className=&quot;card bg-base-200 border border-base-300&quot;&gt;&#10;      &lt;div className=&quot;card-body&quot;&gt;&#10;        &lt;div className=&quot;flex items-start justify-between gap-6 flex-wrap&quot;&gt;&#10;          &lt;div&gt;&#10;            &lt;h2 className=&quot;card-title&quot;&gt;Budget distribution&lt;/h2&gt;&#10;            &lt;p className=&quot;text-sm opacity-80&quot;&gt;&#10;              Your current percentages (stored in your finance profile).&#10;            &lt;/p&gt;&#10;          &lt;/div&gt;&#10;        &lt;/div&gt;&#10;&#10;        &lt;div className=&quot;mt-4 grid grid-cols-1 gap-6 md:grid-cols-[auto_1fr] items-center&quot;&gt;&#10;          &lt;div className=&quot;flex justify-center md:justify-start&quot;&gt;&#10;            &lt;FinancePieChart segments={segments} size={180} /&gt;&#10;          &lt;/div&gt;&#10;          &lt;FinanceLegend segments={segments} /&gt;&#10;        &lt;/div&gt;&#10;      &lt;/div&gt;&#10;    &lt;/div&gt;&#10;  );&#10;}&#10;&#10;" />
              <option name="updatedContent" value="import React from &quot;react&quot;;&#10;import FinanceLegend from &quot;./FinanceLegend.jsx&quot;;&#10;import FinancePieChart from &quot;./FinancePieChart.jsx&quot;;&#10;&#10;function formatMoney(value) {&#10;  const n = Number(value);&#10;  if (!Number.isFinite(n)) return &quot;—&quot;;&#10;  try {&#10;    return new Intl.NumberFormat(undefined, {&#10;      minimumFractionDigits: 2,&#10;      maximumFractionDigits: 2,&#10;    }).format(n);&#10;  } catch {&#10;    return n.toFixed(2);&#10;  }&#10;}&#10;&#10;export default function FinanceSummaryCard({ segments, totalThisMonth, onEdit }) {&#10;  return (&#10;    &lt;div className=&quot;card bg-base-200 border border-base-300&quot;&gt;&#10;      &lt;div className=&quot;card-body&quot;&gt;&#10;        &lt;div className=&quot;flex items-start justify-between gap-6 flex-wrap&quot;&gt;&#10;          &lt;div&gt;&#10;            &lt;h2 className=&quot;card-title&quot;&gt;Budget distribution&lt;/h2&gt;&#10;            &lt;p className=&quot;text-sm opacity-80&quot;&gt;&#10;              Your current percentages (stored in your finance profile).&#10;            &lt;/p&gt;&#10;          &lt;/div&gt;&#10;&#10;          &lt;div className=&quot;flex items-center gap-2&quot;&gt;&#10;            &lt;button className=&quot;btn btn-outline btn-sm&quot; onClick={onEdit}&gt;&#10;              Edit&#10;            &lt;/button&gt;&#10;          &lt;/div&gt;&#10;        &lt;/div&gt;&#10;&#10;        &lt;div className=&quot;mt-4&quot;&gt;&#10;          &lt;div className=&quot;rounded-lg border border-base-300 bg-base-100 p-4&quot;&gt;&#10;            &lt;div className=&quot;text-sm opacity-70&quot;&gt;Total money earned this month&lt;/div&gt;&#10;            &lt;div className=&quot;text-2xl font-bold tabular-nums&quot;&gt;&#10;              {formatMoney(totalThisMonth)}&#10;            &lt;/div&gt;&#10;          &lt;/div&gt;&#10;        &lt;/div&gt;&#10;&#10;        &lt;div className=&quot;mt-6 grid grid-cols-1 gap-6 md:grid-cols-[auto_1fr] items-center&quot;&gt;&#10;          &lt;div className=&quot;flex justify-center md:justify-start&quot;&gt;&#10;            &lt;FinancePieChart segments={segments} size={180} /&gt;&#10;          &lt;/div&gt;&#10;&#10;          &lt;div className=&quot;space-y-4&quot;&gt;&#10;            &lt;FinanceLegend segments={segments} /&gt;&#10;&#10;            &lt;div className=&quot;divider my-0&quot; /&gt;&#10;&#10;            &lt;div className=&quot;space-y-2 text-sm&quot;&gt;&#10;              {segments.map((s) =&gt; {&#10;                const pct = Number(s.value) || 0;&#10;                const allocated = ((Number(totalThisMonth) || 0) * pct) / 100;&#10;                return (&#10;                  &lt;div&#10;                    key={s.key}&#10;                    className=&quot;flex items-center justify-between gap-3&quot;&#10;                  &gt;&#10;                    &lt;div className=&quot;flex items-center gap-2&quot;&gt;&#10;                      &lt;span&#10;                        className=&quot;inline-block h-3 w-3 rounded&quot;&#10;                        style={{ backgroundColor: s.color }}&#10;                      /&gt;&#10;                      &lt;span className=&quot;opacity-80&quot;&gt;&#10;                        {s.label} allocation&#10;                      &lt;/span&gt;&#10;                    &lt;/div&gt;&#10;                    &lt;span className=&quot;font-medium tabular-nums&quot;&gt;&#10;                      {formatMoney(allocated)}&#10;                    &lt;/span&gt;&#10;                  &lt;/div&gt;&#10;                );&#10;              })}&#10;            &lt;/div&gt;&#10;          &lt;/div&gt;&#10;        &lt;/div&gt;&#10;      &lt;/div&gt;&#10;    &lt;/div&gt;&#10;  );&#10;}&#10;&#10;" />
            </PendingDiffInfo>
          </value>
        </entry>
      </map>
    </option>
  </component>
</project>