PromucFlow_constructor/app/client/src/sagas/JSLibrarySaga.ts
albinAppsmith 110e6085b8
feat: Renamed design system package (#19854)
## Description

This PR includes changes for renaming design system package. Since we
are building new package for the refactored design system components,
the old package is renaming to design-system-old.

Fixes #19536 

## Type of change

- New feature (non-breaking change which adds functionality)
- Breaking change (fix or feature that would cause existing
functionality to not work as expected)


## How Has This Been Tested?

- Manual
- Jest
- Cypress

### Test Plan
> Add Testsmith test cases links that relate to this PR

### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)


## Checklist:
### Dev activity
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


### QA activity:
- [ ] Test plan has been approved by relevant developers
- [ ] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test
2023-01-23 09:20:47 +05:30

408 lines
10 KiB
TypeScript

import { ApiResponse } from "api/ApiResponses";
import LibraryApi from "api/LibraryAPI";
import {
createMessage,
customJSLibraryMessages,
} from "@appsmith/constants/messages";
import {
ReduxAction,
ReduxActionErrorTypes,
ReduxActionTypes,
} from "@appsmith/constants/ReduxActionConstants";
import { Toaster, Variant } from "design-system-old";
import {
actionChannel,
ActionPattern,
all,
call,
put,
select,
take,
takeEvery,
takeLatest,
} from "redux-saga/effects";
import { getCurrentApplicationId } from "selectors/editorSelectors";
import CodemirrorTernService from "utils/autocomplete/CodemirrorTernService";
import { EVAL_WORKER_ACTIONS } from "@appsmith/workers/Evaluation/evalWorkerActions";
import { validateResponse } from "./ErrorSagas";
import { evaluateTreeSaga, EvalWorker } from "./EvaluationsSaga";
import log from "loglevel";
import { APP_MODE } from "entities/App";
import { getAppMode } from "selectors/applicationSelectors";
import AnalyticsUtil from "utils/AnalyticsUtil";
import { TJSLibrary } from "workers/common/JSLibrary";
import { getUsedActionNames } from "selectors/actionSelectors";
import AppsmithConsole from "utils/AppsmithConsole";
import { selectInstalledLibraries } from "selectors/entitiesSelector";
export function parseErrorMessage(text: string) {
return text
.split(": ")
.slice(1)
.join("");
}
function* handleInstallationFailure(
url: string,
message: string,
accessor?: string[],
) {
if (accessor) {
yield call(
EvalWorker.request,
EVAL_WORKER_ACTIONS.UNINSTALL_LIBRARY,
accessor,
);
}
AppsmithConsole.error({
text: `Failed to install library script at ${url}`,
});
Toaster.show({
text: message || `Failed to install library script at ${url}`,
variant: Variant.danger,
});
yield put({
type: ReduxActionErrorTypes.INSTALL_LIBRARY_FAILED,
payload: { url, show: false },
});
AnalyticsUtil.logEvent("INSTALL_LIBRARY", { url, success: false });
log.error(message);
}
export function* installLibrarySaga(lib: Partial<TJSLibrary>) {
const { url } = lib;
const takenNamesMap: Record<string, true> = yield select(
getUsedActionNames,
"",
);
const installedLibraries: TJSLibrary[] = yield select(
selectInstalledLibraries,
);
const takenAccessors = ([] as string[]).concat(
...installedLibraries.map((lib) => lib.accessor),
);
const { accessor, defs, error, success } = yield call(
EvalWorker.request,
EVAL_WORKER_ACTIONS.INSTALL_LIBRARY,
{
url,
takenNamesMap,
takenAccessors,
},
);
if (!success) {
log.debug("Failed to install locally");
yield call(handleInstallationFailure, url as string, error?.message);
return;
}
const name: string = lib.name || accessor[accessor.length - 1];
const applicationId: string = yield select(getCurrentApplicationId);
const versionMatch = (url as string).match(/(?:@)(\d+\.)(\d+\.)(\d+)/);
let [version = ""] = versionMatch ? versionMatch : [];
version = version.startsWith("@") ? version.slice(1) : version;
version = version || lib?.version || "";
let stringifiedDefs = "";
try {
stringifiedDefs = JSON.stringify(defs);
} catch (e) {
stringifiedDefs = JSON.stringify({
"!name": `LIB/${accessor[accessor.length - 1]}`,
});
}
const response: ApiResponse<boolean> = yield call(
LibraryApi.addLibrary,
applicationId,
{
name,
version,
accessor,
defs: stringifiedDefs,
url,
},
);
try {
const isValidResponse: boolean = yield validateResponse(response, false);
if (!isValidResponse || !response.data) {
log.debug("Install API failed");
yield call(handleInstallationFailure, url as string, "", accessor);
return;
}
} catch (e) {
yield call(
handleInstallationFailure,
url as string,
(e as Error).message,
accessor,
);
return;
}
try {
CodemirrorTernService.updateDef(defs["!name"], defs);
AnalyticsUtil.logEvent("DEFINITIONS_GENERATION", { url, success: true });
} catch (e) {
Toaster.show({
text: createMessage(customJSLibraryMessages.AUTOCOMPLETE_FAILED, name),
variant: Variant.warning,
});
AppsmithConsole.warning({
text: `Failed to generate code definitions for ${name}`,
});
AnalyticsUtil.logEvent("DEFINITIONS_GENERATION", { url, success: false });
log.debug("Failed to update Tern defs", e);
}
yield put({
type: ReduxActionTypes.UPDATE_LINT_GLOBALS,
payload: {
libs: [
{
name,
version,
url,
accessor,
},
],
add: true,
},
});
//TODO: Check if we could avoid this.
yield call(evaluateTreeSaga, [], false, true, true);
yield put({
type: ReduxActionTypes.INSTALL_LIBRARY_SUCCESS,
payload: {
url,
accessor,
version,
name,
},
});
Toaster.show({
text: createMessage(
customJSLibraryMessages.INSTALLATION_SUCCESSFUL,
accessor[accessor.length - 1],
),
variant: Variant.success,
});
AnalyticsUtil.logEvent("INSTALL_LIBRARY", {
url,
namespace: accessor.join("."),
success: true,
});
AppsmithConsole.info({
text: `${name} installed successfully`,
});
}
function* uninstallLibrarySaga(action: ReduxAction<TJSLibrary>) {
const { accessor, name } = action.payload;
const applicationId: string = yield select(getCurrentApplicationId);
try {
const response: ApiResponse = yield call(
LibraryApi.removeLibrary,
applicationId,
action.payload,
);
const isValidResponse: boolean = yield validateResponse(response);
if (!isValidResponse) {
yield put({
type: ReduxActionErrorTypes.UNINSTALL_LIBRARY_FAILED,
payload: accessor,
});
AnalyticsUtil.logEvent("UNINSTALL_LIBRARY", {
url: action.payload.url,
success: false,
});
return;
}
yield put({
type: ReduxActionTypes.UPDATE_LINT_GLOBALS,
payload: {
libs: [action.payload],
add: false,
},
});
const { success }: { success: boolean } = yield call(
EvalWorker.request,
EVAL_WORKER_ACTIONS.UNINSTALL_LIBRARY,
accessor,
);
if (!success) {
Toaster.show({
text: createMessage(customJSLibraryMessages.UNINSTALL_FAILED, name),
variant: Variant.danger,
});
}
try {
CodemirrorTernService.removeDef(`LIB/${accessor[accessor.length - 1]}`);
} catch (e) {
log.debug(`Failed to remove definitions for ${name}`, e);
}
yield call(evaluateTreeSaga, [], false, true, true);
yield put({
type: ReduxActionTypes.UNINSTALL_LIBRARY_SUCCESS,
payload: action.payload,
});
Toaster.show({
text: createMessage(customJSLibraryMessages.UNINSTALL_SUCCESS, name),
variant: Variant.success,
});
AnalyticsUtil.logEvent("UNINSTALL_LIBRARY", {
url: action.payload.url,
success: true,
});
} catch (e) {
Toaster.show({
text: createMessage(customJSLibraryMessages.UNINSTALL_FAILED, name),
variant: Variant.danger,
});
AnalyticsUtil.logEvent("UNINSTALL_LIBRARY", {
url: action.payload.url,
success: false,
});
}
}
function* fetchJSLibraries(action: ReduxAction<string>) {
const applicationId: string = action.payload;
const mode: APP_MODE = yield select(getAppMode);
try {
const response: ApiResponse = yield call(
LibraryApi.getLibraries,
applicationId,
mode,
);
const isValidResponse: boolean = yield validateResponse(response);
if (!isValidResponse) return;
const libraries = response.data as Array<TJSLibrary & { defs: string }>;
const {
message,
success,
}: { success: boolean; message: string } = yield call(
EvalWorker.request,
EVAL_WORKER_ACTIONS.LOAD_LIBRARIES,
libraries.map((lib) => ({
name: lib.name,
version: lib.version,
url: lib.url,
accessor: lib.accessor,
})),
);
if (!success) {
if (mode === APP_MODE.EDIT) {
yield put({
type: ReduxActionTypes.FETCH_JS_LIBRARIES_SUCCESS,
payload: libraries.map((lib) => ({
name: lib.name,
accessor: lib.accessor,
version: lib.version,
url: lib.url,
docsURL: lib.docsURL,
})),
});
const errorMessage = parseErrorMessage(message);
Toaster.show({
text: errorMessage,
variant: Variant.warning,
});
} else {
yield put({
type: ReduxActionErrorTypes.FETCH_JS_LIBRARIES_FAILED,
});
}
return;
}
if (mode === APP_MODE.EDIT) {
for (const lib of libraries) {
try {
const defs = JSON.parse(lib.defs);
CodemirrorTernService.updateDef(defs["!name"], defs);
} catch (e) {
Toaster.show({
text: createMessage(
customJSLibraryMessages.AUTOCOMPLETE_FAILED,
lib.name,
),
variant: Variant.info,
});
}
}
yield put({
type: ReduxActionTypes.UPDATE_LINT_GLOBALS,
payload: {
libs: libraries,
},
});
}
yield put({
type: ReduxActionTypes.FETCH_JS_LIBRARIES_SUCCESS,
payload: libraries.map((lib) => ({
name: lib.name,
accessor: lib.accessor,
version: lib.version,
url: lib.url,
docsURL: lib.docsURL,
})),
});
} catch (e) {
yield put({
type: ReduxActionErrorTypes.FETCH_JS_LIBRARIES_FAILED,
});
}
}
function* startInstallationRequestChannel() {
const queueInstallChannel: ActionPattern<any> = yield actionChannel([
ReduxActionTypes.INSTALL_LIBRARY_INIT,
]);
while (true) {
const action: ReduxAction<Partial<TJSLibrary>> = yield take(
queueInstallChannel,
);
yield put({
type: ReduxActionTypes.INSTALL_LIBRARY_START,
payload: action.payload.url,
});
yield call(installLibrarySaga, action.payload);
}
}
export default function*() {
yield all([
takeEvery(ReduxActionTypes.UNINSTALL_LIBRARY_INIT, uninstallLibrarySaga),
takeLatest(ReduxActionTypes.FETCH_JS_LIBRARIES_INIT, fetchJSLibraries),
call(startInstallationRequestChannel),
]);
}