fix: use environment variable for API URL
This commit is contained in:
1
frontend-plataforma-tutoriais/.gitignore
vendored
1
frontend-plataforma-tutoriais/.gitignore
vendored
@@ -10,6 +10,7 @@ lerna-debug.log*
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
.env
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../config/api";
|
||||
import styles from "./styles.module.css";
|
||||
import { LuUser, LuMenu, LuSearch, LuLogOut, LuUsers, LuMail, LuGraduationCap, LuTvMinimalPlay, LuLayoutDashboard, LuCircleUser, LuPanelLeftClose, LuClock3, LuCalendar } from "react-icons/lu";
|
||||
import { useEffect, useState } from "react";
|
||||
@@ -13,7 +14,8 @@ import { PiCheckCircleFill } from "react-icons/pi";
|
||||
import { useGetWorkshopsSearch } from "../../hooks/useGetWorkshopsSearch";
|
||||
import { imageSkeletonFadeStyle, onImageSkeletonLoad } from "../../utils/imageSkeleton";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
import { useGetCurrentUser } from "../../hooks/useGetCurrentUser";
|
||||
/* import { useGetCurrentUser } from "../../hooks/useGetCurrentUser"; */
|
||||
|
||||
|
||||
export default function Header() {
|
||||
const [showMenu, setShowMenu] = useState(false);
|
||||
@@ -28,7 +30,7 @@ export default function Header() {
|
||||
const { getVideos } = useGetVideos();
|
||||
const { getVideosSearch } = useGetVideosSearch();
|
||||
const { getWorkshopsSearch } = useGetWorkshopsSearch();
|
||||
const { getCurrentUser } = useGetCurrentUser();
|
||||
/* const { getCurrentUser } = useGetCurrentUser(); */
|
||||
const [role, setRole] = useState(0);
|
||||
const [videosWatched, setVideosWatched] = useState(0);
|
||||
const [videosCount, setVideosCount] = useState(0);
|
||||
@@ -41,8 +43,8 @@ export default function Header() {
|
||||
setVideosWatched(videosWatched ? parseInt(videosWatched) : 0);
|
||||
const videosCount = localStorage.getItem("videosCount");
|
||||
setVideosCount(videosCount ? parseInt(videosCount) : 0);
|
||||
const userData = await getCurrentUser();
|
||||
setRole(userData.data.role_id);
|
||||
/* const userData = await getCurrentUser();
|
||||
setRole(userData.data.role_id); */
|
||||
};
|
||||
fetchAll();
|
||||
}, []);
|
||||
@@ -235,7 +237,7 @@ export default function Header() {
|
||||
<div className={`${styles.boxVideo} position-relative`} >
|
||||
<img
|
||||
className={`${styles.videoThumbnail} position-absolute top-0 start-0 bottom-0 h-100`}
|
||||
src={`http://127.0.0.1:8000/storage/${video.thumbnail}`}
|
||||
src={`${API_URL}/storage/${video.thumbnail}`}
|
||||
alt={video.title}
|
||||
style={imageSkeletonFadeStyle}
|
||||
onLoad={onImageSkeletonLoad}
|
||||
@@ -267,7 +269,7 @@ export default function Header() {
|
||||
<Link to={`/workshop/${workshop.id}`} className="text-decoration-none text-black" onClick={handleCloseSearch}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
3
frontend-plataforma-tutoriais/src/config/api.ts
Normal file
3
frontend-plataforma-tutoriais/src/config/api.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
const API_URL = import.meta.env.VITE_API_URL || "http://127.0.0.1:8000";
|
||||
|
||||
export default API_URL;
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../config/api";
|
||||
|
||||
import type { User } from "../types";
|
||||
|
||||
@@ -9,7 +10,7 @@ interface ApiUserResponse {
|
||||
|
||||
export function useGetCurrentUser() {
|
||||
async function getCurrentUser(): Promise<ApiUserResponse> {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/me", {
|
||||
const response = await fetch(`${API_URL}/api/me`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse, Category, Video } from "../types";
|
||||
|
||||
type GetVideosParams = {
|
||||
@@ -18,7 +19,7 @@ export function useGetVideos() {
|
||||
if (params.status) query.append("status", params.status);
|
||||
if (params.watched !== undefined) query.append("watched", params.watched.toString());
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/videos?${query.toString()}`, {
|
||||
const response = await fetch(`${API_URL}/api/videos?${query.toString()}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse } from "../types";
|
||||
|
||||
export function useGetVideosLength() {
|
||||
async function getVideosLength() {
|
||||
try {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/videos-length", {
|
||||
const response = await fetch(`${API_URL}/api/videos-length`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse, Video } from "../types";
|
||||
|
||||
export function useGetVideosSearch() {
|
||||
async function getVideosSearch(searchQuery: string = "") {
|
||||
const response = await fetch(
|
||||
`http://127.0.0.1:8000/api/videos-search?search=${encodeURIComponent(searchQuery)}`,
|
||||
`${API_URL}/api/videos-search?search=${encodeURIComponent(searchQuery)}`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse, Workshop } from "../types";
|
||||
|
||||
type GetWorkshopsParams = {
|
||||
@@ -16,7 +17,7 @@ export function useGetWorkshops() {
|
||||
if (params.page) query.append("page", params.page.toString());
|
||||
if (params.per_page) query.append("per_page", params.per_page.toString());
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/workshops?${query.toString()}`, {
|
||||
const response = await fetch(`${API_URL}/api/workshops?${query.toString()}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse } from "../types";
|
||||
|
||||
export function useGetWorkshopsLength() {
|
||||
async function getWorkshopsLength() {
|
||||
try {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/workshops-length", {
|
||||
const response = await fetch(`${API_URL}/api/workshops-length`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse, Workshop } from "../types";
|
||||
|
||||
export function useGetWorkshopsSearch() {
|
||||
async function getWorkshopsSearch(searchQuery: string = "") {
|
||||
const response = await fetch(
|
||||
`http://127.0.0.1:8000/api/workshops-search?search=${encodeURIComponent(searchQuery)}`,
|
||||
`${API_URL}/api/workshops-search?search=${encodeURIComponent(searchQuery)}`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse, Video } from "../types";
|
||||
|
||||
export function useNextVideos() {
|
||||
async function getNextVideos() {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/next-videos", {
|
||||
const response = await fetch(`${API_URL}/api/next-videos`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
import API_URL from "../config/api";
|
||||
import type { ApiErrorResponse, NextWorkshopsResponse } from "../types";
|
||||
|
||||
export function useNextWorkshops() {
|
||||
async function getNextWorkshops() {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/next-workshops", {
|
||||
const response = await fetch(`${API_URL}/api/next-workshops`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../config/api";
|
||||
import { useState, useRef } from "react";
|
||||
|
||||
export function useVideoWatch(videoId: number, initialWatched: boolean) {
|
||||
@@ -10,7 +11,7 @@ export function useVideoWatch(videoId: number, initialWatched: boolean) {
|
||||
alreadySent.current = true;
|
||||
|
||||
try {
|
||||
await fetch(`http://127.0.0.1:8000/api/video/${videoId}/watch`, {
|
||||
await fetch(`${API_URL}/api/video/${videoId}/watch`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useState } from "react";
|
||||
import { Link } from "react-router";
|
||||
import styles from "./styles.module.css";
|
||||
@@ -71,7 +72,7 @@ export default function CreateUser() {
|
||||
role_id: role_id,
|
||||
};
|
||||
|
||||
const response = await fetch("http://127.0.0.1:8000/api/create-user", {
|
||||
const response = await fetch(`${API_URL}/api/create-user`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link } from "react-router";
|
||||
import type { Category } from "../../../../types";
|
||||
@@ -25,7 +26,7 @@ export default function CreateVideo() {
|
||||
}, []);
|
||||
|
||||
async function getCategories() {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/categories", {
|
||||
const response = await fetch(`${API_URL}/api/categories`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -75,7 +76,7 @@ export default function CreateVideo() {
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
|
||||
xhr.open("POST", "http://127.0.0.1:8000/api/create-video");
|
||||
xhr.open("POST", `${API_URL}/api/create-video`);
|
||||
xhr.setRequestHeader("Authorization", `Bearer ${localStorage.getItem("token")}`);
|
||||
xhr.setRequestHeader("Accept", "application/json");
|
||||
xhr.upload.onprogress = (event) => {
|
||||
@@ -167,7 +168,7 @@ export default function CreateVideo() {
|
||||
}
|
||||
|
||||
async function createCategory(categoryName: string) {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/categories", {
|
||||
const response = await fetch(`${API_URL}/api/categories`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useState } from "react";
|
||||
import { Link } from "react-router";
|
||||
import styles from "./styles.module.css";
|
||||
@@ -50,7 +51,7 @@ export default function CreateWorkshop() {
|
||||
formData.append("time_start", time_start.toTimeString().slice(0, 5));
|
||||
formData.append("time_end", time_end.toTimeString().slice(0, 5));
|
||||
|
||||
const response = await fetch("http://127.0.0.1:8000/api/create-workshop", {
|
||||
const response = await fetch(`${API_URL}/api/create-workshop`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useNavigate, useParams } from "react-router";
|
||||
import type { ApiErrorResponse, Category, Video } from "../../../../types";
|
||||
@@ -35,7 +36,7 @@ export default function editVideo() {
|
||||
setLoading(true);
|
||||
|
||||
try {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/video/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/video/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -61,7 +62,7 @@ export default function editVideo() {
|
||||
}
|
||||
|
||||
async function destroy(id: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/delete-video/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/delete-video/${id}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -124,7 +125,7 @@ export default function editVideo() {
|
||||
// quando a rota aceita PATCH (method spoofing)
|
||||
formData.append("_method", "PATCH");
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/edit-video/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/edit-video/${id}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -157,7 +158,7 @@ export default function editVideo() {
|
||||
}
|
||||
|
||||
async function getCategories() {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/categories", {
|
||||
const response = await fetch(`${API_URL}/api/categories`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -206,7 +207,7 @@ export default function editVideo() {
|
||||
}
|
||||
|
||||
async function createCategory(categoryName: string) {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/categories", {
|
||||
const response = await fetch(`${API_URL}/api/categories`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useParams } from "react-router";
|
||||
import { CgSpinner } from "react-icons/cg";
|
||||
@@ -47,7 +48,7 @@ export default function Workshop() {
|
||||
async function getWorkshop() {
|
||||
setLoading(true);
|
||||
try {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/edit-workshop/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/edit-workshop/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -93,7 +94,7 @@ export default function Workshop() {
|
||||
formData.append("image", image);
|
||||
}
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/edit-workshop/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/edit-workshop/${id}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -146,7 +147,7 @@ export default function Workshop() {
|
||||
}
|
||||
|
||||
/* async function destroy(id: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/workshop/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/workshop/${id}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -205,7 +206,7 @@ export default function Workshop() {
|
||||
<div className="row mt-4 g-3 gx-md-4 gx-lg-5 ms-0">
|
||||
<div className={`${styles.thumbnailWrapper} col-12 col-lg-3 align-self-center align-self-sm-center px-0 mt-0`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={`${styles.thumbnail} w-100`}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useNavigate, useParams } from "react-router";
|
||||
import type { ApiErrorResponse, User, Workshop } from "../../../../types";
|
||||
@@ -26,7 +27,7 @@ export default function User() {
|
||||
async function getUser() {
|
||||
setLoading(true);
|
||||
try {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/get-user/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/get-user/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -56,7 +57,7 @@ export default function User() {
|
||||
}
|
||||
|
||||
async function destroy(id: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/edit-user/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/edit-user/${id}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -118,7 +119,7 @@ export default function User() {
|
||||
role_id: role_id,
|
||||
};
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/edit-user/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/edit-user/${id}`, {
|
||||
method: "PATCH",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -216,7 +217,7 @@ export default function User() {
|
||||
<div className={`${styles.boxWorkshop} text-start pb-3`}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useDebounce } from "../../../../hooks/useDebounce";
|
||||
import type { ApiErrorResponse, User } from "../../../../types";
|
||||
@@ -29,7 +30,7 @@ export default function Users() {
|
||||
async function index(debouncedSearch: string) {
|
||||
setLoadingUsers(true);
|
||||
try {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/users?page=${currentPage}&filter=${selectedUsers}&search=${encodeURIComponent(debouncedSearch)}`, {
|
||||
const response = await fetch(`${API_URL}/api/users?page=${currentPage}&filter=${selectedUsers}&search=${encodeURIComponent(debouncedSearch)}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import styles from "./styles.module.css";
|
||||
import { LuMail, LuMapPin, LuPhone } from "react-icons/lu";
|
||||
import { CgSpinner } from "react-icons/cg";
|
||||
@@ -35,7 +36,7 @@ export default function Contactos() {
|
||||
};
|
||||
|
||||
setSending(true);
|
||||
const response = await fetch("http://127.0.0.1:8000/api/contact", {
|
||||
const response = await fetch(`${API_URL}/api/contact`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import type { ApiErrorResponse, Video, Workshop, DashboardResponse } from "../../../types";
|
||||
import styles from "./styles.module.css";
|
||||
@@ -36,7 +37,7 @@ export default function Home() {
|
||||
|
||||
async function getDashboard() {
|
||||
setLoading(true);
|
||||
const response = await fetch("http://127.0.0.1:8000/api/dashboard", {
|
||||
const response = await fetch(`${API_URL}/api/dashboard`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -70,7 +71,7 @@ export default function Home() {
|
||||
|
||||
/* Inscrever num workshop */
|
||||
async function inscrever(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/inscrever/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/inscrever/${workshopId}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -102,7 +103,7 @@ export default function Home() {
|
||||
|
||||
/* Cancelar inscrição num workshop */
|
||||
async function cancelarInscricao(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/cancelar-inscricao/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/cancelar-inscricao/${workshopId}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -151,7 +152,7 @@ export default function Home() {
|
||||
};
|
||||
|
||||
setSending(true);
|
||||
const response = await fetch("http://127.0.0.1:8000/api/contact", {
|
||||
const response = await fetch(`${API_URL}/api/contact`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -215,7 +216,7 @@ export default function Home() {
|
||||
<Link to={`/admin/edit-video/${video.id}`}> <LuPencil className={`${styles.iconEdit} text-decoration-none`} /> </Link>
|
||||
)}
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${video.thumbnail}`}
|
||||
src={`${API_URL}/storage/${video.thumbnail}`}
|
||||
className={`${styles.videoThumbnail} position-absolute top-0 start-0 bottom-0 h-100`}
|
||||
alt={video.title}
|
||||
style={imageSkeletonFadeStyle}
|
||||
@@ -248,7 +249,7 @@ export default function Home() {
|
||||
<div className={`${styles.boxWorkshop} text-start pb-3`}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import type { User, Video, Workshop } from "../../../types";
|
||||
import styles from "./styles.module.css";
|
||||
@@ -31,7 +32,7 @@ export default function Profile() {
|
||||
|
||||
async function getProfile() {
|
||||
setLoading(true);
|
||||
const response = await fetch("http://127.0.0.1:8000/api/profile", {
|
||||
const response = await fetch(`${API_URL}/api/profile`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -80,7 +81,7 @@ export default function Profile() {
|
||||
confirmarPassword: confirmarPassword,
|
||||
};
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/profile/${user_id}`, {
|
||||
const response = await fetch(`${API_URL}/api/profile/${user_id}`, {
|
||||
method: "PATCH",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -123,7 +124,7 @@ export default function Profile() {
|
||||
email: email,
|
||||
};
|
||||
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/profile/${user_id}`, {
|
||||
const response = await fetch(`${API_URL}/api/profile/${user_id}`, {
|
||||
method: "PATCH",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -156,7 +157,7 @@ export default function Profile() {
|
||||
|
||||
/* Cancelar inscrição num workshop */
|
||||
async function cancelarInscricao(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/cancelar-inscricao/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/cancelar-inscricao/${workshopId}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -329,7 +330,7 @@ export default function Profile() {
|
||||
<Link to={`/admin/edit-video/${video.id}`}> <LuPencil className={`${styles.iconEdit} text-decoration-none`} /> </Link>
|
||||
)}
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${video.thumbnail}`}
|
||||
src={`${API_URL}/storage/${video.thumbnail}`}
|
||||
className={`${styles.videoThumbnail} position-absolute top-0 start-0 bottom-0 h-100`}
|
||||
alt={video.title}
|
||||
style={imageSkeletonFadeStyle}
|
||||
@@ -361,7 +362,7 @@ export default function Profile() {
|
||||
<div className={`${styles.boxWorkshop} text-start pb-3`}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
@@ -402,7 +403,7 @@ export default function Profile() {
|
||||
<div className={`${styles.boxWorkshop} text-start pb-3`}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import type { ApiErrorResponse, User, Video, Workshop } from "../../../types";
|
||||
import { Link, useSearchParams } from "react-router";
|
||||
@@ -90,7 +91,7 @@ export default function Search() {
|
||||
)}
|
||||
<img
|
||||
className={`${styles.videoThumbnail} position-absolute top-0 start-0 bottom-0 h-100`}
|
||||
src={`http://127.0.0.1:8000/storage/${video.thumbnail}`}
|
||||
src={`${API_URL}/storage/${video.thumbnail}`}
|
||||
alt={video.title}
|
||||
style={imageSkeletonFadeStyle}
|
||||
onLoad={onImageSkeletonLoad}
|
||||
@@ -115,7 +116,7 @@ export default function Search() {
|
||||
<div className={`${styles.boxWorkshop} text-start pb-3`}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useParams } from "react-router";
|
||||
import type { ApiErrorResponse, Video } from "../../../types";
|
||||
@@ -79,7 +80,7 @@ export default function Video() {
|
||||
setLoading(true);
|
||||
setPlayerReady(false);
|
||||
try {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/video/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/video/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -151,7 +152,7 @@ export default function Video() {
|
||||
<Plyr
|
||||
source={{
|
||||
type: "video",
|
||||
sources: [{ src: `http://127.0.0.1:8000${video.url}`, type: "video/mp4" }],
|
||||
sources: [{ src: `${API_URL}${video.url}`, type: "video/mp4" }],
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import type { ApiErrorResponse, Category, Video } from "../../../types";
|
||||
import { Link } from "react-router";
|
||||
@@ -228,7 +229,7 @@ export default function Videos() {
|
||||
)}
|
||||
<img
|
||||
className={`${styles.videoThumbnail} position-absolute top-0 start-0 bottom-0 h-100`}
|
||||
src={`http://127.0.0.1:8000/storage/${video.thumbnail}`}
|
||||
src={`${API_URL}/storage/${video.thumbnail}`}
|
||||
alt={video.title}
|
||||
style={imageSkeletonFadeStyle}
|
||||
onLoad={onImageSkeletonLoad}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useParams } from "react-router";
|
||||
import { CgSpinner } from "react-icons/cg";
|
||||
@@ -41,7 +42,7 @@ export default function Workshop() {
|
||||
|
||||
async function getWorkshop() {
|
||||
try {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/workshop/${id}`, {
|
||||
const response = await fetch(`${API_URL}/api/workshop/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -66,7 +67,7 @@ export default function Workshop() {
|
||||
|
||||
/* Inscrever num workshop */
|
||||
async function inscrever(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/inscrever/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/inscrever/${workshopId}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -98,7 +99,7 @@ export default function Workshop() {
|
||||
|
||||
/* Cancelar inscrição num workshop */
|
||||
async function cancelarInscricao(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/cancelar-inscricao/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/cancelar-inscricao/${workshopId}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -158,7 +159,7 @@ export default function Workshop() {
|
||||
<div className="row mt-4 g-3 gx-md-4 gx-lg-5 ms-0">
|
||||
<div className={`${styles.thumbnailWrapper} col-12 col-lg-3 align-self-center align-self-sm-center px-0 mt-0`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={`${styles.thumbnail} w-100`}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState } from "react";
|
||||
import type { User, Workshop } from "../../../types";
|
||||
import { Link } from "react-router";
|
||||
@@ -62,7 +63,7 @@ export default function Workshops() {
|
||||
|
||||
/* Inscrever num workshop */
|
||||
async function inscrever(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/inscrever/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/inscrever/${workshopId}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -104,7 +105,7 @@ export default function Workshops() {
|
||||
|
||||
/* Cancelar inscrição num workshop */
|
||||
async function cancelarInscricao(workshopId: number) {
|
||||
const response = await fetch(`http://127.0.0.1:8000/api/cancelar-inscricao/${workshopId}`, {
|
||||
const response = await fetch(`${API_URL}/api/cancelar-inscricao/${workshopId}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
@@ -247,7 +248,7 @@ export default function Workshops() {
|
||||
<div className={`${styles.boxWorkshop} text-start pb-3`}>
|
||||
<div className={`${styles.thumbnailWorkshop} position-relative`}>
|
||||
<img
|
||||
src={`http://127.0.0.1:8000/storage/${workshop.image}`}
|
||||
src={`${API_URL}/storage/${workshop.image}`}
|
||||
alt={workshop.title}
|
||||
className={styles.thumbnailWorkshop}
|
||||
style={imageSkeletonFadeStyle}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useEffect, useState, type FormEvent } from "react";
|
||||
import { useNavigate } from "react-router";
|
||||
import type { ApiErrorResponse, LoginResponse } from "../../../types";
|
||||
@@ -32,7 +33,7 @@ export default function Login() {
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/login", {
|
||||
const response = await fetch(`${API_URL}/api/login`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import API_URL from "../../../config/api";
|
||||
import { useState, type FormEvent } from "react";
|
||||
import { useNavigate } from "react-router";
|
||||
import type { RegisterResponse } from "../../../types";
|
||||
@@ -36,7 +37,7 @@ export default function Register() {
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch("http://127.0.0.1:8000/api/register", {
|
||||
const response = await fetch(`${API_URL}/api/register`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
|
||||
@@ -1 +1 @@
|
||||
VITE_API_URL= "http://127.0.0.1:8000/api/"
|
||||
VITE_API_URL= `${API_URL}/api/"
|
||||
@@ -23,7 +23,7 @@ return [
|
||||
'http://localhost:5173',
|
||||
'http://127.0.0.1:5173',
|
||||
'http://localhost:8000',
|
||||
'http://127.0.0.1:8000',
|
||||
env('API_URL'),
|
||||
],
|
||||
|
||||
'allowed_origins_patterns' => [],
|
||||
|
||||
Reference in New Issue
Block a user