mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-09 01:13:55 +00:00
sheet settings with feedback
This commit is contained in:
@@ -3,6 +3,8 @@ import {
|
||||
Alias,
|
||||
DatabaseModel,
|
||||
GetInfo,
|
||||
GoogleSheet,
|
||||
GoogleSheetState,
|
||||
OntimeRundown,
|
||||
OSCSettings,
|
||||
OscSubscription,
|
||||
@@ -239,7 +241,7 @@ export const uploadSheetClientFile = async (file: File) => {
|
||||
.post(`${ontimeURL}/sheet-clientsecrect`, formData, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data',
|
||||
}
|
||||
},
|
||||
})
|
||||
.then((response) => response.data.id);
|
||||
};
|
||||
@@ -273,3 +275,30 @@ export const postPushSheet = async (sheetId: string, worksheet: string, options?
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* @description HTTP request to retrieve google sheets settings
|
||||
* @return {Promise}
|
||||
*/
|
||||
export async function getSheetSettings(): Promise<GoogleSheet> {
|
||||
const res = await axios.get(`${ontimeURL}/sheet-settings`);
|
||||
return res.data;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description HTTP request to mutate google sheets settings
|
||||
* @return {Promise}
|
||||
*/
|
||||
export async function postSheetSettings(data: GoogleSheet): Promise<GoogleSheet> {
|
||||
const res = await axios.post(`${ontimeURL}/sheet-settings`, data);
|
||||
return res.data;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description HTTP request to retrieve google sheets state
|
||||
* @return {Promise}
|
||||
*/
|
||||
export async function getSheetstate(): Promise<GoogleSheetState> {
|
||||
const res = await axios.get(`${ontimeURL}/sheet-state`);
|
||||
console.log(res.data)
|
||||
return res.data;
|
||||
}
|
||||
@@ -9,9 +9,13 @@ import {
|
||||
ModalFooter,
|
||||
ModalHeader,
|
||||
ModalOverlay,
|
||||
useDisclosure,
|
||||
} from '@chakra-ui/react';
|
||||
import { IoCheckmarkCircleOutline } from '@react-icons/all-files/io5/IoCheckmarkCircleOutline';
|
||||
import { IoCloseCircleOutline } from '@react-icons/all-files/io5/IoCloseCircleOutline';
|
||||
|
||||
import { useQueryClient } from '@tanstack/react-query';
|
||||
import { OntimeRundown, ProjectData, UserFields } from 'ontime-types';
|
||||
import { OntimeRundown, ProjectData, UserFields, GoogleSheetState } from 'ontime-types';
|
||||
|
||||
import { PROJECT_DATA, RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants';
|
||||
import { maybeAxiosError } from '../../../common/api/apiUtils';
|
||||
@@ -22,6 +26,9 @@ import {
|
||||
postPreviewSheet,
|
||||
postPushSheet,
|
||||
uploadSheetClientFile,
|
||||
getSheetSettings,
|
||||
postSheetSettings,
|
||||
getSheetstate,
|
||||
} from '../../../common/api/ontimeApi';
|
||||
import { projectDataPlaceholder } from '../../../common/models/ProjectData';
|
||||
import { userFieldsPlaceholder } from '../../../common/models/UserFields';
|
||||
@@ -34,6 +41,7 @@ interface SheetsModalProps {
|
||||
|
||||
export default function SheetsModal(props: SheetsModalProps) {
|
||||
const { isOpen, onClose } = props;
|
||||
|
||||
const fileInputRef = useRef<HTMLInputElement>(null);
|
||||
const [authState, setAuthState] = useState<boolean>(true);
|
||||
|
||||
@@ -41,14 +49,18 @@ export default function SheetsModal(props: SheetsModalProps) {
|
||||
const [userFields, setUserFields] = useState<UserFields | null>(null);
|
||||
const [project, setProject] = useState<ProjectData | null>(null);
|
||||
|
||||
const [sheetState, setSheetState] = useState<GoogleSheetState>({ auth: false, id: false, worksheet: false });
|
||||
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const sheetid = useRef<HTMLInputElement>(null);
|
||||
const worksheet = useRef<HTMLInputElement>(null);
|
||||
|
||||
const handleClose = () => {
|
||||
setRundown(null);
|
||||
setProject(null);
|
||||
setUserFields(null);
|
||||
// setSheetState({ auth: false, id: false, worksheet: false });
|
||||
onClose();
|
||||
};
|
||||
const handleClick = () => {
|
||||
@@ -64,19 +76,37 @@ export default function SheetsModal(props: SheetsModalProps) {
|
||||
}
|
||||
};
|
||||
|
||||
//TODO: do smoething better here
|
||||
getSheetsAuthStatus().then((data) => {
|
||||
setAuthState(data);
|
||||
});
|
||||
const _onChange = async () => {
|
||||
setSheetState(await getSheetstate());
|
||||
};
|
||||
|
||||
const handleAuthenticate = () => {
|
||||
getSheetsAuthUrl().then((data) => {
|
||||
console.log(data);
|
||||
if (data != 'bad') {
|
||||
window.open(data, '_blank', 'noreferrer');
|
||||
if (isOpen) {
|
||||
//TODO: how to get this on modal open
|
||||
getSheetSettings().then((data) => {
|
||||
if (sheetid.current?.value != data.id || worksheet.current?.value != data.worksheet) {
|
||||
_onChange();
|
||||
}
|
||||
if (sheetid.current) {
|
||||
sheetid.current.value = data.id;
|
||||
}
|
||||
if (worksheet.current) {
|
||||
worksheet.current.value = data.worksheet;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const handelSave = () => {
|
||||
postSheetSettings({ id: sheetid.current?.value ?? '', worksheet: worksheet.current?.value ?? '' }).then((data) => {
|
||||
_onChange();
|
||||
if (sheetid.current) {
|
||||
sheetid.current.value = data.id;
|
||||
}
|
||||
if (worksheet.current) {
|
||||
worksheet.current.value = data.worksheet;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handlePullData = () => {
|
||||
postPreviewSheet(sheetid.current?.value ?? '', worksheet.current?.value ?? '').then((data) => {
|
||||
setProject(data.project);
|
||||
@@ -163,11 +193,12 @@ export default function SheetsModal(props: SheetsModalProps) {
|
||||
type='text'
|
||||
ref={sheetid}
|
||||
id='sheetid'
|
||||
width='440px'
|
||||
width='240px'
|
||||
size='sm'
|
||||
textAlign='right'
|
||||
variant='ontime-filled-on-light'
|
||||
/>
|
||||
{sheetState.id ? <IoCheckmarkCircleOutline /> : <IoCloseCircleOutline />}
|
||||
<br />
|
||||
<label htmlFor='worksheet'>Worksheet </label>
|
||||
<Input
|
||||
@@ -179,6 +210,8 @@ export default function SheetsModal(props: SheetsModalProps) {
|
||||
textAlign='right'
|
||||
variant='ontime-filled-on-light'
|
||||
/>
|
||||
{sheetState.worksheet ? <IoCheckmarkCircleOutline /> : <IoCloseCircleOutline />}
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<Button variant='ontime-filled' padding='0 2em' onClick={handlePullData}>
|
||||
@@ -194,8 +227,8 @@ export default function SheetsModal(props: SheetsModalProps) {
|
||||
<ModalFooter>
|
||||
<Button variant='ontime-ghost-on-light'>Reset</Button>
|
||||
{!rundown && (
|
||||
<Button variant='ontime-filled' padding='0 2em' onClick={handleAuthenticate}>
|
||||
Authenticate
|
||||
<Button variant='ontime-filled' padding='0 2em' onClick={handelSave}>
|
||||
Save
|
||||
</Button>
|
||||
)}
|
||||
{rundown && (
|
||||
|
||||
@@ -394,6 +394,29 @@ export async function previewExcel(req, res) {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Meant to create a new project file, it will clear only fields which are specific to a project
|
||||
* @param req
|
||||
* @param res
|
||||
*/
|
||||
export const postNew: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const newProjectData: ProjectData = {
|
||||
title: req.body?.title ?? '',
|
||||
description: req.body?.description ?? '',
|
||||
publicUrl: req.body?.publicUrl ?? '',
|
||||
publicInfo: req.body?.publicInfo ?? '',
|
||||
backstageUrl: req.body?.backstageUrl ?? '',
|
||||
backstageInfo: req.body?.backstageInfo ?? '',
|
||||
};
|
||||
const newData = await DataProvider.setProjectData(newProjectData);
|
||||
await deleteAllEvents();
|
||||
res.status(201).send(newData);
|
||||
} catch (error) {
|
||||
res.status(400).send({ message: error.toString() });
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* downloads and parses an sheet
|
||||
* @returns parsed result
|
||||
@@ -424,7 +447,7 @@ export async function pushSheet(req, res) {
|
||||
* uploads Client secrets file
|
||||
* @returns parsed result
|
||||
*/
|
||||
export async function sheetClientFile(req, res) {
|
||||
export async function uploadGoogleSheetClientFile(req, res) {
|
||||
if (!req.file.path) {
|
||||
res.status(400).send({ message: 'File not found' });
|
||||
return;
|
||||
@@ -432,8 +455,8 @@ export async function sheetClientFile(req, res) {
|
||||
|
||||
try {
|
||||
const client = JSON.parse(fs.readFileSync(req.file.path as string, 'utf-8'));
|
||||
await Sheet.saveClientSecrets(client);
|
||||
res.status(200).send('OK');
|
||||
const auth = await Sheet.saveClientSecrets(client);
|
||||
res.status(200).send(auth);
|
||||
} catch (error) {
|
||||
res.status(500).send({ message: error.toString() });
|
||||
}
|
||||
@@ -463,24 +486,39 @@ export async function sheetAuthUrl(req, res) {
|
||||
}
|
||||
|
||||
/**
|
||||
* Meant to create a new project file, it will clear only fields which are specific to a project
|
||||
* @param req
|
||||
* @param res
|
||||
* @description Get google sheet Settings
|
||||
* @method GET
|
||||
*/
|
||||
export const postNew: RequestHandler = async (req, res) => {
|
||||
export const getGoogleSheetSettings = async (req, res) => {
|
||||
const sheet = DataProvider.getGoogleSheet();
|
||||
res.status(200).send(sheet);
|
||||
};
|
||||
|
||||
/**
|
||||
* @description Change view Settings
|
||||
* @method POST
|
||||
*/
|
||||
export const postGoogleSheetSettings = async (req, res) => {
|
||||
if (failEmptyObjects(req.body, res)) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const newProjectData: ProjectData = {
|
||||
title: req.body?.title ?? '',
|
||||
description: req.body?.description ?? '',
|
||||
publicUrl: req.body?.publicUrl ?? '',
|
||||
publicInfo: req.body?.publicInfo ?? '',
|
||||
backstageUrl: req.body?.backstageUrl ?? '',
|
||||
backstageInfo: req.body?.backstageInfo ?? '',
|
||||
const newData = {
|
||||
id: req.body.id,
|
||||
worksheet: req.body.worksheet,
|
||||
};
|
||||
const newData = await DataProvider.setProjectData(newProjectData);
|
||||
await deleteAllEvents();
|
||||
res.status(201).send(newData);
|
||||
await DataProvider.setGoogleSheet(newData);
|
||||
res.status(200).send(newData);
|
||||
} catch (error) {
|
||||
res.status(400).send({ message: error.toString() });
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @description Get google sheet state
|
||||
* @method GET
|
||||
*/
|
||||
export const getGoogleSheetState = async (req, res) => {
|
||||
res.status(200).send(await Sheet.getSheetState());
|
||||
};
|
||||
|
||||
@@ -145,3 +145,13 @@ export const validateSheetPreview = [
|
||||
next();
|
||||
},
|
||||
];
|
||||
|
||||
export const validateGoogleSheetSettings = [
|
||||
body('id').isString().optional({ nullable: false }),
|
||||
body('worksheet').isString().optional({ nullable: false }),
|
||||
(req, res, next) => {
|
||||
const errors = validationResult(req);
|
||||
if (!errors.isEmpty()) return res.status(422).json({ errors: errors.array() });
|
||||
next();
|
||||
},
|
||||
];
|
||||
|
||||
@@ -21,13 +21,17 @@ import {
|
||||
previewExcel,
|
||||
sheetAuthUrl,
|
||||
sheetAuthState,
|
||||
sheetClientFile,
|
||||
uploadGoogleSheetClientFile,
|
||||
previewSheet,
|
||||
pushSheet,
|
||||
getGoogleSheetSettings,
|
||||
postGoogleSheetSettings,
|
||||
getGoogleSheetState,
|
||||
} from '../controllers/ontimeController.js';
|
||||
|
||||
import {
|
||||
validateAliases,
|
||||
validateGoogleSheetSettings,
|
||||
validateOSC,
|
||||
validateOscSubscription,
|
||||
validatePatchProjectFile,
|
||||
@@ -95,7 +99,7 @@ router.post('/osc-subscriptions', validateOscSubscription, postOscSubscriptions)
|
||||
router.post('/new', projectSanitiser, postNew);
|
||||
|
||||
// create route between controller and '/ontime/sheet-client' endpoint
|
||||
router.post('/sheet-clientsecrect', uploadFile, sheetClientFile);
|
||||
router.post('/sheet-clientsecrect', uploadFile, uploadGoogleSheetClientFile);
|
||||
|
||||
// create route between controller and '/ontime/sheet-authstatus' endpoint
|
||||
router.get('/sheet-authstatus', sheetAuthState);
|
||||
@@ -107,4 +111,13 @@ router.get('/sheet-authurl', sheetAuthUrl);
|
||||
router.post('/sheet-preview', validateSheetPreview, previewSheet);
|
||||
|
||||
// create route between controller and '/ontime/preview-sheet' endpoint
|
||||
router.post('/sheet-push', pushSheet);
|
||||
router.post('/sheet-push', pushSheet);
|
||||
|
||||
// create route between controller and '/ontime/sheet-settings' endpoint
|
||||
router.get('/sheet-settings', getGoogleSheetSettings);
|
||||
|
||||
// create route between controller and '/ontime/sheet-settings' endpoint
|
||||
router.post('/sheet-settings', validateGoogleSheetSettings, postGoogleSheetSettings);
|
||||
|
||||
// create route between controller and '/ontime/sheet-state' endpoint
|
||||
router.get('/sheet-state', getGoogleSheetState);
|
||||
@@ -11,6 +11,7 @@ import { parseExcel } from './parser.js';
|
||||
import { parseProject, parseRundown, parseUserFields } from './parserFunctions.js';
|
||||
import { ensureDirectory } from './fileManagement.js';
|
||||
import { DataProvider } from '../classes/data-provider/DataProvider.js';
|
||||
import { GoogleSheetState } from 'ontime-types';
|
||||
|
||||
type ResponseOK = {
|
||||
data: Partial<DatabaseModel>;
|
||||
@@ -24,6 +25,27 @@ class sheet {
|
||||
private readonly token = this.sheetsFolder + '/token.json';
|
||||
private static authUrl: null | string = null;
|
||||
|
||||
public async getSheetState(): Promise<GoogleSheetState> {
|
||||
const ret: GoogleSheetState = {
|
||||
auth: false,
|
||||
id: false,
|
||||
worksheet: false,
|
||||
};
|
||||
ret.auth = await this.authorized();
|
||||
if (ret.auth) {
|
||||
const settings = DataProvider.getGoogleSheet();
|
||||
const x = await this.exist(settings.id, settings.worksheet);
|
||||
if (x === true) {
|
||||
ret.id = true;
|
||||
} else if (x !== false) {
|
||||
ret.id = true;
|
||||
ret.worksheet = true;
|
||||
}
|
||||
}
|
||||
logger.info(LogOrigin.Server, `Sheet State: ${ret}`);
|
||||
return ret;
|
||||
}
|
||||
|
||||
/**
|
||||
* checks the authorized state
|
||||
* @returns {Promise<boolean>}
|
||||
@@ -42,10 +64,13 @@ class sheet {
|
||||
* test existance of sheet and workssheet and get is index
|
||||
* @param {string} sheetId - https://docs.google.com/spreadsheets/d/[[spreadsheetId]]/edit#gid=0
|
||||
* @param {string} worksheet - the name of the worksheet containg ontime data
|
||||
* @returns {Promise<false | {worksheetId: number, range: string}>} - false if not found | id of worksheet
|
||||
* @returns {Promise<false | {worksheetId: number, range: string}>} - false if not found | true if sheetId existes | id of worksheet and rage of worksheet
|
||||
* @throws
|
||||
*/
|
||||
public async exist(sheetId: string, worksheet: string): Promise<false | { worksheetId: number; range: string }> {
|
||||
public async exist(
|
||||
sheetId: string,
|
||||
worksheet: string,
|
||||
): Promise<false | true | { worksheetId: number; range: string }> {
|
||||
const spreadsheets = await sheets({ version: 'v4', auth: sheet.client }).spreadsheets.get({
|
||||
spreadsheetId: sheetId,
|
||||
});
|
||||
@@ -58,6 +83,8 @@ class sheet {
|
||||
w.properties.gridProperties.columnCount,
|
||||
);
|
||||
return { worksheetId: w.properties.sheetId, range: worksheet + '!A1:' + endCell };
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
@@ -73,6 +100,8 @@ class sheet {
|
||||
const sheetInfo = await this.exist(sheetId, worksheet);
|
||||
if (!sheetInfo) {
|
||||
throw new Error(`Sheet not dose not exits`);
|
||||
} else if (sheetInfo === true) {
|
||||
throw new Error(`Worksheet not dose not exits`);
|
||||
}
|
||||
|
||||
if (!isExcelImportMap(options)) {
|
||||
@@ -176,6 +205,8 @@ class sheet {
|
||||
const sheetInfo = await this.exist(sheetId, worksheet);
|
||||
if (!sheetInfo) {
|
||||
throw new Error(`Sheet not dose not exits`);
|
||||
} else if (sheetInfo === true) {
|
||||
throw new Error(`Worksheet not dose not exits`);
|
||||
}
|
||||
|
||||
const rq = await sheets({ version: 'v4', auth: sheet.client }).spreadsheets.values.get({
|
||||
@@ -203,7 +234,7 @@ class sheet {
|
||||
* saves Object to appdata path as client_secret.json
|
||||
* @param {} secrets
|
||||
*/
|
||||
public async saveClientSecrets(secrets) {
|
||||
public async saveClientSecrets(secrets): Promise<GoogleSheetState> {
|
||||
ensureDirectory(this.sheetsFolder);
|
||||
logger.info(LogOrigin.Server, 'Sheets: got new client_secret');
|
||||
//TODO: test that this is actualy a client file?
|
||||
@@ -211,6 +242,7 @@ class sheet {
|
||||
sheet.client = null;
|
||||
sheet.authUrl = null;
|
||||
await writeFile(this.client_secret, JSON.stringify(secrets), 'utf-8');
|
||||
return await this.getSheetState();
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -2,3 +2,9 @@ export type GoogleSheet = {
|
||||
worksheet: string;
|
||||
id: string;
|
||||
};
|
||||
|
||||
export type GoogleSheetState = {
|
||||
auth: boolean;
|
||||
id: boolean;
|
||||
worksheet: boolean;
|
||||
};
|
||||
@@ -34,7 +34,7 @@ export type { OSCSettings, OscSubscription, OscSubscriptionOptions } from './def
|
||||
// ---> HTTP
|
||||
|
||||
// ---> Google Sheet
|
||||
export type { GoogleSheet } from './definitions/core/GoogleSheet.type.js';
|
||||
export type { GoogleSheet, GoogleSheetState } from './definitions/core/GoogleSheet.type.js';
|
||||
|
||||
// SERVER RESPONSES
|
||||
export type { NetworkInterface, GetInfo } from './api/ontime-controller/BackendResponse.type.js';
|
||||
|
||||
Reference in New Issue
Block a user