Add event status trigger, improve test coverage, and UI enhancements

- Add event-status-changed trigger for SmoothSchedule Activepieces piece
- Add comprehensive test coverage for payments, tickets, messaging, mobile
- Add test coverage for core services, signals, consumers, and views
- Improve Activepieces UI: templates, billing hooks, project hooks
- Update marketing automation showcase and workflow visual components
- Add public API endpoints for availability

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

activepieces-fork/packages/react-ui/src/app/routes/explore/index.tsx

@@ -1,5 +1,5 @@
 import { t } from 'i18next';
-import { ArrowLeft, Search, SearchX } from 'lucide-react';
+import { ArrowLeft, Search, SearchX, Sparkles, Building2 } from 'lucide-react';
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 
@@ -24,14 +24,19 @@ import {
 import { LoadingSpinner } from '@/components/ui/spinner';
 import { TemplateCard } from '@/features/templates/components/template-card';
 import { TemplateDetailsView } from '@/features/templates/components/template-details-view';
-import { useTemplates } from '@/features/templates/hooks/templates-hook';
+import { useAllTemplates } from '@/features/templates/hooks/templates-hook';
 import { userHooks } from '@/hooks/user-hooks';
-import { PlatformRole, Template, TemplateType } from '@activepieces/shared';
+import { PlatformRole, Template } from '@activepieces/shared';
 
 export const ExplorePage = () => {
-  const { filteredTemplates, isLoading, search, setSearch } = useTemplates({
-    type: TemplateType.OFFICIAL,
-  });
+  const {
+    filteredCustomTemplates,
+    filteredOfficialTemplates,
+    filteredTemplates,
+    isLoading,
+    search,
+    setSearch,
+  } = useAllTemplates();
   const [selectedTemplate, setSelectedTemplate] = useState<Template | null>(
     null,
   );
@@ -47,6 +52,20 @@ export const ExplorePage = () => {
     setSelectedTemplate(null);
   };
 
+  const renderTemplateGrid = (templates: Template[]) => (
+    <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
+      {templates.map((template) => (
+        <TemplateCard
+          key={template.id}
+          template={template}
+          onSelectTemplate={(template) => {
+            setSelectedTemplate(template);
+          }}
+        />
+      ))}
+    </div>
+  );
+
   return (
     <div>
       <ProjectDashboardPageHeader title={t('Explore Templates')} />
@@ -67,7 +86,7 @@ export const ExplorePage = () => {
           </div>
         ) : (
           <>
-            {filteredTemplates?.length === 0 && (
+            {filteredTemplates.length === 0 && (
               <Empty className="min-h-[300px]">
                 <EmptyHeader className="max-w-xl">
                   <EmptyMedia variant="icon">
@@ -93,17 +112,38 @@ export const ExplorePage = () => {
                 )}
               </Empty>
             )}
-            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 pb-4">
-              {filteredTemplates?.map((template) => (
-                <TemplateCard
-                  key={template.id}
-                  template={template}
-                  onSelectTemplate={(template) => {
-                    setSelectedTemplate(template);
-                  }}
-                />
-              ))}
-            </div>
+
+            {/* Custom Templates Section (SmoothSchedule-specific) */}
+            {filteredCustomTemplates.length > 0 && (
+              <div className="mb-8">
+                <div className="flex items-center gap-2 mb-4">
+                  <Building2 className="w-5 h-5 text-primary" />
+                  <h2 className="text-lg font-semibold">
+                    {t('SmoothSchedule Templates')}
+                  </h2>
+                  <span className="text-sm text-muted-foreground">
+                    ({filteredCustomTemplates.length})
+                  </span>
+                </div>
+                {renderTemplateGrid(filteredCustomTemplates)}
+              </div>
+            )}
+
+            {/* Official Templates Section (from Activepieces cloud) */}
+            {filteredOfficialTemplates.length > 0 && (
+              <div className="mb-8">
+                <div className="flex items-center gap-2 mb-4">
+                  <Sparkles className="w-5 h-5 text-amber-500" />
+                  <h2 className="text-lg font-semibold">
+                    {t('Community Templates')}
+                  </h2>
+                  <span className="text-sm text-muted-foreground">
+                    ({filteredOfficialTemplates.length})
+                  </span>
+                </div>
+                {renderTemplateGrid(filteredOfficialTemplates)}
+              </div>
+            )}
           </>
         )}
       </div>