Spaces:
Running
Running
ucalyptus
commited on
Commit
·
737a286
0
Parent(s):
Initial commit: LinkedIn visualization dashboard
Browse files- .gitignore +15 -0
- README.md +27 -0
- index.html +88 -0
- linkedin_visualization.jsx +0 -0
.gitignore
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
# OS files
|
| 2 |
+
.DS_Store
|
| 3 |
+
Thumbs.db
|
| 4 |
+
|
| 5 |
+
# Editor files
|
| 6 |
+
.vscode/
|
| 7 |
+
.idea/
|
| 8 |
+
*.swp
|
| 9 |
+
*.swo
|
| 10 |
+
*~
|
| 11 |
+
|
| 12 |
+
# Logs
|
| 13 |
+
*.log
|
| 14 |
+
npm-debug.log*
|
| 15 |
+
|
README.md
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
---
|
| 2 |
+
title: CAN in BN Company Search
|
| 3 |
+
emoji: 🔍
|
| 4 |
+
colorFrom: blue
|
| 5 |
+
colorTo: purple
|
| 6 |
+
sdk: static
|
| 7 |
+
sdk_version: 3.0.0
|
| 8 |
+
app_file: index.html
|
| 9 |
+
pinned: false
|
| 10 |
+
license: mit
|
| 11 |
+
---
|
| 12 |
+
|
| 13 |
+
# CAN in BN Company Search
|
| 14 |
+
|
| 15 |
+
A LinkedIn profile visualization dashboard for analyzing company data and profiles.
|
| 16 |
+
|
| 17 |
+
## Features
|
| 18 |
+
|
| 19 |
+
- Interactive company search and filtering
|
| 20 |
+
- Visual data representation with charts
|
| 21 |
+
- Profile statistics and insights
|
| 22 |
+
- Company-based profile grouping
|
| 23 |
+
|
| 24 |
+
## Usage
|
| 25 |
+
|
| 26 |
+
The dashboard displays LinkedIn profile data with company-based analytics. Use the search functionality to filter companies and click on companies to view associated profiles.
|
| 27 |
+
|
index.html
ADDED
|
@@ -0,0 +1,88 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>LinkedIn Profile Dashboard - CAN in BN Company Search</title>
|
| 7 |
+
<style>
|
| 8 |
+
* {
|
| 9 |
+
margin: 0;
|
| 10 |
+
padding: 0;
|
| 11 |
+
box-sizing: border-box;
|
| 12 |
+
}
|
| 13 |
+
body {
|
| 14 |
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
| 15 |
+
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
| 16 |
+
sans-serif;
|
| 17 |
+
-webkit-font-smoothing: antialiased;
|
| 18 |
+
-moz-osx-font-smoothing: grayscale;
|
| 19 |
+
}
|
| 20 |
+
#root {
|
| 21 |
+
min-height: 100vh;
|
| 22 |
+
}
|
| 23 |
+
</style>
|
| 24 |
+
</head>
|
| 25 |
+
<body>
|
| 26 |
+
<div id="root"></div>
|
| 27 |
+
|
| 28 |
+
<!-- React and ReactDOM -->
|
| 29 |
+
<script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
|
| 30 |
+
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
|
| 31 |
+
|
| 32 |
+
<!-- Babel Standalone for JSX transformation -->
|
| 33 |
+
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
|
| 34 |
+
|
| 35 |
+
<!-- Recharts - using a version that works better with React 18 -->
|
| 36 |
+
<script src="https://unpkg.com/recharts@2.8.0/umd/Recharts.js"></script>
|
| 37 |
+
|
| 38 |
+
<!-- Setup globals for JSX compatibility -->
|
| 39 |
+
<script>
|
| 40 |
+
// Make React available globally
|
| 41 |
+
window.React = React;
|
| 42 |
+
window.ReactDOM = ReactDOM;
|
| 43 |
+
|
| 44 |
+
// Setup Recharts - check the actual structure
|
| 45 |
+
if (typeof Recharts !== 'undefined') {
|
| 46 |
+
window.Recharts = Recharts;
|
| 47 |
+
}
|
| 48 |
+
</script>
|
| 49 |
+
|
| 50 |
+
<!-- Icon wrapper for lucide-react compatibility -->
|
| 51 |
+
<script>
|
| 52 |
+
// Create icon components compatible with lucide-react API
|
| 53 |
+
const createIcon = (name, path) => {
|
| 54 |
+
return ({ size = 24, className = '' }) => {
|
| 55 |
+
return React.createElement('svg', {
|
| 56 |
+
width: size,
|
| 57 |
+
height: size,
|
| 58 |
+
viewBox: '0 0 24 24',
|
| 59 |
+
fill: 'none',
|
| 60 |
+
stroke: 'currentColor',
|
| 61 |
+
strokeWidth: 2,
|
| 62 |
+
strokeLinecap: 'round',
|
| 63 |
+
strokeLinejoin: 'round',
|
| 64 |
+
className: className
|
| 65 |
+
}, React.createElement('path', { d: path }));
|
| 66 |
+
};
|
| 67 |
+
};
|
| 68 |
+
|
| 69 |
+
// Icon paths from lucide - make them globally available
|
| 70 |
+
window.Search = createIcon('Search', 'M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z');
|
| 71 |
+
window.Users = createIcon('Users', 'M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2 M23 21v-2a4 4 0 00-3-3.87 M16 3.13a4 4 0 010 7.75');
|
| 72 |
+
window.Building2 = createIcon('Building2', 'M6 22V4a2 2 0 012-2h8a2 2 0 012 2v18z M6 12h12 M6 12V6h12v6 M6 12h12 M10 6h4 M10 10h4 M10 14h4 M10 18h4');
|
| 73 |
+
window.ArrowLeft = createIcon('ArrowLeft', 'M19 12H5M12 19l-7-7 7-7');
|
| 74 |
+
window.ExternalLink = createIcon('ExternalLink', 'M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6 M15 3h6v6 M10 14L21 3');
|
| 75 |
+
</script>
|
| 76 |
+
|
| 77 |
+
<!-- Main Component -->
|
| 78 |
+
<script type="text/babel" src="linkedin_visualization.jsx"></script>
|
| 79 |
+
|
| 80 |
+
<!-- App Initialization -->
|
| 81 |
+
<script type="text/babel">
|
| 82 |
+
const { createRoot } = ReactDOM;
|
| 83 |
+
const root = createRoot(document.getElementById('root'));
|
| 84 |
+
root.render(React.createElement(LinkedInProfileDashboard));
|
| 85 |
+
</script>
|
| 86 |
+
</body>
|
| 87 |
+
</html>
|
| 88 |
+
|
linkedin_visualization.jsx
ADDED
|
The diff for this file is too large to render.
See raw diff
|
|
|