Merge pull request #43 from IAM5K/expense/UI-uniformity-improvements

Expense/UI uniformity improvements

.editorconfig

@@ -12,5 +12,5 @@ trim_trailing_whitespace = true
 quote_type = double
 
 [*.md]
-max_line_length = off
+max_line_length = 100
 trim_trailing_whitespace = false

.vscode/settings.json

@@ -24,11 +24,6 @@
     "Sandeep",
     "subdir"
   ],
-  "editor.formatOnSave": true,
-  "prettier.htmlWhitespaceSensitivity": "ignore",
-  "[github-actions-workflow]": {
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
   "[typescript]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
@@ -43,5 +38,44 @@
   },
   "[jsonc]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
-  }
+  },
+  "prettier.htmlWhitespaceSensitivity": "ignore",
+  "editor.formatOnSave": true,
+  "[github-actions-workflow]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "todohighlight.keywords": [
+    {
+      "text": "Note:",
+      "color": "lime",
+      "backgroundColor": "rgba(0, 0, 0, 0.2)",
+      "overviewRulerColor": "grey",
+      "isWholeLine": true // Highlight the complete line
+    },
+    {
+      "text": "Info:",
+      "color": "#00FFFF", // Aqua color
+      "backgroundColor": "rgba(0, 0, 0, 0.2)",
+      "isWholeLine": true // Highlight the complete line
+    },
+    {
+      "text": "FIXME:",
+      "color": "orange",
+      "backgroundColor": "rgba(0, 0, 0, 0.2)",
+      "isWholeLine": true // Highlight the complete line
+    },
+    {
+      "text": "TODO:",
+      "color": "red",
+      "backgroundColor": "rgba(0, 0, 0, 0.2)",
+      "borderRadius": "2px", // Using borderRadius along with `border`
+      "isWholeLine": true // Highlight the complete line
+    },
+    {
+      "text": "CHORE:",
+      "color": "#FF00FF", // Magenta color
+      "backgroundColor": "rgba(0, 0, 0, 0.2)",
+      "isWholeLine": true // Highlight the complete line
+    }
+  ]
 }

src/app/models/class/seoTags/seo.ts

@@ -100,4 +100,17 @@ export class SeoTags {
       content: "Sandeep Kumar",
     },
   ];
+
+  public static expensePageTags: seoMetaTag[] = [
+    {
+      name: "description",
+      content:
+        "Summarize all your expenses here. Summarize will help you to check them down in the list immediately and later Analyze them to have an understanding about where you can spend wisely and how to manage your expenses in better way. Soon we will also give finance tips that will help you better.",
+    },
+    {
+      name: "keyword",
+      content:
+        "Summarize, Summarize, arise, arize, money management, expense management, cost analysis,summarize-ng, summarize-ng, digital dairy, expense analysis",
+    },
+  ];
 }

src/app/models/interface/expense.interface.ts

@@ -0,0 +1,17 @@
+export interface ExpenseData {
+  createdAt: {
+    seconds: number;
+    nanoseconds: number;
+  };
+  date: string;
+  spentOn?: string;
+  spendedOn: string;
+  description: string;
+  amount: number;
+  type: string;
+  updatedAt: {
+    seconds: number;
+    nanoseconds: number;
+  };
+  idField?: string;
+}

src/app/models/interface/masterData.model.ts

@@ -10,6 +10,7 @@ export interface seoMetaTag {
   content: string;
 }
 
+export interface Expense {}
 export interface Options {
   title: string;
   value: string | Date | null;

src/app/pages/achievement/achievement.page.ts

@@ -21,7 +21,7 @@ export class AchievementPage implements OnInit {
     {
       name: "keyword",
       content:
-        "summarize-ng, Summarize, arise, arize, achievement managemnet, achievements, achievement analysis,summarize-ng, summarize-ng, digital dairy, motivation from Achievement",
+        "summarize-ng, Summarize, arise, arize, achievement management, achievements, achievement analysis,summarize-ng, summarize-ng, digital dairy, motivation from Achievement",
     },
     {
       name: "author",
@@ -34,7 +34,7 @@ export class AchievementPage implements OnInit {
   currentTime = new Date().getHours() + ":" + new Date().getMinutes();
   achievementTypes = [
     { title: "Adventure", value: "Adventure" },
-    { title: "Bussiness", value: "Bussiness" },
+    { title: "Business", value: "Business" },
     { title: "Career", value: "Career" },
     { title: "Enjoyment", value: "Enjoyment" },
     { title: "Family", value: "Family" },

src/app/pages/expense/component/filter-expense/filter-expense.component.html

@@ -0,0 +1,3 @@
+<p>
+  filter-expense works!
+</p>

src/app/pages/expense/component/filter-expense/filter-expense.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { FilterExpenseComponent } from './filter-expense.component';
+
+describe('FilterExpenseComponent', () => {
+  let component: FilterExpenseComponent;
+  let fixture: ComponentFixture<FilterExpenseComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ FilterExpenseComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(FilterExpenseComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/expense/component/filter-expense/filter-expense.component.ts

@@ -0,0 +1,14 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-filter-expense',
+  templateUrl: './filter-expense.component.html',
+  styleUrls: ['./filter-expense.component.scss'],
+})
+export class FilterExpenseComponent  implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {}
+
+}

src/app/pages/expense/components/analyze/analyze.component.html

@@ -25,8 +25,8 @@
     </ion-card>
     <ion-card color="primary">
       <ion-card-header>
-        <ion-card-title>₹ {{ totalBudget }}</ion-card-title>
-        <ion-card-subtitle>Total Budget</ion-card-subtitle>
+        <ion-card-title>₹ {{totalBudget}}</ion-card-title>
+        <ion-card-subtitle>Budget</ion-card-subtitle>
       </ion-card-header>
     </ion-card>
     <ion-card color="secondary">
@@ -36,46 +36,29 @@
           <span *ngIf="currentExpense === 0">Calculating</span>
           <span *ngIf="currentExpense !== 0">{{ currentExpense }}</span>
         </ion-card-title>
-        <ion-card-subtitle>This Month Expenses</ion-card-subtitle>
+        <ion-card-subtitle>Remaining Balance</ion-card-subtitle>
       </ion-card-header>
     </ion-card>
     <ion-card color="danger">
       <ion-card-header>
-        <ion-card-title>₹ {{ currentBudget }}</ion-card-title>
-        <ion-card-subtitle>This Month Budget</ion-card-subtitle>
+        <ion-card-title>₹ {{currentBudget}}</ion-card-title>
+        <ion-card-subtitle>Exceeding Amount</ion-card-subtitle>
       </ion-card-header>
     </ion-card>
   </div>
-  <div class="card ion-padding line-graph">
+  <h2 class="ion-text-center">Under migration for new UI <br> Will be available soon!</h2>
+  <!-- <div class="card ion-padding line-graph">
     <div class="linechart">
       <h1>Current month total expenses</h1>
-      <canvas
-        #chartA
-        baseChart
-        [width]="graphWidth"
-        [height]="graphHeight"
-        [type]="'line'"
-        [data]="currentMonthExpenseData"
-        [options]="monthlyChartOptions"
-        [legend]="monthlyChartLegend"
-      ></canvas>
+      <canvas #chartA baseChart [width]="graphWidth" [height]="graphHeight" [type]="'line'" [data]="currentMonthExpenseData" [options]="monthlyChartOptions" [legend]="monthlyChartLegend">
+      </canvas>
     </div>
   </div>
   <div class="card ion-padding">
     <div class="pie-chart">
       <h2>Current month category wise expenses</h2>
-      <canvas
-        #chartP
-        baseChart
-        [type]="'pie'"
-        [width]="graphWidth"
-        [height]="graphHeight"
-        [datasets]="pieChartDatasets"
-        [labels]="pieChartLabels"
-        [options]="pieChartOptions"
-        [plugins]="pieChartPlugins"
-        [legend]="pieChartLegend"
-      ></canvas>
+      <canvas #chartP baseChart [type]="'pie'" [width]="graphWidth" [height]="graphHeight" [datasets]="pieChartDatasets" [labels]="pieChartLabels" [options]="pieChartOptions" [plugins]="pieChartPlugins" [legend]="pieChartLegend">
+      </canvas>
     </div>
-  </div>
+  </div> -->
 </ion-content>