@topconsultnpm/sdkui-react 6.19.0-dev1.51 → 6.19.0-dev1.52

package/lib/components/features/blog/TMBlogCommentForm.d.ts

@@ -1,17 +1,17 @@
-import { UserDescriptor } from "@topconsultnpm/sdk-ts";
-import { TMBlogContextDescriptor } from '../../grids/TMBlogsUtils';
+import { BlogPost, UserDescriptor } from "@topconsultnpm/sdk-ts";
 import { FileItem } from '../../base/TMFileManagerUtils';
+import { TMBlogContextDescriptor } from '../../grids/TMBlogsPostUtils';
 interface TMBlogCommentFormProps {
     context: TMBlogContextDescriptor;
     participants: Array<UserDescriptor>;
     onClose: () => void;
-    refreshCallback: () => Promise<void>;
     showAttachmentsSection?: boolean;
     selectedAttachments?: Array<FileItem>;
     selectedAttachmentDid?: Array<number>;
     allFileItems?: FileItem;
     allArchivedDocumentsFileItems?: Array<FileItem>;
-    updateShouldSelectLastBlog?: (value: boolean) => void;
+    onFilterCreated?: (predicate: (post: BlogPost) => boolean) => void;
+    refreshCallback?: () => Promise<void>;
 }
 declare const TMBlogCommentForm: (props: TMBlogCommentFormProps) => import("react/jsx-runtime").JSX.Element;
 export default TMBlogCommentForm;

package/lib/components/features/blog/TMBlogCommentForm.js

@@ -29,7 +29,7 @@ const getNonDirectoryFiles = (items, exclude) => {
 };
 const TMBlogCommentForm = (props) => {
     const maxLength = 1000;
-    const { participants, selectedAttachments, selectedAttachmentDid, allFileItems, allArchivedDocumentsFileItems = [], onClose, refreshCallback, context, showAttachmentsSection = true, updateShouldSelectLastBlog } = props;
+    const { participants, selectedAttachments, selectedAttachmentDid, allFileItems, allArchivedDocumentsFileItems = [], onClose, context, showAttachmentsSection = true, onFilterCreated, refreshCallback } = props;
     // Initialize state with combined array
     const [dataSource, setDataSource] = useState(() => [...getNonDirectoryFiles(allFileItems?.items || [], []), ...allArchivedDocumentsFileItems]);
     const [isEditorEnabled, setIsEditorEnabled] = useState(true);
@@ -136,23 +136,32 @@ const TMBlogCommentForm = (props) => {
                 // Create an instance of WorkingGroupEngine to interact with the working group
                 const workingGroupEngine = new WorkingGroupEngine(SDK_Globals.tmSession);
                 // Call the BlogPostAddAsync method to add the blog post to the working group
-                await workingGroupEngine.BlogPostAddAsync(context.object.id, blogPost);
-                await refreshCallback();
-                updateShouldSelectLastBlog?.(true);
+                const newBlogPostId = await workingGroupEngine.BlogPostAddAsync(context.object.id, blogPost);
+                await refreshCallback?.();
+                if (newBlogPostId && onFilterCreated) {
+                    onFilterCreated(post => post.id === newBlogPostId);
+                }
+                ;
             }
             else if (context.engine === 'SearchEngine') {
                 // Create an instance of SearchEngine
                 const searchEngine = SDK_Globals.tmSession?.NewSearchEngine();
-                await searchEngine.BlogPostAddAsync(context.object.tid, context.object.did, cleanComment);
-                await refreshCallback();
-                setTimeout(() => updateShouldSelectLastBlog?.(true), 300);
+                const newBlogPostId = await searchEngine.BlogPostAddAsync(context.object.tid, context.object.did, cleanComment);
+                await refreshCallback?.();
+                if (newBlogPostId && onFilterCreated) {
+                    onFilterCreated(post => post.id === newBlogPostId);
+                }
+                ;
             }
             else if (context.engine === 'DossierEngine' && context.object && context.object.id) {
                 // Create an instance of DossierEngine
                 const dossierEngine = SDK_Globals.tmSession?.NewDossierEngine();
-                await dossierEngine.BlogPostAddAsync(context.object.id, blogPost);
-                await refreshCallback();
-                setTimeout(() => updateShouldSelectLastBlog?.(true), 300);
+                const newBlogPostId = await dossierEngine.BlogPostAddAsync(context.object.id, blogPost);
+                await refreshCallback?.();
+                if (newBlogPostId && onFilterCreated) {
+                    onFilterCreated(post => post.id === newBlogPostId);
+                }
+                ;
             }
         }
         catch (e) {

package/lib/components/features/documents/TMDcmtBlog.js

@@ -4,18 +4,17 @@ import styled from 'styled-components';
 import { SDK_Globals } from '@topconsultnpm/sdk-ts';
 import { TMExceptionBoxManager } from '../../base/TMPopUp';
 import TMSpinner from '../../base/TMSpinner';
-import TMBlogs from '../../grids/TMBlogs';
 import { TMNothingToShow } from './TMDcmtPreview';
 import { IconBoard, SDKUI_Localizator } from '../../../helper';
 import TMBlogCommentForm from '../blog/TMBlogCommentForm';
+import TMBlogsPost from '../../grids/TMBlogsPost';
 const TMDcmtBlog = ({ tid, did, isVisible }) => {
     const [blogsDatasource, setBlogsDatasource] = useState([]);
     const [hasLoadedDataOnce, setHasLoadedDataOnce] = useState(false); //traccia se *qualsiasi* dato è stato caricato per la prima volta
     const [lastLoadedDid, setLastLoadedDid] = useState(undefined); // `lastLoadedDid` tiene traccia dell'ultimo `did` per cui abbiamo caricato i dati
     // State to manage show comment form selected file
     const [showCommentForm, setShowCommentForm] = useState(false);
-    // Flag to determine if the last blog should be automatically selected (after a new blog is added)
-    const [shouldSelectLastBlog, setShouldSelectLastBlog] = useState(false);
+    const [externalBlogPost, setExternalBlogPost] = useState(undefined);
     const showCommentFormCallback = useCallback(() => {
         setShowCommentForm(true);
     }, []);
@@ -51,14 +50,24 @@ const TMDcmtBlog = ({ tid, did, isVisible }) => {
             fetchDataAsync(tid, did);
         }
     }, [tid, did, isVisible, hasLoadedDataOnce, lastLoadedDid]);
-    const updateShouldSelectLastBlog = (value) => {
-        setShouldSelectLastBlog(value);
-    };
     const refreshCallback = async () => {
         await fetchDataAsync(tid, did);
     };
+    const resetExternalBlogPost = useCallback(() => {
+        setExternalBlogPost(undefined);
+    }, []);
+    const handleFilterCreated = async (predicate) => {
+        await refreshCallback();
+        const res = await SDK_Globals.tmSession?.NewSearchEngine().BlogRetrieveAsync(tid, did);
+        if (res && res.length > 0) {
+            setBlogsDatasource(res ?? []);
+            const firstMatchingPost = res.find(predicate);
+            if (firstMatchingPost)
+                setExternalBlogPost(firstMatchingPost);
+        }
+    };
     return (_jsxs("div", { style: { width: '100%', height: '100%' }, children: [_jsx(StyledContainer, { children: _jsx(StyledSectionContainer, { style: { position: 'relative' }, children: _jsx(StyledBoardContainer, { children: !did ? _jsx(TMNothingToShow, { text: `${SDKUI_Localizator.NoDcmtSelected}.`, secondText: `${SDKUI_Localizator.BlogCase} - ${SDKUI_Localizator.NotAvailable}`, icon: _jsx(IconBoard, { fontSize: 96 }) }) :
-                            _jsx(TMBlogs, { context: { engine: 'SearchEngine', object: { tid, did } }, id: "dcmt-blog", allData: blogsDatasource, showExtendedAttachments: false, showFloatingCommentButton: true, showCommentFormCallback: showCommentFormCallback, refreshCallback: refreshCallback, contextMenuParams: {
+                            _jsx(TMBlogsPost, { context: { engine: 'SearchEngine', object: { tid, did } }, id: "dcmt-blog", displayMode: 'chat', scrollToSelected: true, posts: blogsDatasource, showExtendedAttachments: false, showFloatingCommentButton: true, showCommentFormCallback: showCommentFormCallback, refreshCallback: refreshCallback, contextMenuParams: {
                                     isShowHideFilterEnabled: true,
                                     isShowHideIDEnaled: true,
                                     isCommentEnabled: true,
@@ -69,7 +78,7 @@ const TMDcmtBlog = ({ tid, did, isVisible }) => {
                                     isRefreshEnabled: true,
                                     isRestoreEnabled: true,
                                     isCreateContextualTask: false
-                                }, layoutMode: 'chat', shouldSelectLastBlog: shouldSelectLastBlog, updateShouldSelectLastBlog: updateShouldSelectLastBlog }) }) }) }), (showCommentForm && tid && did) && _jsx(TMBlogCommentForm, { context: { engine: 'SearchEngine', object: { tid, did } }, onClose: () => setShowCommentForm(false), refreshCallback: refreshCallback, participants: [], showAttachmentsSection: false, updateShouldSelectLastBlog: updateShouldSelectLastBlog, allArchivedDocumentsFileItems: [] })] }));
+                                }, externalBlogPost: externalBlogPost, resetExternalBlogPost: resetExternalBlogPost }) }) }) }), (showCommentForm && tid && did) && _jsx(TMBlogCommentForm, { context: { engine: 'SearchEngine', object: { tid, did } }, onClose: () => setShowCommentForm(false), refreshCallback: refreshCallback, participants: [], showAttachmentsSection: false, allArchivedDocumentsFileItems: [], onFilterCreated: handleFilterCreated })] }));
 };
 export default TMDcmtBlog;
 const StyledContainer = styled.div ` user-select: none; overflow: hidden; background-color: #ffffff; width: calc(100%); height: calc(100%); display: flex; gap: 10px; `;

package/lib/components/grids/TMBlogAttachments.d.ts

@@ -0,0 +1,42 @@
+import { BlogPostAttachment, DcmtTypeDescriptor } from "@topconsultnpm/sdk-ts";
+import { TMBlogContextDescriptor } from "./TMBlogsPostUtils";
+import { DcmtInfo } from "../../ts";
+import { FileItem } from "../base/TMFileManagerUtils";
+interface TMBlogAttachmentsProps {
+    contextMenuParams?: {
+        isShowHideFilterEnabled: boolean;
+        isShowHideIDEnaled: boolean;
+        isCommentEnabled: boolean;
+        isDownloadAttachmentEnabled: boolean;
+        isViewEditMetadata: boolean;
+        isDeleteEnabled: boolean;
+        isCopyToClipboardEnabled: boolean;
+        isRestoreEnabled: boolean;
+        isRefreshEnabled: boolean;
+        isCreateContextualTask: boolean;
+    };
+    layoutMode: "compact" | "extended";
+    attachments: Array<BlogPostAttachment>;
+    isSelected: boolean;
+    searchText: string;
+    dcmtTypeDescriptors: Map<number, DcmtTypeDescriptor>;
+    treeFs: FileItem | undefined;
+    draftLatestInfoMap: Map<number, {
+        latestVersion: number;
+        folderId: number;
+        folderName: string;
+        fileExt: string;
+        fileSize: string;
+    }> | undefined;
+    archivedDocumentMap: Map<number, {
+        tid: number;
+        did: number;
+        fileExt: string;
+        fileSize: string;
+    }> | undefined;
+    context?: TMBlogContextDescriptor;
+    handleAttachmentFocus: (attachment: DcmtInfo | undefined) => void;
+    openDcmtForm: (dcmtInfo: DcmtInfo) => void;
+}
+declare const TMBlogAttachments: (props: TMBlogAttachmentsProps) => import("react/jsx-runtime").JSX.Element;
+export default TMBlogAttachments;

package/lib/components/grids/TMBlogAttachments.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { SDK_Globals } from "@topconsultnpm/sdk-ts";
+import { getAttachmentInfo, lightenColor, removeFileExtension } from "./TMBlogsPostUtils";
+import TMDcmtIcon from "../features/documents/TMDcmtIcon";
+import { IconAttachment } from "../../helper";
+const TMBlogAttachments = (props) => {
+    const { attachments, isSelected, searchText, dcmtTypeDescriptors, treeFs, draftLatestInfoMap, archivedDocumentMap, handleAttachmentFocus, openDcmtForm } = props;
+    const handleMouseEnter = (e, blogPostAttachment, name, fileExt) => {
+        e.currentTarget.style.boxShadow = '0 4px 8px rgba(0, 0, 0, 0.15)';
+        e.currentTarget.style.backgroundColor = isSelected ? lightenColor("#135596", 40) : '#cfcfcf';
+        const archiveID = SDK_Globals.tmSession?.SessionDescr?.archiveID;
+        const fileName = `${removeFileExtension(name)}_${archiveID}_${blogPostAttachment.tid}_${blogPostAttachment.did}.${fileExt}`;
+        handleAttachmentFocus({ TID: blogPostAttachment.tid, DID: blogPostAttachment.did, fileName });
+    };
+    const handleMouseLeave = (e) => {
+        e.currentTarget.style.boxShadow = '0 2px 4px rgba(0, 0, 0, 0.1)';
+        e.currentTarget.style.backgroundColor = isSelected ? "#135596" : "#ffffff";
+        handleAttachmentFocus(undefined);
+    };
+    const onDoubleClick = (e, blogPostAttachment, name, fileExt) => {
+        const archiveID = SDK_Globals.tmSession?.SessionDescr?.archiveID;
+        const fileName = `${removeFileExtension(name)}_${archiveID}_${blogPostAttachment.tid}_${blogPostAttachment.did}.${fileExt}`;
+        openDcmtForm({ TID: blogPostAttachment.tid, DID: blogPostAttachment.did, fileName });
+    };
+    return _jsx("div", { style: { width: "100%", marginTop: "5px", overflow: "hidden" }, children: attachments.map((blogPostAttachment) => {
+            const { name, nameElement, tooltipContent, fileExt, archivedDocumentsExist, draftExist } = getAttachmentInfo(blogPostAttachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText);
+            return _jsx("div", { onDoubleClick: (e) => onDoubleClick(e, blogPostAttachment, name, fileExt), onMouseEnter: (e) => handleMouseEnter(e, blogPostAttachment, name, fileExt), onMouseLeave: (e) => handleMouseLeave(e), style: {
+                    display: 'inline-flex',
+                    padding: '4px 8px',
+                    margin: '4px',
+                    border: '1px solid #ddd',
+                    borderRadius: '8px',
+                    boxShadow: '0 2px 4px rgba(0, 0, 0, 0.1)',
+                    backgroundColor: isSelected ? "#135596" : "#ffffff",
+                    cursor: "pointer",
+                    fontSize: '0.9rem',
+                    color: isSelected ? "#ffffff" : "#000000",
+                }, children: _jsxs("div", { style: { alignItems: 'center', display: 'flex' }, children: [(!archivedDocumentsExist && !draftExist) ?
+                            _jsx(IconAttachment, { style: { marginRight: "5px" } }) :
+                            _jsx("div", { style: { marginRight: "10px" }, children: _jsx(TMDcmtIcon, { tid: blogPostAttachment.tid, did: blogPostAttachment.did, fileExtension: fileExt, downloadMode: 'openInNewWindow', tooltipContent: tooltipContent }) }), _jsx("span", { style: { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }, children: nameElement })] }) }, blogPostAttachment.did);
+        }) });
+};
+export default TMBlogAttachments;

package/lib/components/grids/TMBlogHeader.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import { BlogPost, HomeBlogPost } from "@topconsultnpm/sdk-ts";
+import { TMBlogsFilterCategoryId, TMBlogsFilterCategoryIdDataSource } from "./TMBlogsPostUtils";
+interface TMBlogHeaderProps {
+    /** Visibility of the component */
+    isVisible: boolean;
+    /** Layout mode of the component */
+    layoutMode: "compact" | "extended";
+    /** Optional height of the component (CSS value) */
+    height: string;
+    /** Optional width of the component (CSS value) */
+    width: string;
+    /** An array of blog posts or home blog posts */
+    allPosts: Array<BlogPost | HomeBlogPost>;
+    /** Number of posts to show */
+    postsToShow: number;
+    /** Callback when the number of posts to show changes */
+    onPostsToShowChange: (postsToShow: number) => void;
+    /** Data source for the tree component */
+    categoryIdDataSource: Array<TMBlogsFilterCategoryIdDataSource>;
+    /** Currently applied global filters */
+    appliedCategoryIdFilters: Array<TMBlogsFilterCategoryId>;
+    /** Setter for applied global filters */
+    setAppliedCategoryIdFilters: React.Dispatch<React.SetStateAction<Array<TMBlogsFilterCategoryId>>>;
+    /** Current search text */
+    searchText: string;
+    /** Callback when the search text changes */
+    onSearchChange: (value: string) => void;
+}
+declare const TMBlogHeader: (props: TMBlogHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export default TMBlogHeader;

package/lib/components/grids/TMBlogHeader.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { SDKUI_Localizator } from "../../helper";
+import TMDropDown from "../editors/TMDropDown";
+import TMTreeDropDown from "../editors/TMTreeDropDown";
+import { TMSearchBar } from "../sidebar/TMHeader";
+const TMBlogHeader = (props) => {
+    const { isVisible, layoutMode, height, width, allPosts, postsToShow, onPostsToShowChange, categoryIdDataSource, appliedCategoryIdFilters, setAppliedCategoryIdFilters, searchText, onSearchChange } = props;
+    // Data source for the number of posts to display in the UI
+    const postsToShowDataSource = [
+        { value: 30, display: SDKUI_Localizator.Latest + ' 30' },
+        { value: 50, display: SDKUI_Localizator.Latest + ' 50' },
+        { value: 100, display: SDKUI_Localizator.Latest + ' 100' },
+        { value: allPosts.length, display: SDKUI_Localizator.All + ` (${allPosts.length})` },
+    ];
+    // Function to handle changes in the filter (number of posts to show)
+    const handlePostsToShowChange = (e) => {
+        if (!e?.target?.value)
+            return;
+        const value = e.target.value;
+        if (value !== undefined) {
+            onPostsToShowChange(Number(value));
+        }
+    };
+    const containerStyle = {
+        display: isVisible ? "flex" : "none",
+        height: isVisible ? height : "0px",
+        width: isVisible ? width : "0px",
+        flexDirection: layoutMode === "extended" ? "row" : "column",
+        gap: layoutMode === "extended" ? "8px" : "4px",
+        alignItems: layoutMode === "extended" ? "center" : "normal",
+        justifyContent: layoutMode === "extended" ? "normal" : "center",
+        boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+        borderBottom: "2px solid transparent",
+        backgroundImage: "linear-gradient(white, white), linear-gradient(270deg, #46B5A2 16%, #3BAABC 34%, #3BAABC 34%, #3681AD 54%, #3368A5 72%, #2F549D 88%, #304F99 100%)",
+        backgroundOrigin: "border-box",
+        backgroundClip: "padding-box, border-box",
+        marginLeft: "4px",
+    };
+    return _jsxs("div", { style: containerStyle, children: [_jsx("div", { children: _jsx(TMSearchBar, { marginLeft: "0px", maxWidth: "100%", searchValue: searchText, onSearchValueChanged: (value) => onSearchChange(value) }) }), layoutMode === "extended" && _jsx("div", { children: _jsx(TMDropDown, { value: postsToShow, dataSource: postsToShowDataSource, onValueChanged: handlePostsToShowChange, elementStyle: { width: '120px', height: '29px' } }) }), _jsx("div", { children: _jsx(TMTreeDropDown, { dataSource: categoryIdDataSource, values: appliedCategoryIdFilters, setValues: setAppliedCategoryIdFilters, displayExpr: false, isValidKey: () => true, elementStyle: { minWidth: '100%', height: '29px' } }) })] });
+};
+export default TMBlogHeader;

package/lib/components/grids/{TMBlogs.d.ts → TMBlogsPost.d.ts}

@@ -1,36 +1,27 @@
-import React from 'react';
-import { BlogPost, HomeBlogPost, IDCount, UserDescriptor } from "@topconsultnpm/sdk-ts";
-import { TMBlogContextDescriptor } from './TMBlogsUtils';
-import { DcmtInfo } from '../../ts';
-import { FileItem } from '../base/TMFileManagerUtils';
-interface TMBlogsProps {
+import React from "react";
+import { BlogPost, HomeBlogPost } from "@topconsultnpm/sdk-ts";
+import { DcmtInfo } from "../../ts";
+import { FileItem } from "../base/TMFileManagerUtils";
+import { TMBlogsPostHeader, TMBlogContextDescriptor } from "./TMBlogsPostUtils";
+interface TMBlogsPostProps {
+    /** Flag to indicate whether the component is open */
+    scrollToSelected: boolean;
     /** Component Identifier */
     id: string;
     /** An array of blog posts or home blog posts */
-    allData: Array<BlogPost | HomeBlogPost>;
-    /** Optional flag to show extended attachments */
-    showExtendedAttachments?: boolean;
-    /** Optional flag to automatically scroll to the bottom of the list */
-    scrollToBottom?: boolean;
+    posts: Array<BlogPost | HomeBlogPost>;
+    /** Optional display mode */
+    displayMode?: "chat" | "stacked";
     /** Optional height of the component (CSS value) */
     height?: string;
     /** Optional width of the component (CSS value) */
     width?: string;
+    /** Optional flag to indicate whether to scroll to bottom on new posts */
+    scrollToBottom?: boolean;
     /** Optional header configuration object */
-    header?: {
-        /** Flag to display the view mode toggle */
-        showViewMode: boolean;
-        /** Flag to display filter options */
-        showFilters: boolean;
-        /** Flag to display the search bar */
-        showSearchBar: boolean;
-        /** Flag to display a dropdown menu for selecting posts */
-        showPostsDropDown: boolean;
-    };
-    /** Optional flag to show an icon in the component */
-    showIconHeader?: boolean;
-    /** Optional color for customizing the appearance */
-    color?: string;
+    header?: TMBlogsPostHeader;
+    /** Optional flag to show extended attachments */
+    showExtendedAttachments?: boolean;
     /** Optional file system tree structure */
     treeFs?: FileItem;
     /** Optional map storing the latest draft information, where the key is the draft ID */
@@ -48,14 +39,8 @@ interface TMBlogsProps {
         fileExt: string;
         fileSize: string;
     }>;
-    /** Optional callback function to update the list of visualized blog posts */
-    updateVisualizedBlogCallback?: (blogPosts: Array<BlogPost | HomeBlogPost>) => void;
-    /** Optional callback to handle navigation to working groups */
-    handleNavigateToWGs?: (selectedWorkingGroupId: number) => void;
-    /** Optional boolean to control the visibility of an ID */
-    showId?: boolean;
-    /** Optional setter function to update the visibility state of an ID */
-    setShowId?: React.Dispatch<React.SetStateAction<boolean>>;
+    /** Context descriptor for the blog component */
+    context?: TMBlogContextDescriptor;
     /** Optional context menu params */
     contextMenuParams?: {
         isShowHideFilterEnabled: boolean;
@@ -69,34 +54,30 @@ interface TMBlogsProps {
         isRefreshEnabled: boolean;
         isCreateContextualTask: boolean;
     };
-    /** Optional refresh callback */
-    refreshCallback?: () => Promise<void>;
-    /** An array of partecipants */
-    participants?: Array<UserDescriptor>;
-    /** An array of new blog posts ID */
-    newPosts?: Array<IDCount>;
+    /** Optional flag to show the floating comment button (default: false) */
+    showFloatingCommentButton?: boolean;
     /** Show Comment Form Callback */
-    showCommentFormCallback?: () => void;
+    showCommentFormCallback?: (dcmt: DcmtInfo | undefined) => void;
     /** Show Task Form Callback */
     showTaskFormCallback?: () => void;
-    /** Optional Whether to enable the context menu */
-    showContextMenu?: boolean;
-    /** Optional handle attachment focus functon */
-    handleAttachmentFocus?: (attachment: DcmtInfo | undefined) => void;
-    /** Optional flag to show the floating comment button (default: false) */
-    showFloatingCommentButton?: boolean;
-    /** Context descriptor for the blog component */
-    context?: TMBlogContextDescriptor;
-    /** Optional layout mode */
-    layoutMode?: 'stacked' | 'chat';
-    /** Optional callback to mark blog as read */
-    markBlogAsRead?: (blog: BlogPost | undefined) => Promise<void>;
-    /** Flag to indicate whether the blog component should automatically select */
-    shouldSelectLastBlog?: boolean;
-    /** Updates the flag that determines if the blog component should automatically select the last blog. */
-    updateShouldSelectLastBlog?: (value: boolean) => void;
+    /** Optional refresh callback */
+    refreshCallback?: () => Promise<void>;
+    /** Optional boolean to control the visibility of an ID */
+    showId?: boolean;
+    /** Optional setter function to update the visibility state of an ID */
+    setShowId?: React.Dispatch<React.SetStateAction<boolean>>;
     /** Refresh Home Page News Callback */
     refreshHomePageNews?: () => Promise<void>;
+    /** Optional callback to handle navigation to working groups */
+    handleNavigateToWGs?: (blogPost: BlogPost | HomeBlogPost) => void;
+    /** Optional callback to handle navigation to dossiers */
+    handleNavigateToDossiers?: (blogPost: BlogPost | HomeBlogPost) => void;
+    /** Optional callback to mark blog as read */
+    markBlogAsRead?: (blog: BlogPost | undefined) => Promise<void>;
+    /** Optional blog post to be externally selected */
+    externalBlogPost?: BlogPost;
+    /** Optional function to reset the external blog post */
+    resetExternalBlogPost?: () => void;
 }
-declare const TMBlogs: (props: TMBlogsProps) => import("react/jsx-runtime").JSX.Element;
-export default TMBlogs;
+declare const TMBlogsPost: (props: TMBlogsPostProps) => import("react/jsx-runtime").JSX.Element;
+export default TMBlogsPost;