Feature/add privacy policy page (#1028)

* Add privacy policy page

* Update changelog

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
+### Added
+
+- Added a _Privacy Policy_ page
+
 ### Changed
 
 - Simplified the header

apps/client/src/app/app-routing.module.ts

@@ -16,6 +16,13 @@ const routes: Routes = [
         (m) => m.ChangelogPageModule
       )
   },
+  {
+    path: 'about/privacy-policy',
+    loadChildren: () =>
+      import('./pages/about/privacy-policy/privacy-policy-page.module').then(
+        (m) => m.PrivacyPolicyPageModule
+      )
+  },
   {
     path: 'account',
     loadChildren: () =>

apps/client/src/app/core/auth.guard.ts

@@ -17,6 +17,7 @@ export class AuthGuard implements CanActivate {
   private static PUBLIC_PAGE_ROUTES = [
     '/about',
     '/about/changelog',
+    '/about/privacy-policy',
     '/blog',
     '/de/blog',
     '/en/blog',

apps/client/src/app/pages/about/about-page.html

@@ -174,8 +174,8 @@
 
   <div class="row">
     <div
-      class="col-md-6 col-xs-12 my-2"
-      [ngClass]="{ 'offset-md-3': !hasPermissionForBlog }"
+      class="col-md-4 col-xs-12 my-2"
+      [ngClass]="{ 'offset-md-4': !hasPermissionForBlog }"
     >
       <a
         class="py-2 w-100"
@@ -186,7 +186,17 @@
         >Changelog & License</a
       >
     </div>
-    <div *ngIf="hasPermissionForBlog" class="col-md-6 col-xs-12 my-2">
+    <div *ngIf="hasPermissionForSubscription" class="col-md-4 col-xs-12 my-2">
+      <a
+        class="py-2 w-100"
+        color="primary"
+        i18n
+        mat-stroked-button
+        [routerLink]="['/about', 'privacy-policy']"
+        >Privacy Policy</a
+      >
+    </div>
+    <div *ngIf="hasPermissionForBlog" class="col-md-4 col-xs-12 my-2">
       <a
         class="py-2 w-100"
         color="primary"

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page-routing.module.ts

@@ -0,0 +1,15 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { AuthGuard } from '@ghostfolio/client/core/auth.guard';
+
+import { PrivacyPolicyPageComponent } from './privacy-policy-page.component';
+
+const routes: Routes = [
+  { path: '', component: PrivacyPolicyPageComponent, canActivate: [AuthGuard] }
+];
+
+@NgModule({
+  exports: [RouterModule],
+  imports: [RouterModule.forChild(routes)]
+})
+export class PrivacyPolicyPageRoutingModule {}

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page.component.ts

@@ -0,0 +1,22 @@
+import { Component, OnDestroy } from '@angular/core';
+import { Subject } from 'rxjs';
+
+@Component({
+  host: { class: 'page' },
+  selector: 'gf-privacy-policy-page',
+  styleUrls: ['./privacy-policy-page.scss'],
+  templateUrl: './privacy-policy-page.html'
+})
+export class PrivacyPolicyPageComponent implements OnDestroy {
+  private unsubscribeSubject = new Subject<void>();
+
+  /**
+   * @constructor
+   */
+  public constructor() {}
+
+  public ngOnDestroy() {
+    this.unsubscribeSubject.next();
+    this.unsubscribeSubject.complete();
+  }
+}

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page.html

@@ -0,0 +1,8 @@
+<div class="container">
+  <div class="mb-5 row">
+    <div class="col">
+      <h3 class="mb-3 text-center" i18n>Privacy Policy</h3>
+      <markdown [src]="'assets/privacy-policy.md'"></markdown>
+    </div>
+  </div>
+</div>

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page.module.ts

@@ -0,0 +1,17 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { MarkdownModule } from 'ngx-markdown';
+
+import { PrivacyPolicyPageRoutingModule } from './privacy-policy-page-routing.module';
+import { PrivacyPolicyPageComponent } from './privacy-policy-page.component';
+
+@NgModule({
+  declarations: [PrivacyPolicyPageComponent],
+  imports: [
+    CommonModule,
+    MarkdownModule.forChild(),
+    PrivacyPolicyPageRoutingModule
+  ],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA]
+})
+export class PrivacyPolicyPageModule {}

apps/client/src/app/pages/about/privacy-policy/privacy-policy-page.scss

@@ -0,0 +1,21 @@
+:host {
+  color: rgb(var(--dark-primary-text));
+  display: block;
+
+  ::ng-deep {
+    markdown {
+      a {
+        color: rgba(var(--palette-primary-500), 1);
+        font-weight: 500;
+
+        &:hover {
+          color: rgba(var(--palette-primary-300), 1);
+        }
+      }
+    }
+  }
+}
+
+:host-context(.is-dark-theme) {
+  color: rgb(var(--light-primary-text));
+}

apps/client/src/assets/privacy-policy.md

@@ -0,0 +1,80 @@
+Last updated: June 18, 2022
+
+This Privacy Policy describes Our policies and procedures on the collection, use and disclosure of Your information when You use the Service and tells You about Your privacy rights and how the law protects You.
+
+We use Your Personal data to provide and improve the Service. By using the Service, You agree to the collection and use of information in accordance with this Privacy Policy.
+
+## Interpretation and Definitions
+
+### Interpretation
+
+The words of which the initial letter is capitalized have meanings defined under the following conditions. The following definitions shall have the same meaning regardless of whether they appear in singular or in plural.
+
+### Definitions
+
+For the purposes of this Privacy Policy:
+
+- **Account** means a unique account created for You to access our Service or parts of our Service.
+- **Application** means the software program provided by the Company downloaded by You on any electronic device, named Ghostfolio App.
+- **Company** (referred to as either "the Company", "We", "Us" or "Our" in this Agreement) refers to Ghostfolio.
+- **Country** refers to: Switzerland
+- **Device** means any device that can access the Service such as a computer, a cellphone or a digital tablet.
+- **Personal Data** is any information that relates to an identified or identifiable individual.
+- **Service** refers to the Application.
+- **Service Provider** means any natural or legal person who processes the data on behalf of the Company. It refers to third-party companies or individuals employed by the Company to facilitate the Service, to provide the Service on behalf of the Company, to perform services related to the Service or to assist the Company in analyzing how the Service is used.
+- **Usage Data** refers to data collected automatically, either generated by the use of the Service or from the Service infrastructure itself (for example, the duration of a page visit).
+- **You** means the individual accessing or using the Service, or the company, or other legal entity on behalf of which such individual is accessing or using the Service, as applicable.
+
+## Collecting and Using Your Personal Data
+
+### Types of Data Collected
+
+#### Personal Data
+
+While using Our Service, We may ask You to provide Us with certain personally identifiable information that can be used to identify You. Personally identifiable information may include, but is not limited to:
+
+- Usage Data
+- User Id
+
+#### Usage Data
+
+Usage Data is collected automatically when using the Service.
+
+Usage Data may include information such as the time and date of Your visit, the unique user identifier and other diagnostic data.
+
+When You access the Service by or through a mobile device, We may collect certain information automatically, including, but not limited to, the unique user identifier and other diagnostic data.
+
+### Use of Your Personal Data
+
+The Company may use Personal Data for the following purposes:
+
+- **To provide and maintain our Service**, including to monitor the usage of our Service.
+- **For other purposes**: We may use Your information for other purposes, such as data analysis, identifying usage trends, determining the effectiveness of our promotional campaigns and to evaluate and improve our Service, products, services, marketing and your experience.
+
+### Retention of Your Personal Data
+
+The Company will retain Your Personal Data only for as long as is necessary for the purposes set out in this Privacy Policy. We will retain and use Your Personal Data to the extent necessary to comply with our legal obligations (for example, if we are required to retain your data to comply with applicable laws), resolve disputes, and enforce our legal agreements and policies.
+
+The Company will also retain Usage Data for internal analysis purposes. Usage Data is generally retained for a shorter period of time, except when this data is used to strengthen the security or to improve the functionality of Our Service, or We are legally obligated to retain this data for longer time periods.
+
+### Disclosure of Your Personal Data
+
+#### Security of Your Personal Data
+
+The security of Your Personal Data is important to Us, but remember that no method of transmission over the Internet, or method of electronic storage is 100% secure. While We strive to store no personal data at all to protect Your Personal Data, We cannot guarantee its absolute security.
+
+## Links to Other Websites
+
+Our Service may contain links to other websites that are not operated by Us. If You click on a third party link, You will be directed to that third party's site. We strongly advise You to review the Privacy Policy of every site You visit.
+
+We have no control over and assume no responsibility for the content, privacy policies or practices of any third party sites or services.
+
+## Changes to this Privacy Policy
+
+We may update Our Privacy Policy from time to time.
+
+You are advised to review this Privacy Policy periodically for any changes. Changes to this Privacy Policy are effective when they are posted on this page.
+
+## Contact Us
+
+If you have any questions about this Privacy Policy, You can contact us [here](https://ghostfol.io/about).

apps/client/src/assets/robots.txt

@@ -1,5 +1,6 @@
 User-agent: *
 Allow: /
+Disallow: /about/privacy-policy
 Disallow: /p/*
 
 Sitemap: https://ghostfol.io/sitemap.xml