Skip to content

Commit 29ff7d6

Browse files
staredclaude
andcommitted
Clean up project configuration and remove unnecessary files
- Streamlined .gitignore to only essential entries (removed yarn, npm, Windows, IDE cruft) - Enhanced ESLint with strict rules: vue3-strongly-recommended, TypeScript recommended - Added Vue component ordering, naming, and formatting rules - Allowed console logs (useful for debugging) - Removed unnecessary public/webr-worker.js file (WebR provides its own worker) - Simplified WebR initialization to use default configuration - Fixed TypeScript types in useWebR composable - Components now follow proper Vue 3 SFC order (script, template, style) All linting passes with zero errors or warnings. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <[email protected]>
1 parent 43d56af commit 29ff7d6

File tree

9 files changed

+160
-179
lines changed

9 files changed

+160
-179
lines changed

.eslintrc.cjs

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,31 @@ require('@rushstack/eslint-patch/modern-module-resolution')
44
module.exports = {
55
root: true,
66
extends: [
7-
'plugin:vue/vue3-essential',
7+
'plugin:vue/vue3-strongly-recommended',
88
'eslint:recommended',
9-
'@vue/eslint-config-typescript',
9+
'@vue/eslint-config-typescript/recommended',
1010
'@vue/eslint-config-prettier/skip-formatting'
1111
],
1212
parserOptions: {
1313
ecmaVersion: 'latest'
1414
},
1515
rules: {
16-
'no-console': 'warn',
16+
'no-console': 'off',
1717
'no-debugger': 'error',
18+
'no-var': 'error',
19+
'prefer-const': 'error',
20+
'prefer-arrow-callback': 'error',
1821
'@typescript-eslint/no-unused-vars': 'error',
22+
'@typescript-eslint/no-explicit-any': 'warn',
1923
'vue/multi-word-component-names': 'off',
2024
'vue/no-unused-components': 'error',
21-
'vue/no-unused-vars': 'error'
25+
'vue/no-unused-vars': 'error',
26+
'vue/component-tags-order': ['error', {
27+
'order': ['script', 'template', 'style']
28+
}],
29+
'vue/block-tag-newline': 'error',
30+
'vue/component-name-in-template-casing': ['error', 'PascalCase'],
31+
'vue/define-props-declaration': 'error',
32+
'vue/no-empty-component-block': 'error'
2233
}
2334
}

.gitignore

Lines changed: 10 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,25 @@
1-
# Logs
2-
logs
3-
*.log
4-
npm-debug.log*
5-
yarn-debug.log*
6-
yarn-error.log*
7-
pnpm-debug.log*
8-
lerna-debug.log*
9-
1+
# Dependencies
102
node_modules
3+
4+
# Build output
115
dist
126
dist-ssr
13-
*.local
14-
15-
# Editor directories and files
16-
.vscode/*
17-
!.vscode/extensions.json
18-
.idea
19-
.DS_Store
20-
*.suo
21-
*.ntvs*
22-
*.njsproj
23-
*.sln
24-
*.sw?
257

268
# Environment variables
279
.env
2810
.env.local
29-
.env.development.local
30-
.env.test.local
31-
.env.production.local
3211

33-
# OS generated files
34-
Thumbs.db
35-
ehthumbs.db
12+
# Logs
13+
*.log
14+
pnpm-debug.log*
3615

37-
# Build output
38-
build/
39-
out/
16+
# Editor directories and files
17+
.vscode/*
18+
!.vscode/extensions.json
19+
.DS_Store
4020

4121
# Cache
42-
.cache/
43-
.vite/
4422
.eslintcache
4523

46-
# Temporary files
47-
temp/
48-
tmp/
49-
5024
# WebR cache
5125
cache/

public/webr-worker.js

Lines changed: 0 additions & 2 deletions
This file was deleted.

src/App.vue

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,3 @@
1-
<template>
2-
<div id="app">
3-
<header class="header">
4-
<h1 class="title">WebR ggplot2 & dplyr Demo</h1>
5-
<p class="subtitle">Interactive R data visualization and manipulation in the browser</p>
6-
</header>
7-
8-
<main class="main">
9-
<div class="container">
10-
<div class="sidebar">
11-
<div class="controls">
12-
<FileUpload @file-uploaded="handleFileUpload" @file-removed="handleFileRemoved" />
13-
<ExampleSelector @example-selected="handleExampleSelect" />
14-
<button @click="runCode" :disabled="!isReady || isLoading" class="run-button">
15-
{{ isLoading ? 'Running...' : 'Run Code' }}
16-
</button>
17-
</div>
18-
</div>
19-
20-
<div class="content">
21-
<div class="editor-section">
22-
<div class="section-header">
23-
<h2 class="section-title">R Code Editor</h2>
24-
</div>
25-
<CodeEditor v-model="code" />
26-
</div>
27-
28-
<div class="output-section">
29-
<OutputDisplay
30-
:messages="messages"
31-
:is-loading="isLoading"
32-
@clear="clearMessages"
33-
/>
34-
</div>
35-
</div>
36-
</div>
37-
</main>
38-
</div>
39-
</template>
40-
411
<script setup lang="ts">
422
import { ref, onMounted } from 'vue'
433
import CodeEditor from './components/CodeEditor.vue'
@@ -92,6 +52,46 @@ onMounted(() => {
9252
})
9353
</script>
9454

55+
<template>
56+
<div id="app">
57+
<header class="header">
58+
<h1 class="title">WebR ggplot2 & dplyr Demo</h1>
59+
<p class="subtitle">Interactive R data visualization and manipulation in the browser</p>
60+
</header>
61+
62+
<main class="main">
63+
<div class="container">
64+
<div class="sidebar">
65+
<div class="controls">
66+
<FileUpload @file-uploaded="handleFileUpload" @file-removed="handleFileRemoved" />
67+
<ExampleSelector @example-selected="handleExampleSelect" />
68+
<button @click="runCode" :disabled="!isReady || isLoading" class="run-button">
69+
{{ isLoading ? 'Running...' : 'Run Code' }}
70+
</button>
71+
</div>
72+
</div>
73+
74+
<div class="content">
75+
<div class="editor-section">
76+
<div class="section-header">
77+
<h2 class="section-title">R Code Editor</h2>
78+
</div>
79+
<CodeEditor v-model="code" />
80+
</div>
81+
82+
<div class="output-section">
83+
<OutputDisplay
84+
:messages="messages"
85+
:is-loading="isLoading"
86+
@clear="clearMessages"
87+
/>
88+
</div>
89+
</div>
90+
</div>
91+
</main>
92+
</div>
93+
</template>
94+
9595
<style scoped>
9696
#app {
9797
min-height: 100vh;

src/components/CodeEditor.vue

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,3 @@
1-
<template>
2-
<div class="code-editor">
3-
<div ref="editorRef" class="editor-container"></div>
4-
</div>
5-
</template>
6-
71
<script setup lang="ts">
82
import { ref, onMounted, onUnmounted, watch } from 'vue'
93
import * as monaco from 'monaco-editor'
@@ -64,6 +58,12 @@ onUnmounted(() => {
6458
})
6559
</script>
6660

61+
<template>
62+
<div class="code-editor">
63+
<div ref="editorRef" class="editor-container"></div>
64+
</div>
65+
</template>
66+
6767
<style scoped>
6868
.code-editor {
6969
height: 400px;

src/components/ExampleSelector.vue

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,3 @@
1-
<template>
2-
<div class="example-selector">
3-
<label for="example-select" class="label">Examples:</label>
4-
<select
5-
id="example-select"
6-
v-model="selectedExample"
7-
@change="handleExampleChange"
8-
class="select"
9-
>
10-
<option value="">Select an example...</option>
11-
<option v-for="example in examples" :key="example.id" :value="example.id">
12-
{{ example.title }}
13-
</option>
14-
</select>
15-
<div v-if="currentExample" class="example-info">
16-
<p class="description">{{ currentExample.description }}</p>
17-
</div>
18-
</div>
19-
</template>
20-
211
<script setup lang="ts">
222
import { ref, computed } from 'vue'
233
import { examples } from '@/data/examples'
@@ -40,6 +20,26 @@ const handleExampleChange = () => {
4020
}
4121
</script>
4222

23+
<template>
24+
<div class="example-selector">
25+
<label for="example-select" class="label">Examples:</label>
26+
<select
27+
id="example-select"
28+
v-model="selectedExample"
29+
@change="handleExampleChange"
30+
class="select"
31+
>
32+
<option value="">Select an example...</option>
33+
<option v-for="example in examples" :key="example.id" :value="example.id">
34+
{{ example.title }}
35+
</option>
36+
</select>
37+
<div v-if="currentExample" class="example-info">
38+
<p class="description">{{ currentExample.description }}</p>
39+
</div>
40+
</div>
41+
</template>
42+
4343
<style scoped>
4444
.example-selector {
4545
margin-bottom: 1rem;

src/components/FileUpload.vue

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,3 @@
1-
<template>
2-
<div class="file-upload">
3-
<div class="upload-area" @drop="handleDrop" @dragover.prevent @dragenter.prevent>
4-
<input
5-
ref="fileInputRef"
6-
type="file"
7-
accept=".csv"
8-
@change="handleFileSelect"
9-
class="file-input"
10-
/>
11-
<div class="upload-content">
12-
<svg class="upload-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor">
13-
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
14-
<polyline points="14,2 14,8 20,8" />
15-
<line x1="16" y1="13" x2="8" y2="13" />
16-
<line x1="16" y1="17" x2="8" y2="17" />
17-
<polyline points="10,9 9,9 8,9" />
18-
</svg>
19-
<div class="upload-text">
20-
<p class="primary-text">Drop CSV file here or click to browse</p>
21-
<p class="secondary-text">Supported format: .csv</p>
22-
</div>
23-
</div>
24-
</div>
25-
<div v-if="uploadedFile" class="uploaded-file">
26-
<div class="file-info">
27-
<span class="file-name">{{ uploadedFile.name }}</span>
28-
<button @click="removeFile" class="remove-btn">Remove</button>
29-
</div>
30-
</div>
31-
</div>
32-
</template>
33-
341
<script setup lang="ts">
352
import { ref } from 'vue'
363
import type { CsvData } from '@/types'
@@ -86,6 +53,39 @@ const removeFile = () => {
8653
}
8754
</script>
8855

56+
<template>
57+
<div class="file-upload">
58+
<div class="upload-area" @drop="handleDrop" @dragover.prevent @dragenter.prevent>
59+
<input
60+
ref="fileInputRef"
61+
type="file"
62+
accept=".csv"
63+
@change="handleFileSelect"
64+
class="file-input"
65+
/>
66+
<div class="upload-content">
67+
<svg class="upload-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor">
68+
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
69+
<polyline points="14,2 14,8 20,8" />
70+
<line x1="16" y1="13" x2="8" y2="13" />
71+
<line x1="16" y1="17" x2="8" y2="17" />
72+
<polyline points="10,9 9,9 8,9" />
73+
</svg>
74+
<div class="upload-text">
75+
<p class="primary-text">Drop CSV file here or click to browse</p>
76+
<p class="secondary-text">Supported format: .csv</p>
77+
</div>
78+
</div>
79+
</div>
80+
<div v-if="uploadedFile" class="uploaded-file">
81+
<div class="file-info">
82+
<span class="file-name">{{ uploadedFile.name }}</span>
83+
<button @click="removeFile" class="remove-btn">Remove</button>
84+
</div>
85+
</div>
86+
</div>
87+
</template>
88+
8989
<style scoped>
9090
.file-upload {
9191
width: 100%;

0 commit comments

Comments
 (0)