diff --git a/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/ChannelVersionHistory.vue b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/ChannelVersionHistory.vue
new file mode 100644
index 0000000000..0ee92065a4
--- /dev/null
+++ b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/ChannelVersionHistory.vue
@@ -0,0 +1,314 @@
+<template>
+
+  <div class="channel-version-history">
+    <div
+      v-if="!isExpanded"
+      class="toggle-section"
+    >
+      <KButton
+        appearance="basic-link"
+        :text="seeAllVersions$()"
+        data-test="expand-versions-button"
+        @click="handleExpand"
+      />
+    </div>
+    <div
+      v-if="isExpanded"
+      class="versions-container"
+    >
+      <div
+        v-if="isLoading && versions.length === 0"
+        class="loading"
+        role="status"
+        :aria-label="loadingVersionHistory$()"
+      >
+        <KCircularLoader />
+      </div>
+
+      <div
+        v-else-if="error && versions.length === 0"
+        class="error"
+        role="alert"
+      >
+        {{ errorLoadingVersions$() }}
+      </div>
+
+      <div
+        v-else-if="!isLoading && versions.length === 0"
+        class="empty-state"
+      >
+        {{ noVersionsAvailable$() }}
+      </div>
+
+      <div
+        v-else
+        class="versions-list"
+      >
+        <!-- Display each version -->
+        <ul class="versions-list-items">
+          <li
+            v-for="version in versions"
+            :key="version.id"
+            class="version-item"
+          >
+            <div class="version-header">
+              <span class="version-number">
+                {{ versionLabel$({ version: version.version }) }}
+              </span>
+              <span :style="{ color: $themeTokens.annotation }">
+                {{ $formatDate(version.date_published) }}
+              </span>
+            </div>
+            <div
+              class="version-description"
+              :style="{ backgroundColor: $themePalette.grey.v_100 }"
+            >
+              <div class="description-label">
+                {{ versionDescriptionLabel$() }}
+              </div>
+              <KOptionalText>
+                <div
+                  v-if="version.version_notes"
+                  class="description-body"
+                  :style="{ color: $themeTokens.annotation }"
+                >
+                  {{ version.version_notes }}
+                </div>
+              </KOptionalText>
+            </div>
+          </li>
+        </ul>
+
+        <!-- "Show more" button - shown when more versions available -->
+        <div
+          v-if="hasMore"
+          class="show-more-section"
+        >
+          <!-- Show error with retry button if pagination failed -->
+          <div
+            v-if="error && versions.length > 0"
+            class="fetch-more-error"
+            role="alert"
+            :style="{ color: $themeTokens.error }"
+          >
+            <span>{{ errorLoadingVersions$() }}</span>
+            <KButton
+              appearance="basic-link"
+              :text="retry$()"
+              data-test="retry-button"
+              @click="handleShowMore"
+            />
+          </div>
+          <template v-else>
+            <KButton
+              appearance="basic-link"
+              :text="showMore$()"
+              :disabled="isLoadingMore"
+              data-test="show-more-button"
+              @click="handleShowMore"
+            />
+            <KCircularLoader
+              v-if="isLoadingMore"
+              class="inline-loader"
+            />
+          </template>
+        </div>
+
+        <div class="collapse-section">
+          <KButton
+            appearance="basic-link"
+            :text="hideVersions$()"
+            data-test="collapse-versions-button"
+            @click="handleCollapse"
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+
+</template>
+
+
+<script>
+
+  import { ref, watch } from 'vue';
+  import { useChannelVersionHistory } from 'shared/composables/useChannelVersionHistory';
+  import { communityChannelsStrings } from 'shared/strings/communityChannelsStrings';
+
+  /**
+   * Displays channel version history with pagination
+   *
+   * Shows a collapsible list of channel versions with their descriptions.
+   * Versions are fetched on-demand when expanded and paginated with 5 versions per page.
+   *
+   * @component
+   */
+  export default {
+    name: 'ChannelVersionHistory',
+    setup(props) {
+      const isExpanded = ref(false);
+      const {
+        seeAllVersions$,
+        hideVersions$,
+        showMore$,
+        versionLabel$,
+        errorLoadingVersions$,
+        versionDescriptionLabel$,
+        noVersionsAvailable$,
+        retry$,
+        loadingVersionHistory$,
+      } = communityChannelsStrings;
+
+      const {
+        versions,
+        isLoading,
+        isLoadingMore,
+        error,
+        hasMore,
+        fetchVersions,
+        fetchMore,
+        reset,
+      } = useChannelVersionHistory();
+
+      watch(
+        () => props.channelId,
+        (newChannelId, oldChannelId) => {
+          if (newChannelId !== oldChannelId) {
+            reset();
+            isExpanded.value = false;
+          }
+        },
+      );
+
+      const handleExpand = async () => {
+        isExpanded.value = true;
+        if (versions.value.length === 0) {
+          await fetchVersions(props.channelId);
+        }
+      };
+      const handleCollapse = () => {
+        isExpanded.value = false;
+      };
+      const handleShowMore = async () => {
+        await fetchMore();
+      };
+
+      return {
+        isExpanded,
+        versions,
+        isLoading,
+        isLoadingMore,
+        error,
+        hasMore,
+        handleExpand,
+        handleCollapse,
+        handleShowMore,
+        seeAllVersions$,
+        hideVersions$,
+        showMore$,
+        versionLabel$,
+        errorLoadingVersions$,
+        versionDescriptionLabel$,
+        noVersionsAvailable$,
+        retry$,
+        loadingVersionHistory$,
+      };
+    },
+    props: {
+      channelId: {
+        type: String,
+        required: true,
+      },
+    },
+  };
+
+</script>
+
+
+<style scoped lang="scss">
+
+  .channel-version-history {
+    margin-top: 16px;
+
+    .toggle-section {
+      margin: 8px 0;
+    }
+
+    .versions-container {
+      .loading,
+      .error,
+      .empty-state {
+        padding: 8px 0;
+        text-align: center;
+      }
+
+      .versions-list {
+        .versions-list-items {
+          display: flex;
+          flex-direction: column;
+          gap: 24px;
+          padding: 0;
+          margin: 0;
+          list-style: none;
+        }
+
+        .version-item {
+          .version-header {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+
+            .version-number {
+              font-weight: 600;
+            }
+          }
+
+          .version-description {
+            padding: 10px;
+            margin-top: 4px;
+            border-radius: 4px;
+
+            .description-label {
+              margin-bottom: 6px;
+              font-weight: 600;
+            }
+
+            .description-body {
+              max-height: 120px;
+              overflow-y: auto;
+              line-height: 1.4;
+              word-break: break-word;
+              word-wrap: break-word;
+              overflow-wrap: break-word;
+            }
+          }
+        }
+
+        .show-more-section {
+          display: flex;
+          gap: 8px;
+          align-items: center;
+          justify-content: center;
+          margin: 8px 0;
+
+          .inline-loader {
+            width: 20px;
+            height: 20px;
+          }
+
+          .fetch-more-error {
+            display: flex;
+            gap: 8px;
+            align-items: center;
+            font-size: 14px;
+          }
+        }
+
+        .collapse-section {
+          margin: 8px 0;
+        }
+      }
+    }
+  }
+
+</style>
diff --git a/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/PublishSidePanel.vue b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/PublishSidePanel.vue
index f16745cd5e..fec0e2ef03 100644
--- a/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/PublishSidePanel.vue
+++ b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/PublishSidePanel.vue
@@ -74,6 +74,11 @@
                       @blur="isLanguageSelectBlurred = true"
                     />
                   </div>
+
+                  <ChannelVersionHistory
+                    v-if="currentChannel && currentChannel.version > 0"
+                    :channelId="currentChannel.id"
+                  />
                 </div>
               </div>
 
@@ -154,6 +159,7 @@
 <script>
 
   import { ref, computed, getCurrentInstance } from 'vue';
+  import ChannelVersionHistory from './ChannelVersionHistory.vue';
   import SidePanelModal from 'shared/views/SidePanelModal';
   import { Channel, CommunityLibrarySubmission } from 'shared/data/resources';
   import { forceServerSync } from 'shared/data/serverSync';
@@ -165,6 +171,7 @@
     name: 'PublishSidePanel',
     components: {
       SidePanelModal,
+      ChannelVersionHistory,
     },
     setup(props, { emit }) {
       const PublishModes = {
@@ -354,7 +361,9 @@
           }
 
           if (mode.value === PublishModes.DRAFT) {
-            await Channel.publishDraft(currentChannel.value.id, { use_staging_tree: false });
+            await Channel.publishDraft(currentChannel.value.id, {
+              use_staging_tree: false,
+            });
             emit('close');
           } else {
             // `newChannelLanguage.value` is a KSelect option { value, label }, so we need to
diff --git a/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/ChannelVersionHistory.spec.js b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/ChannelVersionHistory.spec.js
new file mode 100644
index 0000000000..1758c58e12
--- /dev/null
+++ b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/ChannelVersionHistory.spec.js
@@ -0,0 +1,344 @@
+import { render, fireEvent, waitFor, screen } from '@testing-library/vue';
+import { createLocalVue } from '@vue/test-utils';
+import VueRouter from 'vue-router';
+import { ref } from 'vue';
+import KThemePlugin from 'kolibri-design-system/lib/KThemePlugin';
+import ChannelVersionHistory from '../ChannelVersionHistory.vue';
+import { useChannelVersionHistory } from 'shared/composables/useChannelVersionHistory';
+import { communityChannelsStrings } from 'shared/strings/communityChannelsStrings';
+
+const localVue = createLocalVue();
+localVue.use(VueRouter);
+localVue.use(KThemePlugin);
+
+jest.mock('shared/composables/useChannelVersionHistory');
+
+const createVersion = (id, version, version_notes = null) => ({
+  id,
+  version,
+  version_notes,
+  date_published: '2026-03-06T12:00:00Z',
+});
+
+describe('ChannelVersionHistory', () => {
+  let mockComposable;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+
+    mockComposable = {
+      versions: ref([]),
+      isLoading: ref(false),
+      isLoadingMore: ref(false),
+      error: ref(null),
+      hasMore: ref(false),
+      fetchVersions: jest.fn(),
+      fetchMore: jest.fn(),
+      reset: jest.fn(),
+    };
+
+    useChannelVersionHistory.mockReturnValue(mockComposable);
+  });
+
+  const renderComponent = (props = {}) => {
+    const router = new VueRouter();
+    return render(ChannelVersionHistory, {
+      localVue,
+      router,
+      propsData: {
+        channelId: 'test-channel-id',
+        ...props,
+      },
+    });
+  };
+
+  describe('initial state', () => {
+    it('renders "See all versions" button when collapsed', () => {
+      renderComponent();
+      expect(screen.getByText(communityChannelsStrings.seeAllVersions$())).toBeInTheDocument();
+    });
+
+    it('does not show versions list when collapsed', () => {
+      mockComposable.versions.value = [createVersion(1, 1, 'Test')];
+      renderComponent();
+
+      expect(
+        screen.queryByText(communityChannelsStrings.versionLabel$({ version: 1 })),
+      ).not.toBeInTheDocument();
+    });
+  });
+
+  describe('expanding', () => {
+    it('fetches versions when expanded for the first time', async () => {
+      renderComponent();
+
+      const expandButton = screen.getByText(communityChannelsStrings.seeAllVersions$());
+      await fireEvent.click(expandButton);
+
+      expect(mockComposable.fetchVersions).toHaveBeenCalledWith('test-channel-id');
+    });
+
+    it('does not fetch again if versions already loaded', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      renderComponent();
+
+      const expandButton = screen.getByText(communityChannelsStrings.seeAllVersions$());
+      await fireEvent.click(expandButton);
+
+      expect(mockComposable.fetchVersions).not.toHaveBeenCalled();
+    });
+
+    it('shows loading indicator when fetching initial versions', async () => {
+      mockComposable.isLoading.value = true;
+      renderComponent();
+
+      const expandButton = screen.getByText(communityChannelsStrings.seeAllVersions$());
+      await fireEvent.click(expandButton);
+
+      await waitFor(() => {
+        expect(screen.getByRole('progressbar')).toBeInTheDocument();
+      });
+    });
+
+    it('shows error message when fetch fails and no versions loaded', async () => {
+      renderComponent();
+
+      const expandButton = screen.getByText(communityChannelsStrings.seeAllVersions$());
+      await fireEvent.click(expandButton);
+
+      // Simulate error after expansion
+      mockComposable.error.value = new Error('Network error');
+
+      await waitFor(() => {
+        expect(
+          screen.getByText(communityChannelsStrings.errorLoadingVersions$()),
+        ).toBeInTheDocument();
+      });
+    });
+  });
+
+  describe('displaying versions', () => {
+    it('shows empty state when no versions available', async () => {
+      mockComposable.versions.value = [];
+      mockComposable.isLoading.value = false;
+      mockComposable.error.value = null;
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        expect(
+          screen.getByText(communityChannelsStrings.noVersionsAvailable$()),
+        ).toBeInTheDocument();
+      });
+    });
+
+    it('renders version list when versions are available', async () => {
+      const versions = [
+        createVersion(1, 3, 'Version 3 notes'),
+        createVersion(2, 2, 'Version 2 notes'),
+        createVersion(3, 1, null),
+      ];
+      mockComposable.versions.value = versions;
+
+      renderComponent();
+
+      const expandButton = screen.getByText(communityChannelsStrings.seeAllVersions$());
+      await fireEvent.click(expandButton);
+
+      await waitFor(() => {
+        expect(
+          screen.getByText(communityChannelsStrings.versionLabel$({ version: 3 })),
+        ).toBeInTheDocument();
+        expect(
+          screen.getByText(communityChannelsStrings.versionLabel$({ version: 2 })),
+        ).toBeInTheDocument();
+        expect(
+          screen.getByText(communityChannelsStrings.versionLabel$({ version: 1 })),
+        ).toBeInTheDocument();
+      });
+    });
+
+    it('renders version descriptions when available', async () => {
+      mockComposable.versions.value = [createVersion(1, 2, 'Added new features')];
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        expect(screen.getByText('Added new features')).toBeInTheDocument();
+        expect(
+          screen.getByText(communityChannelsStrings.versionDescriptionLabel$()),
+        ).toBeInTheDocument();
+      });
+    });
+
+    it('shows "Hide versions" button when expanded', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      renderComponent();
+
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        expect(screen.getByText(communityChannelsStrings.hideVersions$())).toBeInTheDocument();
+      });
+    });
+  });
+
+  describe('pagination', () => {
+    it('shows "Show more" button when hasMore is true', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        expect(screen.getByText(communityChannelsStrings.showMore$())).toBeInTheDocument();
+      });
+    });
+
+    it('does not show "Show more" button when hasMore is false', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = false;
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        expect(screen.queryByText(communityChannelsStrings.showMore$())).not.toBeInTheDocument();
+      });
+    });
+
+    it('calls fetchMore when "Show more" is clicked', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      const showMoreButton = await screen.findByText(communityChannelsStrings.showMore$());
+      await fireEvent.click(showMoreButton);
+
+      expect(mockComposable.fetchMore).toHaveBeenCalled();
+    });
+
+    it('disables "Show more" button when loading more', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+      mockComposable.isLoadingMore.value = true;
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        const showMoreButton = screen.getByText(communityChannelsStrings.showMore$()).closest('a');
+        expect(showMoreButton).toHaveAttribute('disabled');
+      });
+    });
+
+    it('shows inline loader when loading more', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+      mockComposable.isLoadingMore.value = true;
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        const loaders = screen.getAllByRole('progressbar');
+        expect(loaders.length).toBeGreaterThan(0);
+      });
+    });
+
+    it('shows error message when fetchMore fails but versions exist', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+      mockComposable.error.value = new Error('Failed to fetch more');
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        const errorMessages = screen.getAllByText(communityChannelsStrings.errorLoadingVersions$());
+        expect(errorMessages.length).toBe(1);
+      });
+    });
+
+    it('shows retry button when fetchMore fails', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+      mockComposable.error.value = new Error('Failed to fetch more');
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      await waitFor(() => {
+        expect(screen.getByText(communityChannelsStrings.retry$())).toBeInTheDocument();
+      });
+    });
+
+    it('calls fetchMore when retry button is clicked', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+      mockComposable.hasMore.value = true;
+      mockComposable.error.value = new Error('Failed to fetch more');
+
+      renderComponent();
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+
+      const retryButton = await screen.findByText(communityChannelsStrings.retry$());
+      await fireEvent.click(retryButton);
+
+      expect(mockComposable.fetchMore).toHaveBeenCalled();
+    });
+  });
+
+  describe('collapsing', () => {
+    it('hides version list when "Hide versions" is clicked', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+
+      renderComponent();
+
+      // Expand
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+      expect(
+        screen.getByText(communityChannelsStrings.versionLabel$({ version: 1 })),
+      ).toBeInTheDocument();
+
+      // Collapse
+      const hideVersionsButton = screen.getByText(communityChannelsStrings.hideVersions$());
+      await fireEvent.click(hideVersionsButton);
+
+      await waitFor(() => {
+        expect(
+          screen.queryByText(communityChannelsStrings.versionLabel$({ version: 1 })),
+        ).not.toBeInTheDocument();
+        expect(screen.getByText(communityChannelsStrings.seeAllVersions$())).toBeInTheDocument();
+      });
+    });
+  });
+
+  describe('channel ID changes', () => {
+    it('calls reset when channelId prop changes', async () => {
+      mockComposable.versions.value = [createVersion(1, 1)];
+
+      const wrapper = renderComponent({ channelId: 'channel-1' });
+
+      // Expand
+      await fireEvent.click(screen.getByText(communityChannelsStrings.seeAllVersions$()));
+      await wrapper.updateProps({ channelId: 'channel-2' });
+
+      await waitFor(() => {
+        expect(mockComposable.reset).toHaveBeenCalled();
+      });
+    });
+
+    it('does not reset when channelId remains the same', async () => {
+      const wrapper = renderComponent({ channelId: 'channel-1' });
+
+      await wrapper.updateProps({ channelId: 'channel-1' });
+
+      expect(mockComposable.reset).not.toHaveBeenCalled();
+    });
+  });
+});
diff --git a/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/PublishSidePanel.spec.js b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/PublishSidePanel.spec.js
index 0d95fff1ea..cece3ca086 100644
--- a/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/PublishSidePanel.spec.js
+++ b/contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/__tests__/PublishSidePanel.spec.js
@@ -391,4 +391,9 @@ describe('PublishSidePanel', () => {
     await fireEvent.click(cancelBtn);
     expect(emitted().close).toBeTruthy();
   });
+
+  it('renders ChannelVersionHistory component', () => {
+    renderComponent();
+    expect(screen.getByText(communityChannelsStrings.seeAllVersions$())).toBeInTheDocument();
+  });
 });
diff --git a/contentcuration/contentcuration/frontend/shared/composables/__tests__/useChannelVersionHistory.spec.js b/contentcuration/contentcuration/frontend/shared/composables/__tests__/useChannelVersionHistory.spec.js
new file mode 100644
index 0000000000..29c6fd2820
--- /dev/null
+++ b/contentcuration/contentcuration/frontend/shared/composables/__tests__/useChannelVersionHistory.spec.js
@@ -0,0 +1,277 @@
+import { useChannelVersionHistory, VERSIONS_PER_PAGE } from '../useChannelVersionHistory';
+import { ChannelVersion } from 'shared/data/resources';
+
+jest.mock('shared/data/resources', () => ({
+  ChannelVersion: {
+    fetchCollection: jest.fn(),
+  },
+}));
+
+describe('useChannelVersionHistory', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('fetchVersions', () => {
+    it('fetches first page of versions successfully', async () => {
+      const mockVersions = Array.from({ length: 5 }, (_, i) => ({
+        id: i + 1,
+        version: 5 - i,
+        version_notes: `Version ${5 - i}`,
+      }));
+      const mockMore = { channel: 'channel-id', cursor: 'abc123' };
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: mockVersions,
+        more: mockMore,
+      });
+
+      const { fetchVersions, versions, isLoading, hasMore } = useChannelVersionHistory();
+
+      expect(isLoading.value).toBe(false);
+
+      const fetchPromise = fetchVersions('channel-id');
+      expect(isLoading.value).toBe(true);
+
+      await fetchPromise;
+
+      expect(ChannelVersion.fetchCollection).toHaveBeenCalledWith({
+        channel: 'channel-id',
+        max_results: VERSIONS_PER_PAGE,
+      });
+      expect(versions.value).toEqual(mockVersions);
+      expect(hasMore.value).toBe(true);
+      expect(isLoading.value).toBe(false);
+    });
+
+    it('sets hasMore to false when no more object', async () => {
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: [{ id: 1, version: 1 }],
+        more: null,
+      });
+
+      const { fetchVersions, hasMore } = useChannelVersionHistory();
+      await fetchVersions('channel-id');
+
+      expect(hasMore.value).toBe(false);
+    });
+
+    it('handles errors during fetch', async () => {
+      const mockError = new Error('Network error');
+      ChannelVersion.fetchCollection.mockRejectedValue(mockError);
+
+      const { fetchVersions, versions, error, isLoading } = useChannelVersionHistory();
+
+      await fetchVersions('channel-id');
+
+      expect(error.value).toBe(mockError);
+      expect(versions.value).toEqual([]);
+      expect(isLoading.value).toBe(false);
+    });
+
+    it('resets state before fetching new versions', async () => {
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: [{ id: 1, version: 1 }],
+        more: null,
+      });
+
+      const { fetchVersions, versions } = useChannelVersionHistory();
+
+      // First fetch
+      await fetchVersions('channel-1');
+      expect(versions.value.length).toBe(1);
+
+      // Second fetch should reset
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: [
+          { id: 2, version: 2 },
+          { id: 3, version: 3 },
+        ],
+        more: null,
+      });
+      await fetchVersions('channel-2');
+
+      expect(versions.value.length).toBe(2);
+    });
+
+    it('clears error on new fetch', async () => {
+      const mockError = new Error('Network error');
+      ChannelVersion.fetchCollection.mockRejectedValue(mockError);
+
+      const { fetchVersions, error } = useChannelVersionHistory();
+      await fetchVersions('channel-id');
+      expect(error.value).toBe(mockError);
+
+      // Successful fetch should clear error
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: [{ id: 1, version: 1 }],
+        more: null,
+      });
+      await fetchVersions('channel-id');
+      expect(error.value).toBe(null);
+    });
+  });
+
+  describe('fetchMore', () => {
+    it('fetches next page using cursor and appends to existing versions', async () => {
+      const page1 = Array.from({ length: 5 }, (_, i) => ({ id: i + 1, version: 5 - i }));
+      const page2 = [{ id: 6, version: 1 }];
+      const moreParams = { channel: 'channel-id', cursor: 'cursor123' };
+
+      ChannelVersion.fetchCollection
+        .mockResolvedValueOnce({ results: page1, more: moreParams })
+        .mockResolvedValueOnce({ results: page2, more: null });
+
+      const { fetchVersions, fetchMore, versions, hasMore } = useChannelVersionHistory();
+
+      await fetchVersions('channel-id');
+      expect(versions.value).toEqual(page1);
+      expect(hasMore.value).toBe(true);
+
+      await fetchMore();
+
+      expect(ChannelVersion.fetchCollection).toHaveBeenCalledTimes(2);
+      expect(ChannelVersion.fetchCollection).toHaveBeenLastCalledWith(moreParams);
+      expect(versions.value).toEqual([...page1, ...page2]);
+      expect(hasMore.value).toBe(false);
+    });
+
+    it('does not fetch when hasMore is false', async () => {
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: [{ id: 1, version: 1 }],
+        more: null,
+      });
+
+      const { fetchVersions, fetchMore } = useChannelVersionHistory();
+      await fetchVersions('channel-id');
+
+      ChannelVersion.fetchCollection.mockClear();
+      await fetchMore();
+
+      expect(ChannelVersion.fetchCollection).not.toHaveBeenCalled();
+    });
+
+    it('does not fetch when isLoadingMore is true', async () => {
+      const fullPage = Array.from({ length: 5 }, (_, i) => ({ id: i + 1, version: i + 1 }));
+      const moreParams = { channel: 'channel-id', cursor: 'cursor123' };
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: fullPage,
+        more: moreParams,
+      });
+
+      const { fetchVersions, fetchMore, isLoadingMore } = useChannelVersionHistory();
+      await fetchVersions('channel-id');
+
+      // Start first fetchMore but don't await
+      ChannelVersion.fetchCollection.mockImplementation(
+        () => new Promise(resolve => setTimeout(() => resolve({ results: [], more: null }), 100)),
+      );
+
+      const promise1 = fetchMore();
+      expect(isLoadingMore.value).toBe(true);
+
+      // Try to fetch more while already loading
+      await fetchMore();
+
+      expect(ChannelVersion.fetchCollection).toHaveBeenCalledTimes(2); // Initial + first fetchMore only
+
+      await promise1;
+    });
+
+    it('does not fetch when no initial fetch has been made', async () => {
+      const { fetchMore } = useChannelVersionHistory();
+
+      await fetchMore();
+
+      expect(ChannelVersion.fetchCollection).not.toHaveBeenCalled();
+    });
+
+    it('handles errors during fetchMore', async () => {
+      const mockError = new Error('Network error');
+      const fullPage = Array.from({ length: 5 }, (_, i) => ({ id: i + 1, version: i + 1 }));
+      const moreParams = { channel: 'channel-id', cursor: 'cursor123' };
+      ChannelVersion.fetchCollection
+        .mockResolvedValueOnce({ results: fullPage, more: moreParams })
+        .mockRejectedValueOnce(mockError);
+
+      const { fetchVersions, fetchMore, error, versions, isLoadingMore } =
+        useChannelVersionHistory();
+
+      await fetchVersions('channel-id');
+      const initialVersions = versions.value;
+
+      await fetchMore();
+
+      expect(error.value).toBe(mockError);
+      expect(versions.value).toEqual(initialVersions); // Versions should remain unchanged
+      expect(isLoadingMore.value).toBe(false);
+    });
+
+    it('clears error before fetching more', async () => {
+      const mockError = new Error('Network error');
+      const fullPage = Array.from({ length: 5 }, (_, i) => ({ id: i + 1, version: i + 1 }));
+      const moreParams = { channel: 'channel-id', cursor: 'cursor123' };
+      ChannelVersion.fetchCollection
+        .mockResolvedValueOnce({ results: fullPage, more: moreParams })
+        .mockRejectedValueOnce(mockError)
+        .mockResolvedValueOnce({ results: [{ id: 6, version: 6 }], more: null });
+
+      const { fetchVersions, fetchMore, error, hasMore } = useChannelVersionHistory();
+
+      await fetchVersions('channel-id');
+      expect(hasMore.value).toBe(true);
+
+      await fetchMore(); // This will fail
+      expect(error.value).toBe(mockError);
+      // hasMore should still be true since the error didn't update moreObject
+      expect(hasMore.value).toBe(true);
+
+      await fetchMore(); // This should succeed and clear error
+      expect(error.value).toBe(null);
+    });
+  });
+
+  describe('reset', () => {
+    it('resets all state to initial values', async () => {
+      const fullPage = Array.from({ length: 5 }, (_, i) => ({ id: i + 1, version: i + 1 }));
+      const moreParams = { channel: 'channel-id', cursor: 'cursor123' };
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: fullPage,
+        more: moreParams,
+      });
+
+      const { fetchVersions, reset, versions, isLoading, isLoadingMore, error, hasMore } =
+        useChannelVersionHistory();
+
+      await fetchVersions('channel-id');
+      expect(versions.value.length).toBe(5);
+      expect(hasMore.value).toBe(true);
+
+      reset();
+
+      expect(versions.value).toEqual([]);
+      expect(isLoading.value).toBe(false);
+      expect(isLoadingMore.value).toBe(false);
+      expect(error.value).toBe(null);
+      expect(hasMore.value).toBe(false);
+    });
+
+    it('allows fetching after reset', async () => {
+      ChannelVersion.fetchCollection.mockResolvedValue({
+        results: [{ id: 1, version: 1 }],
+        more: null,
+      });
+
+      const { fetchVersions, reset, versions } = useChannelVersionHistory();
+
+      await fetchVersions('channel-1');
+      expect(versions.value.length).toBe(1);
+
+      reset();
+      expect(versions.value).toEqual([]);
+
+      await fetchVersions('channel-2');
+      expect(versions.value.length).toBe(1);
+      expect(ChannelVersion.fetchCollection).toHaveBeenCalledTimes(2);
+    });
+  });
+});
diff --git a/contentcuration/contentcuration/frontend/shared/composables/useChannelVersionHistory.js b/contentcuration/contentcuration/frontend/shared/composables/useChannelVersionHistory.js
new file mode 100644
index 0000000000..42dbddb7ab
--- /dev/null
+++ b/contentcuration/contentcuration/frontend/shared/composables/useChannelVersionHistory.js
@@ -0,0 +1,96 @@
+import { ref, computed } from 'vue';
+import { ChannelVersion } from 'shared/data/resources';
+
+export const VERSIONS_PER_PAGE = 5;
+
+/**
+ * Composable that fetches and manages cursor-based paginated channel versions
+ *
+ * @returns {{
+ *   versions: import('vue').Ref<Array<Object>>,
+ *   isLoading: import('vue').Ref<boolean>,
+ *   isLoadingMore: import('vue').Ref<boolean>,
+ *   error: import('vue').Ref<Error|null>,
+ *   hasMore: import('vue').ComputedRef<boolean>,
+ *   fetchVersions: (channelId: string) => Promise<void>,
+ *   fetchMore: () => Promise<void>,
+ *   reset: () => void,
+ * }}
+ */
+export function useChannelVersionHistory() {
+  const versions = ref([]);
+  const isLoading = ref(false);
+  const isLoadingMore = ref(false);
+  const error = ref(null);
+  const moreObject = ref(null);
+  const currentChannelId = ref(null);
+
+  const hasMore = computed(() => Boolean(moreObject.value));
+
+  /**
+   * Fetch first page of versions for a channel
+   * @param {string} channelId - The channel ID to fetch versions for
+   */
+  async function fetchVersions(channelId) {
+    isLoading.value = true;
+    error.value = null;
+    versions.value = [];
+    moreObject.value = null;
+    currentChannelId.value = channelId;
+
+    try {
+      const response = await ChannelVersion.fetchCollection({
+        channel: channelId,
+        max_results: VERSIONS_PER_PAGE,
+      });
+
+      versions.value = response.results || [];
+      moreObject.value = response.more || null;
+    } catch (err) {
+      error.value = err;
+      versions.value = [];
+    } finally {
+      isLoading.value = false;
+    }
+  }
+
+  async function fetchMore() {
+    if (!hasMore.value || isLoadingMore.value) {
+      return;
+    }
+
+    isLoadingMore.value = true;
+    error.value = null;
+
+    try {
+      const response = await ChannelVersion.fetchCollection(moreObject.value);
+
+      versions.value = [...versions.value, ...(response.results || [])];
+      moreObject.value = response.more || null;
+    } catch (err) {
+      error.value = err;
+    } finally {
+      isLoadingMore.value = false;
+    }
+  }
+
+  function reset() {
+    versions.value = [];
+    isLoading.value = false;
+    isLoadingMore.value = false;
+    error.value = null;
+    moreObject.value = null;
+    currentChannelId.value = null;
+  }
+
+  return {
+    versions,
+    isLoading,
+    isLoadingMore,
+    error,
+    hasMore,
+    fetchVersions,
+    fetchMore,
+    reset,
+  };
+}
diff --git a/contentcuration/contentcuration/frontend/shared/strings/communityChannelsStrings.js b/contentcuration/contentcuration/frontend/shared/strings/communityChannelsStrings.js
index 53ee27edfa..615962b0c3 100644
--- a/contentcuration/contentcuration/frontend/shared/strings/communityChannelsStrings.js
+++ b/contentcuration/contentcuration/frontend/shared/strings/communityChannelsStrings.js
@@ -77,6 +77,39 @@ export const communityChannelsStrings = createTranslator('CommunityChannelsStrin
     message: 'Language is required',
     context: 'Error message when language selection is required but not provided',
   },
+  // Channel version history strings
+  seeAllVersions: {
+    message: 'See all versions',
+    context: 'Button text to expand and show channel version history',
+  },
+  hideVersions: {
+    message: 'Hide versions',
+    context: 'Button text to collapse channel version history',
+  },
+  showMore: {
+    message: 'Show more',
+    context: 'Button text to load more channel versions',
+  },
+  versionLabel: {
+    message: 'Version {version}',
+    context: 'Label displaying a channel version number',
+  },
+  errorLoadingVersions: {
+    message: 'Unable to load version history',
+    context: 'Error message when channel versions fail to load',
+  },
+  noVersionsAvailable: {
+    message: 'No version history available',
+    context: 'Message shown when channel has no published versions',
+  },
+  retry: {
+    message: 'Retry',
+    context: 'Button text to retry loading more versions after an error',
+  },
+  loadingVersionHistory: {
+    message: 'Loading version history',
+    context: 'Aria label for screen readers when version history is loading',
+  },
   pendingStatus: {
     message: 'Submitted',
     context: 'Status indicating that an Community Library submission is pending',
diff --git a/contentcuration/contentcuration/viewsets/channel.py b/contentcuration/contentcuration/viewsets/channel.py
index 82ff6e0c34..ae0cb760c0 100644
--- a/contentcuration/contentcuration/viewsets/channel.py
+++ b/contentcuration/contentcuration/viewsets/channel.py
@@ -59,6 +59,7 @@
 from contentcuration.models import User
 from contentcuration.utils.garbage_collect import get_deleted_chefs_root
 from contentcuration.utils.pagination import CachedListPagination
+from contentcuration.utils.pagination import ValuesViewsetCursorPagination
 from contentcuration.utils.pagination import ValuesViewsetPageNumberPagination
 from contentcuration.utils.publish import ChannelIncompleteError
 from contentcuration.utils.publish import publish_channel
@@ -96,10 +97,10 @@ class CatalogListPagination(CachedListPagination):
     max_page_size = 1000
 
 
-class ChannelVersionListPagination(ValuesViewsetPageNumberPagination):
-    page_size = None
-    page_size_query_param = "page_size"
-    max_page_size = 1000
+class ChannelVersionListPagination(ValuesViewsetCursorPagination):
+    ordering = "-version"
+    page_size_query_param = "max_results"
+    max_page_size = 100
 
 
 primary_token_subquery = Subquery(