>({
key={index}
className={`${styles.tr} ${selectedRows.has(index) ? styles.selected : ''} ${onRowClick ? styles.clickable : ''}`}
onClick={() => onRowClick?.(row, index)}
+ draggable={rowDraggable}
+ onDragStart={rowDraggable && onRowDragStart ? (e) => onRowDragStart(e, row) : undefined}
{...Object.fromEntries(
Object.entries(dataAttributes).map(([key, value]) => [`data-${key}`, value])
)}
diff --git a/src/components/Navigation/UserSection.tsx b/src/components/Navigation/UserSection.tsx
index e19cd0e..1b6f9e7 100644
--- a/src/components/Navigation/UserSection.tsx
+++ b/src/components/Navigation/UserSection.tsx
@@ -49,9 +49,12 @@ export const UserSection: React.FC = () => {
}
// Initialen fΓΌr Avatar
- const initials = user.fullName
- ? user.fullName.split(' ').map(n => n[0]).join('').toUpperCase().slice(0, 2)
- : user.username.slice(0, 2).toUpperCase();
+ const initials = (() => {
+ const name = user.fullName || user.username || '';
+ const parts = name.trim().split(/\s+/);
+ if (parts.length >= 2) return (parts[0][0] + parts[parts.length - 1][0]).toLocaleUpperCase();
+ return [...name.trim()].slice(0, 2).join('').toLocaleUpperCase() || '?';
+ })();
return (
diff --git a/src/components/ProviderSelector/ProviderSelector.module.css b/src/components/ProviderSelector/ProviderSelector.module.css
index ddfa9c9..04d2be7 100644
--- a/src/components/ProviderSelector/ProviderSelector.module.css
+++ b/src/components/ProviderSelector/ProviderSelector.module.css
@@ -46,7 +46,7 @@
display: inline-block;
}
-/* Trigger Button - matches iconButton style from PlaygroundPage */
+/* Trigger Button */
.triggerButton {
display: flex;
align-items: center;
diff --git a/src/components/ProviderSelector/ProviderSelector.tsx b/src/components/ProviderSelector/ProviderSelector.tsx
index 1e8e864..e41cefb 100644
--- a/src/components/ProviderSelector/ProviderSelector.tsx
+++ b/src/components/ProviderSelector/ProviderSelector.tsx
@@ -2,7 +2,7 @@
* ProviderSelector Component
*
* Wiederverwendbare Komponente zur Auswahl von AICore-Providern.
- * Kann im Chat Playground und Automation Editor verwendet werden.
+ * Kann im AI Workspace und Automation Editor verwendet werden.
*
* Features:
* - Dropdown fΓΌr Einzelauswahl
diff --git a/src/components/UiComponents/WorkflowStatus/WorkflowStatus.tsx b/src/components/UiComponents/WorkflowStatus/WorkflowStatus.tsx
index 59031c8..41d9692 100644
--- a/src/components/UiComponents/WorkflowStatus/WorkflowStatus.tsx
+++ b/src/components/UiComponents/WorkflowStatus/WorkflowStatus.tsx
@@ -2,114 +2,37 @@ import React, { useMemo } from 'react';
import { WorkflowStatusProps, WorkflowStatusType } from './WorkflowStatusTypes';
import styles from './WorkflowStatus.module.css';
-// Helper function to extract workflow status and round from log message
+const _STATUS_MAP: Record = {
+ success: 'completed',
+ completed: 'completed',
+ started: 'started',
+ running: 'started',
+ resumed: 'resumed',
+ stopped: 'stopped',
+ failed: 'failed',
+ error: 'failed',
+};
+
const extractWorkflowStatus = (logs: any[]): { status: WorkflowStatusType; round: number | null; timestamp: number } => {
- // First, check for completion messages with success status (these take priority)
- const completionMessages = logs.filter(log => {
- const message = (log.message || '').toLowerCase();
+ if (!logs.length) return { status: null, round: null, timestamp: 0 };
+
+ const sorted = [...logs].sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0));
+
+ for (const log of sorted) {
const logStatus = (log.status || '').toLowerCase();
- return (message.includes('fast path completed') ||
- message.includes('completed successfully')) &&
- logStatus === 'success';
- });
-
- // If we have completion messages, use the latest one
- if (completionMessages.length > 0) {
- const latestCompletion = completionMessages.sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))[0];
-
- // Try to extract round from completion message
- let round: number | null = null;
- const message = (latestCompletion.message || '').toLowerCase();
- const roundMatch = message.match(/\(?round\s+(\d+)\)?/i);
- if (roundMatch) {
- round = parseInt(roundMatch[1], 10);
- } else {
- // If no round in completion message, get round from latest workflow status message
- const statusMessages = logs.filter(log => {
- const msg = (log.message || '').toLowerCase();
- return msg.includes('workflow started') || msg.includes('workflow resumed');
- });
- if (statusMessages.length > 0) {
- const latestWorkflowStatus = statusMessages.sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))[0];
- const workflowMessage = (latestWorkflowStatus.message || '').toLowerCase();
- const workflowRoundMatch = workflowMessage.match(/\(?round\s+(\d+)\)?/i);
- if (workflowRoundMatch) {
- round = parseInt(workflowRoundMatch[1], 10);
- }
- }
+ const mapped = _STATUS_MAP[logStatus];
+ if (mapped) {
+ const roundMatch = (log.message || '').match(/\(?round\s+(\d+)\)?/i);
+ return { status: mapped, round: roundMatch ? parseInt(roundMatch[1], 10) : null, timestamp: log.timestamp || 0 };
}
-
- return {
- status: 'completed',
- round,
- timestamp: latestCompletion.timestamp || 0
- };
}
- // If no completion messages, look for workflow started/resumed/stopped messages
- const statusMessages = logs.filter(log => {
- const message = (log.message || '').toLowerCase();
- return message.includes('workflow started') ||
- message.includes('workflow resumed') ||
- message.includes('workflow stopped') ||
- message.includes('workflow failed') ||
- message.includes('workflow completed');
- });
-
- if (statusMessages.length === 0) {
- return { status: null, round: null, timestamp: 0 };
- }
-
- // Get the latest status message
- const latestStatus = statusMessages.sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))[0];
- const message = (latestStatus.message || '').toLowerCase();
-
- let status: WorkflowStatusType = null;
- if (message.includes('started')) {
- status = 'started';
- } else if (message.includes('resumed')) {
- status = 'resumed';
- } else if (message.includes('stopped')) {
- status = 'stopped';
- } else if (message.includes('failed')) {
- status = 'failed';
- } else if (message.includes('completed')) {
- status = 'completed';
- }
-
- // Extract round number from message (e.g., "round 4", "round 2", or "(round 4)")
- const roundMatch = message.match(/\(?round\s+(\d+)\)?/i);
- const round = roundMatch ? parseInt(roundMatch[1], 10) : null;
-
- return {
- status,
- round,
- timestamp: latestStatus.timestamp || 0
- };
+ return { status: null, round: null, timestamp: 0 };
};
-// Helper function to format bytes to KB or MB
-const formatBytes = (bytes?: number): string => {
- if (bytes === undefined || bytes === null) return '-';
- if (bytes === 0) return '0 B';
- const kb = bytes / 1024;
- if (kb < 1024) {
- return `${kb.toFixed(2)} KB`;
- }
- const mb = kb / 1024;
- return `${mb.toFixed(2)} MB`;
-};
-
-// Helper function to format price
-const formatPrice = (price?: number): string => {
- if (price === undefined || price === null) return '-';
- return `$${price.toFixed(2)}`;
-};
-
-// Helper function to format processing time
-const formatProcessingTime = (time?: number): string => {
- if (time === undefined || time === null) return '-';
- return `${time.toFixed(2)}s`;
+const _formatCurrency = (amount?: number): string => {
+ if (amount === undefined || amount === null) return '-';
+ return `${amount.toFixed(2)} CHF`;
};
const WorkflowStatus: React.FC = ({
@@ -122,40 +45,10 @@ const WorkflowStatus: React.FC = ({
}) => {
// Use workflow status and round from API response, fallback to extracting from logs
const workflowStatus = useMemo(() => {
- // If we have status from API, use it
if (workflowStatusFromApi) {
- let status: WorkflowStatusType = null;
- const statusLower = workflowStatusFromApi.toLowerCase();
-
- if (statusLower === 'completed') {
- status = 'completed';
- } else if (statusLower === 'running') {
- // Check if it's started or resumed from logs
- const startedResumedLogs = logs.filter(log => {
- const message = (log.message || '').toLowerCase();
- return message.includes('workflow started') || message.includes('workflow resumed');
- });
- if (startedResumedLogs.length > 0) {
- const latest = startedResumedLogs.sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))[0];
- const message = (latest.message || '').toLowerCase();
- status = message.includes('resumed') ? 'resumed' : 'started';
- } else {
- status = 'started';
- }
- } else if (statusLower === 'stopped') {
- status = 'stopped';
- } else if (statusLower === 'failed') {
- status = 'failed';
- }
-
- return {
- status,
- round: currentRoundFromApi || null,
- timestamp: Date.now() / 1000 // Use current time since we don't have timestamp from API
- };
+ const mapped = _STATUS_MAP[workflowStatusFromApi.toLowerCase()] || null;
+ return { status: mapped, round: currentRoundFromApi || null, timestamp: Date.now() / 1000 };
}
-
- // Fallback to extracting from logs
return extractWorkflowStatus(logs);
}, [workflowStatusFromApi, currentRoundFromApi, logs]);
@@ -185,33 +78,13 @@ const WorkflowStatus: React.FC = ({
)}
- {/* Stats Display */}
- {latestStats && (
+ {/* Cost Display */}
+ {latestStats && latestStats.priceCHF !== undefined && (
- {latestStats.priceUsd !== undefined && (
-
- Price:
- {formatPrice(latestStats.priceUsd)}
-
- )}
- {latestStats.processingTime !== undefined && (
-
- Time:
- {formatProcessingTime(latestStats.processingTime)}
-
- )}
- {latestStats.bytesSent !== undefined && (
-
- Sent:
- {formatBytes(latestStats.bytesSent)}
-
- )}
- {latestStats.bytesReceived !== undefined && (
-
- Received:
- {formatBytes(latestStats.bytesReceived)}
-
- )}
+
+ Cost:
+ {_formatCurrency(latestStats.priceCHF)}
+
+
+
);
diff --git a/src/locales/de.ts b/src/locales/de.ts
index 1f0c637..87d282d 100644
--- a/src/locales/de.ts
+++ b/src/locales/de.ts
@@ -718,11 +718,6 @@ export default {
'warning.duplicate_file.title': 'Datei bereits vorhanden',
'warning.duplicate_file.message': 'Die Datei "{fileName}" existiert bereits mit identischem Inhalt. Die vorhandene Datei wird wiederverwendet.',
- // Chat Playground Page
- 'chatPlayground.title': 'Chat Playground',
- 'chatPlayground.description': 'Workflow-AusfΓΌhrung und Chat-Interaktion',
- 'chatPlayground.subtitle': 'Chat-basierte Workflow-Steuerung',
-
// Automations Page
'automations.title': 'Automatisierungen',
'automations.description': 'Workflow-Automatisierungen verwalten',
diff --git a/src/locales/en.ts b/src/locales/en.ts
index 6d9bbe0..8989b10 100644
--- a/src/locales/en.ts
+++ b/src/locales/en.ts
@@ -718,11 +718,6 @@ export default {
'warning.duplicate_file.title': 'File Already Exists',
'warning.duplicate_file.message': 'The file "{fileName}" already exists with identical content. The existing file will be reused.',
- // Chat Playground Page
- 'chatPlayground.title': 'Chat Playground',
- 'chatPlayground.description': 'Workflow execution and chat interaction',
- 'chatPlayground.subtitle': 'Chat-based workflow control',
-
// Automations Page
'automations.title': 'Automations',
'automations.description': 'Manage workflow automations',
diff --git a/src/locales/fr.ts b/src/locales/fr.ts
index 83f8b06..9c396fa 100644
--- a/src/locales/fr.ts
+++ b/src/locales/fr.ts
@@ -718,11 +718,6 @@ export default {
'warning.duplicate_file.title': 'Fichier DΓ©jΓ Existant',
'warning.duplicate_file.message': 'Le fichier "{fileName}" existe dΓ©jΓ avec un contenu identique. Le fichier existant sera rΓ©utilisΓ©.',
- // Chat Playground Page
- 'chatPlayground.title': 'Chat Playground',
- 'chatPlayground.description': 'ExΓ©cution de workflow et interaction chat',
- 'chatPlayground.subtitle': 'ContrΓ΄le des workflows par chat',
-
// Automations Page
'automations.title': 'Automatisations',
'automations.description': 'GΓ©rer les automatisations de workflow',
diff --git a/src/pages/FeatureView.tsx b/src/pages/FeatureView.tsx
index c0a29bc..56deae2 100644
--- a/src/pages/FeatureView.tsx
+++ b/src/pages/FeatureView.tsx
@@ -27,14 +27,13 @@ import { ChatbotConversationsView } from './views/chatbot/ChatbotConversationsVi
// RealEstate Views
import { RealEstatePekView, RealEstateInstanceRolesPlaceholder } from './views/realestate';
-// Chat Playground Views (reusing existing workflow pages)
-import { PlaygroundPage, WorkflowsPage } from './workflows';
-
// Automation Views
import { AutomationDefinitionsView, AutomationTemplatesView, AutomationLogsView } from './views/automation';
-// CodeEditor Views
-import { CodeEditorPage, CodeEditorWorkflowsPage } from './views/codeeditor';
+// Workspace Views
+import { WorkspacePage } from './views/workspace/WorkspacePage';
+import { WorkspaceEditorPage } from './views/workspace/WorkspaceEditorPage';
+import { WorkspaceSettingsPage } from './views/workspace/WorkspaceSettingsPage';
// Teamsbot Views
import { TeamsbotDashboardView } from './views/teamsbot/TeamsbotDashboardView';
@@ -124,18 +123,15 @@ const VIEW_COMPONENTS: Record> = {
dashboard: RealEstatePekView,
'instance-roles': RealEstateInstanceRolesPlaceholder,
},
- chatplayground: {
- playground: PlaygroundPage,
- workflows: WorkflowsPage,
- },
automation: {
definitions: AutomationDefinitionsView,
templates: AutomationTemplatesView,
logs: AutomationLogsView,
},
- codeeditor: {
- editor: CodeEditorPage,
- workflows: CodeEditorWorkflowsPage,
+ workspace: {
+ dashboard: WorkspacePage,
+ editor: WorkspaceEditorPage,
+ settings: WorkspaceSettingsPage,
},
teamsbot: {
dashboard: TeamsbotDashboardView,
@@ -199,6 +195,12 @@ export const FeatureViewPage: React.FC = ({ view }) => {
return ;
}
+ // Workspace dashboard is rendered persistently by WorkspaceKeepAlive at MainLayout level;
+ // other workspace views (e.g. settings, editor) use the standard FeatureViewPage rendering.
+ if (featureCode === 'workspace' && view !== 'settings' && view !== 'editor') {
+ return null;
+ }
+
// View-Komponente finden
const featureViews = VIEW_COMPONENTS[featureCode];
if (!featureViews) {
diff --git a/src/pages/Login.module.css b/src/pages/Login.module.css
index 4394f61..a66ca81 100644
--- a/src/pages/Login.module.css
+++ b/src/pages/Login.module.css
@@ -1,16 +1,21 @@
.container {
display: flex;
- min-height: 100vh;
-
+ min-height: 100dvh;
font-family: "DM Sans", sans-serif;
color: var(--color-bg);
}
+@supports not (min-height: 100dvh) {
+ .container {
+ min-height: 100vh;
+ }
+}
+
.mainContent {
flex: 1;
display: flex;
flex-direction: column;
- padding: 3rem;
+ padding: 2.5rem 2rem;
background-color: var(--color-bg);
}
@@ -18,39 +23,28 @@
display: flex;
flex-direction: column;
align-items: center;
+ width: 100%;
flex: 1;
}
-.logoText {
-
- font-size: 35px;
+.logo {
display: flex;
+ justify-content: center;
align-items: center;
- letter-spacing: -0.5px;
- font-weight: 200;
+ width: 100%;
}
-.logoPower {
- color: var(--color-text);
-}
-
-.logoOn {
- color: var(--color-secondary);
- font-weight: 700;
-}
-
-.logo img {
- height: 40px;
+.logoImage {
+ height: 44px;
+ width: auto;
+ object-fit: contain;
}
.loginBox {
-
-
background-color: var(--color-bg);
- width: 25%;
+ width: min(100%, 460px);
height: auto;
-
- margin-top: 5%;
+ margin-top: 2rem;
padding: 2rem;
border-radius: 25px;
@@ -297,3 +291,41 @@ button:disabled {
.passwordResetLink .textButton:hover {
color: var(--color-secondary);
}
+
+@media (max-width: 768px) {
+ .mainContent {
+ padding: 1rem;
+ }
+
+ .logoImage {
+ height: 40px;
+ }
+
+ .loginBox {
+ width: 100%;
+ margin-top: 1.25rem;
+ padding: 1.25rem;
+ border-radius: 20px;
+ }
+
+ .registerLink {
+ flex-wrap: wrap;
+ text-align: center;
+ }
+}
+
+@media (max-width: 420px) {
+ .mainContent {
+ padding: 0.75rem;
+ }
+
+ .loginBox {
+ padding: 1rem;
+ border-radius: 16px;
+ }
+
+ .input,
+ .button {
+ height: 48px;
+ }
+}
diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx
index d06bca0..f5673ee 100644
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@@ -108,10 +108,11 @@ function Login() {
-
- Power
- On
-
+
diff --git a/src/pages/PasswordResetRequest.module.css b/src/pages/PasswordResetRequest.module.css
index b5fcf44..7b12a8b 100644
--- a/src/pages/PasswordResetRequest.module.css
+++ b/src/pages/PasswordResetRequest.module.css
@@ -1,16 +1,21 @@
.container {
display: flex;
- min-height: 100vh;
-
+ min-height: 100dvh;
font-family: "DM Sans", sans-serif;
color: var(--color-bg);
}
+@supports not (min-height: 100dvh) {
+ .container {
+ min-height: 100vh;
+ }
+}
+
.mainContent {
flex: 1;
display: flex;
flex-direction: column;
- padding: 3rem;
+ padding: 2.5rem 2rem;
background-color: var(--color-bg);
}
@@ -18,39 +23,28 @@
display: flex;
flex-direction: column;
align-items: center;
+ width: 100%;
flex: 1;
}
-.logoText {
-
- font-size: 35px;
+.logo {
display: flex;
+ justify-content: center;
align-items: center;
- letter-spacing: -0.5px;
- font-weight: 200;
+ width: 100%;
}
-.logoPower {
- color: var(--color-text);
-}
-
-.logoOn {
- color: var(--color-secondary);
- font-weight: 700;
-}
-
-.logo img {
- height: 40px;
+.logoImage {
+ height: 44px;
+ width: auto;
+ object-fit: contain;
}
.loginBox {
-
-
background-color: var(--color-bg);
- width: 25%;
+ width: min(100%, 460px);
height: auto;
-
- margin-top: 5%;
+ margin-top: 2rem;
padding: 2rem;
border-radius: 25px;
@@ -240,3 +234,41 @@ button:disabled {
.infoMessage p {
margin: 0;
}
+
+@media (max-width: 768px) {
+ .mainContent {
+ padding: 1rem;
+ }
+
+ .logoImage {
+ height: 40px;
+ }
+
+ .loginBox {
+ width: 100%;
+ margin-top: 1.25rem;
+ padding: 1.25rem;
+ border-radius: 20px;
+ }
+
+ .registerLink {
+ flex-wrap: wrap;
+ text-align: center;
+ }
+}
+
+@media (max-width: 420px) {
+ .mainContent {
+ padding: 0.75rem;
+ }
+
+ .loginBox {
+ padding: 1rem;
+ border-radius: 16px;
+ }
+
+ .input,
+ .button {
+ height: 48px;
+ }
+}
diff --git a/src/pages/PasswordResetRequest.tsx b/src/pages/PasswordResetRequest.tsx
index 6923655..74e4bc0 100644
--- a/src/pages/PasswordResetRequest.tsx
+++ b/src/pages/PasswordResetRequest.tsx
@@ -54,10 +54,11 @@ function PasswordResetRequest() {
-
- Power
- On
-
+
diff --git a/src/pages/Register.module.css b/src/pages/Register.module.css
index e42373d..a0350a7 100644
--- a/src/pages/Register.module.css
+++ b/src/pages/Register.module.css
@@ -1,16 +1,21 @@
.container {
display: flex;
- min-height: 100vh;
-
+ min-height: 100dvh;
font-family: "DM Sans", sans-serif;
color: var(--color-bg);
}
+@supports not (min-height: 100dvh) {
+ .container {
+ min-height: 100vh;
+ }
+}
+
.mainContent {
flex: 1;
display: flex;
flex-direction: column;
- padding: 3rem;
+ padding: 2.5rem 2rem;
background-color: var(--color-bg);
}
@@ -18,39 +23,28 @@
display: flex;
flex-direction: column;
align-items: center;
+ width: 100%;
flex: 1;
}
-.logoText {
-
- font-size: 35px;
+.logo {
display: flex;
+ justify-content: center;
align-items: center;
- letter-spacing: -0.5px;
- font-weight: 200;
+ width: 100%;
}
-.logoPower {
- color: var(--color-text);
-}
-
-.logoOn {
- color: var(--color-secondary);
- font-weight: 700;
-}
-
-.logo img {
- height: 40px;
+.logoImage {
+ height: 44px;
+ width: auto;
+ object-fit: contain;
}
.loginBox {
-
-
background-color: var(--color-bg);
- width: 25%;
+ width: min(100%, 460px);
height: auto;
-
- margin-top: 5%;
+ margin-top: 2rem;
padding: 2rem;
border-radius: 25px;
@@ -273,3 +267,41 @@ button:disabled {
.infoMessage p {
margin: 0;
}
+
+@media (max-width: 768px) {
+ .mainContent {
+ padding: 1rem;
+ }
+
+ .logoImage {
+ height: 40px;
+ }
+
+ .loginBox {
+ width: 100%;
+ margin-top: 1.25rem;
+ padding: 1.25rem;
+ border-radius: 20px;
+ }
+
+ .registerLink {
+ flex-wrap: wrap;
+ text-align: center;
+ }
+}
+
+@media (max-width: 420px) {
+ .mainContent {
+ padding: 0.75rem;
+ }
+
+ .loginBox {
+ padding: 1rem;
+ border-radius: 16px;
+ }
+
+ .input,
+ .button {
+ height: 48px;
+ }
+}
diff --git a/src/pages/Register.tsx b/src/pages/Register.tsx
index a3c1403..8c71330 100644
--- a/src/pages/Register.tsx
+++ b/src/pages/Register.tsx
@@ -137,10 +137,11 @@ function Register() {
-
- Power
- On
-
+
diff --git a/src/pages/Reset.module.css b/src/pages/Reset.module.css
index 401c409..18bda8b 100644
--- a/src/pages/Reset.module.css
+++ b/src/pages/Reset.module.css
@@ -1,16 +1,21 @@
.container {
display: flex;
- min-height: 100vh;
-
+ min-height: 100dvh;
font-family: "DM Sans", sans-serif;
color: var(--color-bg);
}
+@supports not (min-height: 100dvh) {
+ .container {
+ min-height: 100vh;
+ }
+}
+
.mainContent {
flex: 1;
display: flex;
flex-direction: column;
- padding: 3rem;
+ padding: 2.5rem 2rem;
background-color: var(--color-bg);
}
@@ -18,39 +23,28 @@
display: flex;
flex-direction: column;
align-items: center;
+ width: 100%;
flex: 1;
}
-.logoText {
-
- font-size: 35px;
+.logo {
display: flex;
+ justify-content: center;
align-items: center;
- letter-spacing: -0.5px;
- font-weight: 200;
+ width: 100%;
}
-.logoPower {
- color: var(--color-text);
-}
-
-.logoOn {
- color: var(--color-secondary);
- font-weight: 700;
-}
-
-.logo img {
- height: 40px;
+.logoImage {
+ height: 44px;
+ width: auto;
+ object-fit: contain;
}
.loginBox {
-
-
background-color: var(--color-bg);
- width: 25%;
+ width: min(100%, 460px);
height: auto;
-
- margin-top: 5%;
+ margin-top: 2rem;
padding: 2rem;
border-radius: 25px;
@@ -234,3 +228,41 @@ button:disabled {
font-family: var(--font-family);
margin-bottom: 10px;
}
+
+@media (max-width: 768px) {
+ .mainContent {
+ padding: 1rem;
+ }
+
+ .logoImage {
+ height: 40px;
+ }
+
+ .loginBox {
+ width: 100%;
+ margin-top: 1.25rem;
+ padding: 1.25rem;
+ border-radius: 20px;
+ }
+
+ .registerLink {
+ flex-wrap: wrap;
+ text-align: center;
+ }
+}
+
+@media (max-width: 420px) {
+ .mainContent {
+ padding: 0.75rem;
+ }
+
+ .loginBox {
+ padding: 1rem;
+ border-radius: 16px;
+ }
+
+ .input,
+ .button {
+ height: 48px;
+ }
+}
diff --git a/src/pages/Reset.tsx b/src/pages/Reset.tsx
index 617ef01..6f9eb1a 100644
--- a/src/pages/Reset.tsx
+++ b/src/pages/Reset.tsx
@@ -96,10 +96,11 @@ function Reset() {
-
- Power
- On
-
+
@@ -135,10 +136,11 @@ function Reset() {
-
- Power
- On
-
+
diff --git a/src/pages/Store.tsx b/src/pages/Store.tsx
index dc9fb03..febcce3 100644
--- a/src/pages/Store.tsx
+++ b/src/pages/Store.tsx
@@ -7,7 +7,7 @@
*/
import React from 'react';
-import { FaCogs, FaComments, FaFileAlt, FaHeadset } from 'react-icons/fa';
+import { FaCogs, FaHeadset } from 'react-icons/fa';
import { useLanguage } from '../providers/language/LanguageContext';
import { useStore } from '../hooks/useStore';
import type { StoreFeature } from '../api/storeApi';
@@ -15,8 +15,6 @@ import styles from './Store.module.css';
const FEATURE_ICONS: Record
= {
automation: ,
- chatplayground: ,
- codeeditor: ,
teamsbot: ,
};
@@ -26,16 +24,6 @@ const FEATURE_DESCRIPTIONS: Record> = {
en: 'Create and manage automations to handle recurring tasks efficiently.',
fr: 'Creer et gerer des automatisations pour traiter efficacement les taches recurrentes.',
},
- chatplayground: {
- de: 'Teste und experimentiere mit AI-Chat-Modellen in einer interaktiven Umgebung.',
- en: 'Test and experiment with AI chat models in an interactive environment.',
- fr: 'Testez et experimentez avec des modeles de chat IA dans un environnement interactif.',
- },
- codeeditor: {
- de: 'AI-gestuetzter Editor fuer Text-Dateien mit Cursor-artigem Chat und Diff-Preview.',
- en: 'AI-powered editor for text files with Cursor-style chat and diff preview.',
- fr: 'Editeur de fichiers texte assiste par IA avec chat et apercu des modifications.',
- },
teamsbot: {
de: 'Integriere einen AI-Bot in deine Microsoft Teams Meetings und Channels.',
en: 'Integrate an AI bot into your Microsoft Teams meetings and channels.',
diff --git a/src/pages/admin/Admin.module.css b/src/pages/admin/Admin.module.css
index ccb0b9b..4fcc8df 100644
--- a/src/pages/admin/Admin.module.css
+++ b/src/pages/admin/Admin.module.css
@@ -88,6 +88,34 @@
border-color: var(--text-secondary);
}
+.googleButton {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ padding: 0.5rem 1rem;
+ background: #4285f4;
+ color: white;
+ border: none;
+ border-radius: 6px;
+ font-size: 0.875rem;
+ font-weight: 500;
+ cursor: pointer;
+ transition: background 0.2s, transform 0.1s;
+}
+
+.googleButton:hover {
+ background: #3367d6;
+}
+
+.googleButton:active {
+ transform: scale(0.98);
+}
+
+.googleButton:disabled {
+ opacity: 0.6;
+ cursor: not-allowed;
+}
+
/* Filter Section Styles */
.filterSection {
display: flex;
diff --git a/src/pages/basedata/ConnectionsPage.tsx b/src/pages/basedata/ConnectionsPage.tsx
index 0661fdb..9cd0b7e 100644
--- a/src/pages/basedata/ConnectionsPage.tsx
+++ b/src/pages/basedata/ConnectionsPage.tsx
@@ -221,7 +221,7 @@ export const ConnectionsPage: React.FC = () => {
{canCreate && (
<>