vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #357 from getmaxun/develop

Browse Source 
chore: release v0.0.8
This commit is contained in:
Karishma Shukla
2025-01-25 23:48:32 +05:30
committed by GitHub
parent f0e289d90e 5cadc49376
commit 0dd5f62ca3
38 changed files with 1011 additions and 495 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@@ -1,6 +1,6 @@
<h1 align="center">
<div>
<a href="https://maxun-website.vercel.app/?ref=ghread">
<a href="https://www.maxun.dev/?ref=ghread">
<img src="/src/assets/maxunlogo.png" width="50" />
<br>
Maxun

2
maxun-core/package.json
View File

@@ -1,6 +1,6 @@
{
"name": "maxun-core",
"version": "0.0.9",
"version": "0.0.10",
"description": "Core package for Maxun, responsible for data extraction",
"main": "build/index.js",
"typings": "build/index.d.ts",

402
maxun-core/src/interpret.ts
View File

@@ -490,6 +490,14 @@ export default class Interpreter extends EventEmitter {
const executeAction = async (invokee: any, methodName: string, args: any) => {
console.log("Executing action:", methodName, args);
if (methodName === 'press' || methodName === 'type') {
// Extract only the first two arguments for these methods
const limitedArgs = Array.isArray(args) ? args.slice(0, 2) : [args];
await (<any>invokee[methodName])(...limitedArgs);
return;
}
if (!args || Array.isArray(args)) {
await (<any>invokee[methodName])(...(args ?? []));
} else {
@@ -547,221 +555,225 @@ export default class Interpreter extends EventEmitter {
let scrapedItems: Set<string> = new Set<string>();
let visitedUrls: string[] = [];
// Debug logging helper
const debugLog = (message: string, ...args: any[]) => {
console.log(`[Page ${visitedUrls.length + 1}] ${message}`, ...args);
};
let availableSelectors = config.pagination.selector.split(',');
while (true) {
switch (config.pagination.type) {
case 'scrollDown':
await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
await page.waitForTimeout(2000);
switch (config.pagination.type) {
case 'scrollDown':
await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
await page.waitForTimeout(2000);
const currentHeight = await page.evaluate(() => document.body.scrollHeight);
if (currentHeight === previousHeight) {
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
const currentHeight = await page.evaluate(() => document.body.scrollHeight);
if (currentHeight === previousHeight) {
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
previousHeight = currentHeight;
break;
case 'scrollUp':
await page.evaluate(() => window.scrollTo(0, 0));
await page.waitForTimeout(2000);
const currentTopHeight = await page.evaluate(() => document.documentElement.scrollTop);
if (currentTopHeight === 0) {
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
previousHeight = currentTopHeight;
break;
case 'clickNext':
console.log("Page URL:", page.url());
const pageResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
// console.log("Page results:", pageResults);
// Filter out already scraped items
const newResults = pageResults.filter(item => {
const uniqueKey = JSON.stringify(item);
if (scrapedItems.has(uniqueKey)) return false; // Ignore if already scraped
scrapedItems.add(uniqueKey); // Mark as scraped
return true;
});
allResults = allResults.concat(newResults);
console.log("Results so far:", allResults.length);
if (config.limit && allResults.length >= config.limit) {
return allResults.slice(0, config.limit);
}
let checkButton = null;
let workingSelector = null;
for (let i = 0; i < availableSelectors.length; i++) {
const selector = availableSelectors[i];
try {
// Wait for selector with a short timeout
checkButton = await page.waitForSelector(selector, { state: 'attached' });
if (checkButton) {
workingSelector = selector;
previousHeight = currentHeight;
break;
case 'scrollUp':
await page.evaluate(() => window.scrollTo(0, 0));
await page.waitForTimeout(2000);
const currentTopHeight = await page.evaluate(() => document.documentElement.scrollTop);
if (currentTopHeight === 0) {
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
previousHeight = currentTopHeight;
break;
case 'clickNext':
debugLog("Current URL:", page.url());
const pageResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
// Filter out already scraped items
const newResults = pageResults.filter(item => {
const uniqueKey = JSON.stringify(item);
if (scrapedItems.has(uniqueKey)) return false;
scrapedItems.add(uniqueKey);
return true;
});
allResults = allResults.concat(newResults);
debugLog("Results collected so far:", allResults.length);
if (config.limit && allResults.length >= config.limit) {
return allResults.slice(0, config.limit);
}
} catch (error) {
console.log(`Selector failed: ${selector}`);
}
}
if (!workingSelector) {
return allResults;
}
await page.waitForLoadState('networkidle', { timeout: 30000 });
await page.waitForTimeout(2000);
// const nextButton = await page.$(config.pagination.selector);
const nextButton = await page.$(workingSelector);
if (!nextButton) {
return allResults; // No more pages to scrape
}
let checkButton = null;
let workingSelector = null;
const selectorIndex = availableSelectors.indexOf(workingSelector!);
availableSelectors = availableSelectors.slice(selectorIndex);
// Try each selector with explicit waiting
for (const selector of availableSelectors) {
try {
checkButton = await page.waitForSelector(selector, {
state: 'attached',
timeout: 30000
});
if (checkButton) {
workingSelector = selector;
debugLog('Found working selector:', selector);
break;
}
} catch (error) {
debugLog(`Selector failed: ${selector} - ${error.message}`);
}
}
// await Promise.all([
// nextButton.dispatchEvent('click'),
// page.waitForNavigation({ waitUntil: 'networkidle' })
// ]);
if (!workingSelector) {
debugLog('No working selector found after trying all options');
return allResults;
}
const previousUrl = page.url();
visitedUrls.push(previousUrl);
const nextButton = await page.$(workingSelector);
if (!nextButton) {
debugLog('Next button not found');
return allResults;
}
try {
// Try both click methods simultaneously
await Promise.race([
Promise.all([
page.waitForNavigation({ waitUntil: 'networkidle', timeout: 30000 }),
nextButton.click()
]),
Promise.all([
page.waitForNavigation({ waitUntil: 'networkidle', timeout: 30000 }),
nextButton.dispatchEvent('click')
])
]);
} catch (error) {
// Verify if navigation actually succeeded
const currentUrl = page.url();
if (currentUrl === previousUrl) {
console.log("Previous URL same as current URL. Navigation failed.");
}
}
const selectorIndex = availableSelectors.indexOf(workingSelector);
availableSelectors = availableSelectors.slice(selectorIndex);
const currentUrl = page.url();
if (visitedUrls.includes(currentUrl)) {
console.log(`Detected navigation to a previously visited URL: ${currentUrl}`);
// Extract the current page number from the URL
const match = currentUrl.match(/\d+/);
if (match) {
const currentNumber = match[0];
// Use visitedUrls.length + 1 as the next page number
const nextNumber = visitedUrls.length + 1;
// Create new URL by replacing the current number with the next number
const nextUrl = currentUrl.replace(currentNumber, nextNumber.toString());
console.log(`Navigating to constructed URL: ${nextUrl}`);
// Navigate to the next page
await Promise.all([
page.waitForNavigation({ waitUntil: 'networkidle' }),
page.goto(nextUrl)
]);
}
}
// Give the page a moment to stabilize after navigation
await page.waitForTimeout(1000);
break;
case 'clickLoadMore':
while (true) {
let checkButton = null;
let workingSelector = null;
for (let i = 0; i < availableSelectors.length; i++) {
const selector = availableSelectors[i];
try {
// Wait for selector with a short timeout
checkButton = await page.waitForSelector(selector, { state: 'attached' });
if (checkButton) {
workingSelector = selector;
// Store current URL to check if navigation succeeded
const previousUrl = page.url();
visitedUrls.push(previousUrl);
// Try both click methods in sequence
try {
await Promise.all([
page.waitForNavigation({
waitUntil: 'networkidle',
timeout: 15000
}),
nextButton.click()
]);
} catch (error) {
// If we're still on the same URL, try dispatch event
if (page.url() === previousUrl) {
await Promise.all([
page.waitForNavigation({
waitUntil: 'networkidle',
timeout: 15000
}),
nextButton.dispatchEvent('click')
]);
}
}
await page.waitForLoadState('domcontentloaded');
await page.waitForLoadState('networkidle', { timeout: 30000 });
const currentUrl = page.url();
if (visitedUrls.includes(currentUrl)) {
debugLog(`Navigation failed/Detected navigation to previously visited URL: ${currentUrl}`);
return allResults;
}
// Give the page a moment to stabilize after navigation
await page.waitForTimeout(1000);
} catch (error) {
debugLog(`Navigation failed completely: ${error.message}`);
return allResults;
}
break;
case 'clickLoadMore':
while (true) {
let checkButton = null;
let workingSelector = null;
for (const selector of availableSelectors) {
try {
checkButton = await page.waitForSelector(selector, {
state: 'attached',
timeout: 30000
});
if (checkButton) {
workingSelector = selector;
debugLog('Found working selector:', selector);
break;
}
} catch (error) {
debugLog(`Load More selector failed: ${selector}`);
}
}
if (!workingSelector) {
debugLog('No working Load More selector found');
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
const loadMoreButton = await page.$(workingSelector);
if (!loadMoreButton) {
debugLog('Load More button not found');
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
const selectorIndex = availableSelectors.indexOf(workingSelector);
availableSelectors = availableSelectors.slice(selectorIndex);
try {
try {
await loadMoreButton.click();
} catch (error) {
await loadMoreButton.dispatchEvent('click');
}
} catch (error) {
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
await page.waitForTimeout(2000);
await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
await page.waitForTimeout(2000);
const currentHeight = await page.evaluate(() => document.body.scrollHeight);
if (currentHeight === previousHeight) {
debugLog('No more items loaded after Load More');
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
previousHeight = currentHeight;
if (config.limit && allResults.length >= config.limit) {
allResults = allResults.slice(0, config.limit);
break;
}
} catch (error) {
console.log(`Selector failed: ${selector}`);
}
}
if (!workingSelector) {
// No more working selectors available, so scrape the remaining items
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
const loadMoreButton = await page.$(workingSelector);
if (!loadMoreButton) {
// No more "Load More" button, so scrape the remaining items
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
const selectorIndex = availableSelectors.indexOf(workingSelector!);
availableSelectors = availableSelectors.slice(selectorIndex);
// Click the 'Load More' button to load additional items
// await loadMoreButton.dispatchEvent('click');
try {
await Promise.race([
loadMoreButton.click(),
loadMoreButton.dispatchEvent('click')
]);
} catch (error) {
console.log('Both click attempts failed');
}
await page.waitForTimeout(2000); // Wait for new items to load
// After clicking 'Load More', scroll down to load more items
await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
await page.waitForTimeout(2000);
// Check if more items are available
const currentHeight = await page.evaluate(() => document.body.scrollHeight);
if (currentHeight === previousHeight) {
// No more items loaded, return the scraped results
const finalResults = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(finalResults);
return allResults;
}
previousHeight = currentHeight;
if (config.limit && allResults.length >= config.limit) {
// If limit is set and reached, return the limited results
allResults = allResults.slice(0, config.limit);
break;
}
}
break;
default:
const results = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(results);
return allResults;
}
if (config.limit && allResults.length >= config.limit) {
allResults = allResults.slice(0, config.limit);
break;
}
default:
const results = await page.evaluate((cfg) => window.scrapeList(cfg), config);
allResults = allResults.concat(results);
return allResults;
}
if (config.limit && allResults.length >= config.limit) {
allResults = allResults.slice(0, config.limit);
break;
}
}
return allResults;

4
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "maxun",
"version": "0.0.7",
"version": "0.0.8",
"author": "Maxun",
"license": "AGPL-3.0-or-later",
"dependencies": {
@@ -47,7 +47,7 @@
"lodash": "^4.17.21",
"loglevel": "^1.8.0",
"loglevel-plugin-remote": "^0.6.8",
"maxun-core": "^0.0.9",
"maxun-core": "^0.0.10",
"minio": "^8.0.1",
"moment-timezone": "^0.5.45",
"node-cron": "^3.0.3",

7
public/locales/de.json
View File

@@ -32,6 +32,7 @@
"new": "Roboter erstellen",
"modal": {
"title": "Geben Sie die URL ein",
"login_title": "Erfordert diese Seite eine Anmeldung?",
"label": "URL",
"button": "Aufnahme starten"
},
@@ -40,7 +41,8 @@
"duplicate": "Duplizieren",
"notifications": {
"delete_warning": "Roboter kann nicht gelöscht werden, da zugehörige Ausführungen vorhanden sind",
"delete_success": "Roboter erfolgreich gelöscht"
"delete_success": "Roboter erfolgreich gelöscht",
"auth_success": "Roboter erfolgreich authentifiziert"
}
},
"mainmenu": {
@@ -204,7 +206,8 @@
"confirm_text_fields": "Bitte bestätigen Sie alle Textfelder",
"unable_create_settings": "Listeneinstellungen können nicht erstellt werden. Stellen Sie sicher, dass Sie ein Feld für die Liste definiert haben.",
"capture_text_discarded": "Texterfassung verworfen",
"capture_list_discarded": "Listenerfassung verworfen"
"capture_list_discarded": "Listenerfassung verworfen",
"label_required": "Beschriftung darf nicht leer sein"
}
},
"save_recording": {

7
public/locales/en.json
View File

@@ -32,6 +32,7 @@
"new":"Create Robot",
"modal":{
"title":"Enter the URL",
"login_title": "Does this website require login?",
"label":"URL",
"button":"Start Recording"
},
@@ -41,7 +42,8 @@
"search":"Search Robots...",
"notifications": {
"delete_warning": "Cannot delete robot as it has associated runs",
"delete_success": "Robot deleted successfully"
"delete_success": "Robot deleted successfully",
"auth_success": "Robot successfully authenticated"
}
},
"mainmenu":{
@@ -206,7 +208,8 @@
"confirm_text_fields": "Please confirm all text fields",
"unable_create_settings": "Unable to create list settings. Make sure you have defined a field for the list.",
"capture_text_discarded": "Capture Text Discarded",
"capture_list_discarded": "Capture List Discarded"
"capture_list_discarded": "Capture List Discarded",
"label_required": "Label cannot be empty"
}
},
"save_recording": {

7
public/locales/es.json
View File

@@ -32,6 +32,7 @@
"new": "Crear Robot",
"modal": {
"title": "Ingresa la URL",
"login_title": "¿Este sitio requiere inicio de sesión?",
"label": "URL",
"button": "Comenzar grabación"
},
@@ -41,7 +42,8 @@
"search": "Buscar robots...",
"notifications": {
"delete_warning": "No se puede eliminar el robot ya que tiene ejecuciones asociadas",
"delete_success": "Robot eliminado exitosamente"
"delete_success": "Robot eliminado exitosamente",
"auth_success": "Robot autenticado exitosamente"
}
},
"mainmenu": {
@@ -205,7 +207,8 @@
"confirm_text_fields": "Por favor confirme todos los campos de texto",
"unable_create_settings": "No se pueden crear las configuraciones de la lista. Asegúrese de haber definido un campo para la lista.",
"capture_text_discarded": "Captura de texto descartada",
"capture_list_discarded": "Captura de lista descartada"
"capture_list_discarded": "Captura de lista descartada",
"label_required": "La etiqueta no puede estar vacía"
}
},
"save_recording": {

7
public/locales/ja.json
View File

@@ -32,6 +32,7 @@
"new": "ロボットを作成",
"modal": {
"title": "URLを入力してください",
"login_title": "このサイトはログインが必要ですか?",
"label": "URL",
"button": "録画を開始"
},
@@ -41,7 +42,8 @@
"search": "ロボットを検索...",
"notifications": {
"delete_warning": "関連する実行があるため、ロボットを削除できません",
"delete_success": "ロボットが正常に削除されました"
"delete_success": "ロボットが正常に削除されました",
"auth_success": "ロボットの認証に成功しました"
}
},
"mainmenu": {
@@ -205,7 +207,8 @@
"confirm_text_fields": "すべてのテキストフィールドを確認してください",
"unable_create_settings": "リスト設定を作成できません。リストのフィールドを定義したことを確認してください。",
"capture_text_discarded": "テキスト取得が破棄されました",
"capture_list_discarded": "リスト取得が破棄されました"
"capture_list_discarded": "リスト取得が破棄されました",
"label_required": "ラベルは空にできません"
}
},
"save_recording": {

7
public/locales/zh.json
View File

@@ -32,6 +32,7 @@
"new": "创建机器人",
"modal": {
"title": "输入URL",
"login_title": "此网站需要登录吗？",
"label": "URL",
"button": "开始录制"
},
@@ -41,7 +42,8 @@
"search": "搜索机器人...",
"notifications": {
"delete_warning": "无法删除机器人，因为它有关联的运行记录",
"delete_success": "机器人删除成功"
"delete_success": "机器人删除成功",
"auth_success": "机器人认证成功"
}
},
"mainmenu": {
@@ -205,7 +207,8 @@
"confirm_text_fields": "请确认所有文本字段",
"unable_create_settings": "无法创建列表设置。请确保您已为列表定义了字段。",
"capture_text_discarded": "文本捕获已放弃",
"capture_list_discarded": "列表捕获已放弃"
"capture_list_discarded": "列表捕获已放弃",
"label_required": "标签不能为空"
}
},
"save_recording": {

10
server/Dockerfile
View File

@@ -25,7 +25,7 @@ RUN mkdir -p /tmp/chromium-data-dir && \
# Install dependencies
RUN apt-get update && apt-get install -y \
libgbm-dev \
libgbm1 \
libnss3 \
libatk1.0-0 \
libatk-bridge2.0-0 \
@@ -44,14 +44,8 @@ RUN apt-get update && apt-get install -y \
&& rm -rf /var/lib/apt/lists/* \
&& mkdir -p /tmp/.X11-unix && chmod 1777 /tmp/.X11-unix
# Add a dbus configuration to prevent connection errors
# RUN mkdir -p /var/run/dbus
# Make the script executable
# RUN chmod +x ./start.sh
# Expose the backend port
EXPOSE ${BACKEND_PORT:-8080}
# Start the backend using the start script
CMD ["npm", "run", "server"]
CMD ["npm", "run", "server"]

12
server/src/routes/auth.ts
View File

@@ -380,11 +380,19 @@ router.get(
httpOnly: false,
maxAge: 60000,
}); // 1-minute expiration
res.cookie("robot_auth_message", "Robot successfully authenticated", {
// res.cookie("robot_auth_message", "Robot successfully authenticated", {
// httpOnly: false,
// maxAge: 60000,
// });
res.cookie('robot_auth_robotId', robotId, {
httpOnly: false,
maxAge: 60000,
});
res.redirect(`${process.env.PUBLIC_URL}/robots/${robotId}/integrate` as string || `http://localhost:5173/robots/${robotId}/integrate`);
const baseUrl = process.env.PUBLIC_URL || "http://localhost:5173";
const redirectUrl = `${baseUrl}/robots/`;
res.redirect(redirectUrl);
} catch (error: any) {
res.status(500).json({ message: `Google OAuth error: ${error.message}` });
}

116
server/src/routes/storage.ts
View File

@@ -18,12 +18,43 @@ import { AuthenticatedRequest } from './record';
import { computeNextRun } from '../utils/schedule';
import { capture } from "../utils/analytics";
import { tryCatch } from 'bullmq';
import { encrypt, decrypt } from '../utils/auth';
import { WorkflowFile } from 'maxun-core';
import { Page } from 'playwright';
chromium.use(stealthPlugin());
export const router = Router();
export const decryptWorkflowActions = async (workflow: any[],): Promise<any[]> => {
// Create a deep copy to avoid mutating the original workflow
const processedWorkflow = JSON.parse(JSON.stringify(workflow));
// Process each step in the workflow
for (const step of processedWorkflow) {
if (!step.what) continue;
// Process each action in the step
for (const action of step.what) {
// Only process type and press actions
if ((action.action === 'type' || action.action === 'press') && Array.isArray(action.args) && action.args.length > 1) {
// The second argument contains the encrypted value
const encryptedValue = action.args[1];
if (typeof encryptedValue === 'string') {
try {
// Decrypt the value and update the args array
action.args[1] = await decrypt(encryptedValue);
} catch (error) {
console.error('Failed to decrypt value:', error);
// Keep the encrypted value if decryption fails
}
}
}
}
}
return processedWorkflow;
};
/**
* Logs information about recordings API.
*/
@@ -55,6 +86,13 @@ router.get('/recordings/:id', requireSignIn, async (req, res) => {
raw: true
}
);
if (data?.recording?.workflow) {
data.recording.workflow = await decryptWorkflowActions(
data.recording.workflow,
);
}
return res.send(data);
} catch (e) {
logger.log('info', 'Error while reading robots');
@@ -116,13 +154,74 @@ function formatRunResponse(run: any) {
return formattedRun;
}
interface CredentialInfo {
value: string;
type: string;
}
interface Credentials {
[key: string]: CredentialInfo;
}
function updateTypeActionsInWorkflow(workflow: any[], credentials: Credentials) {
return workflow.map(step => {
if (!step.what) return step;
const indicesToRemove = new Set<number>();
step.what.forEach((action: any, index: number) => {
if (!action.action || !action.args?.[0]) return;
if ((action.action === 'type' || action.action === 'press') && credentials[action.args[0]]) {
indicesToRemove.add(index);
if (step.what[index + 1]?.action === 'waitForLoadState') {
indicesToRemove.add(index + 1);
}
}
});
const filteredWhat = step.what.filter((_: any, index: number) => !indicesToRemove.has(index));
Object.entries(credentials).forEach(([selector, credentialInfo]) => {
const clickIndex = filteredWhat.findIndex((action: any) =>
action.action === 'click' && action.args?.[0] === selector
);
if (clickIndex !== -1) {
const chars = credentialInfo.value.split('');
chars.forEach((char, i) => {
filteredWhat.splice(clickIndex + 1 + (i * 2), 0, {
action: 'type',
args: [
selector,
encrypt(char),
credentialInfo.type
]
});
filteredWhat.splice(clickIndex + 2 + (i * 2), 0, {
action: 'waitForLoadState',
args: ['networkidle']
});
});
}
});
return {
...step,
what: filteredWhat
};
});
}
/**
* PUT endpoint to update the name and limit of a robot.
*/
router.put('/recordings/:id', requireSignIn, async (req: AuthenticatedRequest, res) => {
try {
const { id } = req.params;
const { name, limit } = req.body;
const { name, limit, credentials } = req.body;
// Validate input
if (!name && limit === undefined) {
@@ -141,17 +240,21 @@ router.put('/recordings/:id', requireSignIn, async (req: AuthenticatedRequest, r
robot.set('recording_meta', { ...robot.recording_meta, name });
}
let workflow = [...robot.recording.workflow]; // Create a copy of the workflow
if (credentials) {
workflow = updateTypeActionsInWorkflow(workflow, credentials);
}
// Update the limit
if (limit !== undefined) {
const workflow = [...robot.recording.workflow]; // Create a copy of the workflow
// Ensure the workflow structure is valid before updating
if (
workflow.length > 0 &&
workflow[0]?.what?.[0]
) {
// Create a new workflow object with the updated limit
const updatedWorkflow = workflow.map((step, index) => {
workflow = workflow.map((step, index) => {
if (index === 0) { // Assuming you want to update the first step
return {
...step,
@@ -173,14 +276,13 @@ router.put('/recordings/:id', requireSignIn, async (req: AuthenticatedRequest, r
}
return step;
});
// Replace the workflow in the recording object
robot.set('recording', { ...robot.recording, workflow: updatedWorkflow });
} else {
return res.status(400).json({ error: 'Invalid workflow structure for updating limit.' });
}
}
robot.set('recording', { ...robot.recording, workflow });
await robot.save();
const updatedRobot = await Robot.findOne({ where: { 'recording_meta.id': id } });

8
server/src/storage/db.ts
View File

@@ -29,7 +29,13 @@ export const connectDB = async () => {
export const syncDB = async () => {
try {
//setupAssociations();
await sequelize.sync({ force: false }); // force: true will drop and recreate tables on every run
const isDevelopment = process.env.NODE_ENV === 'development';
// force: true will drop and recreate tables on every run
// Use `alter: true` only in development mode
await sequelize.sync({
force: false,
alter: isDevelopment
});
console.log('Database synced successfully!');
} catch (error) {
console.error('Failed to sync database:', error);

57
server/src/workflow-management/classes/Generator.ts
View File

@@ -39,6 +39,7 @@ interface MetaData {
pairs: number;
updatedAt: string;
params: string[],
isLogin?: boolean;
}
/**
@@ -97,6 +98,7 @@ export class WorkflowGenerator {
pairs: 0,
updatedAt: '',
params: [],
isLogin: false,
}
/**
@@ -134,9 +136,9 @@ export class WorkflowGenerator {
*/
private registerEventHandlers = (socket: Socket) => {
socket.on('save', (data) => {
const { fileName, userId } = data;
const { fileName, userId, isLogin } = data;
logger.log('debug', `Saving workflow ${fileName} for user ID ${userId}`);
this.saveNewWorkflow(fileName, userId);
this.saveNewWorkflow(fileName, userId, isLogin);
});
socket.on('new-recording', () => this.workflowRecord = {
workflow: [],
@@ -425,6 +427,40 @@ export class WorkflowGenerator {
return;
}
if ((elementInfo?.tagName === 'INPUT' || elementInfo?.tagName === 'TEXTAREA') && selector) {
// Calculate the exact position within the element
const elementPos = await page.evaluate((selector) => {
const element = document.querySelector(selector);
if (!element) return null;
const rect = element.getBoundingClientRect();
return {
x: rect.left,
y: rect.top
};
}, selector);
if (elementPos) {
const relativeX = coordinates.x - elementPos.x;
const relativeY = coordinates.y - elementPos.y;
const pair: WhereWhatPair = {
where,
what: [{
action: 'click',
args: [selector, { position: { x: relativeX, y: relativeY } }]
}]
};
if (selector) {
this.generatedData.lastUsedSelector = selector;
this.generatedData.lastAction = 'click';
}
await this.addPairToWorkflowAndNotifyClient(pair, page);
return;
}
}
//const element = await getElementMouseIsOver(page, coordinates);
//logger.log('debug', `Element: ${JSON.stringify(element, null, 2)}`);
if (selector) {
@@ -474,6 +510,10 @@ export class WorkflowGenerator {
public onKeyboardInput = async (key: string, coordinates: Coordinates, page: Page) => {
let where: WhereWhatPair["where"] = { url: this.getBestUrl(page.url()) };
const selector = await this.generateSelector(page, coordinates, ActionType.Keydown);
const elementInfo = await getElementInformation(page, coordinates, '', false);
const inputType = elementInfo?.attributes?.type || "text";
if (selector) {
where.selectors = [selector];
}
@@ -481,7 +521,7 @@ export class WorkflowGenerator {
where,
what: [{
action: 'press',
args: [selector, encrypt(key)],
args: [selector, encrypt(key), inputType],
}],
}
if (selector) {
@@ -660,7 +700,7 @@ export class WorkflowGenerator {
* @param fileName The name of the file.
* @returns {Promise<void>}
*/
public saveNewWorkflow = async (fileName: string, userId: number) => {
public saveNewWorkflow = async (fileName: string, userId: number, isLogin: boolean) => {
const recording = this.optimizeWorkflow(this.workflowRecord);
try {
this.recordingMeta = {
@@ -670,6 +710,7 @@ export class WorkflowGenerator {
pairs: recording.workflow.length,
updatedAt: new Date().toLocaleString(),
params: this.getParams() || [],
isLogin: isLogin,
}
const robot = await Robot.create({
userId,
@@ -991,6 +1032,7 @@ export class WorkflowGenerator {
let input = {
selector: '',
value: '',
type: '',
actionCounter: 0,
};
@@ -1005,7 +1047,7 @@ export class WorkflowGenerator {
// when more than one press action is present, add a type action
pair.what.splice(index - input.actionCounter, input.actionCounter, {
action: 'type',
args: [input.selector, encrypt(input.value)],
args: [input.selector, encrypt(input.value), input.type],
}, {
action: 'waitForLoadState',
args: ['networkidle'],
@@ -1033,13 +1075,14 @@ export class WorkflowGenerator {
action: 'waitForLoadState',
args: ['networkidle'],
})
input = { selector: '', value: '', actionCounter: 0 };
input = { selector: '', value: '', type: '', actionCounter: 0 };
}
} else {
pushTheOptimizedAction(pair, index);
input = {
selector: condition.args[0],
value: condition.args[1],
type: condition.args[2],
actionCounter: 1,
};
}
@@ -1048,7 +1091,7 @@ export class WorkflowGenerator {
if (input.value.length !== 0) {
pushTheOptimizedAction(pair, index);
// clear the input
input = { selector: '', value: '', actionCounter: 0 };
input = { selector: '', value: '', type: '', actionCounter: 0 };
}
}
});

9
src/App.test.tsx
View File

@@ -1,9 +0,0 @@
import React from 'react';
import { render, screen } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});

2
src/App.tsx
View File

@@ -2,7 +2,7 @@ import React from "react";
import { Routes, Route } from "react-router-dom";
import { ThemeProvider, createTheme } from "@mui/material/styles";
import { GlobalInfoProvider } from "./context/globalInfo";
import { PageWrapper } from "./pages/PageWrappper";
import { PageWrapper } from "./pages/PageWrapper";
import i18n from "./i18n";
import ThemeModeProvider from './context/theme-provider';

11
src/api/storage.ts
View File

@@ -5,6 +5,15 @@ import { ScheduleSettings } from "../components/robot/ScheduleSettings";
import { CreateRunResponse, ScheduleRunResponse } from "../pages/MainPage";
import { apiUrl } from "../apiConfig";
interface CredentialInfo {
value: string;
type: string;
}
interface Credentials {
[key: string]: CredentialInfo;
}
export const getStoredRecordings = async (): Promise<string[] | null> => {
try {
const response = await axios.get(`${apiUrl}/storage/recordings`);
@@ -19,7 +28,7 @@ export const getStoredRecordings = async (): Promise<string[] | null> => {
}
};
export const updateRecording = async (id: string, data: { name?: string; limit?: number }): Promise<boolean> => {
export const updateRecording = async (id: string, data: { name?: string; limit?: number, credentials?: Credentials }): Promise<boolean> => {
try {
const response = await axios.put(`${apiUrl}/storage/recordings/${id}`, data);
if (response.status === 200) {

4
src/components/dashboard/NavBar.tsx
View File

@@ -5,7 +5,7 @@ import styled from "styled-components";
import { stopRecording } from "../../api/recording";
import { useGlobalInfoStore } from "../../context/globalInfo";
import { IconButton, Menu, MenuItem, Typography, Chip, Button, Modal, Tabs, Tab, Box, Snackbar, Tooltip } from "@mui/material";
import { AccountCircle, Logout, Clear, YouTube, X, Update, Close, Language, Brightness7, Brightness4, Description } from "@mui/icons-material";
import { AccountCircle, Logout, Clear, YouTube, X, Update, Close, Language, Description, LightMode, DarkMode } from "@mui/icons-material";
import { useNavigate } from 'react-router-dom';
import { AuthContext } from '../../context/auth';
import { SaveRecording } from '../recorder/SaveRecording';
@@ -114,7 +114,7 @@ export const NavBar: React.FC<NavBarProps> = ({
}
}}
>
{darkMode ? <Brightness7 /> : <Brightness4 />}
{darkMode ? <LightMode /> : <DarkMode />}
</IconButton>
</Tooltip>
);

11
src/components/dashboard/NotFound.tsx Normal file
View File

@@ -0,0 +1,11 @@
import React from 'react';
export function NotFoundPage() {
return (
<div style={{ textAlign: 'center' }}>
<h1>404 - Page Not Found</h1>
<p>Oops! This page does not exist.</p>
<a href="/" style={{ textDecoration: 'none' }}>Take me to the homepage</a>
</div>
);
}

26
src/components/integration/IntegrationSettings.tsx
View File

@@ -14,7 +14,6 @@ import axios from "axios";
import { useGlobalInfoStore } from "../../context/globalInfo";
import { getStoredRecording } from "../../api/storage";
import { apiUrl } from "../../apiConfig.js";
import Cookies from 'js-cookie';
import { useTranslation } from "react-i18next";
@@ -30,20 +29,6 @@ export interface IntegrationSettings {
data: string;
}
// Helper functions to replace js-cookie functionality
const getCookie = (name: string): string | null => {
const value = `; ${document.cookie}`;
const parts = value.split(`; ${name}=`);
if (parts.length === 2) {
return parts.pop()?.split(';').shift() || null;
}
return null;
};
const removeCookie = (name: string): void => {
document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`;
};
export const IntegrationSettingsModal = ({
isOpen,
handleStart,
@@ -155,17 +140,6 @@ export const IntegrationSettingsModal = ({
};
useEffect(() => {
// Check if there is a success message in cookies
const status = getCookie("robot_auth_status");
const message = getCookie("robot_auth_message");
if (status === "success" && message) {
notify("success", message);
// Clear the cookies after reading
removeCookie("robot_auth_status");
removeCookie("robot_auth_message");
}
// Check if we're on the callback URL
const urlParams = new URLSearchParams(window.location.search);
const code = urlParams.get("code");

2
src/components/pickers/DatePicker.tsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react';
import { useSocketStore } from '../../context/socket';
import { Coordinates } from './canvas';
import { Coordinates } from '../recorder/canvas';
interface DatePickerProps {
coordinates: Coordinates;

1
src/components/recorder/AddWhatCondModal.tsx
View File

@@ -3,7 +3,6 @@ import { GenericModal } from "../ui/GenericModal";
import { modalStyle } from "./AddWhereCondModal";
import { Button, MenuItem, TextField, Typography } from "@mui/material";
import React, { useRef } from "react";
import { Dropdown as MuiDropdown } from "../ui/DropdownMui";
import { KeyValueForm } from "./KeyValueForm";
import { ClearButton } from "../ui/buttons/ClearButton";
import { useSocketStore } from "../../context/socket";

1
src/components/recorder/Highlighter.tsx
View File

@@ -1,5 +1,4 @@
import React from 'react';
import styled from "styled-components";
interface HighlighterProps {

1
src/components/recorder/LeftSidePanel.tsx
View File

@@ -3,7 +3,6 @@ import React, { useCallback, useEffect, useState } from "react";
import { getActiveWorkflow, getParamsOfActiveWorkflow } from "../../api/workflow";
import { useSocketStore } from '../../context/socket';
import { WhereWhatPair, WorkflowFile } from "maxun-core";
import { SidePanelHeader } from "./SidePanelHeader";
import { emptyWorkflow } from "../../shared/constants";
import { LeftSidePanelContent } from "./LeftSidePanelContent";
import { useBrowserDimensionsStore } from "../../context/browserDimensions";

4
src/components/recorder/LeftSidePanelContent.tsx
View File

@@ -1,15 +1,13 @@
import React, { useCallback, useEffect, useState } from 'react';
import Box from "@mui/material/Box";
import { Pair } from "./Pair";
import { WhereWhatPair, WorkflowFile } from "maxun-core";
import { useSocketStore } from "../../context/socket";
import { Add } from "@mui/icons-material";
import { Socket } from "socket.io-client";
import { AddButton } from "../ui/buttons/AddButton";
import { AddPair } from "../../api/workflow";
import { GenericModal } from "../ui/GenericModal";
import { PairEditForm } from "./PairEditForm";
import { Fab, Tooltip, Typography } from "@mui/material";
import { Tooltip } from "@mui/material";
interface LeftSidePanelContentProps {
workflow: WorkflowFile;

3
src/components/recorder/PairDetail.tsx
View File

@@ -1,6 +1,6 @@
import React, { useLayoutEffect, useRef, useState } from 'react';
import { WhereWhatPair } from "maxun-core";
import { Box, Button, IconButton, MenuItem, Stack, TextField, Tooltip, Typography } from "@mui/material";
import { IconButton, Stack, TextField, Tooltip, Typography } from "@mui/material";
import { Close, KeyboardArrowDown, KeyboardArrowUp } from "@mui/icons-material";
import TreeView from '@mui/lab/TreeView';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
@@ -11,7 +11,6 @@ import { WarningText } from "../ui/texts";
import NotificationImportantIcon from '@mui/icons-material/NotificationImportant';
import { RemoveButton } from "../ui/buttons/RemoveButton";
import { AddWhereCondModal } from "./AddWhereCondModal";
import { UpdatePair } from "../../api/workflow";
import { useSocketStore } from "../../context/socket";
import { AddWhatCondModal } from "./AddWhatCondModal";

4
src/components/recorder/RightSidePanel.tsx
View File

@@ -3,7 +3,6 @@ import { Button, Paper, Box, TextField, IconButton } from "@mui/material";
import EditIcon from '@mui/icons-material/Edit';
import TextFieldsIcon from '@mui/icons-material/TextFields';
import DocumentScannerIcon from '@mui/icons-material/DocumentScanner';
import { SimpleBox } from "../ui/Box";
import { WorkflowFile } from "maxun-core";
import Typography from "@mui/material/Typography";
import { useGlobalInfoStore } from "../../context/globalInfo";
@@ -12,15 +11,12 @@ import { useBrowserSteps } from '../../context/browserSteps';
import { useSocketStore } from '../../context/socket';
import { ScreenshotSettings } from '../../shared/types';
import InputAdornment from '@mui/material/InputAdornment';
import { SidePanelHeader } from './SidePanelHeader';
import FormControlLabel from '@mui/material/FormControlLabel';
import FormControl from '@mui/material/FormControl';
import FormLabel from '@mui/material/FormLabel';
import Radio from '@mui/material/Radio';
import RadioGroup from '@mui/material/RadioGroup';
import { emptyWorkflow } from "../../shared/constants";
import { getActiveWorkflow } from "../../api/workflow";
import DeleteIcon from '@mui/icons-material/Delete';
import ActionDescriptionBox from '../action/ActionDescriptionBox';
import { useThemeMode } from '../../context/theme-provider';
import { useTranslation } from 'react-i18next';

4
src/components/recorder/SaveRecording.tsx
View File

@@ -22,7 +22,7 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => {
const [recordingName, setRecordingName] = useState<string>(fileName);
const [waitingForSave, setWaitingForSave] = useState<boolean>(false);
const { browserId, setBrowserId, notify, recordings } = useGlobalInfoStore();
const { browserId, setBrowserId, notify, recordings, isLogin } = useGlobalInfoStore();
const { socket } = useSocketStore();
const { state, dispatch } = useContext(AuthContext);
const { user } = state;
@@ -59,7 +59,7 @@ export const SaveRecording = ({ fileName }: SaveRecordingProps) => {
// releases resources and changes the view for main page by clearing the global browserId
const saveRecording = async () => {
if (user) {
const payload = { fileName: recordingName, userId: user.id };
const payload = { fileName: recordingName, userId: user.id, isLogin: isLogin };
socket?.emit('save', payload);
setWaitingForSave(true);
console.log(`Saving the recording as ${recordingName} for userId ${user.id}`);

1
src/components/recorder/canvas.tsx
View File

@@ -1,6 +1,5 @@
import React, { useCallback, useEffect, useRef } from 'react';
import { useSocketStore } from '../../context/socket';
import { getMappedCoordinates } from "../../helpers/inputHelpers";
import { useGlobalInfoStore } from "../../context/globalInfo";
import { useActionContext } from '../../context/browserActions';
import DatePicker from '../pickers/DatePicker';

35
src/components/robot/Recordings.tsx
View File

@@ -1,13 +1,15 @@
import React, { useState } from "react";
import React, { useEffect, useState } from "react";
import { RecordingsTable } from "./RecordingsTable";
import { Grid } from "@mui/material";
import { RunSettings, RunSettingsModal } from "../run/RunSettings";
import { ScheduleSettings, ScheduleSettingsModal } from "./ScheduleSettings";
import { IntegrationSettings, IntegrationSettingsModal } from "../integration/IntegrationSettings";
import { RobotSettings, RobotSettingsModal } from "./RobotSettings";
import { IntegrationSettingsModal } from "../integration/IntegrationSettings";
import { RobotSettingsModal } from "./RobotSettings";
import { RobotEditModal } from "./RobotEdit";
import { RobotDuplicationModal } from "./RobotDuplicate";
import { useNavigate, useLocation, useParams } from "react-router-dom";
import { useGlobalInfoStore } from "../../context/globalInfo";
import { useTranslation } from "react-i18next";
interface RecordingsProps {
handleEditRecording: (id: string, fileName: string) => void;
@@ -26,6 +28,8 @@ export const Recordings = ({
const location = useLocation();
const { selectedRecordingId } = useParams();
const [params, setParams] = useState<string[]>([]);
const { notify } = useGlobalInfoStore();
const { t } = useTranslation();
const handleNavigate = (path: string, id: string, name: string, params: string[]) => {
setParams(params);
@@ -39,6 +43,31 @@ export const Recordings = ({
navigate("/robots"); // Navigate back to the main robots page
};
useEffect(() => {
// Helper function to get and clear a cookie
const getAndClearCookie = (name: string) => {
const value = document.cookie
.split('; ')
.find(row => row.startsWith(`${name}=`))
?.split('=')[1];
if (value) {
document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`;
}
return value;
};
const authStatus = getAndClearCookie('robot_auth_status');
const robotId = getAndClearCookie('robot_auth_robotId');
if (authStatus === 'success' && robotId) {
notify(authStatus, t("recordingtable.notifications.auth_success"));
handleNavigate(`/robots/${robotId}/integrate`, robotId, "", []);''
}
}, []);
// Determine which modal to open based on the current route
const getCurrentModal = () => {
const currentPath = location.pathname;

260
src/components/robot/RecordingsTable.tsx
View File

@@ -11,8 +11,32 @@ import TableRow from '@mui/material/TableRow';
import { useEffect } from "react";
import { WorkflowFile } from "maxun-core";
import SearchIcon from '@mui/icons-material/Search';
import { IconButton, Button, Box, Typography, TextField, MenuItem, Menu, ListItemIcon, ListItemText } from "@mui/material";
import { Schedule, DeleteForever, Edit, PlayCircle, Settings, Power, ContentCopy, MoreHoriz } from "@mui/icons-material";
import {
IconButton,
Button,
Box,
Typography,
TextField,
MenuItem,
Menu,
ListItemIcon,
ListItemText,
CircularProgress,
RadioGroup,
FormControlLabel,
Radio,
Checkbox,
} from "@mui/material";
import {
Schedule,
DeleteForever,
Edit,
PlayCircle,
Settings,
Power,
ContentCopy,
MoreHoriz
} from "@mui/icons-material";
import { useGlobalInfoStore } from "../../context/globalInfo";
import { checkRunsForRecording, deleteRecordingFromStorage, getStoredRecordings } from "../../api/storage";
import { Add } from "@mui/icons-material";
@@ -52,7 +76,14 @@ interface RecordingsTableProps {
handleDuplicateRobot: (id: string, name: string, params: string[]) => void;
}
export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handleScheduleRecording, handleIntegrateRecording, handleSettingsRecording, handleEditRobot, handleDuplicateRobot }: RecordingsTableProps) => {
export const RecordingsTable = ({
handleEditRecording,
handleRunRecording,
handleScheduleRecording,
handleIntegrateRecording,
handleSettingsRecording,
handleEditRobot,
handleDuplicateRobot }: RecordingsTableProps) => {
const { t } = useTranslation();
const [page, setPage] = React.useState(0);
const [rowsPerPage, setRowsPerPage] = React.useState(10);
@@ -85,7 +116,20 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl
},
];
const { notify, setRecordings, browserId, setBrowserId, setInitialUrl, recordingUrl, setRecordingUrl, recordingName, setRecordingName, recordingId, setRecordingId } = useGlobalInfoStore();
const {
notify,
setRecordings,
browserId,
setBrowserId,
setInitialUrl,
recordingUrl,
setRecordingUrl,
isLogin,
setIsLogin,
recordingName,
setRecordingName,
recordingId,
setRecordingId } = useGlobalInfoStore();
const navigate = useNavigate();
const handleChangePage = (event: unknown, newPage: number) => {
@@ -200,101 +244,107 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl
</IconButton>
</Box>
</Box>
<TableContainer component={Paper} sx={{ width: '100%', overflow: 'hidden', marginTop: '15px' }}>
<Table stickyHeader aria-label="sticky table">
<TableHead>
<TableRow>
{columns.map((column) => (
<TableCell
key={column.id}
align={column.align}
style={{ minWidth: column.minWidth }}
>
{column.label}
</TableCell>
))}
</TableRow>
</TableHead>
<TableBody>
{filteredRows.length !== 0 ? filteredRows
.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
.map((row) => {
return (
<TableRow hover role="checkbox" tabIndex={-1} key={row.id}>
{columns.map((column) => {
// @ts-ignore
const value: any = row[column.id];
if (value !== undefined) {
return (
<TableCell key={column.id} align={column.align}>
{value}
</TableCell>
);
} else {
switch (column.id) {
case 'interpret':
return (
<TableCell key={column.id} align={column.align}>
<InterpretButton handleInterpret={() => handleRunRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
case 'schedule':
return (
<TableCell key={column.id} align={column.align}>
<ScheduleButton handleSchedule={() => handleScheduleRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
case 'integrate':
return (
<TableCell key={column.id} align={column.align}>
<IntegrateButton handleIntegrate={() => handleIntegrateRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
case 'options':
return (
<TableCell key={column.id} align={column.align}>
<OptionsButton
handleEdit={() => handleEditRobot(row.id, row.name, row.params || [])}
handleDuplicate={() => {
handleDuplicateRobot(row.id, row.name, row.params || []);
}}
handleDelete={() => {
{rows.length === 0 ? (
<Box display="flex" justifyContent="center" alignItems="center" height="50%">
<CircularProgress />
</Box>
) : (
<TableContainer component={Paper} sx={{ width: '100%', overflow: 'hidden', marginTop: '15px' }}>
<Table stickyHeader aria-label="sticky table">
<TableHead>
<TableRow>
{columns.map((column) => (
<TableCell
key={column.id}
align={column.align}
style={{ minWidth: column.minWidth }}
>
{column.label}
</TableCell>
))}
</TableRow>
</TableHead>
<TableBody>
{filteredRows.length !== 0 ? filteredRows
.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
.map((row) => {
return (
<TableRow hover role="checkbox" tabIndex={-1} key={row.id}>
{columns.map((column) => {
// @ts-ignore
const value: any = row[column.id];
if (value !== undefined) {
return (
<TableCell key={column.id} align={column.align}>
{value}
</TableCell>
);
} else {
switch (column.id) {
case 'interpret':
return (
<TableCell key={column.id} align={column.align}>
<InterpretButton handleInterpret={() => handleRunRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
case 'schedule':
return (
<TableCell key={column.id} align={column.align}>
<ScheduleButton handleSchedule={() => handleScheduleRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
case 'integrate':
return (
<TableCell key={column.id} align={column.align}>
<IntegrateButton handleIntegrate={() => handleIntegrateRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
case 'options':
return (
<TableCell key={column.id} align={column.align}>
<OptionsButton
handleEdit={() => handleEditRobot(row.id, row.name, row.params || [])}
handleDuplicate={() => {
handleDuplicateRobot(row.id, row.name, row.params || []);
}}
handleDelete={() => {
checkRunsForRecording(row.id).then((result: boolean) => {
if (result) {
notify('warning', t('recordingtable.notifications.delete_warning'));
}
})
checkRunsForRecording(row.id).then((result: boolean) => {
if (result) {
notify('warning', t('recordingtable.notifications.delete_warning'));
}
})
deleteRecordingFromStorage(row.id).then((result: boolean) => {
if (result) {
setRows([]);
notify('success', t('recordingtable.notifications.delete_success'));
fetchRecordings();
}
})
}}
/>
</TableCell>
);
case 'settings':
return (
<TableCell key={column.id} align={column.align}>
<SettingsButton handleSettings={() => handleSettingsRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
default:
return null;
deleteRecordingFromStorage(row.id).then((result: boolean) => {
if (result) {
setRows([]);
notify('success', t('recordingtable.notifications.delete_success'));
fetchRecordings();
}
})
}}
/>
</TableCell>
);
case 'settings':
return (
<TableCell key={column.id} align={column.align}>
<SettingsButton handleSettings={() => handleSettingsRecording(row.id, row.name, row.params || [])} />
</TableCell>
);
default:
return null;
}
}
}
})}
</TableRow>
);
})
: null}
</TableBody>
</Table>
</TableContainer>
})}
</TableRow>
);
})
: null}
</TableBody>
</Table>
</TableContainer>
)}
<TablePagination
rowsPerPageOptions={[10, 25, 50]}
component="div"
@@ -305,7 +355,7 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl
onRowsPerPageChange={handleChangeRowsPerPage}
/>
<GenericModal isOpen={isModalOpen} onClose={() => setModalOpen(false)} modalStyle={modalStyle}>
<div style={{ padding: '20px' }}>
<div style={{ padding: '10px' }}>
<Typography variant="h6" gutterBottom>{t('recordingtable.modal.title')}</Typography>
<TextField
label={t('recordingtable.modal.label')}
@@ -313,8 +363,22 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl
fullWidth
value={recordingUrl}
onChange={setBrowserRecordingUrl}
style={{ marginBottom: '20px', marginTop: '20px' }}
style={{ marginBottom: '10px', marginTop: '20px' }}
/>
<FormControlLabel
control={
<Checkbox
checked={isLogin}
onChange={(e) => setIsLogin(e.target.checked)}
color="primary"
/>
}
label={t('recordingtable.modal.login_title')}
style={{ marginBottom: '10px' }}
/>
<br />
<Button
variant="contained"
color="primary"

1
src/components/robot/RobotDuplicate.tsx
View File

@@ -5,7 +5,6 @@ import { modalStyle } from "../recorder/AddWhereCondModal";
import { useGlobalInfoStore } from '../../context/globalInfo';
import { duplicateRecording, getStoredRecording } from '../../api/storage';
import { WhereWhatPair } from 'maxun-core';
import { getUserById } from "../../api/auth";
import { useTranslation } from 'react-i18next';
interface RobotMeta {

364
src/components/robot/RobotEdit.tsx
View File

@@ -1,7 +1,8 @@
import React, { useState, useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import { GenericModal } from "../ui/GenericModal";
import { TextField, Typography, Box, Button } from "@mui/material";
import { TextField, Typography, Box, Button, IconButton, InputAdornment } from "@mui/material";
import { Visibility, VisibilityOff } from '@mui/icons-material';
import { modalStyle } from "../recorder/AddWhereCondModal";
import { useGlobalInfoStore } from '../../context/globalInfo';
import { getStoredRecording, updateRecording } from '../../api/storage';
@@ -20,11 +21,6 @@ interface RobotWorkflow {
workflow: WhereWhatPair[];
}
interface RobotEditOptions {
name: string;
limit?: number;
}
interface ScheduleConfig {
runEvery: number;
runEveryUnit: 'MINUTES' | 'HOURS' | 'DAYS' | 'WEEKS' | 'MONTHS';
@@ -57,10 +53,61 @@ interface RobotSettingsProps {
initialSettings?: RobotSettings | null;
}
interface CredentialInfo {
value: string;
type: string;
}
interface Credentials {
[key: string]: CredentialInfo;
}
interface CredentialVisibility {
[key: string]: boolean;
}
interface GroupedCredentials {
passwords: string[];
emails: string[];
usernames: string[];
others: string[];
}
export const RobotEditModal = ({ isOpen, handleStart, handleClose, initialSettings }: RobotSettingsProps) => {
const { t } = useTranslation();
const [robot, setRobot] = useState<RobotSettings | null>(null);
const [credentials, setCredentials] = useState<Credentials>({});
const { recordingId, notify } = useGlobalInfoStore();
const [credentialGroups, setCredentialGroups] = useState<GroupedCredentials>({
passwords: [],
emails: [],
usernames: [],
others: []
});
const [showPasswords, setShowPasswords] = useState<CredentialVisibility>({});
const isEmailPattern = (value: string): boolean => {
return value.includes('@');
};
const isUsernameSelector = (selector: string): boolean => {
return selector.toLowerCase().includes('username') ||
selector.toLowerCase().includes('user') ||
selector.toLowerCase().includes('email');
};
const determineCredentialType = (selector: string, info: CredentialInfo): 'password' | 'email' | 'username' | 'other' => {
if (info.type === 'password' || selector.toLowerCase().includes('password')) {
return 'password';
}
if (isEmailPattern(info.value) || selector.toLowerCase().includes('email')) {
return 'email';
}
if (isUsernameSelector(selector)) {
return 'username';
}
return 'other';
};
useEffect(() => {
if (isOpen) {
@@ -68,6 +115,112 @@ export const RobotEditModal = ({ isOpen, handleStart, handleClose, initialSettin
}
}, [isOpen]);
useEffect(() => {
if (robot?.recording?.workflow) {
const extractedCredentials = extractInitialCredentials(robot.recording.workflow);
setCredentials(extractedCredentials);
setCredentialGroups(groupCredentialsByType(extractedCredentials));
}
}, [robot]);
const extractInitialCredentials = (workflow: any[]): Credentials => {
const credentials: Credentials = {};
// Helper function to check if a character is printable
const isPrintableCharacter = (char: string): boolean => {
return char.length === 1 && !!char.match(/^[\x20-\x7E]$/);
};
// Process each step in the workflow
workflow.forEach(step => {
if (!step.what) return;
// Keep track of the current input field being processed
let currentSelector = '';
let currentValue = '';
let currentType = '';
// Process actions in sequence to maintain correct text state
step.what.forEach((action: any) => {
if (
(action.action === 'type' || action.action === 'press') &&
action.args?.length >= 2 &&
typeof action.args[1] === 'string'
) {
const selector: string = action.args[0];
const character: string = action.args[1];
const inputType: string = action.args[2] || '';
// Detect `input[type="password"]`
if (!currentType && inputType.toLowerCase() === 'password') {
currentType = 'password';
}
// If we're dealing with a new selector, store the previous one
if (currentSelector && selector !== currentSelector) {
if (!credentials[currentSelector]) {
credentials[currentSelector] = {
value: currentValue,
type: currentType
};
} else {
credentials[currentSelector].value = currentValue;
}
}
// Update current tracking variables
if (selector !== currentSelector) {
currentSelector = selector;
currentValue = credentials[selector]?.value || '';
currentType = inputType || credentials[selector]?.type || '';
}
// Handle different types of key actions
if (character === 'Backspace') {
// Remove the last character when backspace is pressed
currentValue = currentValue.slice(0, -1);
} else if (isPrintableCharacter(character)) {
// Add the character to the current value
currentValue += character;
}
// Note: We ignore other special keys like 'Shift', 'Enter', etc.
}
});
// Store the final state of the last processed selector
if (currentSelector) {
credentials[currentSelector] = {
value: currentValue,
type: currentType
};
}
});
return credentials;
};
const groupCredentialsByType = (credentials: Credentials): GroupedCredentials => {
return Object.entries(credentials).reduce((acc: GroupedCredentials, [selector, info]) => {
const credentialType = determineCredentialType(selector, info);
switch (credentialType) {
case 'password':
acc.passwords.push(selector);
break;
case 'email':
acc.emails.push(selector);
break;
case 'username':
acc.usernames.push(selector);
break;
default:
acc.others.push(selector);
}
return acc;
}, { passwords: [], emails: [], usernames: [], others: [] });
};
const getRobot = async () => {
if (recordingId) {
const robot = await getStoredRecording(recordingId);
@@ -75,7 +228,14 @@ export const RobotEditModal = ({ isOpen, handleStart, handleClose, initialSettin
} else {
notify('error', t('robot_edit.notifications.update_failed'));
}
}
};
const handleClickShowPassword = (selector: string) => {
setShowPasswords(prev => ({
...prev,
[selector]: !prev[selector]
}));
};
const handleRobotNameChange = (newName: string) => {
setRobot((prev) =>
@@ -83,12 +243,21 @@ export const RobotEditModal = ({ isOpen, handleStart, handleClose, initialSettin
);
};
const handleCredentialChange = (selector: string, value: string) => {
setCredentials(prev => ({
...prev,
[selector]: {
...prev[selector],
value
}
}));
};
const handleLimitChange = (newLimit: number) => {
setRobot((prev) => {
if (!prev) return prev;
const updatedWorkflow = [...prev.recording.workflow];
if (
updatedWorkflow.length > 0 &&
updatedWorkflow[0]?.what &&
@@ -104,20 +273,101 @@ export const RobotEditModal = ({ isOpen, handleStart, handleClose, initialSettin
});
};
const renderAllCredentialFields = () => {
return (
<>
{renderCredentialFields(
credentialGroups.usernames,
t('Username'),
'text'
)}
{renderCredentialFields(
credentialGroups.emails,
t('Email'),
'text'
)}
{renderCredentialFields(
credentialGroups.passwords,
t('Password'),
'password'
)}
{renderCredentialFields(
credentialGroups.others,
t('Other'),
'text'
)}
</>
);
};
const renderCredentialFields = (selectors: string[], headerText: string, defaultType: 'text' | 'password' = 'text') => {
if (selectors.length === 0) return null;
return (
<>
{/* <Typography variant="h6" style={{ marginBottom: '20px' }}>
{headerText}
</Typography> */}
{selectors.map((selector, index) => {
const isVisible = showPasswords[selector];
return (
<TextField
key={selector}
type={isVisible ? 'text' : 'password'}
label={headerText === 'Other' ? `${`Input`} ${index + 1}` : headerText}
value={credentials[selector]?.value || ''}
onChange={(e) => handleCredentialChange(selector, e.target.value)}
style={{ marginBottom: '20px' }}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton
aria-label="Show input"
onClick={() => handleClickShowPassword(selector)}
edge="end"
disabled={!credentials[selector]?.value}
>
{isVisible ? <Visibility /> : <VisibilityOff />}
</IconButton>
</InputAdornment>
),
}}
/>
);
})}
</>
);
};
const handleSave = async () => {
if (!robot) return;
try {
const credentialsForPayload = Object.entries(credentials).reduce((acc, [selector, info]) => {
const enforceType = info.type === 'password' ? 'password' : 'text';
acc[selector] = {
value: info.value,
type: enforceType
};
return acc;
}, {} as Record<string, CredentialInfo>);
const payload = {
name: robot.recording_meta.name,
limit: robot.recording.workflow[0]?.what[0]?.args?.[0]?.limit,
credentials: credentialsForPayload,
};
const success = await updateRecording(robot.recording_meta.id, payload);
if (success) {
notify('success', t('robot_edit.notifications.update_success'));
handleStart(robot); // Inform parent about the updated robot
handleStart(robot);
handleClose();
setTimeout(() => {
@@ -143,55 +393,63 @@ export const RobotEditModal = ({ isOpen, handleStart, handleClose, initialSettin
{t('robot_edit.title')}
</Typography>
<Box style={{ display: 'flex', flexDirection: 'column' }}>
{
robot && (
<>
{robot && (
<>
<TextField
label={t('robot_edit.change_name')}
key="Robot Name"
type='text'
value={robot.recording_meta.name}
onChange={(e) => handleRobotNameChange(e.target.value)}
style={{ marginBottom: '20px' }}
/>
{robot.recording.workflow?.[0]?.what?.[0]?.args?.[0]?.limit !== undefined && (
<TextField
label={t('robot_edit.change_name')}
key="Robot Name"
type='text'
value={robot.recording_meta.name}
onChange={(e) => handleRobotNameChange(e.target.value)}
label={t('robot_edit.robot_limit')}
type="number"
value={robot.recording.workflow[0].what[0].args[0].limit || ''}
onChange={(e) => {
const value = parseInt(e.target.value, 10);
if (value >= 1) {
handleLimitChange(value);
}
}}
inputProps={{ min: 1 }}
style={{ marginBottom: '20px' }}
/>
{robot.recording.workflow?.[0]?.what?.[0]?.args?.[0]?.limit !== undefined && (
<TextField
label={t('robot_edit.robot_limit')}
type="number"
value={robot.recording.workflow[0].what[0].args[0].limit || ''}
onChange={(e) => {
const value = parseInt(e.target.value, 10);
if (value >= 1) {
handleLimitChange(value);
}
}}
inputProps={{ min: 1 }}
style={{ marginBottom: '20px' }}
/>
)}
)}
<Box mt={2} display="flex" justifyContent="flex-end">
<Button variant="contained" color="primary" onClick={handleSave}>
{t('robot_edit.save')}
</Button>
<Button
onClick={handleClose}
color="primary"
variant="outlined"
style={{ marginLeft: '10px' }}
sx={{
color: '#ff00c3 !important',
borderColor: '#ff00c3 !important',
backgroundColor: 'whitesmoke !important',
}}>
{t('robot_edit.cancel')}
</Button>
</Box>
</>
)
}
{(Object.keys(credentials).length > 0) && (
<>
<Typography variant="body1" style={{ marginBottom: '20px' }}>
{t('Input Texts')}
</Typography>
{renderAllCredentialFields()}
</>
)}
<Box mt={2} display="flex" justifyContent="flex-end">
<Button variant="contained" color="primary" onClick={handleSave}>
{t('robot_edit.save')}
</Button>
<Button
onClick={handleClose}
color="primary"
variant="outlined"
style={{ marginLeft: '10px' }}
sx={{
color: '#ff00c3 !important',
borderColor: '#ff00c3 !important',
backgroundColor: 'whitesmoke !important',
}}>
{t('robot_edit.cancel')}
</Button>
</Box>
</>
)}
</Box>
</>
</GenericModal>
);
};
};

8
src/components/robot/ScheduleSettings.tsx
View File

@@ -190,7 +190,7 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
sx={dropDownStyle}
>
{units.map((unit) => (
<MenuItem key={unit} value={unit}>{unit}</MenuItem>
<MenuItem key={unit} value={unit}> {unit.charAt(0).toUpperCase() + unit.slice(1).toLowerCase()}</MenuItem>
))}
</Dropdown>
</Box>
@@ -207,7 +207,9 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
sx={dropDownStyle}
>
{days.map((day) => (
<MenuItem key={day} value={day}>{day}</MenuItem>
<MenuItem key={day} value={day}>
{day.charAt(0).toUpperCase() + day.slice(1).toLowerCase()}
</MenuItem>
))}
</Dropdown>
</Box>
@@ -265,7 +267,7 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
sx={dropDownStyle}
>
{validMomentTimezones.map((tz) => (
<MenuItem key={tz} value={tz}>{tz}</MenuItem>
<MenuItem key={tz} value={tz}>{tz.charAt(0).toUpperCase() + tz.slice(1).toLowerCase()}</MenuItem>
))}
</Dropdown>
</Box>

3
src/components/run/InterpretationButtons.tsx
View File

@@ -1,7 +1,6 @@
import { Box, Button, Stack, Typography, CircularProgress } from "@mui/material";
import { PlayCircle } from "@mui/icons-material";
import React, { useCallback, useEffect, useState } from "react";
import { interpretCurrentRecording, stopCurrentInterpretation } from "../../api/recording";
import { interpretCurrentRecording } from "../../api/recording";
import { useSocketStore } from "../../context/socket";
import { useGlobalInfoStore } from "../../context/globalInfo";
import { GenericModal } from "../ui/GenericModal";

94
src/components/run/RunsTable.tsx
View File

@@ -9,7 +9,7 @@ import TableContainer from '@mui/material/TableContainer';
import TableHead from '@mui/material/TableHead';
import TablePagination from '@mui/material/TablePagination';
import TableRow from '@mui/material/TableRow';
import { Accordion, AccordionSummary, AccordionDetails, Typography, Box, TextField } from '@mui/material';
import { Accordion, AccordionSummary, AccordionDetails, Typography, Box, TextField, CircularProgress } from '@mui/material';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import SearchIcon from '@mui/icons-material/Search';
import { useNavigate } from 'react-router-dom';
@@ -18,7 +18,6 @@ import { getStoredRuns } from "../../api/storage";
import { RunSettings } from "./RunSettings";
import { CollapsibleRow } from "./ColapsibleRow";
// Export columns before the component
export const columns: readonly Column[] = [
{ id: 'runStatus', label: 'Status', minWidth: 80 },
{ id: 'name', label: 'Name', minWidth: 80 },
@@ -70,7 +69,6 @@ export const RunsTable: React.FC<RunsTableProps> = ({
const { t } = useTranslation();
const navigate = useNavigate();
// Update column labels using translation if needed
const translatedColumns = columns.map(column => ({
...column,
label: t(`runstable.${column.id}`, column.label)
@@ -162,48 +160,54 @@ export const RunsTable: React.FC<RunsTableProps> = ({
sx={{ width: '250px' }}
/>
</Box>
<TableContainer component={Paper} sx={{ width: '100%', overflow: 'hidden' }}>
{Object.entries(groupedRows).map(([id, data]) => (
<Accordion key={id} onChange={(event, isExpanded) => handleAccordionChange(id, isExpanded)}>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<Typography variant="h6">{data[data.length - 1].name}</Typography>
</AccordionSummary>
<AccordionDetails>
<Table stickyHeader aria-label="sticky table">
<TableHead>
<TableRow>
<TableCell />
{translatedColumns.map((column) => (
<TableCell
key={column.id}
align={column.align}
style={{ minWidth: column.minWidth }}
>
{column.label}
</TableCell>
))}
</TableRow>
</TableHead>
<TableBody>
{data
.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
.map((row) => (
<CollapsibleRow
row={row}
handleDelete={handleDelete}
key={`row-${row.id}`}
isOpen={runId === row.runId && runningRecordingName === row.name}
currentLog={currentInterpretationLog}
abortRunHandler={abortRunHandler}
runningRecordingName={runningRecordingName}
/>
))}
</TableBody>
</Table>
</AccordionDetails>
</Accordion>
))}
</TableContainer>
{rows.length === 0 ? (
<Box display="flex" justifyContent="center" alignItems="center" height="50%">
<CircularProgress />
</Box>
) : (
<TableContainer component={Paper} sx={{ width: '100%', overflow: 'hidden' }}>
{Object.entries(groupedRows).map(([id, data]) => (
<Accordion key={id} onChange={(event, isExpanded) => handleAccordionChange(id, isExpanded)}>
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<Typography variant="h6">{data[data.length - 1].name}</Typography>
</AccordionSummary>
<AccordionDetails>
<Table stickyHeader aria-label="sticky table">
<TableHead>
<TableRow>
<TableCell />
{translatedColumns.map((column) => (
<TableCell
key={column.id}
align={column.align}
style={{ minWidth: column.minWidth }}
>
{column.label}
</TableCell>
))}
</TableRow>
</TableHead>
<TableBody>
{data
.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
.map((row) => (
<CollapsibleRow
row={row}
handleDelete={handleDelete}
key={`row-${row.id}`}
isOpen={runId === row.runId && runningRecordingName === row.name}
currentLog={currentInterpretationLog}
abortRunHandler={abortRunHandler}
runningRecordingName={runningRecordingName}
/>
))}
</TableBody>
</Table>
</AccordionDetails>
</Accordion>
))}
</TableContainer>
)}
<TablePagination
rowsPerPageOptions={[10, 25, 50]}
component="div"

6
src/context/globalInfo.tsx
View File

@@ -10,6 +10,8 @@ interface GlobalInfo {
notification: AlertSnackbarProps;
notify: (severity: 'error' | 'warning' | 'info' | 'success', message: string) => void;
closeNotify: () => void;
isLogin: boolean;
setIsLogin: (isLogin: boolean) => void;
recordings: string[];
setRecordings: (recordings: string[]) => void;
rerenderRuns: boolean;
@@ -53,6 +55,7 @@ class GlobalInfoStore implements Partial<GlobalInfo> {
recordingName = '';
initialUrl = 'https://';
recordingUrl = 'https://';
isLogin = false;
currentWorkflowActionsState = {
hasScrapeListAction: false,
hasScreenshotAction: false,
@@ -75,6 +78,7 @@ export const GlobalInfoProvider = ({ children }: { children: JSX.Element }) => {
const [recordingLength, setRecordingLength] = useState<number>(globalInfoStore.recordingLength);
const [recordingId, setRecordingId] = useState<string | null>(globalInfoStore.recordingId);
const [recordingName, setRecordingName] = useState<string>(globalInfoStore.recordingName);
const [isLogin, setIsLogin] = useState<boolean>(globalInfoStore.isLogin);
const [initialUrl, setInitialUrl] = useState<string>(globalInfoStore.initialUrl);
const [recordingUrl, setRecordingUrl] = useState<string>(globalInfoStore.recordingUrl);
const [currentWorkflowActionsState, setCurrentWorkflowActionsState] = useState(globalInfoStore.currentWorkflowActionsState);
@@ -127,6 +131,8 @@ export const GlobalInfoProvider = ({ children }: { children: JSX.Element }) => {
setInitialUrl,
recordingUrl,
setRecordingUrl,
isLogin,
setIsLogin,
currentWorkflowActionsState,
setCurrentWorkflowActionsState,
shouldResetInterpretationLog,

3
src/pages/PageWrappper.tsx → src/pages/PageWrapper.tsx
View File

@@ -12,7 +12,7 @@ import Login from './Login';
import Register from './Register';
import UserRoute from '../routes/userRoute';
import { Routes, Route, useNavigate, Navigate } from 'react-router-dom';
import { Runs } from '../components/run/Runs';
import { NotFoundPage } from '../components/dashboard/NotFound';
export const PageWrapper = () => {
const [open, setOpen] = useState(false);
@@ -75,6 +75,7 @@ export const PageWrapper = () => {
path="/register"
element={<Register />}
/>
<Route path="*" element={<NotFoundPage />} />
</Routes>
</React.Fragment>
</SocketProvider>