use api directly

This commit is contained in:
arc-alex
2023-12-19 13:33:57 +01:00
parent fa56f48461
commit 8ae1c6de42
4 changed files with 42 additions and 25 deletions
+12 -6
View File
@@ -265,17 +265,23 @@ export const uploadSheetClientFile = async (file: File) => {
}; };
export const getSheetsAuthUrl = async () => { export const getSheetsAuthUrl = async () => {
const res = await axios.get(`${ontimeURL}/sheet-authurl`); const response = await axios.get(`${ontimeURL}/sheet-authurl`);
return res.data; return response.data;
}; };
export const postPreviewSheet = async (id: string, worksheet: string) => { export const postPreviewSheet = async (id: string, worksheet: string) => {
const response = await axios.post(`${ontimeURL}/sheet-preview`, { id, worksheet }); const response = await axios.post(`${ontimeURL}/sheet-preview`, {
id,
worksheet,
});
return response.data.data; return response.data.data;
}; };
export const postPushSheet = async (id: string, worksheet: string) => { export const postPushSheet = async (id: string, worksheet: string) => {
const response = await axios.post(`${ontimeURL}/sheet-push`, { id, worksheet }); const response = await axios.post(`${ontimeURL}/sheet-push`, {
id,
worksheet,
});
return response.data.data; return response.data.data;
}; };
@@ -284,9 +290,9 @@ export const postPushSheet = async (id: string, worksheet: string) => {
* @return {Promise} * @return {Promise}
*/ */
export const getSheetState = async (id: string, worksheet: string): Promise<SheetState> => { export const getSheetState = async (id: string, worksheet: string): Promise<SheetState> => {
const res = await axios.post(`${ontimeURL}/sheet-state`, { const response = await axios.post(`${ontimeURL}/sheet-state`, {
id, id,
worksheet, worksheet,
}); });
return res.data; return response.data;
}; };
@@ -16,11 +16,12 @@ import {
Select, Select,
} from '@chakra-ui/react'; } from '@chakra-ui/react';
import { useQueryClient } from '@tanstack/react-query'; import { useQueryClient } from '@tanstack/react-query';
import { OntimeRundown, ProjectData, UserFields } from 'ontime-types'; import { OntimeRundown, ProjectData, SheetState, UserFields } from 'ontime-types';
import { PROJECT_DATA, RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants'; import { PROJECT_DATA, RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants';
import { maybeAxiosError } from '../../../common/api/apiUtils'; import { maybeAxiosError } from '../../../common/api/apiUtils';
import { import {
getSheetState,
getSheetsAuthUrl, getSheetsAuthUrl,
patchData, patchData,
postPreviewSheet, postPreviewSheet,
@@ -52,18 +53,25 @@ export default function SheetsModal(props: SheetsModalProps) {
const fileInputRef = useRef<HTMLInputElement>(null); const fileInputRef = useRef<HTMLInputElement>(null);
const sheetRef = useRef<HTMLInputElement>(null); const sheetRef = useRef<HTMLInputElement>(null);
const worksheetRef = useRef<HTMLSelectElement>(null); const worksheetRef = useRef<HTMLSelectElement>(null);
const [sheetId, setSheetId] = useState<string | null>(null); // const [sheetId, setSheetId] = useState<string | null>(null);
const [worksheet, setWorksheet] = useState<string | null>(null); // const [worksheet, setWorksheet] = useState<string | null>(null);
const { data: sheetState, refetch } = useSheetState(sheetId, worksheet); // const { data: sheetState, refetch } = useSheetState(sheetId, worksheet);
const onChange = () => { const [sheetState, setState] = useState<SheetState>({
if (sheetRef.current?.value && sheetRef.current?.value.length > 43 && worksheetRef.current) { secret: false,
setSheetId(sheetRef.current.value); auth: false,
setWorksheet(worksheetRef.current.value); id: false,
refetch(); worksheet: false,
} worksheetOptions: [],
});
//TODO: soulde the be a button like now or on change?
const testId = async () => {
console.log('test', sheetRef.current?.value, worksheetRef.current?.value);
setState(await getSheetState(sheetRef.current?.value ?? '', worksheetRef.current?.value ?? ''));
}; };
const handleClose = () => { const handleClose = () => {
setRundown(null); setRundown(null);
setProject(null); setProject(null);
@@ -87,12 +95,14 @@ export default function SheetsModal(props: SheetsModalProps) {
// TODO: show this in the modal // TODO: show this in the modal
console.error(error); console.error(error);
} }
refetch(); // refetch();
setState(await getSheetState(sheetRef.current?.value ?? '', worksheetRef.current?.value ?? ''));
}; };
useEffect(() => { useEffect(() => {
if (isOpen) { if (isOpen) {
refetch(); getSheetState(sheetRef.current?.value ?? '', worksheetRef.current?.value ?? '').then((data) => setState(data));
// refetch();
} }
return () => { return () => {
// Alex: This function will be run when the component unmounts // Alex: This function will be run when the component unmounts
@@ -214,11 +224,13 @@ export default function SheetsModal(props: SheetsModalProps) {
ref={sheetRef} ref={sheetRef}
id='sheetid' id='sheetid'
size='sm' size='sm'
onChange={onChange}
variant='ontime-filled-on-light' variant='ontime-filled-on-light'
disabled={!sheetState?.auth} disabled={!sheetState?.auth}
/> />
</label> </label>
<Button variant='ontime-filled' padding='0 2em' onClick={testId}>
Test Sheet ID
</Button>
</Step> </Step>
<Step <Step
@@ -245,7 +257,7 @@ export default function SheetsModal(props: SheetsModalProps) {
disabled={!sheetState?.worksheet} disabled={!sheetState?.worksheet}
variant='ontime-ghosted-on-light' variant='ontime-ghosted-on-light'
padding='0 2em' padding='0 2em'
onClick={handlePullData} onClick={handlePushData}
> >
Push data Push data
</Button> </Button>
@@ -253,7 +265,7 @@ export default function SheetsModal(props: SheetsModalProps) {
disabled={!sheetState?.worksheet} disabled={!sheetState?.worksheet}
variant='ontime-ghosted-on-light' variant='ontime-ghosted-on-light'
padding='0 2em' padding='0 2em'
onClick={handlePushData} onClick={handlePullData}
> >
Pull data Pull data
</Button> </Button>
@@ -464,7 +464,7 @@ export const postNew: RequestHandler = async (req, res) => {
*/ */
export async function previewSheet(req, res) { export async function previewSheet(req, res) {
try { try {
const { id, worksheet } = req.data; const { id, worksheet } = req.body;
const data = await Sheet.pull(id, worksheet); const data = await Sheet.pull(id, worksheet);
res.status(200).send(data); res.status(200).send(data);
} catch (error) { } catch (error) {
@@ -528,7 +528,6 @@ export async function sheetAuthUrl(req, res) {
* @method POST * @method POST
*/ */
export const getSheetState = async (req, res) => { export const getSheetState = async (req, res) => {
console.log('getstate', req.body);
const { id, worksheet } = req.body; const { id, worksheet } = req.body;
res.status(200).send(await Sheet.getSheetState(id, worksheet)); res.status(200).send(await Sheet.getSheetState(id, worksheet));
}; };
@@ -155,8 +155,8 @@ export const validatePatchProjectFile = [
//TODO: is thise correct //TODO: is thise correct
export const validateSheetParams = [ export const validateSheetParams = [
body('sheetid').isString().optional({ nullable: false }), body('id').exists().isString(),
body('worksheet').isString().optional({ nullable: false }), body('worksheet').exists().isString(),
(req, res, next) => { (req, res, next) => {
const errors = validationResult(req); const errors = validationResult(req);
if (!errors.isEmpty()) return res.status(422).json({ errors: errors.array() }); if (!errors.isEmpty()) return res.status(422).json({ errors: errors.array() });