data service

Author: marcelnoehre

src/app/components/grid/grid.component.ts

@@ -1,6 +1,7 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { GridItem } from '../../interfaces/grid-item.interface';
 import { MatCardModule } from '@angular/material/card';
+import { DataService } from '../../services/data.service';
 
 @Component({
   selector: 'app-grid',
@@ -9,38 +10,14 @@ import { MatCardModule } from '@angular/material/card';
   templateUrl: './grid.component.html',
   styleUrl: './grid.component.scss'
 })
-export class GridComponent {
-  gridItems: GridItem[] = [{
-    title: 'VSCode Extension',
-    description: 'The sQeeZ extension for Visual Studio Code.',
-    image: './grid/vsc-extension.svg',
-    url: 'https://github.com/sQeeZ-scripting-language/language-server'
-  }, {
-    title: 'Playground',
-    description: 'The sQeeZ playground for testing scripts.',
-    image: './grid/playground.svg',
-    url: 'https://sqeez-scripting-language.github.io/playground/'
-  }, {
-    title: 'Documentation',
-    description: 'The sQeeZ documentation for learning the language.',
-    image: './grid/documentation.svg',
-    url: 'https://sqeez-scripting-language.github.io/documentation/'
-  }, {
-    title: 'GitHub',
-    description: 'The sQeeZ GitHub organization.',
-    image: './grid/github.svg',
-    url: 'https://github.com/sqeez-scripting-language/'
-  }, {
-    title: 'All Releases',
-    description: 'All sQeeZ releases on GitHub.',
-    image: './grid/releases.svg',
-    url: 'https://github.com/sQeeZ-scripting-language/interpreter/releases'
-  }, {
-    title: 'Contribute',
-    description: 'Contribute to the sQeeZ project on GitHub.',
-    image: './grid/contribute.svg',
-    url: 'https://github.com/sQeeZ-scripting-language#-become-part-of-the-sqeez-journey'
-  }];
+export class GridComponent implements OnInit {
+  gridItems: GridItem[] = [];
+
+  constructor(private data: DataService) {}
+
+  ngOnInit(): void {
+    this.gridItems = this.data.gridItems;
+  }
 
   redirectTo(url: string): void {
     // new tab

src/app/services/data.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { DataService } from './data.service';
+
+describe('DataService', () => {
+  let service: DataService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(DataService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/services/data.service.ts

@@ -0,0 +1,43 @@
+import { Injectable } from '@angular/core';
+import { GridItem } from '../interfaces/grid-item.interface';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class DataService {
+  private _gridItems: GridItem[] = [{
+    title: 'VSCode Extension',
+    description: 'The sQeeZ extension for Visual Studio Code.',
+    image: './grid/vsc-extension.svg',
+    url: 'https://github.com/sQeeZ-scripting-language/language-server'
+  }, {
+    title: 'Playground',
+    description: 'The sQeeZ playground for testing scripts.',
+    image: './grid/playground.svg',
+    url: 'https://sqeez-scripting-language.github.io/playground/'
+  }, {
+    title: 'Documentation',
+    description: 'The sQeeZ documentation for learning the language.',
+    image: './grid/documentation.svg',
+    url: 'https://sqeez-scripting-language.github.io/documentation/'
+  }, {
+    title: 'GitHub',
+    description: 'The sQeeZ GitHub organization.',
+    image: './grid/github.svg',
+    url: 'https://github.com/sqeez-scripting-language/'
+  }, {
+    title: 'All Releases',
+    description: 'All sQeeZ releases on GitHub.',
+    image: './grid/releases.svg',
+    url: 'https://github.com/sQeeZ-scripting-language/interpreter/releases'
+  }, {
+    title: 'Contribute',
+    description: 'Contribute to the sQeeZ project on GitHub.',
+    image: './grid/contribute.svg',
+    url: 'https://github.com/sQeeZ-scripting-language#-become-part-of-the-sqeez-journey'
+  }];
+
+  get gridItems(): GridItem[] {
+    return this._gridItems;
+  }
+}