-
- {intl.formatMessage(messages.librariesTabErrorMessage)}
-
- )}
- />
- ) : (
-
- {sortAlphabeticallyArray(libraries).map(({
- displayName, org, number, url,
- }) => (
-
- ))}
-
- )
- );
-};
-LibrariesTab.propTypes = {
- libraries: PropTypes.arrayOf(
- PropTypes.shape({
- displayName: PropTypes.string.isRequired,
- libraryKey: PropTypes.string.isRequired,
- number: PropTypes.string.isRequired,
- org: PropTypes.string.isRequired,
- url: PropTypes.string.isRequired,
- }),
- ).isRequired,
- isLoading: PropTypes.bool.isRequired,
- isFailed: PropTypes.bool.isRequired,
-};
-
-export default LibrariesTab;
diff --git a/src/studio-home/tabs-section/libraries-tab/index.tsx b/src/studio-home/tabs-section/libraries-tab/index.tsx
new file mode 100644
index 000000000..b993e9a78
--- /dev/null
+++ b/src/studio-home/tabs-section/libraries-tab/index.tsx
@@ -0,0 +1,71 @@
+import React from 'react';
+import { useIntl } from '@edx/frontend-platform/i18n';
+import { Icon, Row } from '@openedx/paragon';
+import { Error } from '@openedx/paragon/icons';
+
+import AlertMessage from '@src/generic/alert-message';
+import { LoadingSpinner } from '@src/generic/Loading';
+import CardItem from '../../card-item';
+import { sortAlphabeticallyArray } from '../utils';
+import messages from '../messages';
+import { MigrateLegacyLibrariesAlert } from './MigrateLegacyLibrariesAlert';
+
+interface LibrariesTabProps {
+ libraries: {
+ displayName: string;
+ libraryKey: string;
+ number: string;
+ org: string;
+ url: string;
+ }[];
+ isLoading: boolean;
+ isFailed: boolean;
+}
+
+const LibrariesTab = ({
+ libraries,
+ isLoading,
+ isFailed,
+}: LibrariesTabProps) => {
+ const intl = useIntl();
+ if (isLoading) {
+ return (
+
+
+
+ );
+ }
+ return (
+ isFailed ? (
+
+
+ {intl.formatMessage(messages.librariesTabErrorMessage)}
+
+ )}
+ />
+ ) : (
+ <>
+
+
+ {sortAlphabeticallyArray(libraries).map(({
+ displayName, org, number, url,
+ }) => (
+
+ ))}
+
+ >
+ )
+ );
+};
+
+export default LibrariesTab;
diff --git a/src/studio-home/tabs-section/messages.ts b/src/studio-home/tabs-section/messages.ts
index cecac598e..db60d6536 100644
--- a/src/studio-home/tabs-section/messages.ts
+++ b/src/studio-home/tabs-section/messages.ts
@@ -88,6 +88,24 @@ const messages = defineMessages({
id: 'course-authoring.studio-home.libraries.tab.library.not.found.alert.message',
defaultMessage: 'There are no libraries with the current filters.',
},
+ alertTitle: {
+ id: 'studio-home.legacy-libraries.migrate-alert.title',
+ defaultMessage: 'Migrate Legacy Libraries',
+ description: 'Title for the alert message to migrate legacy libraries',
+ },
+ alertDescription: {
+ id: 'studio-home.legacy-libraries.migrate-alert.description',
+ defaultMessage: 'In a future release, legacy libraries will no longer be supported.'
+ + ' The new libraries experience allows you to author sections, subsections, units,'
+ + ' and components to reuse across your courses. Content from legacy libraries can be'
+ + ' migrated to the new experience.',
+ description: 'Description for the alert message to migrate legacy libraries',
+ },
+ alertReviewButton: {
+ id: 'studio-home.legacy-libraries.migrate-alert.review-button',
+ defaultMessage: 'Review Legacy Libraries',
+ description: 'Label for the button to review legacy libraries',
+ },
});
export default messages;