1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00

added callbacks to upload

This commit is contained in:
Fedor Katurov 2019-11-19 11:46:17 +07:00
parent 59252232e0
commit b6756bb3e5
5 changed files with 95 additions and 58 deletions

View file

@ -16,20 +16,20 @@
overflow: hidden; overflow: hidden;
&::after { &::after {
content: ' '; content: " ";
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: url('~/sprites/stripes.svg') rgba(0, 0, 0, 0.3); background: url("~/sprites/stripes.svg") rgba(0, 0, 0, 0.3);
z-index: 4; z-index: 4;
pointer-events: none; pointer-events: none;
touch-action: none; touch-action: none;
} }
&::before { &::before {
content: ' '; content: " ";
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;

View file

@ -41,14 +41,14 @@ function* onGetFlow() {
hideLoader(); hideLoader();
} }
const start = // const start =
(stored && stored[0] && stored[0].created_at) || new Date().toISOString(); // (stored && stored[0] && stored[0].created_at) || new Date().toISOString();
//
const end = // const end =
(stored && // (stored &&
stored[stored.length - 1] && // stored[stored.length - 1] &&
stored[stored.length - 1].created_at) || // stored[stored.length - 1].created_at) ||
new Date().toISOString(); // new Date().toISOString();
yield put(flowSetFlow({ is_loading: true })); yield put(flowSetFlow({ is_loading: true }));
@ -69,17 +69,17 @@ function* onGetFlow() {
updated: IFlowState["updated"]; updated: IFlowState["updated"];
valid: INode["id"][]; valid: INode["id"][];
}> = yield call(reqWrapper, getNodeDiff, { }> = yield call(reqWrapper, getNodeDiff, {
start, start: new Date().toISOString(),
end, end: new Date().toISOString(),
with_heroes: true, with_heroes: true,
with_updated: true, with_updated: true,
with_recent: true, with_recent: true,
with_valid: true with_valid: false
}); });
const result = uniq([ const result = uniq([
...(before || []), ...(before || []),
...(valid ? stored.filter(node => valid.includes(node.id)) : stored), // ...(valid ? stored.filter(node => valid.includes(node.id)) : stored),
...(after || []) ...(after || [])
]); ]);

View file

@ -45,8 +45,8 @@ const authPersistConfig: PersistConfig = {
const flowPersistConfig: PersistConfig = { const flowPersistConfig: PersistConfig = {
key: "flow", key: "flow",
// whitelist: ["nodes", "heroes", "recent", "updated"], whitelist: ["nodes", "heroes", "recent", "updated"],
whitelist: [], // whitelist: [],
storage storage
}; };

View file

@ -1,7 +1,7 @@
import { DetailedHTMLProps, InputHTMLAttributes } from 'react'; import { DetailedHTMLProps, InputHTMLAttributes } from "react";
import { DIALOGS } from '~/redux/modal/constants'; import { DIALOGS } from "~/redux/modal/constants";
import { ERRORS } from '~/constants/errors'; import { ERRORS } from "~/constants/errors";
import { IUser } from './auth/types'; import { IUser } from "./auth/types";
export interface ITag { export interface ITag {
id: number; id: number;
@ -55,7 +55,7 @@ export interface IResultWithStatus<T> {
export type UUID = string; export type UUID = string;
export type IUploadType = 'image' | 'text' | 'audio' | 'video' | 'other'; export type IUploadType = "image" | "text" | "audio" | "video" | "other";
export interface IFile { export interface IFile {
id?: number; id?: number;
@ -91,15 +91,17 @@ export interface IFileWithUUID {
subject?: string; subject?: string;
target: string; target: string;
type: string; type: string;
onSuccess?: (file: IFile) => void;
onFail?: () => void;
} }
export interface IBlockText { export interface IBlockText {
type: 'text'; type: "text";
text: string; text: string;
} }
export interface IBlockEmbed { export interface IBlockEmbed {
type: 'video'; type: "video";
url: string; url: string;
} }
@ -122,7 +124,7 @@ export interface INode {
is_heroic?: boolean; is_heroic?: boolean;
flow: { flow: {
display: 'single' | 'vertical' | 'horizontal' | 'quadro'; display: "single" | "vertical" | "horizontal" | "quadro";
show_description: boolean; show_description: boolean;
}; };
@ -145,7 +147,7 @@ export interface IComment {
update_at?: string; update_at?: string;
} }
export type IMessage = Omit<IComment, 'user' | 'node'> & { export type IMessage = Omit<IComment, "user" | "node"> & {
from: IUser; from: IUser;
to: IUser; to: IUser;
}; };
@ -153,7 +155,7 @@ export type IMessage = Omit<IComment, 'user' | 'node'> & {
export interface ICommentGroup { export interface ICommentGroup {
user: IUser; user: IUser;
comments: IComment[]; comments: IComment[];
ids: IComment['id'][]; ids: IComment["id"][];
} }
export type IUploadProgressHandler = (progress: ProgressEvent) => void; export type IUploadProgressHandler = (progress: ProgressEvent) => void;
@ -162,25 +164,25 @@ export type IValidationErrors = Record<string, IError>;
export type InputHandler<T = string> = (val: T) => void; export type InputHandler<T = string> = (val: T) => void;
export const NOTIFICATION_TYPES = { export const NOTIFICATION_TYPES = {
message: 'message', message: "message",
comment: 'comment', comment: "comment",
node: 'node', node: "node"
}; };
export type IMessageNotification = { export type IMessageNotification = {
type: typeof NOTIFICATION_TYPES['message']; type: typeof NOTIFICATION_TYPES["message"];
content: Partial<IMessage>; content: Partial<IMessage>;
created_at: string; created_at: string;
}; };
export type ICommentNotification = { export type ICommentNotification = {
type: typeof NOTIFICATION_TYPES['comment']; type: typeof NOTIFICATION_TYPES["comment"];
content: Partial<IComment>; content: Partial<IComment>;
created_at: string; created_at: string;
}; };
export type INodeNotification = { export type INodeNotification = {
type: typeof NOTIFICATION_TYPES['node']; type: typeof NOTIFICATION_TYPES["node"];
content: Partial<INode>; content: Partial<INode>;
created_at: string; created_at: string;
}; };

View file

@ -1,37 +1,49 @@
import { takeEvery, all, spawn, call, put, take, fork, race } from 'redux-saga/effects'; import {
import { postUploadFile } from './api'; takeEvery,
import { UPLOAD_ACTIONS, FILE_MIMES } from '~/redux/uploads/constants'; all,
spawn,
call,
put,
take,
fork,
race
} from "redux-saga/effects";
import { postUploadFile } from "./api";
import { UPLOAD_ACTIONS, FILE_MIMES } from "~/redux/uploads/constants";
import { import {
uploadUploadFiles, uploadUploadFiles,
uploadSetStatus, uploadSetStatus,
uploadAddStatus, uploadAddStatus,
uploadDropStatus, uploadDropStatus,
uploadAddFile, uploadAddFile
} from './actions'; } from "./actions";
import { reqWrapper } from '../auth/sagas'; import { reqWrapper } from "../auth/sagas";
import { createUploader, uploadGetThumb } from '~/utils/uploader'; import { createUploader, uploadGetThumb } from "~/utils/uploader";
import { HTTP_RESPONSES } from '~/utils/api'; import { HTTP_RESPONSES } from "~/utils/api";
import { IFileWithUUID, IFile, IUploadProgressHandler } from '../types'; import { IFileWithUUID, IFile, IUploadProgressHandler } from "../types";
function* uploadCall({ function* uploadCall({
file, file,
temp_id, temp_id,
target, target,
type, type,
onProgress, onProgress
}: IFileWithUUID & { onProgress: IUploadProgressHandler }) { }: IFileWithUUID & { onProgress: IUploadProgressHandler }) {
return yield call(reqWrapper, postUploadFile, { return yield call(reqWrapper, postUploadFile, {
file, file,
temp_id, temp_id,
type, type,
target, target,
onProgress, onProgress
}); });
} }
function* onUploadProgress(chan) { function* onUploadProgress(chan) {
while (true) { while (true) {
const { progress, temp_id }: { progress: number; temp_id: string } = yield take(chan); const {
progress,
temp_id
}: { progress: number; temp_id: string } = yield take(chan);
yield put(uploadSetStatus(temp_id, { progress })); yield put(uploadSetStatus(temp_id, { progress }));
} }
@ -47,10 +59,10 @@ function* uploadCancelWorker(id) {
} }
function* uploadWorker({ file, temp_id, target, type }: IFileWithUUID) { function* uploadWorker({ file, temp_id, target, type }: IFileWithUUID) {
const [promise, chan] = createUploader<Partial<IFileWithUUID>, Partial<IFileWithUUID>>( const [promise, chan] = createUploader<
uploadCall, Partial<IFileWithUUID>,
{ temp_id, target, type } Partial<IFileWithUUID>
); >(uploadCall, { temp_id, target, type });
yield fork(onUploadProgress, chan); yield fork(onUploadProgress, chan);
@ -58,15 +70,26 @@ function* uploadWorker({ file, temp_id, target, type }: IFileWithUUID) {
temp_id, temp_id,
file, file,
target, target,
type, type
}); });
return result; return result;
} }
function* uploadFile({ file, temp_id, type, target }: IFileWithUUID) { function* uploadFile({
file,
temp_id,
type,
target,
onSuccess,
onFail
}: IFileWithUUID) {
if (!file.type || !file.type || !FILE_MIMES[type].includes(file.type)) { if (!file.type || !file.type || !FILE_MIMES[type].includes(file.type)) {
return { error: 'File_Not_Image', status: HTTP_RESPONSES.BAD_REQUEST, data: {} }; return {
error: "File_Not_Image",
status: HTTP_RESPONSES.BAD_REQUEST,
data: {}
};
} }
const preview = yield call(uploadGetThumb, file); const preview = yield call(uploadGetThumb, file);
@ -81,7 +104,7 @@ function* uploadFile({ file, temp_id, type, target }: IFileWithUUID) {
// type: file.type, // type: file.type,
temp_id, temp_id,
type, type,
name: file.name, name: file.name
} }
) )
); );
@ -91,9 +114,9 @@ function* uploadFile({ file, temp_id, type, target }: IFileWithUUID) {
file, file,
temp_id, temp_id,
target, target,
type, type
}), }),
cancel: call(uploadCancelWorker, temp_id), cancel: call(uploadCancelWorker, temp_id)
// subject_cancel: call(uploadSubjectCancelWorker, subject) // subject_cancel: call(uploadSubjectCancelWorker, subject)
// add here CANCEL_UPLOADS worker, that will watch for subject // add here CANCEL_UPLOADS worker, that will watch for subject
// cancel_editing: take(UPLOAD_ACTIONS.CANCEL_EDITING), // cancel_editing: take(UPLOAD_ACTIONS.CANCEL_EDITING),
@ -101,14 +124,24 @@ function* uploadFile({ file, temp_id, type, target }: IFileWithUUID) {
}); });
if (cancel || cancel_editing) { if (cancel || cancel_editing) {
if (onFail) onFail();
return yield put(uploadDropStatus(temp_id)); return yield put(uploadDropStatus(temp_id));
} }
const { data, error }: { data: IFile & { detail: string }; error: string } = result; const {
data,
error
}: { data: IFile & { detail: string }; error: string } = result;
if (error) { if (error) {
if (onFail) onFail();
return yield put( return yield put(
uploadSetStatus(temp_id, { is_uploading: false, error: data.detail || error, type }) uploadSetStatus(temp_id, {
is_uploading: false,
error: data.detail || error,
type
})
); );
} }
@ -121,12 +154,14 @@ function* uploadFile({ file, temp_id, type, target }: IFileWithUUID) {
type, type,
thumbnail_url: data.full_path, thumbnail_url: data.full_path,
progress: 1, progress: 1,
name: file.name, name: file.name
}) })
); );
yield put(uploadAddFile(data)); yield put(uploadAddFile(data));
if (onSuccess) onSuccess(data);
return { error: null, status: HTTP_RESPONSES.CREATED, data: {} }; // add file here as data return { error: null, status: HTTP_RESPONSES.CREATED, data: {} }; // add file here as data
} }