Skip to content

Commit

Permalink
fixed redirect with proper style for preview purchased course
Browse files Browse the repository at this point in the history
  • Loading branch information
@TomasSirotek
TomasSirotek committed Dec 18, 2023
1 parent 8dcadd5 commit 32fbb97
Show file tree
Hide file tree
Showing 4 changed files with 95 additions and 153 deletions.
6 changes: 2 additions & 4 deletions src/Application/Features/Payments/Command/WebhookCommand/CreateWebhook.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,11 @@ public class CreateWebhookCommandHandler : IRequestHandler<WebhookCommand,IResul
private readonly IPaymentGateway _paymentGateway;
private readonly IApplicationDbContext _context;
private readonly IHttpContextAccessor _httpContextAccessor;
private readonly ILogger<CreateWebhookCommandHandler> _logger;

public CreateWebhookCommandHandler(IPaymentGateway paymentGateway, IHttpContextAccessor httpContextAccessor, ILogger<CreateWebhookCommandHandler> logger, IApplicationDbContext context)
public CreateWebhookCommandHandler(IPaymentGateway paymentGateway, IHttpContextAccessor httpContextAccessor, IApplicationDbContext context)
{
_paymentGateway = paymentGateway;
_httpContextAccessor = httpContextAccessor;
_logger = logger;
_context = context;
}

Expand Down Expand Up @@ -50,7 +48,7 @@ public async Task<IResult> Handle(WebhookCommand request, CancellationToken canc
{
UserId = userId,
CourseId = courseId,
PurchaseDate = DateTime.UtcNow
PurchaseDate = DateTime.UtcNow // this could have been autogenerated by the database
};

_context.OwnedCourses.Add(newPurchasedCourse);
Expand Down
4 changes: 2 additions & 2 deletions src/UI/src/app/modules/management/components/shared/course-detail-drawer.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,8 +141,8 @@ export class CourseDetailDrawer implements OnInit {
},
quantity: 1,
metadata: { userId: userId, courseId: this.course.id },
successRedirectUrl: `https://vercel-prod-exam.vercel.app/dashboard`,
cancelRedirectUrl: 'https://vercel-prod-exam.vercel.app/courses',
successRedirectUrl: `https://vercel-prod-exam-4xw2bthvm-tomas-projects-c26019c9.vercel.app/dashboard`,
cancelRedirectUrl: 'https://vercel-prod-exam-4xw2bthvm-tomas-projects-c26019c9.vercel.app/courses',
};

this.paymentService.generatePaymentLink(request).subscribe((response) => {
Expand Down
232 changes: 91 additions & 141 deletions src/UI/src/app/shared/components/modal/modal-preview.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,21 @@



<div
id="modalCreatePreview"
tabindex="-1"
aria-hidden="true"
class="hidden overflow-auto fixed top-0 right-0 left-0 z-40 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full"
class="hidden overflow-auto fixed top-0 right-0 left-0 z-40 justify-center items-center w-full md:inset-0 max-h-full h-[calc(100%-1rem)]"
>
<div class="relative p-4 w-full max-w-xl max-h-full ">
<div class="relative p-4 w-full max-w-xl max-h-full flex flex-col">
<!-- Modal content -->
<div class="relative rounded-lg shadow dark:bg-night-700 bg-white">
<div class="relative flex-1 rounded-lg shadow dark:bg-night-700 bg-white ">
<!-- Modal header -->
<div
class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-700 "
class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-700"
>
<h3 class="text-xl font-semibold text-gray-900 dark:text-white">
{{course?.title}}
{{ course?.title }}
</h3>
<button
type="button"
Expand All @@ -34,153 +37,100 @@ <h3 class="text-xl font-semibold text-gray-900 dark:text-white">
d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"
/>
</svg>
<span class="sr-only">Close modal</span>
</button>

<div
class="absolute bottom-0 left-0 w-full flex items-center p-4 md:p-5 border-t rounded-b dark:border-gray-600"
>
<button
data-testid="confirm-delete-modal"
(click)="cancel()"
class="w-full mr-2 text-white bg-primary-500 dark:bg-primary-500 hover:bg-primary-700 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-200 rounded-md text-sm font-medium px-5 py-2.5 hover:text-gray-900 focus:z-10 dark:bg-gray-500 dark:text-white "
>
Close
<span class="sr-only">Close modal</span>
</button>
</div>


</div>






<!-- Modal body -->
<div class="p-4 md:p-5 space-y-4 overflow-auto ">

<div id="default-modal" tabindex="-1" class=" absolute left-0 right-0 z-50 hidden w-full p-4 overflow-x-hidden overflow-y-auto md:inset-0 h-[calc(100%-1rem)] max-h-full" [ngClass]="{'hidden': !showPopupModal}">

<div class="relative p-4 w-full max-w-3xl max-h-full justify-center items-center w-full">
<!-- Modal content -->
<div class="relative bg-white rounded-lg shadow dark:bg-night-700">
<!-- Modal header -->
<div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600">
<h3 class="text-xl font-semibold text-gray-900 dark:text-white">
Terms of Service
</h3>
<button (click)="toggleModal()" type="button" class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white" data-modal-hide="default-modal">
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"/>
</svg>
<span class="sr-only">Close modal</span>
</button>
</div>
<!-- Modal body -->
<div class="p-4 md:p-5 space-y-4">
<p class="text-base leading-relaxed text-gray-500 dark:text-gray-400">
With less than a month to go before the European Union enacts new consumer privacy laws for its citizens, companies around the world are updating their terms of service agreements to comply.
</p>
<p class="text-base leading-relaxed text-gray-500 dark:text-gray-400">
The European Union’s General Data Protection Regulation (G.D.P.R.) goes into effect on May 25 and is meant to ensure a common set of data rights in the European Union. It requires organizations to notify users as soon as possible of high-risk data breaches that could personally affect them.
</p>
</div>
<!-- Modal footer -->
<div class="flex items-center p-4 md:p-5 border-t border-gray-200 rounded-b dark:border-gray-600 w-full">
<button (click)="toggleModal()" type="button" class="w-full text-white bg-primary-500 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-500">Close</button>
</div>
</div>
</div>
</div>
<!-- PUT description -->
<p *ngIf="descriptionType" class="text-base leading-relaxed text-gray-500 dark:text-gray-400">
{{description}}
</p>

<div *ngIf="!descriptionType">
<img
src="{{ course?.coverImageRelativePath }}"
alt=""
class="w-[300px] h-full object-cover"
/>
</div>


<div class="py-1 " *ngIf="!descriptionType" >


<div class="overflow-auto h-[500px]">
<!-- Modal body -->
<div>
<img
src="{{ course?.coverImageRelativePath }}"
alt=""
class="w-full h-full object-cover"
/>
</div>

<!-- Additional content here -->
<div class="py-1 px-2">
<div *ngFor="let chapter of course?.chapters" class="py-1">
<div
class="custom-cursor border px-4 dark:border-gray-700"
data-accordion="collapse"
[attr.data-active-classes]="
'hover:cursor-move bg-red-500 dark:bg-gray-900 text-gray-900 dark:text-white'
"
[attr.data-inactive-classes]="
'hover:cursor-move text-gray-500 dark:text-gray-400'
"
>
<div id="accordion-flush">
<h2>
<button
type="button"
class="flex items-center justify-between w-full py-5 font-medium rtl:text-right text-gray-500 dark:text-gray-400 gap-3"
[attr.aria-controls]="'accordion-flush-body-' + chapter.id"
(click)="toggleAccordion(chapter.id)"

>
<div class="flex items-center gap-3 break-words">
<svg

data-accordion-icon
[ngClass]="{ 'rotate-180': !chapter['isExpanded'] }"

class="w-3 h-3 shrink-0"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 10 6"
<div
class="custom-cursor border px-4 dark:border-gray-700"
data-accordion="collapse"
[attr.data-active-classes]="
'hover:cursor-move bg-red-500 dark:bg-gray-900 text-gray-900 dark:text-white'
"
[attr.data-inactive-classes]="
'hover:cursor-move text-gray-500 dark:text-gray-400'
"
>
<div id="accordion-flush">
<h2>
<button
type="button"
class="flex items-center justify-between w-full py-5 font-medium rtl:text-right text-gray-500 dark:text-gray-400 gap-3"
[attr.aria-controls]="'accordion-flush-body-' + chapter.id"
(click)="toggleAccordion(chapter.id)"
>
<div class="flex items-center gap-3 break-words">
<svg
data-accordion-icon
[ngClass]="{ 'rotate-180': !chapter['isExpanded'] }"
class="w-3 h-3 shrink-0"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 10 6"
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 5 5 1 1 5"
/>
</svg>

<span>{{ chapter?.title }}</span>
</div>
<span>2h 30min</span>
</button>
</h2>

<div *ngIf="chapter && chapter['isExpanded']" class="border-t">
<div
class="flex items-center justify-between w-full py-5 font-medium rtl:text-right text-gray-500 dark:text-gray-400 gap-3"
>
<div class="flex items-center gap-3">
<span>{{ chapter?.description }}</span>
</div>
<a
class="underline text-blue-500 cursor-pointer"
target="_blank"
rel="noopener noreferrer"
href="{{ chapter?.videoURL }}"
>View preview</a
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 5 5 1 1 5"
/>
</svg>

<span>{{ chapter?.title }}</span>
</div>
<span>2h 30min</span>
</button>
</h2>

<div *ngIf="chapter && chapter['isExpanded']" class="border-t">

<div
class="flex items-center justify-between w-full py-5 font-medium rtl:text-right text-gray-500 dark:text-gray-400 gap-3"
>
<div class="flex items-center gap-3">
<span>{{chapter?.description}}</span>
</div>
<a class="underline text-blue-500 cursor-pointer" target="_blank" rel="noopener noreferrer" href="{{chapter?.videoURL}}">View preview</a>
</div>
</div>
</div>
</div>
</div>


</div>
</div>
</div>
<!-- Modal footer -->

</div>

<!-- Modal footer -->
<div
class="w-full flex items-center p-4 md:p-5 border-t rounded-b dark:border-gray-600 dark:bg-slate-800"
>
<button
data-testid="confirm-delete-modal"
(click)="cancel()"
class="w-full text-white bg-primary-500 dark:bg-primary-500 hover:bg-primary-700 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-200 rounded-md text-sm font-medium px-5 py-2.5 hover:text-gray-900 focus:z-10 dark:bg-gray-500 dark:text-white"
>
Close
</button>
</div>
</div>
</div>




6 changes: 0 additions & 6 deletions src/Web/Endpoints/Payments.cs
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,8 @@
using System.Text;
using Azure.Core;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using SkillSphere.Application.Auth.Commands;
using SkillSphere.Application.Common.Models;
using SkillSphere.Application.Features.Payments.Command;
using SkillSphere.Application.Features.Payments.Command.PaymentCommand;
using SkillSphere.Application.Features.Payments.Command.WebhookCommand;
using SkillSphere.Web.Infrastructure;
using Stripe;

namespace SkillSphere.Web.Endpoints;

Expand Down

0 comments on commit 32fbb97

Please sign in to comment.