refactor(app): move course and challenge detail related files

Author: ourai

src/app/learn/[type]/ChallengesCard.js

@@ -14,8 +14,6 @@
  * limitations under the License.
  */
 
-export default function LearnDetailsLayout({children}) {
-  return (
-    <>{children}</>
-  );
-}
+'use client';
+
+export { default } from '#/entry/pages/course-detail';

src/app/learn/[type]/[id]/layout.js src/app/learn/[type]/[id]/CourseDetailPageAdapter.js

@@ -49,7 +49,7 @@ export default async function ChapterPage({ params }) {
   const collection = { link: `/learn/${collectionType}`, text: collectionTextMap[collectionType] };
 
   const datas = await Promise.all([
-    get(`v1/learn/course/${params.type === 'courses' ? 'opencourse' : 'challenges'}/${params.id}`, {isServer: true}),
+    get(`v1/learn/course/${collectionType === 'courses' ? 'opencourse' : 'challenges'}/${params.id}`, {isServer: true}),
     get(`ts/v1/learn/general/course/single/${params.chapter_id}`, {isServer: true}),
   ]);
   const [{ data }, { data: lessonData }] = [...datas];

src/app/learn/[type]/[id]/Time.js

@@ -17,7 +17,7 @@
 import { PreviewAlert } from '@/components/PreviewAlert';
 import { get } from '@/utils/request';
 
-import CourseOrChallengeDetail from './CourseOrChallengeDetail';
+import CourseDetailPageAdapter from './CourseDetailPageAdapter';
 import GrowPath from './GrowPath';
 
 export async function generateMetadata({ params }) {
@@ -74,7 +74,7 @@ export default async function LearnDetailsPage({ params, searchParams }) {
   return learnType !== 'career_path' ? (
     <>
       <PreviewAlert searchParams={searchParams} />
-      <CourseOrChallengeDetail params={params} data={data} permission={permission} related={related} />
+      <CourseDetailPageAdapter params={params} data={data} permission={permission} related={related} />
     </>
   ) : <GrowPath params={params} data={data} permission={permission} />;
 }

src/app/learn/[type]/[id]/[chapter_id]/page.js

@@ -15,62 +15,17 @@
  */
 
 import clsx from 'clsx';
-import Image from 'next/image';
 import Link from 'next/link';
-import LocationIcon from 'public/images/location.svg';
-import TicketPic from 'public/images/ticket.png';
-import TimeIcon from 'public/images/time.svg';
 import ContentEditable from 'react-contenteditable';
 
 import { USDTIcon } from '@/components/Icons';
 import { ArrowRightLineIcon } from '@/components/Icons';
 import { HTMLDecode } from '@/utils';
-import { formatTime } from '@/utils/date';
-
-import { countries } from '#/lib/countries';
 
 import { CardTitleWidget } from '../../../course';
+import DatePlaceWidget from '../../widgets/date-place';
 import TagListWidget from '../../widgets/tag-list';
 
-export function TimeAndLocation({data, from, openTicket, permission, type}) {
-  // console.log(data)
-
-  return (
-    <>
-      <div className="my-2 flex items-center justify-between">
-        <div className="flex items-center">
-          <Image src={TimeIcon} alt="" />
-          <p className="text-sm opacity-60 ml-2">Time</p>
-        </div>
-        <div className="h-4">
-          <p className="text-sm text-gray">
-            {formatTime(data.challenges_extra.course_challenges_extra_start_date * 1000, 'YYYY/MM/DD')} -{' '}
-            {formatTime(data.challenges_extra.course_challenges_extra_end_date * 1000, 'MM/DD')}
-            {data.challenges_extra.course_challenges_extra_time_zone?.label?.substr(0, 11) && <span className="text-xs h-4 py-[2px]">{data.challenges_extra.course_challenges_extra_time_zone?.label?.substr(0, 11)}</span>}
-          </p>
-        </div>
-      </div>
-      <div className="mt-2 flex items-center justify-between gap-10">
-        <div className="flex items-center">
-          <Image src={LocationIcon} alt="" />
-          <p className="text-sm opacity-60 ml-2">Location</p>
-        </div>
-        <p className="text-sm text-gray flex-1 text-right flex items-center justify-end gap-1">
-          {
-            data?.challenges_extra.course_challenges_extra_online ?
-              'Online'
-              :
-              data?.challenges_extra.course_challenges_extra_country ?
-                countries.find(f => f.code === data?.challenges_extra.course_challenges_extra_country)?.name
-            + ', ' + data?.challenges_extra.course_challenges_extra_city : ''
-          }
-          {!data?.challenges_extra.course_challenges_extra_online && from === 'rc' && (permission?.course_user_permission_status === 1 && type === 'challenges') && <Image onClick={openTicket} height={12} src={TicketPic} alt="" className="cursor-pointer" />}
-        </p>
-      </div>
-    </>
-  );
-}
-
 function ChallengeItem({ data }) {
   return (
     <Link
@@ -91,7 +46,7 @@ function ChallengeItem({ data }) {
             disabled={true}
           />
         </h6>
-        <TimeAndLocation data={data} />
+        <DatePlaceWidget data={data} />
       </div>
       <div className="flex items-center justify-between py-4 px-6">
         <div className="flex items-center gap-14">

src/app/learn/[type]/[id]/loading.js

@@ -20,7 +20,7 @@ import Avatar from '@/components/Avatar';
 import Image from '@/components/Image';
 import { formatTime } from '@/utils/date';
 
-import { ChallengesStatus } from '#/app/learn/[type]/ChallengesStatus';
+import StatusTag from '../../widgets/status-tag';
 
 function EnrolledChallengeItem({ data }) {
   const router = useRouter();
@@ -51,7 +51,7 @@ function EnrolledChallengeItem({ data }) {
 
         </div>
         <div className="flex mt-4 items-center text-sm opacity-80 md:mt-0">
-          <ChallengesStatus data={data} />
+          <StatusTag data={data} />
           <p>
             <span className="hidden md:inline">Time:&nbsp;</span>
             {formatTime(data.challenges_extra.course_challenges_extra_start_date * 1000, 'YYYY/MM/DD')} -{' '}