05ccebad8d
- Restore TS frontend source (canvas, tools, CRDT, components, services) - Keep 5 JSX components that TS code depends on (CADCanvas, LayerPanel, BlockLibrary, PluginRegistry, Toolbar) - Keep JS services (api.js, blockService.js) that components depend on - Fix vite/plugin-react version mismatch (downgrade to v4 for vite 6) - Add axios dependency - Skip tsc in build script (vite/esbuild handles transpilation) - Fix index.html lang=de, favicon path - Add vite proxy config for /api and /ws - Backend unchanged (already from deployed containers)
39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import './StatusBar.css';
|
|
|
|
const StatusBar: React.FC = () => {
|
|
// Mock status data
|
|
const coordinates = { x: 10.5, y: 20.3 };
|
|
const snapEnabled = true;
|
|
const activeLayer = 'Layer 1';
|
|
const units = 'mm';
|
|
|
|
return (
|
|
<div className="status-bar" role="status" aria-label="Application Status">
|
|
<div className="status-section coordinates">
|
|
<span className="status-label">Coordinates:</span>
|
|
<span className="status-value">X: {coordinates.x}, Y: {coordinates.y}</span>
|
|
</div>
|
|
<div className="status-section snap">
|
|
<span className="status-label">Snap:</span>
|
|
<button
|
|
className={`toggle-button ${snapEnabled ? 'enabled' : 'disabled'}`}
|
|
aria-pressed={snapEnabled}
|
|
aria-label={snapEnabled ? 'Snap enabled. Click to disable' : 'Snap disabled. Click to enable'}
|
|
>
|
|
{snapEnabled ? 'ON' : 'OFF'}
|
|
</button>
|
|
</div>
|
|
<div className="status-section layer">
|
|
<span className="status-label">Layer:</span>
|
|
<span className="status-value">{activeLayer}</span>
|
|
</div>
|
|
<div className="status-section units">
|
|
<span className="status-label">Units:</span>
|
|
<span className="status-value">{units}</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default StatusBar; |