feat(marketplace): cross-instance browse page + entry points

- add cross-instance listings index (published only, live counts)
- add browse page with title search, adoptions/newest sort, row select
- add sidebar admin entry + /courses/:id/marketplace route
- add "Import Assessments" button on assessments index (from_tab)
- add FE api/operations/types, controller + component specs

Author: LWS49

app/controllers/components/course/assessment_marketplace_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+class Course::AssessmentMarketplaceComponent < SimpleDelegator
+  include Course::ControllerComponentHost::Component
+
+  def self.display_name
+    'Assessment Marketplace'
+  end
+
+  def sidebar_items
+    return [] unless can?(:access_marketplace, current_course)
+
+    [
+      key: :admin_marketplace,
+      icon: :duplication,
+      type: :admin,
+      weight: 6,
+      path: course_marketplace_path(current_course)
+    ]
+  end
+end

app/controllers/course/assessment/marketplace/controller.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+class Course::Assessment::Marketplace::Controller < Course::ComponentController
+  private
+
+  def component
+    current_component_host[:course_assessment_marketplace_component]
+  end
+end

app/controllers/course/assessment/marketplace/listings_controller.rb

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+class Course::Assessment::Marketplace::ListingsController < Course::Assessment::Marketplace::Controller
+  before_action :authorize_access!
+
+  def index
+    ActsAsTenant.without_tenant do
+      @listings = Course::Assessment::Marketplace::Listing.published.includes(:assessment).to_a
+      listing_ids = @listings.map(&:id)
+      assessment_ids = @listings.map(&:assessment_id)
+      @adoption_counts = Course::Assessment::Marketplace::Adoption.
+                         where(listing_id: listing_ids).group(:listing_id).
+                         distinct.count(:destination_course_id)
+      # reorder(nil) strips QuestionAssessment's `default_scope { order(weight: :asc) }`; without it
+      # the injected `ORDER BY weight` breaks the grouped aggregate (PG::GroupingError — weight is
+      # neither grouped nor aggregated).
+      @question_counts = Course::QuestionAssessment.
+                         where(assessment_id: assessment_ids).reorder(nil).group(:assessment_id).
+                         distinct.count(:question_id)
+    end
+  end
+
+  private
+
+  def authorize_access!
+    authorize!(:access_marketplace, current_course)
+  end
+end

app/views/course/assessment/marketplace/listings/index.json.jbuilder

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+json.canAccess true
+json.listings @listings do |listing|
+  assessment = listing.assessment
+  json.id listing.id
+  json.assessmentId assessment.id
+  json.title assessment.title
+  json.questionCount(@question_counts[assessment.id] || 0)
+  json.adoptions(@adoption_counts[listing.id] || 0)
+  json.firstPublishedAt listing.first_published_at
+  json.previewUrl course_listing_path(current_course, listing)
+  json.duplicateUrl duplicate_course_listings_path(current_course)
+end

client/app/api/course/Marketplace.ts

@@ -1,5 +1,7 @@
 import { AxiosResponse } from 'axios';
 
+import { MarketplaceListing } from 'course/marketplace/types';
+
 import BaseCourseAPI from './Base';
 
 export default class MarketplaceAPI extends BaseCourseAPI {
@@ -18,4 +20,10 @@ export default class MarketplaceAPI extends BaseCourseAPI {
       `/courses/${this.courseId}/assessments/${assessmentId}/marketplace_listing`,
     );
   }
+
+  index(): Promise<
+    AxiosResponse<{ listings: MarketplaceListing[]; canAccess: boolean }>
+  > {
+    return this.client.get(this.#urlPrefix);
+  }
 }

client/app/bundles/course/assessment/pages/AssessmentsIndex/ImportAssessmentsButton.tsx

@@ -0,0 +1,27 @@
+import { Button } from '@mui/material';
+
+import Link from 'lib/components/core/Link';
+import useTranslation from 'lib/hooks/useTranslation';
+
+import translations from '../../translations';
+
+interface Props {
+  canImport: boolean;
+  tabId: number;
+}
+
+const ImportAssessmentsButton = ({
+  canImport,
+  tabId,
+}: Props): JSX.Element | null => {
+  const { t } = useTranslation();
+  if (!canImport) return null;
+
+  return (
+    <Link to={`../marketplace?from_tab=${tabId}`}>
+      <Button variant="outlined">{t(translations.importAssessments)}</Button>
+    </Link>
+  );
+};
+
+export default ImportAssessmentsButton;

client/app/bundles/course/assessment/pages/AssessmentsIndex/__test__/ImportAssessmentsButton.test.tsx

@@ -0,0 +1,19 @@
+import { render } from 'test-utils';
+
+import ImportAssessmentsButton from '../ImportAssessmentsButton';
+
+it('links to the marketplace with the given tab as from_tab when the user can import', async () => {
+  const page = render(<ImportAssessmentsButton canImport tabId={42} />);
+  const link = await page.findByRole('link', { name: 'Import Assessments' });
+  expect(link).toHaveAttribute(
+    'href',
+    expect.stringContaining('/marketplace?from_tab=42'),
+  );
+});
+
+it('renders nothing when the user cannot import', () => {
+  const page = render(<ImportAssessmentsButton canImport={false} tabId={42} />);
+  expect(
+    page.queryByRole('link', { name: 'Import Assessments' }),
+  ).not.toBeInTheDocument();
+});

client/app/bundles/course/assessment/pages/AssessmentsIndex/index.tsx

@@ -9,6 +9,7 @@ import Preload from 'lib/components/wrappers/Preload';
 import { fetchAssessments } from '../../operations/assessments';
 
 import AssessmentsTable from './AssessmentsTable';
+import ImportAssessmentsButton from './ImportAssessmentsButton';
 import NewAssessmentFormButton from './NewAssessmentFormButton';
 
 const AssessmentsIndex = (): JSX.Element => {
@@ -30,17 +31,23 @@ const AssessmentsIndex = (): JSX.Element => {
         <Page
           actions={
             data.display.canCreateAssessments && (
-              <NewAssessmentFormButton
-                key={data.display.tabId}
-                // @ts-ignore: component is still written in JSX
-                canManageMonitor={data.display.canManageMonitor}
-                categoryId={data.display.category.id}
-                gamified={data.display.isGamified}
-                isKoditsuExamEnabled={data.display.isKoditsuExamEnabled}
-                monitoringEnabled={data.display.isMonitoringEnabled}
-                randomizationAllowed={data.display.allowRandomization}
-                tabId={data.display.tabId}
-              />
+              <>
+                <ImportAssessmentsButton
+                  canImport={data.display.canCreateAssessments}
+                  tabId={data.display.tabId}
+                />
+                <NewAssessmentFormButton
+                  key={data.display.tabId}
+                  // @ts-ignore: component is still written in JSX
+                  canManageMonitor={data.display.canManageMonitor}
+                  categoryId={data.display.category.id}
+                  gamified={data.display.isGamified}
+                  isKoditsuExamEnabled={data.display.isKoditsuExamEnabled}
+                  monitoringEnabled={data.display.isMonitoringEnabled}
+                  randomizationAllowed={data.display.allowRandomization}
+                  tabId={data.display.tabId}
+                />
+              </>
             )
           }
           title={data.display.category.title}

client/app/bundles/course/assessment/translations.ts

@@ -2043,6 +2043,10 @@ const translations = defineMessages({
     id: 'course.assessment.question.programming.liveFeedbackNotSupported',
     defaultMessage: 'Get Help is not supported for {languageName}.',
   },
+  importAssessments: {
+    id: 'course.assessment.AssessmentsIndex.importAssessments',
+    defaultMessage: 'Import Assessments',
+  },
 });
 
 export default translations;

client/app/bundles/course/marketplace/operations.ts

@@ -0,0 +1,8 @@
+import CourseAPI from 'api/course';
+
+import { MarketplaceListing } from './types';
+
+export const fetchListings = async (): Promise<MarketplaceListing[]> => {
+  const response = await CourseAPI.marketplace.index();
+  return response.data.listings as MarketplaceListing[];
+};