@open-mercato/core 0.6.6-develop.6184.1.b7e55f8d61 → 0.6.6-develop.6198.1.0822f97cc6

package/src/modules/customers/components/detail/InlineEditors.tsx

@@ -3,15 +3,13 @@
 import * as React from 'react'
 import Link from 'next/link'
 import { AtSign, Briefcase, Loader2, Pencil, X } from 'lucide-react'
-import ReactMarkdown from 'react-markdown'
 import { Button } from '@open-mercato/ui/primitives/button'
-import type { PluggableList } from 'unified'
+import { MarkdownContent } from '@open-mercato/ui/backend/markdown'
 import { flash } from '@open-mercato/ui/backend/FlashMessages'
 import { useT } from '@open-mercato/shared/lib/i18n/context'
 import { cn } from '@open-mercato/shared/lib/utils'
 import { useQueryClient } from '@tanstack/react-query'
 import { useOrganizationScopeVersion } from '@open-mercato/shared/lib/frontend/useOrganizationScope'
-import remarkGfm from 'remark-gfm'
 import { useEmailDuplicateCheck } from '../../backend/hooks/useEmailDuplicateCheck'
 import { lookupPhoneDuplicate } from '../../utils/phoneDuplicates'
 import {
@@ -172,8 +170,6 @@ export function InlineTextEditor(props: InlineFieldProps) {
 export const InlineMultilineEditor = UiInlineMultilineEditor
 export const InlineSelectEditor = UiInlineSelectEditor
 
-const MARKDOWN_PREVIEW_PLUGINS: PluggableList = [remarkGfm]
-
 function createSocialRenderDisplay(IconComponent: typeof Briefcase): NonNullable<InlineFieldProps['renderDisplay']> {
   // eslint-disable-next-line react/display-name
   return ({ value, emptyLabel }) => {
@@ -206,11 +202,11 @@ export const renderMultilineMarkdownDisplay: InlineMultilineDisplayRenderer = ({
     return <span className="text-muted-foreground">{emptyLabel}</span>
   }
   return (
-    <div className="text-sm text-foreground [&>*]:mb-2 [&>*:last-child]:mb-0 [&_ul]:ml-4 [&_ul]:list-disc [&_ol]:ml-4 [&_ol]:list-decimal [&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_pre]:rounded-md [&_pre]:bg-muted [&_pre]:p-3 [&_pre]:text-xs">
-      <ReactMarkdown remarkPlugins={MARKDOWN_PREVIEW_PLUGINS}>
-        {raw}
-      </ReactMarkdown>
-    </div>
+    <MarkdownContent
+      format="markdown"
+      body={raw}
+      className="text-sm text-foreground [&>*]:mb-2 [&>*:last-child]:mb-0 [&_ul]:ml-4 [&_ul]:list-disc [&_ol]:ml-4 [&_ol]:list-decimal [&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_pre]:rounded-md [&_pre]:bg-muted [&_pre]:p-3 [&_pre]:text-xs"
+    />
   )
 }
 

package/src/modules/integrations/backend/integrations/[id]/page.tsx

@@ -47,6 +47,10 @@ import {
   resolveIntegrationDetailWidgetSpotId,
   resolveRequestedIntegrationDetailTab,
 } from '../detail-page-widgets'
+import {
+  refreshIntegrationDetailPanels,
+  refreshIntegrationRunActivityPanels,
+} from '../detail-page-refresh'
 import { isValidCredentialUrl } from '../../../lib/credentials-field-validation'
 
 type CredentialField = IntegrationCredentialField
@@ -531,8 +535,7 @@ export default function IntegrationDetailPage({ params }: IntegrationDetailPageP
     spotId: detailWidgetSpotId,
   })
   const refreshDetail = React.useCallback(async () => {
-    await loadDetail({ showLoading: false })
-    await loadCredentials()
+    await refreshIntegrationDetailPanels({ loadDetail, loadCredentials })
   }, [loadCredentials, loadDetail])
   const refreshLogs = React.useCallback(async () => {
     await loadLogs()
@@ -549,13 +552,14 @@ export default function IntegrationDetailPage({ params }: IntegrationDetailPageP
     }
     if (options?.showLoading) setIsRefreshingRunActivity(true)
     try {
-      const call = await apiCall<DataSyncRunDetail>(
-        `/api/data_sync/runs/${encodeURIComponent(runIdFromUrl)}`,
-        undefined,
-        { fallback: null },
-      )
-      await loadLogs()
-      await loadDetail({ showLoading: false })
+      const [call] = await Promise.all([
+        apiCall<DataSyncRunDetail>(
+          `/api/data_sync/runs/${encodeURIComponent(runIdFromUrl)}`,
+          undefined,
+          { fallback: null },
+        ),
+        refreshIntegrationRunActivityPanels({ loadLogs, loadDetail }),
+      ])
       if (call.ok && call.result) {
         setActiveRunDetail(call.result)
         setActiveRunRefreshedAt(new Date().toISOString())

package/src/modules/integrations/backend/integrations/detail-page-refresh.ts

@@ -0,0 +1,36 @@
+type ShowLoadingOption = { showLoading?: boolean }
+type IntegrationDetailLoader = (options?: ShowLoadingOption) => Promise<void>
+type IntegrationPanelLoader = () => Promise<void>
+
+/**
+ * Refresh the integration detail and credential panels concurrently.
+ *
+ * Detail and credentials are served by independent endpoints with no data
+ * dependency between them, so the two requests start together instead of
+ * waiting for the detail load to resolve before credentials begins.
+ */
+export async function refreshIntegrationDetailPanels(loaders: {
+  loadDetail: IntegrationDetailLoader
+  loadCredentials: IntegrationPanelLoader
+}): Promise<void> {
+  await Promise.all([
+    loaders.loadDetail({ showLoading: false }),
+    loaders.loadCredentials(),
+  ])
+}
+
+/**
+ * Refresh the run-activity panels (logs and detail) concurrently.
+ *
+ * loadLogs and loadDetail hit independent endpoints and neither consumes the
+ * other's result, so the two reloads start together.
+ */
+export async function refreshIntegrationRunActivityPanels(loaders: {
+  loadLogs: IntegrationPanelLoader
+  loadDetail: IntegrationDetailLoader
+}): Promise<void> {
+  await Promise.all([
+    loaders.loadLogs(),
+    loaders.loadDetail({ showLoading: false }),
+  ])
+}