feat(web,server): user memory settings (#3628)

* feat(web,server): user preference for time-based memories

* chore: open api

* dev: mobile

* fix: update

* mobile work

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>
Co-authored-by: Alex Tran <Alex.Tran@conductix.com>

web/src/api/open-api/api.ts

@@ -954,6 +954,12 @@ export interface CreateUserDto {
      * @memberof CreateUserDto
      */
     'lastName': string;
+    /**
+     * 
+     * @type {boolean}
+     * @memberof CreateUserDto
+     */
+    'memoriesEnabled'?: boolean;
     /**
      * 
      * @type {string}
@@ -2995,6 +3001,12 @@ export interface UpdateUserDto {
      * @memberof UpdateUserDto
      */
     'lastName'?: string;
+    /**
+     * 
+     * @type {boolean}
+     * @memberof UpdateUserDto
+     */
+    'memoriesEnabled'?: boolean;
     /**
      * 
      * @type {string}
@@ -3124,6 +3136,12 @@ export interface UserResponseDto {
      * @memberof UserResponseDto
      */
     'lastName': string;
+    /**
+     * 
+     * @type {boolean}
+     * @memberof UserResponseDto
+     */
+    'memoriesEnabled': boolean;
     /**
      * 
      * @type {string}

web/src/lib/components/user-settings-page/memories-settings.svelte

@@ -0,0 +1,49 @@
+<script lang="ts">
+  import {
+    notificationController,
+    NotificationType,
+  } from '$lib/components/shared-components/notification/notification';
+  import { api, UserResponseDto } from '@api';
+  import { fade } from 'svelte/transition';
+  import { handleError } from '../../utils/handle-error';
+  import SettingSwitch from '../admin-page/settings/setting-switch.svelte';
+  import Button from '../elements/buttons/button.svelte';
+
+  export let user: UserResponseDto;
+
+  const handleSave = async () => {
+    try {
+      const { data } = await api.userApi.updateUser({
+        updateUserDto: {
+          id: user.id,
+          memoriesEnabled: user.memoriesEnabled,
+        },
+      });
+
+      Object.assign(user, data);
+
+      notificationController.show({ message: 'Saved settings', type: NotificationType.Info });
+    } catch (error) {
+      handleError(error, 'Unable to update settings');
+    }
+  };
+</script>
+
+<section class="my-4">
+  <div in:fade={{ duration: 500 }}>
+    <form autocomplete="off" on:submit|preventDefault>
+      <div class="ml-4 mt-4 flex flex-col gap-4">
+        <div class="ml-4">
+          <SettingSwitch
+            title="Time-based memories"
+            subtitle="Photos from previous years"
+            bind:checked={user.memoriesEnabled}
+          />
+        </div>
+        <div class="flex justify-end">
+          <Button type="submit" size="sm" on:click={() => handleSave()}>Save</Button>
+        </div>
+      </div>
+    </form>
+  </div>
+</section>

web/src/lib/components/user-settings-page/user-settings-list.svelte

@@ -4,10 +4,11 @@
   import { onMount } from 'svelte';
   import SettingAccordion from '../admin-page/settings/setting-accordion.svelte';
   import ChangePasswordSettings from './change-password-settings.svelte';
-  import OAuthSettings from './oauth-settings.svelte';
-  import UserAPIKeyList from './user-api-key-list.svelte';
   import DeviceList from './device-list.svelte';
+  import MemoriesSettings from './memories-settings.svelte';
+  import OAuthSettings from './oauth-settings.svelte';
   import PartnerSettings from './partner-settings.svelte';
+  import UserAPIKeyList from './user-api-key-list.svelte';
   import UserProfileSettings from './user-profile-settings.svelte';
 
   export let user: UserResponseDto;
@@ -39,6 +40,10 @@
   <DeviceList />
 </SettingAccordion>
 
+<SettingAccordion title="Memories" subtitle="Manage what you see in your memories.">
+  <MemoriesSettings {user} />
+</SettingAccordion>
+
 {#if oauthEnabled}
   <SettingAccordion
     title="OAuth"

web/src/routes/(user)/photos/+page.svelte

@@ -59,7 +59,9 @@
   <svelte:fragment slot="content">
     {#if assetCount}
       <AssetGrid {assetStore} {assetInteractionStore} removeAction={AssetAction.ARCHIVE}>
-        <MemoryLane />
+        {#if data.user.memoriesEnabled}
+          <MemoryLane />
+        {/if}
       </AssetGrid>
     {:else}
       <EmptyPlaceholder text="CLICK TO UPLOAD YOUR FIRST PHOTO" actionHandler={() => openFileUploadDialog()} />

web/src/test-data/factories/user-factory.ts

@@ -15,5 +15,6 @@ export const userFactory = Sync.makeFactory<UserResponseDto>({
   createdAt: Sync.each(() => faker.date.past().toISOString()),
   deletedAt: null,
   updatedAt: Sync.each(() => faker.date.past().toISOString()),
+  memoriesEnabled: true,
   oauthId: '',
 });