@selfcommunity/react-core 0.6.7-alpha.8 → 0.6.7-payments.143

package/lib/esm/constants/Preferences.d.ts

@@ -135,11 +135,18 @@ export declare const CONFIGURATIONS_EVENTS_ENABLED: string;
 export declare const CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED: string;
 export declare const CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED: string;
 export declare const CONFIGURATIONS_EVENTS_PRIVATE_ENABLED: string;
+export declare const CONFIGURATIONS_COURSES_ENABLED: string;
+export declare const CONFIGURATIONS_COURSES_ONLY_STAFF_ENABLED: string;
+export declare const CONFIGURATIONS_COURSES_VISIBILITY_ENABLED: string;
+export declare const CONFIGURATIONS_COURSES_PRIVATE_ENABLED: string;
 export declare const CONFIGURATIONS_ONBOARDING_ENABLED: string;
 export declare const CONFIGURATIONS_ONBOARDING_HIDDEN: string;
 export declare const CONFIGURATIONS_LIVE_STREAM_ENABLED: string;
 export declare const CONFIGURATIONS_LIVE_STREAM_ONLY_STAFF_ENABLED: string;
+export declare const CONFIGURATIONS_LIVE_VIDEO_CONFERENCE_ENABLED: string;
 export declare const CONFIGURATIONS_SUBSCRIPTION_TIER: string;
+export declare const CONFIGURATIONS_PAYMENTS_ENABLED: string;
+export declare const CONFIGURATIONS_STRIPE_CONNECTED_ACCOUNT_ID: string;
 /**
  * PROVIDERS
  */
@@ -166,6 +173,12 @@ export declare const PROVIDERS_WEB_PUSH_ENABLED: string;
 export declare const WEBMASTER_META_ROBOTS: string;
 export declare const WEBMASTER_META_TITLE_HOME_NOT_LOGGED: string;
 export declare const WEBMASTER_META_DESCRIPTION: string;
+/**
+ * STATIC
+ */
+export declare const STATIC_ENVIRONMENT: string;
+export declare const STATIC_STACKID: string;
+export declare const STATIC_STRIPE_PUBLIC_KEY: string;
 export declare const getPreferenceSection: (value: any) => any;
 export declare const getPreferenceName: (value: any) => any;
 export declare const getPreference: (value: any) => {

package/lib/esm/constants/Preferences.js

@@ -136,11 +136,18 @@ export const CONFIGURATIONS_EVENTS_ENABLED = `${SCPreferenceSection.CONFIGURATIO
 export const CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.EVENTS_ONLY_STAFF_ENABLED}`;
 export const CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.EVENTS_VISIBILITY_ENABLED}`;
 export const CONFIGURATIONS_EVENTS_PRIVATE_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.EVENTS_PRIVATE_ENABLED}`;
+export const CONFIGURATIONS_COURSES_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.COURSES_ENABLED}`;
+export const CONFIGURATIONS_COURSES_ONLY_STAFF_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.COURSES_ONLY_STAFF_ENABLED}`;
+export const CONFIGURATIONS_COURSES_VISIBILITY_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.COURSES_VISIBILITY_ENABLED}`;
+export const CONFIGURATIONS_COURSES_PRIVATE_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.COURSES_PRIVATE_ENABLED}`;
 export const CONFIGURATIONS_ONBOARDING_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.ONBOARDING_ENABLED}`;
 export const CONFIGURATIONS_ONBOARDING_HIDDEN = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.ONBOARDING_HIDDEN}`;
 export const CONFIGURATIONS_LIVE_STREAM_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.LIVE_STREAM_ENABLED}`;
 export const CONFIGURATIONS_LIVE_STREAM_ONLY_STAFF_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.LIVE_STREAM_ONLY_STAFF_ENABLED}`;
+export const CONFIGURATIONS_LIVE_VIDEO_CONFERENCE_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.LIVE_STREAM_VIDEO_CONFERENCE_ENABLED}`;
 export const CONFIGURATIONS_SUBSCRIPTION_TIER = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.SUBSCRIPTION_TIER}`;
+export const CONFIGURATIONS_PAYMENTS_ENABLED = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.PAYMENTS_ENABLED}`;
+export const CONFIGURATIONS_STRIPE_CONNECTED_ACCOUNT_ID = `${SCPreferenceSection.CONFIGURATIONS}.${SCPreferenceName.STRIPE_CONNECTED_ACCOUNT_ID}`;
 /**
  * PROVIDERS
  */
@@ -167,6 +174,12 @@ export const PROVIDERS_WEB_PUSH_ENABLED = `${SCPreferenceSection.PROVIDERS}.${SC
 export const WEBMASTER_META_ROBOTS = `${SCPreferenceSection.WEBMASTER}.${SCPreferenceName.META_ROBOTS}`;
 export const WEBMASTER_META_TITLE_HOME_NOT_LOGGED = `${SCPreferenceSection.WEBMASTER}.${SCPreferenceName.META_TITLE_HOME_NOT_LOGGED}`;
 export const WEBMASTER_META_DESCRIPTION = `${SCPreferenceSection.WEBMASTER}.${SCPreferenceName.META_DESCRIPTION}`;
+/**
+ * STATIC
+ */
+export const STATIC_ENVIRONMENT = `${SCPreferenceSection.STATIC}.${SCPreferenceName.ENVIRONMENT}`;
+export const STATIC_STACKID = `${SCPreferenceSection.STATIC}.${SCPreferenceName.STACK_ID}`;
+export const STATIC_STRIPE_PUBLIC_KEY = `${SCPreferenceSection.STATIC}.${SCPreferenceName.STRIPE_PUBLIC_KEY}`;
 const booleanType = (value) => {
     if (value === 'True') {
         return true;
@@ -286,11 +299,18 @@ export const DATA_TYPES = {
     [CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED]: booleanType,
     [CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED]: booleanType,
     [CONFIGURATIONS_EVENTS_PRIVATE_ENABLED]: booleanType,
+    [CONFIGURATIONS_COURSES_ENABLED]: booleanType,
+    [CONFIGURATIONS_COURSES_ONLY_STAFF_ENABLED]: booleanType,
+    [CONFIGURATIONS_COURSES_VISIBILITY_ENABLED]: booleanType,
+    [CONFIGURATIONS_COURSES_PRIVATE_ENABLED]: booleanType,
     [CONFIGURATIONS_ONBOARDING_ENABLED]: booleanType,
     [CONFIGURATIONS_ONBOARDING_HIDDEN]: booleanType,
     [CONFIGURATIONS_LIVE_STREAM_ENABLED]: booleanType,
     [CONFIGURATIONS_LIVE_STREAM_ONLY_STAFF_ENABLED]: booleanType,
+    [CONFIGURATIONS_LIVE_VIDEO_CONFERENCE_ENABLED]: booleanType,
     [CONFIGURATIONS_SUBSCRIPTION_TIER]: stringType,
+    [CONFIGURATIONS_PAYMENTS_ENABLED]: booleanType,
+    [CONFIGURATIONS_STRIPE_CONNECTED_ACCOUNT_ID]: stringType,
     [PROVIDERS_APP_URL_ON_APP_STORE]: stringType,
     [PROVIDERS_APP_URL_ON_GOOGLE_PLAY]: stringType,
     [PROVIDERS_FACEBOOK_SIGNIN_ENABLED]: stringType,
@@ -311,4 +331,7 @@ export const DATA_TYPES = {
     [WEBMASTER_META_ROBOTS]: stringType,
     [WEBMASTER_META_TITLE_HOME_NOT_LOGGED]: stringType,
     [WEBMASTER_META_DESCRIPTION]: stringType,
+    [STATIC_ENVIRONMENT]: stringType,
+    [STATIC_STACKID]: stringType,
+    [STATIC_STRIPE_PUBLIC_KEY]: stringType,
 };

package/lib/esm/constants/Routes.d.ts

@@ -38,10 +38,18 @@ export declare const GROUPS_ROUTE_NAME = "groups";
 export declare const GROUPS_SUBSCRIBED_ROUTE_NAME = "groups_subscribed";
 export declare const EVENT_ROUTE_NAME = "event";
 export declare const EVENTS_ROUTE_NAME = "events";
+export declare const COURSE_ROUTE_NAME = "course";
+export declare const COURSE_EDIT_ROUTE_NAME = "course_edit";
+export declare const COURSE_DASHBOARD_ROUTE_NAME = "course_dashboard";
+export declare const COURSE_LESSON_ROUTE_NAME = "course_lesson";
+export declare const COURSE_LESSON_EDIT_ROUTE_NAME = "course_lesson_edit";
+export declare const COURSE_LESSON_COMMENT_ROUTE_NAME = "course_lesson_comment";
+export declare const COURSES_ROUTE_NAME = "courses";
 export declare const EVENTS_SUGGESTED_ROUTE_NAME = "events_suggested";
 export declare const EVENTS_SUBSCRIBED_ROUTE_NAME = "events_subscribed";
 export declare const EVENTS_HIGHLIGHT_ROUTE_NAME = "events_highlight";
 export declare const LIVESTREAM_ROUTE_NAME = "live";
+export declare const CHECKOUT_PAYMENT = "checkout_payment";
 /**
  * Default Routes
  * @type {{[p: string]: string, '[POST_ROUTE_NAME]': string, '[INCUBATOR_ROUTE_NAME]': string, '[LOYALTY_ROUTE_NAME]': string, '[USER_NOTIFICATION_ROUTE_NAME]': string, '[USER_PRIVATE_MESSAGES_ROUTE_NAME]': string, '[COMMENT_ROUTE_NAME]': string, '[DISCUSSION_ROUTE_NAME]': string, '[CATEGORIES_ROUTE_NAME]': string, '[USER_PROFILE_ROUTE_NAME]': string, '[CATEGORY_ROUTE_NAME]': string, '[USER_PROFILE_SETTINGS_ROUTE_NAME]': string, '[STATUS_ROUTE_NAME]': string}}

package/lib/esm/constants/Routes.js

@@ -38,10 +38,18 @@ export const GROUPS_ROUTE_NAME = 'groups';
 export const GROUPS_SUBSCRIBED_ROUTE_NAME = 'groups_subscribed';
 export const EVENT_ROUTE_NAME = 'event';
 export const EVENTS_ROUTE_NAME = 'events';
+export const COURSE_ROUTE_NAME = 'course';
+export const COURSE_EDIT_ROUTE_NAME = 'course_edit';
+export const COURSE_DASHBOARD_ROUTE_NAME = 'course_dashboard';
+export const COURSE_LESSON_ROUTE_NAME = 'course_lesson';
+export const COURSE_LESSON_EDIT_ROUTE_NAME = 'course_lesson_edit';
+export const COURSE_LESSON_COMMENT_ROUTE_NAME = 'course_lesson_comment';
+export const COURSES_ROUTE_NAME = 'courses';
 export const EVENTS_SUGGESTED_ROUTE_NAME = 'events_suggested';
 export const EVENTS_SUBSCRIBED_ROUTE_NAME = 'events_subscribed';
 export const EVENTS_HIGHLIGHT_ROUTE_NAME = 'events_highlight';
 export const LIVESTREAM_ROUTE_NAME = 'live';
+export const CHECKOUT_PAYMENT = 'checkout_payment';
 /**
  * Default Routes
  * @type {{[p: string]: string, '[POST_ROUTE_NAME]': string, '[INCUBATOR_ROUTE_NAME]': string, '[LOYALTY_ROUTE_NAME]': string, '[USER_NOTIFICATION_ROUTE_NAME]': string, '[USER_PRIVATE_MESSAGES_ROUTE_NAME]': string, '[COMMENT_ROUTE_NAME]': string, '[DISCUSSION_ROUTE_NAME]': string, '[CATEGORIES_ROUTE_NAME]': string, '[USER_PROFILE_ROUTE_NAME]': string, '[CATEGORY_ROUTE_NAME]': string, '[USER_PROFILE_SETTINGS_ROUTE_NAME]': string, '[STATUS_ROUTE_NAME]': string}}
@@ -85,5 +93,13 @@ export const defaultRoutes = {
     [EVENT_ROUTE_NAME]: '/event/:id/:slug/',
     [EVENTS_SUBSCRIBED_ROUTE_NAME]: '/events/subscribed/',
     [EVENTS_HIGHLIGHT_ROUTE_NAME]: '/events/highlight/',
+    [COURSE_ROUTE_NAME]: '/course/:id/:slug/',
+    [COURSES_ROUTE_NAME]: '/courses/',
+    [COURSE_EDIT_ROUTE_NAME]: '/course/:id/:slug/edit/:tab',
+    [COURSE_DASHBOARD_ROUTE_NAME]: '/course/:id/:slug/dashboard',
+    [COURSE_LESSON_ROUTE_NAME]: '/course/:id/:slug/section/:section_id/lesson/:lesson_id/',
+    [COURSE_LESSON_EDIT_ROUTE_NAME]: '/course/:id/:slug/section/:section_id/lesson/:lesson_id/edit',
+    [COURSE_LESSON_COMMENT_ROUTE_NAME]: '/course/:id/:slug/section/:section_id/lesson/:lesson_id/comment/:comment_id',
     [LIVESTREAM_ROUTE_NAME]: '/live/:slug/',
+    [CHECKOUT_PAYMENT]: '/checkout/:content_type/:content_id/price/:price_id',
 };

package/lib/esm/hooks/useSCFetchCategories.d.ts

@@ -1,4 +1,5 @@
 import { SCCategoryType } from '@selfcommunity/types';
+import { CategoryParams } from '@selfcommunity/api-services';
 import { CacheStrategies } from '@selfcommunity/utils';
 /**
  :::info
@@ -14,6 +15,7 @@ import { CacheStrategies } from '@selfcommunity/utils';
  */
 declare const useSCFetchCategories: (props?: {
     cacheStrategy?: CacheStrategies;
+    endpointQueryParams?: CategoryParams;
 }) => {
     categories: SCCategoryType[];
     isLoading: boolean;

package/lib/esm/hooks/useSCFetchCategories.js

@@ -6,7 +6,7 @@ import { CacheStrategies, Logger, LRUCache } from '@selfcommunity/utils';
 import { getCategoriesObjectCacheKey, getCategoryObjectCacheKey } from '../constants/Cache';
 const init = { categories: [], isLoading: true };
 // HYDRATE the cache
-const hydrate = (ids) => {
+const hydrate = (ids, endpointQueryParams) => {
     if (!ids) {
         return null;
     }
@@ -18,6 +18,9 @@ const hydrate = (ids) => {
         // REVALIDATE CACHE
         return null;
     }
+    if (endpointQueryParams === null || endpointQueryParams === void 0 ? void 0 : endpointQueryParams.can_create_content) {
+        return categories.filter((c) => !c.content_only_staff);
+    }
     return categories;
 };
 /**
@@ -34,17 +37,17 @@ const hydrate = (ids) => {
  */
 const useSCFetchCategories = (props) => {
     // PROPS
-    const { cacheStrategy = CacheStrategies.CACHE_FIRST } = props || {};
+    const { cacheStrategy = CacheStrategies.CACHE_FIRST, endpointQueryParams = {} } = props || {};
     // CACHE
     const __categoriesCacheKey = getCategoriesObjectCacheKey();
     // STATE
-    const categories = cacheStrategy !== CacheStrategies.NETWORK_ONLY ? hydrate(LRUCache.get(__categoriesCacheKey, null)) : null;
+    const categories = cacheStrategy !== CacheStrategies.NETWORK_ONLY ? hydrate(LRUCache.get(__categoriesCacheKey, null), endpointQueryParams) : null;
     const [data, setData] = useState(categories !== null ? { categories, isLoading: false } : init);
     /**
      * Fetch categories
      */
     const fetchCategories = (next = Endpoints.CategoryList.url()) => __awaiter(void 0, void 0, void 0, function* () {
-        const data = yield CategoryService.getAllCategories({ active: true }, { url: next });
+        const data = yield CategoryService.getAllCategories(Object.assign({ active: true }, endpointQueryParams), { url: next });
         return data.next ? data.results.concat(yield fetchCategories(data.next)) : data.results;
     });
     /**

package/lib/esm/hooks/useSCFetchCourse.d.ts

@@ -0,0 +1,23 @@
+import { CourseInfoParams } from '@selfcommunity/api-services';
+import { SCCourseType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ :::info
+ This custom hook is used to fetch an course object.
+ :::
+ * @param object
+ * @param object.id
+ * @param object.course
+ * @param object.cacheStrategy
+ * @param object.params
+ */
+export default function useSCFetchCourse({ id, course, cacheStrategy, params, }: {
+    id?: number | string;
+    course?: SCCourseType;
+    cacheStrategy?: CacheStrategies;
+    params?: CourseInfoParams;
+}): {
+    scCourse: SCCourseType;
+    setSCCourse: (c: SCCourseType) => void;
+    error: string;
+};

package/lib/esm/hooks/useSCFetchCourse.js

@@ -0,0 +1,78 @@
+import { Endpoints, http } from '@selfcommunity/api-services';
+import { CacheStrategies, Logger, LRUCache, objectWithoutProperties } from '@selfcommunity/utils';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect';
+import { useSCUser } from '../components/provider/SCUserProvider';
+import { getCourseObjectCacheKey } from '../constants/Cache';
+import { SCOPE_SC_CORE } from '../constants/Errors';
+/**
+ :::info
+ This custom hook is used to fetch an course object.
+ :::
+ * @param object
+ * @param object.id
+ * @param object.course
+ * @param object.cacheStrategy
+ * @param object.params
+ */
+export default function useSCFetchCourse({ id = null, course = null, cacheStrategy = CacheStrategies.CACHE_FIRST, params = null, }) {
+    const __courseId = useMemo(() => (course === null || course === void 0 ? void 0 : course.id) || id, [course, id]);
+    // CONTEXT
+    const scUserContext = useSCUser();
+    const authUserId = useMemo(() => { var _a; return ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) || null; }, [scUserContext.user]);
+    // CACHE
+    const __courseCacheKey = useMemo(() => getCourseObjectCacheKey(__courseId), [__courseId]);
+    const __course = useMemo(() => (authUserId ? course : objectWithoutProperties(course, ['join_status'])), [authUserId, course]);
+    const [scCourse, setScCourse] = useState(cacheStrategy !== CacheStrategies.NETWORK_ONLY ? LRUCache.get(__courseCacheKey, __course) : null);
+    const [error, setError] = useState(null);
+    const setSCCourse = useCallback((c) => {
+        setScCourse(c);
+        LRUCache.set(__courseCacheKey, c);
+    }, [setScCourse, __courseCacheKey]);
+    /**
+     * Memoized fetchTag
+     */
+    const fetchCourse = useMemo(() => (id) => {
+        return http
+            .request({
+            url: Endpoints.GetCourseInfo.url({ id }),
+            method: Endpoints.GetCourseInfo.method,
+            params: params !== null && params !== void 0 ? params : {},
+        })
+            .then((res) => {
+            if (res.status >= 300) {
+                return Promise.reject(res);
+            }
+            return Promise.resolve(res.data);
+        });
+    }, []);
+    /**
+     * If id attempt to get the course by id
+     */
+    useEffect(() => {
+        if (id !== null && id !== undefined && !course) {
+            fetchCourse(id)
+                .then((e) => {
+                setSCCourse(e);
+            })
+                .catch((err) => {
+                LRUCache.delete(__courseCacheKey);
+                if (err.status === 403) {
+                    setError('You do not have permission to perform this action.');
+                    Logger.error(SCOPE_SC_CORE, 'You do not have permission to perform this action.');
+                }
+                else {
+                    setError(`Course with id ${id} not found`);
+                    Logger.error(SCOPE_SC_CORE, `Course with id ${id} not found`);
+                }
+                Logger.error(SCOPE_SC_CORE, err.message);
+            });
+        }
+    }, [id, course, authUserId]);
+    useDeepCompareEffectNoCheck(() => {
+        if (course) {
+            setSCCourse(course);
+        }
+    }, [course, authUserId]);
+    return { scCourse, setSCCourse, error };
+}

package/lib/esm/hooks/useSCFetchCourses.d.ts

@@ -0,0 +1,22 @@
+import { SCCourseType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ :::info
+ This custom hook is used to fetch courses.
+ @param object.cacheStrategy
+
+ :::tip Context can be consumed in this way:
+
+ ```jsx
+ const {courses, isLoading} = useSCFetchCourses();
+ ```
+ :::
+ * @param props
+ */
+declare const useSCFetchCourses: (props?: {
+    cacheStrategy?: CacheStrategies;
+}) => {
+    courses: SCCourseType[];
+    isLoading: boolean;
+};
+export default useSCFetchCourses;

package/lib/esm/hooks/useSCFetchCourses.js

@@ -0,0 +1,81 @@
+import { __awaiter } from "tslib";
+import { useEffect, useState } from 'react';
+import { SCOPE_SC_CORE } from '../constants/Errors';
+import { Endpoints, http } from '@selfcommunity/api-services';
+import { CacheStrategies, Logger, LRUCache } from '@selfcommunity/utils';
+import { getCourseObjectCacheKey, getCoursesObjectCacheKey } from '../constants/Cache';
+const init = { courses: [], isLoading: true };
+// HYDRATE the cache
+const hydrate = (ids) => {
+    if (!ids) {
+        return null;
+    }
+    const courses = ids.map((id) => {
+        const __courseCacheKey = getCourseObjectCacheKey(id);
+        return LRUCache.get(__courseCacheKey);
+    });
+    if (courses.filter((c) => !c).length > 0) {
+        // REVALIDATE CACHE
+        return null;
+    }
+    return courses;
+};
+/**
+ :::info
+ This custom hook is used to fetch courses.
+ @param object.cacheStrategy
+
+ :::tip Context can be consumed in this way:
+
+ ```jsx
+ const {courses, isLoading} = useSCFetchCourses();
+ ```
+ :::
+ * @param props
+ */
+const useSCFetchCourses = (props) => {
+    // PROPS
+    const { cacheStrategy = CacheStrategies.CACHE_FIRST } = props || {};
+    // CACHE
+    const __coursesCacheKey = getCoursesObjectCacheKey();
+    // STATE
+    const courses = cacheStrategy !== CacheStrategies.NETWORK_ONLY ? hydrate(LRUCache.get(__coursesCacheKey, null)) : null;
+    const [data, setData] = useState(courses !== null ? { courses, isLoading: false } : init);
+    /**
+     * Fetch courses
+     */
+    const fetchCourses = (next = Endpoints.GetJoinedCourses.url()) => __awaiter(void 0, void 0, void 0, function* () {
+        const response = yield http.request({
+            url: next,
+            method: Endpoints.GetJoinedCourses.method,
+        });
+        const data = response.data;
+        if (data.next) {
+            return data.results.concat(yield fetchCourses(data.next));
+        }
+        return data.results;
+    });
+    /**
+     * Get courses
+     */
+    useEffect(() => {
+        if (cacheStrategy === CacheStrategies.CACHE_FIRST && courses) {
+            return;
+        }
+        fetchCourses()
+            .then((data) => {
+            setData({ courses: data, isLoading: false });
+            LRUCache.set(__coursesCacheKey, data.map((course) => {
+                const __courseCacheKey = getCourseObjectCacheKey(course.id);
+                LRUCache.set(__courseCacheKey, course);
+                return course.id;
+            }));
+        })
+            .catch((error) => {
+            console.log(error);
+            Logger.error(SCOPE_SC_CORE, 'Unable to retrieve courses');
+        });
+    }, []);
+    return data;
+};
+export default useSCFetchCourses;

package/lib/esm/hooks/useSCFetchLesson.d.ts

@@ -0,0 +1,22 @@
+import { SCCourseLessonType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ :::info
+ This custom hook is used to fetch a lesson object.
+ :::
+ * @param object
+ * @param object.id
+ * @param object.lesson
+ * @param object.cacheStrategy
+ */
+export default function useSCFetchLesson({ id, lesson, courseId, sectionId, cacheStrategy, }: {
+    id?: number | string;
+    lesson?: SCCourseLessonType;
+    courseId: number | string;
+    sectionId: number | string;
+    cacheStrategy?: CacheStrategies;
+}): {
+    scLesson: SCCourseLessonType;
+    setSCLesson: (lesson: SCCourseLessonType) => void;
+    error: string;
+};

package/lib/esm/hooks/useSCFetchLesson.js

@@ -0,0 +1,69 @@
+import { Endpoints, http } from '@selfcommunity/api-services';
+import { CacheStrategies, Logger, LRUCache } from '@selfcommunity/utils';
+import { useEffect, useMemo, useState } from 'react';
+import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect';
+import { useSCUser } from '../components/provider/SCUserProvider';
+import { getLessonObjectCacheKey } from '../constants/Cache';
+import { SCOPE_SC_CORE } from '../constants/Errors';
+/**
+ :::info
+ This custom hook is used to fetch a lesson object.
+ :::
+ * @param object
+ * @param object.id
+ * @param object.lesson
+ * @param object.cacheStrategy
+ */
+export default function useSCFetchLesson({ id = null, lesson = null, courseId = null, sectionId = null, cacheStrategy = CacheStrategies.CACHE_FIRST, }) {
+    const __lessonId = useMemo(() => (lesson === null || lesson === void 0 ? void 0 : lesson.id) || id, [lesson, id]);
+    // CONTEXT
+    const scUserContext = useSCUser();
+    const authUserId = useMemo(() => { var _a; return ((_a = scUserContext.user) === null || _a === void 0 ? void 0 : _a.id) || null; }, [scUserContext.user]);
+    // CACHE
+    const __lessonCacheKey = useMemo(() => getLessonObjectCacheKey(__lessonId), [__lessonId]);
+    const [scLesson, setScLesson] = useState(cacheStrategy !== CacheStrategies.NETWORK_ONLY ? LRUCache.get(__lessonCacheKey, lesson) : null);
+    const [error, setError] = useState(null);
+    const setSCLesson = (lesson) => {
+        setScLesson(lesson);
+        LRUCache.set(__lessonCacheKey, lesson);
+    };
+    /**
+     * Memoized fetchTag
+     */
+    const fetchLesson = useMemo(() => (id) => {
+        return http
+            .request({
+            url: Endpoints.GetCourseLesson.url({ id: courseId, section_id: sectionId, lesson_id: id }),
+            method: Endpoints.GetCourseLesson.method,
+        })
+            .then((res) => {
+            if (res.status >= 300) {
+                return Promise.reject(res);
+            }
+            return Promise.resolve(res.data);
+        });
+    }, []);
+    /**
+     * If id attempt to get the lesson by id
+     */
+    useEffect(() => {
+        if (id !== null && id !== undefined && courseId !== null && courseId !== undefined && sectionId) {
+            fetchLesson(id)
+                .then((e) => {
+                setSCLesson(e);
+            })
+                .catch((err) => {
+                LRUCache.delete(__lessonCacheKey);
+                setError(`Lesson with id ${id} not found`);
+                Logger.error(SCOPE_SC_CORE, `Lesson with id ${id} not found`);
+                Logger.error(SCOPE_SC_CORE, err.message);
+            });
+        }
+    }, [id, courseId, authUserId, sectionId]);
+    useDeepCompareEffectNoCheck(() => {
+        if (lesson) {
+            setSCLesson(lesson);
+        }
+    }, [lesson, authUserId]);
+    return { scLesson, setSCLesson, error };
+}

package/lib/esm/hooks/useSCFetchLessonCommentObject.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { SCCourseCommentType, SCCourseLessonType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ :::info
+ This custom hooks is used to fetch a course lesson comment.
+ :::
+ * @param object
+ * @param object.id
+ * @param object.commentObject
+ * @param object.lesson
+ * @param object.cacheStrategy
+ */
+export default function useSCFetchLessonCommentObject({ id, commentObject, lesson, cacheStrategy, }: {
+    id?: number;
+    commentObject?: SCCourseCommentType;
+    lesson: SCCourseLessonType;
+    cacheStrategy?: CacheStrategies;
+}): {
+    obj: SCCourseCommentType;
+    setObj: import("react").Dispatch<import("react").SetStateAction<SCCourseCommentType>>;
+    error: string;
+};

package/lib/esm/hooks/useSCFetchLessonCommentObject.js

@@ -0,0 +1,69 @@
+import { useEffect, useMemo, useState } from 'react';
+import { SCOPE_SC_CORE } from '../constants/Errors';
+import { http, Endpoints } from '@selfcommunity/api-services';
+import { CacheStrategies, Logger, LRUCache } from '@selfcommunity/utils';
+import { getLessonCommentCacheKey } from '../constants/Cache';
+import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect';
+/**
+ :::info
+ This custom hooks is used to fetch a course lesson comment.
+ :::
+ * @param object
+ * @param object.id
+ * @param object.commentObject
+ * @param object.lesson
+ * @param object.cacheStrategy
+ */
+export default function useSCFetchLessonCommentObject({ id = null, commentObject = null, lesson = null, cacheStrategy = CacheStrategies.CACHE_FIRST, }) {
+    const __commentObjectId = commentObject ? commentObject.id : id;
+    // CACHE
+    const __commentObjectCacheKey = getLessonCommentCacheKey(__commentObjectId);
+    const [obj, setObj] = useState(cacheStrategy !== CacheStrategies.NETWORK_ONLY ? LRUCache.get(__commentObjectCacheKey, commentObject) : commentObject);
+    const [error, setError] = useState(null);
+    /**
+     * Memoized fetchLessonCommentObject
+     */
+    const fetchLessonCommentObject = useMemo(() => () => {
+        return http
+            .request({
+            url: Endpoints.GetCourseLessonComment.url({
+                id: lesson.course_id,
+                section_id: lesson.section_id,
+                lesson_id: lesson.id,
+                comment_id: __commentObjectId,
+            }),
+            method: Endpoints.GetCourseLessonComment.method,
+        })
+            .then((res) => {
+            if (res.status >= 300) {
+                return Promise.reject(res);
+            }
+            return Promise.resolve(res.data);
+        });
+    }, [__commentObjectId, lesson]);
+    /**
+     * If course commentObject resolve it
+     */
+    useEffect(() => {
+        if (__commentObjectId && lesson && (!obj || cacheStrategy === CacheStrategies.STALE_WHILE_REVALIDATE)) {
+            fetchLessonCommentObject()
+                .then((obj) => {
+                setObj(obj);
+                LRUCache.set(__commentObjectCacheKey, obj);
+            })
+                .catch((err) => {
+                LRUCache.delete(__commentObjectCacheKey);
+                setError(`Course Lesson comment Object with id ${id} not found`);
+                Logger.error(SCOPE_SC_CORE, `Course Lesson comment Object with id ${id} not found`);
+                Logger.error(SCOPE_SC_CORE, err.message);
+            });
+        }
+    }, [__commentObjectId, lesson]);
+    useDeepCompareEffectNoCheck(() => {
+        if (commentObject) {
+            setObj(commentObject);
+            LRUCache.set(__commentObjectCacheKey, obj);
+        }
+    }, [commentObject]);
+    return { obj, setObj, error };
+}

package/lib/esm/hooks/useSCFetchLessonCommentObjects.d.ts

@@ -0,0 +1,48 @@
+import { SCCommentsOrderBy, SCCourseCommentType, SCCourseLessonType } from '@selfcommunity/types';
+import { CacheStrategies } from '@selfcommunity/utils';
+/**
+ * Interface SCLessonCommentsObjectType
+ */
+export interface SCLessonCommentsObjectType {
+    componentLoaded: boolean;
+    comments: SCCourseCommentType[];
+    total: number;
+    next: string;
+    previous: string;
+    isLoadingNext: boolean;
+    isLoadingPrevious: boolean;
+    page: number;
+    reload: boolean;
+}
+/**
+ * @hidden
+ * We have complex state logic that involves multiple sub-values,
+ * so useReducer is preferable to useState.
+ * Define all possible auth action types label
+ * Use this to export actions and dispatch an action
+ */
+export declare const commentsObjectActionTypes: {
+    LOADING_NEXT: string;
+    LOADING_PREVIOUS: string;
+    DATA_NEXT_LOADED: string;
+    DATA_PREVIOUS_LOADED: string;
+    DATA_RELOAD: string;
+    DATA_RELOADED: string;
+    DATA_REVALIDATE: string;
+};
+/**
+ :::info
+ This custom hooks is used to fetch paginated comments for a specific course lesson.
+ :::
+ * @param props
+ */
+export default function useSCFetchLessonCommentObjects(props: {
+    id?: number;
+    lessonObject?: SCCourseLessonType;
+    offset?: number;
+    pageSize?: number;
+    orderBy?: SCCommentsOrderBy;
+    parent?: number;
+    onChangePage?: (page: any) => any;
+    cacheStrategy?: CacheStrategies;
+}): any;