feat: remove unused files

This commit is contained in:
Shivam Mishra
2025-06-10 17:32:18 +05:30
parent c645ba3922
commit 1503ddeda4
2 changed files with 0 additions and 155 deletions
@@ -1,49 +0,0 @@
import React, { useState } from 'react';
export const HelloWorld = () => {
const [count, setCount] = useState(0);
return (
<div style={{
padding: '20px',
border: '1px solid #ccc',
borderRadius: '8px',
fontFamily: 'Arial, sans-serif',
maxWidth: '300px',
margin: '20px auto',
textAlign: 'center'
}}>
<h2>Hello from Chatwoot React!</h2>
<p>Count: {count}</p>
<button
onClick={() => setCount(count + 1)}
style={{
padding: '10px 20px',
backgroundColor: '#007bff',
color: 'white',
border: 'none',
borderRadius: '4px',
cursor: 'pointer',
fontSize: '16px'
}}
>
Increment
</button>
<button
onClick={() => setCount(0)}
style={{
padding: '10px 20px',
backgroundColor: '#dc3545',
color: 'white',
border: 'none',
borderRadius: '4px',
cursor: 'pointer',
fontSize: '16px',
marginLeft: '10px'
}}
>
Reset
</button>
</div>
);
};
@@ -1,106 +0,0 @@
import React, { useEffect, useRef, useState } from 'react';
import { registerVueWebComponents } from '../vue-components/registerWebComponents';
export const VueWebComponentWrapper = ({
initialCount = 0,
title = 'Hello from Vue in React!',
color = '#42b883',
...otherProps
}) => {
const elementRef = useRef();
const [isReady, setIsReady] = useState(false);
const [currentCount, setCurrentCount] = useState(initialCount);
// Register Web Components on mount
useEffect(() => {
registerVueWebComponents();
setIsReady(true);
// Listen for custom events from Vue component
const handleCountChange = event => {
setCurrentCount(event.detail.count);
console.log('Vue component count changed:', event.detail.count);
};
document.addEventListener('vue-counter-changed', handleCountChange);
return () => {
document.removeEventListener('vue-counter-changed', handleCountChange);
};
}, []);
// Update Web Component properties when React props change
useEffect(() => {
if (!isReady || !elementRef.current) return;
const element = elementRef.current;
// Set properties on the Web Component
// Vue converts camelCase props to kebab-case attributes
element.setAttribute('initial-count', initialCount);
element.setAttribute('title', title);
element.setAttribute('color', color);
console.log('Updated Vue Web Component props:', {
initialCount,
title,
color,
});
}, [isReady, initialCount, title, color]);
if (!isReady) {
return (
<div
style={{
padding: '20px',
textAlign: 'center',
border: '1px dashed #ccc',
borderRadius: '8px',
color: '#666',
}}
>
Loading Vue Web Component...
</div>
);
}
return (
<div style={{ margin: '20px 0' }}>
<div
style={{
padding: '10px',
backgroundColor: '#f8f9fa',
borderRadius: '4px',
marginBottom: '10px',
fontSize: '14px',
color: '#666',
}}
>
<strong>React Wrapper Info:</strong> Current count tracked by React:{' '}
{currentCount}
</div>
{/* This is the Vue Web Component rendered inside React */}
<vue-hello-world
ref={elementRef}
initial-count={initialCount}
title={title}
color={color}
{...otherProps}
/>
<div
style={{
padding: '10px',
backgroundColor: '#e8f5e8',
borderRadius: '4px',
marginTop: '10px',
fontSize: '12px',
color: '#666',
}}
>
This Vue component is running as a Web Component inside React!
</div>
</div>
);
};