Merge branch 'main' into back-feed

homebase-id · Dec 15, 2023 · 8157c91 · 8157c91
2 parents b480dee + 16b2d9a
commit 8157c91
Show file tree

Hide file tree

Showing 24 changed files with 148 additions and 44 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/common-app/src/hooks/socialFeed/index.ts b/packages/common-app/src/hooks/socialFeed/index.ts
@@ -4,5 +4,6 @@ export * from './post/usePostComposer';
 export * from './useSocialChannel';
 export * from './useSocialChannels';
 export * from './useSocialFeed';
+export * from './useManageSocialFeed';
 export * from './useSocialPost';
 export * from './article/useArticleComposer';
diff --git a/packages/common-app/src/hooks/socialFeed/useManageSocialFeed.ts b/packages/common-app/src/hooks/socialFeed/useManageSocialFeed.ts
@@ -0,0 +1,26 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { BlogConfig, PostContent } from '@youfoundation/js-lib/public';
+
+import { useDotYouClient } from '@youfoundation/common-app';
+import { DriveSearchResult, deleteFile } from '@youfoundation/js-lib/core';
+
+export const useManageSocialFeed = () => {
+  const dotYouClient = useDotYouClient().getDotYouClient();
+  const queryClient = useQueryClient();
+
+  const removeFromFeed = async ({ postFile }: { postFile: DriveSearchResult<PostContent> }) => {
+    return await deleteFile(dotYouClient, BlogConfig.FeedDrive, postFile.fileId);
+  };
+
+  return {
+    removeFromFeed: useMutation({
+      mutationFn: removeFromFeed,
+      onMutate: async ({ postFile }) => {
+        //
+      },
+      onSettled: () => {
+        queryClient.invalidateQueries({ queryKey: ['social-feeds'] });
+      },
+    }),
+  };
+};
diff --git a/packages/common-app/src/socialFeed/Blocks/Meta/Meta.tsx b/packages/common-app/src/socialFeed/Blocks/Meta/Meta.tsx
@@ -1,6 +1,13 @@
 import { Suspense } from 'react';
 import { ChannelDefinition, EmbeddedPost, PostContent } from '@youfoundation/js-lib/public';
-import { ActionGroupOptionProps, Lock, useIsConnected } from '@youfoundation/common-app';
+import {
+  ActionGroupOptionProps,
+  Block,
+  Lock,
+  Times,
+  useIsConnected,
+  useManageSocialFeed,
+} from '@youfoundation/common-app';
 
 import {
   ChannelDefinitionVm,
@@ -92,21 +99,40 @@ export const PostMeta = ({
           <OwnerActions postFile={postFile} />
         </Suspense>
       ) : odinId ? (
-        <ExternalActions odinId={odinId} />
+        <ExternalActions odinId={odinId} postFile={postFile} />
       ) : null}
     </div>
   );
 };
 
-const ExternalActions = ({ odinId }: { odinId: string }) => {
+const ExternalActions = ({
+  odinId,
+  postFile,
+}: {
+  odinId: string;
+  postFile: DriveSearchResult<PostContent>;
+}) => {
   const identity = useDotYouClient().getIdentity();
+  const { mutateAsync: removeFromMyFeed } = useManageSocialFeed().removeFromFeed;
 
   const options: ActionGroupOptionProps[] = [
     {
       icon: UserX,
-      label: `${t('Edit what I follow from')} "${odinId}"`,
+      label: `${t('Follow settings')}`,
       href: `https://${identity}/owner/follow/following/${odinId}`,
     },
+    {
+      icon: Times,
+      label: `${t('Remove this post from my feed')}`,
+      onClick: () => {
+        removeFromMyFeed({ postFile });
+      },
+    },
+    {
+      icon: Block,
+      label: `${t('Block this user')}`,
+      href: `https://${identity}/owner/connections/${odinId}/block`,
+    },
   ];
 
   return (

diff --git a/packages/js-lib/package.json b/packages/js-lib/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.0.2-alpha.18",
+  "version": "0.0.2-alpha.20",
   "name": "@youfoundation/js-lib",
   "author": "YouFoundation",
   "description": "JavaScript SDK for the DotYouCore api",

diff --git a/packages/js-lib/src/core/DriveData/SecurityHelpers.ts b/packages/js-lib/src/core/DriveData/SecurityHelpers.ts
@@ -11,7 +11,8 @@ import {
   mergeByteArrays,
 } from '../../helpers/DataUtil';
 import { EncryptedKeyHeader, FileMetadata, KeyHeader } from './File/DriveFileTypes';
-import { OdinBlob } from '../OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 /// Encryption
 export const encryptKeyHeader = async (

diff --git a/packages/js-lib/src/core/DriveData/Upload/DriveFileUploadProvider.ts b/packages/js-lib/src/core/DriveData/Upload/DriveFileUploadProvider.ts
@@ -19,7 +19,8 @@ import {
 } from './UploadHelpers';
 import { getFileHeader, getPayloadBytes, getThumbBytes } from '../File/DriveFileProvider';
 import { getRandom16ByteArray } from '../../../helpers/DataUtil';
-import { OdinBlob } from '../../OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 const isDebug = hasDebugFlag();
 

diff --git a/packages/js-lib/src/core/DriveData/Upload/UploadHelpers.ts b/packages/js-lib/src/core/DriveData/Upload/UploadHelpers.ts
@@ -23,6 +23,9 @@ import {
 import { ThumbnailFile, SystemFileType, PayloadFile, KeyHeader } from '../File/DriveFileTypes';
 import { OdinBlob } from '../../OdinBlob';
 
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
+
 const EMPTY_KEY_HEADER: KeyHeader = {
   iv: new Uint8Array(Array(16).fill(0)),
   aesKey: new Uint8Array(Array(16).fill(0)),

diff --git a/packages/js-lib/src/helpers/DataUtil.ts b/packages/js-lib/src/helpers/DataUtil.ts
@@ -2,7 +2,8 @@ import { Guid } from 'guid-typescript';
 
 import md5 from './md5/md5';
 import { AccessControlList, EncryptedKeyHeader, PayloadDescriptor } from '../core/core';
-import { OdinBlob } from '../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 export const getRandom16ByteArray = (): Uint8Array => {
   return crypto.getRandomValues(new Uint8Array(16));

diff --git a/packages/js-lib/src/helpers/ImageMerger.ts b/packages/js-lib/src/helpers/ImageMerger.ts
@@ -1,6 +1,7 @@
 import { base64ToUint8Array, uint8ArrayToBase64 } from './DataUtil';
 import { EmbeddedThumb } from '../core/DriveData/File/DriveFileTypes';
-import { OdinBlob } from '../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 const GRID_PIXEL_SIZE = 40;
 const IMAGE_SIZE = GRID_PIXEL_SIZE / 2;

diff --git a/packages/js-lib/src/media/Video/VideoSegmenter.tsx b/packages/js-lib/src/media/Video/VideoSegmenter.tsx
@@ -1,4 +1,5 @@
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 import { mergeByteArrays } from '../../helpers/helpers';
 import { SegmentedVideoMetadata } from '../MediaTypes';
 

diff --git a/packages/js-lib/src/media/VideoProvider.ts b/packages/js-lib/src/media/VideoProvider.ts
@@ -23,7 +23,8 @@ import {
 } from '../core/core';
 import { PlainVideoMetadata, SegmentedVideoMetadata, VideoUploadResult } from './MediaTypes';
 import { createThumbnails } from './Thumbs/ThumbnailProvider';
-import { OdinBlob } from '../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 export type VideoContentType = 'video/mp4';
 

diff --git a/packages/js-lib/src/peer/peerData/ExternalVideoProvider.ts b/packages/js-lib/src/peer/peerData/ExternalVideoProvider.ts
@@ -1,4 +1,5 @@
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 import { DotYouClient } from '../../core/DotYouClient';
 import { SystemFileType, TargetDrive } from '../../core/core';
 import { stringifyToQueryParams, tryJsonParse } from '../../helpers/helpers';

diff --git a/packages/js-lib/src/profile/AttributeData/AttributeDataProvider.ts b/packages/js-lib/src/profile/AttributeData/AttributeDataProvider.ts
@@ -1,4 +1,5 @@
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 import { DotYouClient } from '../../core/DotYouClient';
 import { DEFAULT_PAYLOAD_KEY } from '../../core/DriveData/Upload/UploadHelpers';
 import {

diff --git a/packages/js-lib/src/profile/ProfileData/ProfileDefinitionProvider.ts b/packages/js-lib/src/profile/ProfileData/ProfileDefinitionProvider.ts
@@ -1,4 +1,5 @@
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 import { DotYouClient } from '../../core/DotYouClient';
 import { DEFAULT_PAYLOAD_KEY } from '../../core/DriveData/Upload/UploadHelpers';
 import {

diff --git a/packages/js-lib/src/public/file/ProfileCardProvider.ts b/packages/js-lib/src/public/file/ProfileCardProvider.ts
@@ -1,4 +1,5 @@
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 import { DotYouClient } from '../../core/DotYouClient';
 import { DriveSearchResult, SecurityGroupType } from '../../core/DriveData/File/DriveFileTypes';
 import { getDecryptedImageData } from '../../media/ImageProvider';

diff --git a/packages/js-lib/src/public/posts/PostDefinitionProvider.ts b/packages/js-lib/src/public/posts/PostDefinitionProvider.ts
@@ -1,4 +1,5 @@
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 import { DotYouClient } from '../../core/DotYouClient';
 import { DEFAULT_PAYLOAD_KEY } from '../../core/DriveData/Upload/UploadHelpers';
 import {

diff --git a/packages/js-lib/src/public/posts/PostReactionProvider.ts b/packages/js-lib/src/public/posts/PostReactionProvider.ts
@@ -37,7 +37,8 @@ import { uploadFileOverPeer } from '../../peer/peerData/Upload/PeerUploadProvide
 import { deleteFileOverPeer } from '../../peer/peerData/File/PeerFileManageProvider';
 import { queryBatchOverPeer } from '../../peer/peerData/Query/PeerDriveQueryProvider';
 import { getContentFromHeaderOrPayloadOverPeer } from '../../peer/peerData/File/PeerFileProvider';
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 const COMMENT_MEDIA_PAYLOAD = 'cmmnt_md';
 

diff --git a/packages/js-lib/src/public/posts/PostUploadProvider.ts b/packages/js-lib/src/public/posts/PostUploadProvider.ts
@@ -44,7 +44,8 @@ import {
 import { makeGrid } from '../../helpers/ImageMerger';
 import { processVideoFile } from '../../media/Video/VideoProcessor';
 import { createThumbnails } from '../../media/media';
-import { OdinBlob } from '../../core/OdinBlob';
+const OdinBlob: typeof Blob =
+  (typeof window !== 'undefined' && (window as any)?.CustomBlob) || Blob;
 
 const POST_MEDIA_PAYLOAD_KEY = 'pst_mdi';
 

diff --git a/packages/owner-app/src/app/App.tsx b/packages/owner-app/src/app/App.tsx
@@ -11,7 +11,7 @@ import {
 import { Helmet, HelmetProvider } from 'react-helmet-async';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
-import Layout, { MinimalLayout, NoLayout } from '../components/ui/Layout/Layout';
+import Layout, { MinimalLayout } from '../components/ui/Layout/Layout';
 
 const YouAuthConsent = lazy(() => import('../templates/YouAuthConsent/YouAuthConsent'));
 const Setup = lazy(() => import('../templates/Setup/Setup').then((m) => ({ default: m.Setup })));

diff --git a/packages/owner-app/src/components/FileBrowser/FileBrowser.tsx b/packages/owner-app/src/components/FileBrowser/FileBrowser.tsx
@@ -1,7 +1,7 @@
 import { AttributeConfig, ProfileConfig } from '@youfoundation/js-lib/profile';
 import { useEffect, useState } from 'react';
 import { AclIcon, AclSummary, Trash, t } from '@youfoundation/common-app';
-import { useFiles } from '../../hooks/files/useFiles';
+import { useFile, useFiles } from '../../hooks/files/useFiles';
 import Section from '../ui/Sections/Section';
 import { Clipboard, File as FileIcon, Pager } from '@youfoundation/common-app';
 import { ActionButton } from '@youfoundation/common-app';
@@ -13,7 +13,7 @@ import {
   SystemFileType,
   TargetDrive,
 } from '@youfoundation/js-lib/core';
-import { BlogConfig, HomePageConfig, ReactionConfig } from '@youfoundation/js-lib/public';
+import { BlogConfig, ReactionConfig } from '@youfoundation/js-lib/public';
 import { ContactConfig } from '@youfoundation/js-lib/network';
 
 const dateFormat: Intl.DateTimeFormatOptions = {
@@ -60,6 +60,7 @@ const FileBrowser = ({
     return null;
   }
 
+  const currentPageData = driveData?.pages?.[currentPage - 1];
   return (
     <Section
       title={`${t('Files')}${systemFileType ? ` (${systemFileType})` : ''}:`}
@@ -72,7 +73,7 @@ const FileBrowser = ({
       }
     >
       <div className="grid grid-cols-2 gap-2 sm:grid-cols-3 lg:grid-cols-5">
-        {driveData?.pages?.[currentPage - 1]?.searchResults.map((file) => (
+        {currentPageData?.searchResults.map((file) => (
           <File key={file.fileId} file={file} targetDrive={targetDrive} />
         ))}
       </div>
@@ -93,8 +94,8 @@ const File = ({
   const isImage = ['image/webp', 'image/jpeg', 'image/svg+xml', 'image/gif'].includes(contentType);
   const contentTypeExtension = (contentType || 'application/json').split('/')[1];
 
-  const fetchFile = useFiles({ targetDrive }).fetchFile;
-  const { mutate: deleteFile } = useFiles({
+  const fetchFile = useFile({ targetDrive }).fetchFile;
+  const { mutate: deleteFile } = useFile({
     targetDrive,
     systemFileType: file.fileSystemType,
   }).deleteFile;

diff --git a/packages/owner-app/src/hooks/files/useFiles.ts b/packages/owner-app/src/hooks/files/useFiles.ts
@@ -25,7 +25,6 @@ export const useFiles = ({
   targetDrive: TargetDrive;
   systemFileType?: SystemFileType;
 }) => {
-  const queryClient = useQueryClient();
   const dotYouClient = useAuth().getDotYouClient();
 
   const fetchFiles = async ({
@@ -43,6 +42,28 @@ export const useFiles = ({
     return response;
   };
 
+  return {
+    fetch: useInfiniteQuery({
+      queryKey: ['files', systemFileType?.toLowerCase() || 'standard', targetDrive.alias],
+      initialPageParam: undefined as string | undefined,
+      queryFn: ({ pageParam }) => fetchFiles({ targetDrive, pageParam }),
+      getNextPageParam: (lastPage) =>
+        lastPage?.searchResults?.length >= pageSize ? lastPage?.cursorState : undefined,
+      enabled: !!targetDrive,
+    }),
+  };
+};
+
+export const useFile = ({
+  targetDrive,
+  systemFileType,
+}: {
+  targetDrive: TargetDrive;
+  systemFileType?: SystemFileType;
+}) => {
+  const queryClient = useQueryClient();
+  const dotYouClient = useAuth().getDotYouClient();
+
   const fetchFile = async (
     result: DriveSearchResult | DeletedDriveSearchResult,
     payloadKey?: string
@@ -99,22 +120,13 @@ export const useFiles = ({
   const removeFile = async (fileId: string) => await deleteFile(dotYouClient, targetDrive, fileId);
 
   return {
-    fetch: useInfiniteQuery({
-      queryKey: ['files', systemFileType || 'Standard', targetDrive.alias],
-      initialPageParam: undefined as string | undefined,
-      queryFn: ({ pageParam }) => fetchFiles({ targetDrive, pageParam }),
-      getNextPageParam: (lastPage) =>
-        lastPage?.searchResults?.length >= pageSize ? lastPage?.cursorState : undefined,
-      refetchOnMount: false,
-      refetchOnWindowFocus: false,
-      enabled: !!targetDrive,
-    }),
     fetchFile: fetchFile,
     deleteFile: useMutation({
       mutationFn: removeFile,
       onSettled: () => {
         queryClient.invalidateQueries({
-          queryKey: ['files', systemFileType || 'Standard', targetDrive.alias],
+          queryKey: ['files', systemFileType?.toLowerCase() || 'standard', targetDrive.alias],
+          exact: false,
         });
       },
     }),