diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json deleted file mode 100644 index 94f4329..0000000 --- a/.devcontainer/devcontainer.json +++ /dev/null @@ -1,52 +0,0 @@ -// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at: -// https://github.com/microsoft/vscode-dev-containers/tree/v0.245.2/containers/docker-existing-docker-compose -// If you want to run as a non-root user in the container, see .devcontainer/docker-compose.yml. -{ - "name": "Existing Docker Compose (Extend)", - - // Update the 'dockerComposeFile' list if you have more compose files or use different names. - // The .devcontainer/docker-compose.yml file contains any overrides you need/want to make. - "dockerComposeFile": [ - "../docker-compose.yml", - "docker-compose.yml" - ], - - // The 'service' property is the name of the service for the container that VS Code should - // use. Update this value and .devcontainer/docker-compose.yml to the real service name. - "service": "devcontainer", - - // The optional 'workspaceFolder' property is the path VS Code should open by default when - // connected. This is typically a file mount in .devcontainer/docker-compose.yml - "workspaceFolder": "/workspace", - "customizations": { - "vscode": { - "extensions": [ - "GitHub.copilot", - "rebornix.ruby", - "castwide.solargraph", - "znck.grammarly" - ], - "settings": { - "grammarly.files.include": [ - "**/*.txt", - "**/*.md" - ] - } - } - } - - // Use 'forwardPorts' to make a list of ports inside the container available locally. - // "forwardPorts": [], - - // Uncomment the next line if you want start specific services in your Docker Compose config. - // "runServices": [], - - // Uncomment the next line if you want to keep your containers running after VS Code shuts down. - // "shutdownAction": "none", - - // Uncomment the next line to run commands after the container is created - for example installing curl. - // "postCreateCommand": "apt-get update && apt-get install -y curl", - - // Uncomment to connect as a non-root user if you've added one. See https://aka.ms/vscode-remote/containers/non-root. - // "remoteUser": "vscode" -} diff --git a/.devcontainer/docker-compose.yml b/.devcontainer/docker-compose.yml deleted file mode 100644 index 73c1c9f..0000000 --- a/.devcontainer/docker-compose.yml +++ /dev/null @@ -1,38 +0,0 @@ -version: '3.8' -services: - # Update this to the name of the service you want to work with in your docker-compose.yml file - devcontainer: - # If you want add a non-root user to your Dockerfile, you can use the "remoteUser" - # property in devcontainer.json to cause VS Code its sub-processes (terminals, tasks, - # debugging) to execute as the user. Uncomment the next line if you want the entire - # container to run as this user instead. Note that, on Linux, you may need to - # ensure the UID and GID of the container user you create matches your local user. - # See https://aka.ms/vscode-remote/containers/non-root for details. - # - # user: vscode - - # Uncomment if you want to override the service's Dockerfile to one in the .devcontainer - # folder. Note that the path of the Dockerfile and context is relative to the *primary* - # docker-compose.yml file (the first in the devcontainer.json "dockerComposeFile" - # array). The sample below assumes your primary file is in the root of your project. - # - # build: - # context: . - # dockerfile: .devcontainer/Dockerfile - - volumes: - # Update this to wherever you want VS Code to mount the folder of your project - - .:/workspace:cached - - # Uncomment the next line to use Docker from inside the container. See https://aka.ms/vscode-remote/samples/docker-from-docker-compose for details. - # - /var/run/docker.sock:/var/run/docker.sock - - # Uncomment the next four lines if you will use a ptrace-based debugger like C++, Go, and Rust. - # cap_add: - # - SYS_PTRACE - # security_opt: - # - seccomp:unconfined - - # Overrides default command so things don't shut down after the process ends. - command: /bin/sh -c "while sleep 1000; do :; done" - diff --git a/.github/workflows/coding-style-check.yml b/.github/workflows/coding-style-check.yml index b3ac12e..c2a02ba 100644 --- a/.github/workflows/coding-style-check.yml +++ b/.github/workflows/coding-style-check.yml @@ -1,37 +1,37 @@ -name: Coding Style Check +name: coding-style-check + on: - pull_request: push: branches: + - main - develop + pull_request: + branches: - main + - develop jobs: - coding-style-check: + standardrb: runs-on: ubuntu-latest - timeout-minutes: 30 + steps: - - name: Checkout - uses: actions/checkout@v4 + - uses: actions/checkout@v3 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v2 - - name: Restore Cache - uses: actions/cache@v4 - id: bundle_cache_id - env: - cache-name: cache-bundle + - name: Cache Docker layers + uses: actions/cache@v3 with: - path: ./vendor/bundle - key: ${{ runner.os }}-gem-${{ hashFiles('**/Gemfile.lock') }} + path: /tmp/.buildx-cache + key: ${{ runner.os }}-buildx-${{ github.sha }} restore-keys: | - ${{ runner.os }}-gem-${{ env.cache-name }}- - ${{ runner.os }}-gem- - ${{ runner.os }}- + ${{ runner.os }}-buildx- - - name: Install Packages - shell: bash + - name: Install dependencies run: | - docker compose -f docker-compose.ci.yml run --rm app bundle install --jobs=16 - docker compose -f docker-compose.ci.yml run --rm app bundle clean --force + docker compose -f compose.ci.yml run --rm app bundle install --jobs=16 + docker compose -f compose.ci.yml run --rm app bundle clean --force - - name: Run Linter - run: docker compose -f docker-compose.ci.yml run --rm app bundle exec standardrb + - name: Run standardrb + run: docker compose -f compose.ci.yml run --rm app bundle exec standardrb diff --git a/.github/workflows/run-test.yml b/.github/workflows/run-test.yml index 95c3903..d61b4b4 100644 --- a/.github/workflows/run-test.yml +++ b/.github/workflows/run-test.yml @@ -1,47 +1,47 @@ -name: Run Test +name: test + on: - pull_request: push: branches: + - main - develop + pull_request: + branches: - main + - develop jobs: - run-test: + test: runs-on: ubuntu-latest - timeout-minutes: 30 + steps: - - name: Checkout - uses: actions/checkout@v4 - - - name: Restore Cache - uses: actions/cache@v4 - id: bundle_cache_id - env: - cache-name: cache-bundle + - uses: actions/checkout@v3 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v2 + + - name: Cache Docker layers + uses: actions/cache@v3 with: - path: ./vendor/bundle - key: ${{ runner.os }}-gem-${{ hashFiles('**/Gemfile.lock') }} + path: /tmp/.buildx-cache + key: ${{ runner.os }}-buildx-${{ github.sha }} restore-keys: | - ${{ runner.os }}-gem-${{ env.cache-name }}- - ${{ runner.os }}-gem- - ${{ runner.os }}- + ${{ runner.os }}-buildx- - - name: Up Docker Container - run: docker compose -f docker-compose.ci.yml up -d + - name: Start containers + run: docker compose -f compose.ci.yml up -d - - name: Install Packages - shell: bash + - name: Install dependencies run: | - docker compose -f docker-compose.ci.yml exec app bundle install --jobs=16 - docker compose -f docker-compose.ci.yml exec app bundle clean --force + docker compose -f compose.ci.yml exec app bundle install --jobs=16 + docker compose -f compose.ci.yml exec app bundle clean --force - - name: Setup DB + - name: Setup database run: | - docker compose -f docker-compose.ci.yml exec app sh -c "cd ./spec/dummy && bundle exec rails db:setup" + docker compose -f compose.ci.yml exec app sh -c "cd ./spec/dummy && bundle exec rails db:setup" - - name: Run Test - run: docker compose -f docker-compose.ci.yml exec app bundle exec rspec + - name: Run tests + run: docker compose -f compose.ci.yml exec app bundle exec rspec - - name: Down Docker Container - run: docker compose -f docker-compose.ci.yml down + - name: Stop containers + run: docker compose -f compose.ci.yml down diff --git a/Gemfile b/Gemfile index e4a3baf..3bfba4f 100644 --- a/Gemfile +++ b/Gemfile @@ -7,3 +7,4 @@ gemspec gem "bump" gem "rake" gem "solargraph" +gem "nio4r", "~> 2.7.0" diff --git a/Gemfile.lock b/Gemfile.lock index aab0229..fd481fa 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,118 +1,116 @@ PATH remote: . specs: - rails-mermaid_erd (0.5.1) + rails-mermaid_erd (0.6.0) rails (>= 5.2) GEM remote: https://rubygems.org/ specs: - actioncable (7.1.4.1) - actionpack (= 7.1.4.1) - activesupport (= 7.1.4.1) + actioncable (8.0.1) + actionpack (= 8.0.1) + activesupport (= 8.0.1) nio4r (~> 2.0) websocket-driver (>= 0.6.1) zeitwerk (~> 2.6) - actionmailbox (7.1.4.1) - actionpack (= 7.1.4.1) - activejob (= 7.1.4.1) - activerecord (= 7.1.4.1) - activestorage (= 7.1.4.1) - activesupport (= 7.1.4.1) - mail (>= 2.7.1) - net-imap - net-pop - net-smtp - actionmailer (7.1.4.1) - actionpack (= 7.1.4.1) - actionview (= 7.1.4.1) - activejob (= 7.1.4.1) - activesupport (= 7.1.4.1) - mail (~> 2.5, >= 2.5.4) - net-imap - net-pop - net-smtp + actionmailbox (8.0.1) + actionpack (= 8.0.1) + activejob (= 8.0.1) + activerecord (= 8.0.1) + activestorage (= 8.0.1) + activesupport (= 8.0.1) + mail (>= 2.8.0) + actionmailer (8.0.1) + actionpack (= 8.0.1) + actionview (= 8.0.1) + activejob (= 8.0.1) + activesupport (= 8.0.1) + mail (>= 2.8.0) rails-dom-testing (~> 2.2) - actionpack (7.1.4.1) - actionview (= 7.1.4.1) - activesupport (= 7.1.4.1) + actionpack (8.0.1) + actionview (= 8.0.1) + activesupport (= 8.0.1) nokogiri (>= 1.8.5) - racc rack (>= 2.2.4) rack-session (>= 1.0.1) rack-test (>= 0.6.3) rails-dom-testing (~> 2.2) rails-html-sanitizer (~> 1.6) - actiontext (7.1.4.1) - actionpack (= 7.1.4.1) - activerecord (= 7.1.4.1) - activestorage (= 7.1.4.1) - activesupport (= 7.1.4.1) + useragent (~> 0.16) + actiontext (8.0.1) + actionpack (= 8.0.1) + activerecord (= 8.0.1) + activestorage (= 8.0.1) + activesupport (= 8.0.1) globalid (>= 0.6.0) nokogiri (>= 1.8.5) - actionview (7.1.4.1) - activesupport (= 7.1.4.1) + actionview (8.0.1) + activesupport (= 8.0.1) builder (~> 3.1) erubi (~> 1.11) rails-dom-testing (~> 2.2) rails-html-sanitizer (~> 1.6) - activejob (7.1.4.1) - activesupport (= 7.1.4.1) + activejob (8.0.1) + activesupport (= 8.0.1) globalid (>= 0.3.6) - activemodel (7.1.4.1) - activesupport (= 7.1.4.1) - activerecord (7.1.4.1) - activemodel (= 7.1.4.1) - activesupport (= 7.1.4.1) + activemodel (8.0.1) + activesupport (= 8.0.1) + activerecord (8.0.1) + activemodel (= 8.0.1) + activesupport (= 8.0.1) timeout (>= 0.4.0) - activestorage (7.1.4.1) - actionpack (= 7.1.4.1) - activejob (= 7.1.4.1) - activerecord (= 7.1.4.1) - activesupport (= 7.1.4.1) + activestorage (8.0.1) + actionpack (= 8.0.1) + activejob (= 8.0.1) + activerecord (= 8.0.1) + activesupport (= 8.0.1) marcel (~> 1.0) - activesupport (7.1.4.1) + activesupport (8.0.1) base64 + benchmark (>= 0.3) bigdecimal - concurrent-ruby (~> 1.0, >= 1.0.2) + concurrent-ruby (~> 1.0, >= 1.3.1) connection_pool (>= 2.2.5) drb i18n (>= 1.6, < 2) + logger (>= 1.4.2) minitest (>= 5.1) - mutex_m - tzinfo (~> 2.0) + securerandom (>= 0.3) + tzinfo (~> 2.0, >= 2.0.5) + uri (>= 0.13.1) ast (2.4.2) backport (1.2.0) base64 (0.2.0) - benchmark (0.3.0) - bigdecimal (3.1.8) + benchmark (0.4.0) + bigdecimal (3.1.9) builder (3.3.0) bump (0.10.0) concurrent-ruby (1.3.4) connection_pool (2.4.1) crass (1.0.6) - date (3.4.0) + date (3.4.1) diff-lcs (1.5.1) docile (1.4.0) drb (2.2.1) e2mmap (0.1.0) - erubi (1.13.0) + erubi (1.13.1) globalid (1.2.1) activesupport (>= 6.1) i18n (1.14.6) concurrent-ruby (~> 1.0) - io-console (0.7.2) - irb (1.14.1) + io-console (0.8.0) + irb (1.14.3) rdoc (>= 4.0.0) reline (>= 0.4.2) jaro_winkler (1.6.0) - json (2.8.2) + json (2.9.1) kramdown (2.4.0) rexml kramdown-parser-gfm (1.1.0) kramdown (~> 2.0) language_server-protocol (3.17.0.3) lint_roller (1.1.0) + logger (1.6.4) loofah (2.23.1) crass (~> 1.0.2) nokogiri (>= 1.12.0) @@ -121,11 +119,10 @@ GEM net-imap net-pop net-smtp - marcel (1.0.2) + marcel (1.0.4) mini_mime (1.1.5) - minitest (5.25.2) - mutex_m (0.3.0) - net-imap (0.5.1) + minitest (5.25.4) + net-imap (0.5.4) date net-protocol net-pop (0.1.2) @@ -134,55 +131,58 @@ GEM timeout net-smtp (0.5.0) net-protocol - nio4r (2.5.8) - nokogiri (1.16.7-aarch64-linux) + nio4r (2.7.4) + nokogiri (1.18.0-aarch64-linux-musl) racc (~> 1.4) - nokogiri (1.16.7-arm64-darwin) + nokogiri (1.18.0-arm64-darwin) racc (~> 1.4) - nokogiri (1.16.7-x86_64-darwin) + nokogiri (1.18.0-x86_64-darwin) racc (~> 1.4) - nokogiri (1.16.7-x86_64-linux) + nokogiri (1.18.0-x86_64-linux-gnu) + racc (~> 1.4) + nokogiri (1.18.0-x86_64-linux-musl) racc (~> 1.4) parallel (1.26.3) parser (3.3.6.0) ast (~> 2.4.1) racc - pg (1.5.8) - psych (5.2.0) + pg (1.5.9) + psych (5.2.2) + date stringio racc (1.8.1) rack (3.1.8) rack-session (2.0.0) rack (>= 3.0.0) - rack-test (2.1.0) + rack-test (2.2.0) rack (>= 1.3) rackup (2.2.1) rack (>= 3) - rails (7.1.4.1) - actioncable (= 7.1.4.1) - actionmailbox (= 7.1.4.1) - actionmailer (= 7.1.4.1) - actionpack (= 7.1.4.1) - actiontext (= 7.1.4.1) - actionview (= 7.1.4.1) - activejob (= 7.1.4.1) - activemodel (= 7.1.4.1) - activerecord (= 7.1.4.1) - activestorage (= 7.1.4.1) - activesupport (= 7.1.4.1) + rails (8.0.1) + actioncable (= 8.0.1) + actionmailbox (= 8.0.1) + actionmailer (= 8.0.1) + actionpack (= 8.0.1) + actiontext (= 8.0.1) + actionview (= 8.0.1) + activejob (= 8.0.1) + activemodel (= 8.0.1) + activerecord (= 8.0.1) + activestorage (= 8.0.1) + activesupport (= 8.0.1) bundler (>= 1.15.0) - railties (= 7.1.4.1) + railties (= 8.0.1) rails-dom-testing (2.2.0) activesupport (>= 5.0.0) minitest nokogiri (>= 1.6) - rails-html-sanitizer (1.6.0) + rails-html-sanitizer (1.6.2) loofah (~> 2.21) - nokogiri (~> 1.14) - railties (7.1.4.1) - actionpack (= 7.1.4.1) - activesupport (= 7.1.4.1) - irb + nokogiri (>= 1.15.7, != 1.16.7, != 1.16.6, != 1.16.5, != 1.16.4, != 1.16.3, != 1.16.2, != 1.16.1, != 1.16.0.rc1, != 1.16.0) + railties (8.0.1) + actionpack (= 8.0.1) + activesupport (= 8.0.1) + irb (~> 1.13) rackup (>= 1.0.0) rake (>= 12.2) thor (~> 1.0, >= 1.2.2) @@ -190,10 +190,10 @@ GEM rainbow (3.1.1) rake (13.2.1) rbs (2.8.4) - rdoc (6.8.1) + rdoc (6.10.0) psych (>= 4.0.0) - regexp_parser (2.9.2) - reline (0.5.11) + regexp_parser (2.10.0) + reline (0.6.0) io-console (~> 0.5) reverse_markdown (2.1.1) nokogiri @@ -215,22 +215,23 @@ GEM rspec-mocks (~> 3.13) rspec-support (~> 3.13) rspec-support (3.13.1) - rubocop (1.68.0) + rubocop (1.69.2) json (~> 2.3) language_server-protocol (>= 3.17.0) parallel (~> 1.10) parser (>= 3.3.0.2) rainbow (>= 2.2.2, < 4.0) - regexp_parser (>= 2.4, < 3.0) - rubocop-ast (>= 1.32.2, < 2.0) + regexp_parser (>= 2.9.3, < 3.0) + rubocop-ast (>= 1.36.2, < 2.0) ruby-progressbar (~> 1.7) - unicode-display_width (>= 2.4.0, < 3.0) - rubocop-ast (1.36.1) + unicode-display_width (>= 2.4.0, < 4.0) + rubocop-ast (1.37.0) parser (>= 3.3.1.0) - rubocop-performance (1.22.1) + rubocop-performance (1.23.0) rubocop (>= 1.48.1, < 2.0) rubocop-ast (>= 1.31.1, < 2.0) ruby-progressbar (1.13.0) + securerandom (0.4.1) simplecov (0.22.0) docile (~> 1.1) simplecov-html (~> 0.11) @@ -253,28 +254,32 @@ GEM thor (~> 1.0) tilt (~> 2.0) yard (~> 0.9, >= 0.9.24) - standard (1.42.1) + standard (1.43.0) language_server-protocol (~> 3.17.0.2) lint_roller (~> 1.0) - rubocop (~> 1.68.0) + rubocop (~> 1.69.1) standard-custom (~> 1.0.0) - standard-performance (~> 1.5) + standard-performance (~> 1.6) standard-custom (1.0.2) lint_roller (~> 1.0) rubocop (~> 1.50) - standard-performance (1.5.0) + standard-performance (1.6.0) lint_roller (~> 1.1) - rubocop-performance (~> 1.22.0) + rubocop-performance (~> 1.23.0) stringio (3.1.2) thor (1.3.2) tilt (2.3.0) - timeout (0.4.2) + timeout (0.4.3) tzinfo (2.0.6) concurrent-ruby (~> 1.0) tzinfo-data (1.2024.2) tzinfo (>= 1.0.0) - unicode-display_width (2.6.0) - websocket-driver (0.7.5) + unicode-display_width (3.1.3) + unicode-emoji (~> 4.0, >= 4.0.4) + unicode-emoji (4.0.4) + uri (1.0.2) + useragent (0.16.11) + websocket-driver (0.7.6) websocket-extensions (>= 0.1.0) websocket-extensions (0.1.5) yard (0.9.36) @@ -290,6 +295,7 @@ PLATFORMS DEPENDENCIES bump + nio4r (~> 2.7.0) pg rails-mermaid_erd! rake diff --git a/RELEASE.md b/RELEASE.md index 3f943b3..701bf83 100644 --- a/RELEASE.md +++ b/RELEASE.md @@ -23,7 +23,7 @@ bundle exec rspec cd /workspace/spec/dummy RAILS_ENV=test bundle exec rails mermaid_erd cp -f /workspace/spec/dummy/mermaid_erd/index.html /workspace/docs/example.html -chromium-browser --headless --disable-gpu --no-sandbox --window-size=1200,800 --hide-scrollbars --screenshot="/workspace/docs/screen_shot.png" /workspace/spec/dummy/mermaid_erd/index.html +chromium-browser --headless --disable-gpu --no-sandbox --window-size=1280,800 --hide-scrollbars --screenshot="/workspace/docs/screen_shot.png" /workspace/spec/dummy/mermaid_erd/index.html ``` in host machine: diff --git a/docker-compose.ci.yml b/compose.ci.yml similarity index 100% rename from docker-compose.ci.yml rename to compose.ci.yml diff --git a/docker-compose.yml b/compose.yml similarity index 79% rename from docker-compose.yml rename to compose.yml index deb9f4d..3fee2a9 100644 --- a/docker-compose.yml +++ b/compose.yml @@ -8,6 +8,13 @@ services: volumes: - .:/workspace - bundle_data:/usr/local/bundle + command: /bin/sh + tty: true + environment: + POSTGRES_HOST: db + POSTGRES_USER: test + POSTGRES_PASSWORD: test + RAILS_ENV: test db: container_name: rails-mermaid-erd-db diff --git a/docs/DEVELOPMENT.md b/docs/DEVELOPMENT.md new file mode 100644 index 0000000..836abc9 --- /dev/null +++ b/docs/DEVELOPMENT.md @@ -0,0 +1,211 @@ +# Rails Mermaid ERD Developer Documentation + +## Project Overview +Rails Mermaid ERD is a Ruby gem that generates Mermaid format ER diagrams from Ruby on Rails applications. The generated ERD can be copied in Markdown format for easy sharing on GitHub and can also be saved as images. + +## Technology Stack +### Backend +- Ruby on Rails (>= 5.2) +- PostgreSQL 14 (Test database) + +### Frontend +- Vue.js 3.2.40 +- Mermaid.js 9.1.7 (ERD generation) +- TailwindCSS 3.1.8 + - Forms plugin 0.5.2 + - Typography plugin 0.5.4 + +### Development Environment +- Docker/Docker Compose V2 +- Alpine Linux (Base container image) + +## Development Environment Setup + +### Prerequisites +- Docker +- Docker Compose V2 + +### Setup Instructions + +1. Clone the repository +```bash +git clone https://github.com/koedame/rails-mermaid_erd.git +cd rails-mermaid_erd +``` + +2. Build and start the Docker environment +```bash +docker compose up -d +``` + +Note: The initial build may take several minutes as it needs to install system dependencies in the Alpine Linux container. + +3. Setup the test database +```bash +# Create and migrate the test database for the dummy application +docker compose exec -w /workspace/spec/dummy devcontainer bundle exec rails db:create db:migrate RAILS_ENV=test +``` + +4. Run tests to verify the setup +```bash +docker compose exec devcontainer bundle exec rspec +``` + +If all tests pass and you see a coverage report, your development environment is ready. + +## Project Structure +- `/lib`: Main gem code + - `/lib/rails-mermaid_erd`: Core gem implementation + - `/lib/rails-mermaid_erd/version.rb`: Gem version definition +- `/spec`: Test files + - `/spec/dummy`: Test Rails application with sample models + - Contains User, Post, Comment, and other models for testing +- `/docs`: Documentation +- `/.github`: GitHub Actions configuration +- `/.devcontainer`: Development container settings + +## Dependencies +### Production +- rails (>= 5.2) + +### Development +- pg (PostgreSQL client) +- rspec-rails (Testing framework) +- simplecov (Code coverage) +- standard (Code style) +- tzinfo-data (Timezone data) + +## Docker Configuration +The project includes several Docker-related files: +- `compose.yml`: Main development environment configuration + - `devcontainer`: Ruby development environment (Alpine Linux based) + - `db`: PostgreSQL 14 database for testing +- `compose.ci.yml`: CI environment configuration +- `Dockerfile`: Development container definition +- `Dockerfile.ci`: CI container definition + +### Database Configuration +The test database is configured with the following credentials: +- Host: `db` +- User: `test` +- Password: `test` +- Database: `dummy_test` (for the dummy Rails application) + +### Environment Variables +The following environment variables are automatically set in the development container: +- `POSTGRES_HOST`: db +- `POSTGRES_USER`: test +- `POSTGRES_PASSWORD`: test +- `RAILS_ENV`: test + +### Common Docker Commands +```bash +# Start the development environment +docker compose up -d + +# View logs +docker compose logs -f + +# Stop the environment +docker compose down + +# Rebuild containers +docker compose build --no-cache + +# Run tests in container +docker compose exec devcontainer bundle exec rspec + +# Access container shell +docker compose exec devcontainer +``` + +## Development Workflow +1. Make changes to the gem code in `/lib` +2. Write tests in `/spec` +3. Run tests to verify changes +4. Update documentation if necessary + +### Testing +The gem includes a dummy Rails application in `/spec/dummy` for testing purposes. This application includes several models (User, Post, Comment, etc.) to test the ERD generation functionality. + +To run the tests: +```bash +docker compose exec devcontainer bundle exec rspec +``` + +The test suite includes coverage reporting via SimpleCov. The coverage report will be generated in the `/coverage` directory. + +## License +This project is released under the MIT License. + +## Contributing +1. Fork the repository +2. Create your feature branch (`git checkout -b feature/amazing-feature`) +3. Commit your changes (`git commit -m 'Add some amazing feature'`) +4. Push to the branch (`git push origin feature/amazing-feature`) +5. Create a Pull Request + +## CI/CD +GitHub Actions automates the following checks: +- Test execution +- Code style verification +- Version management + +## Development Best Practices +1. Write tests before modifying code +2. Follow StandardRb coding conventions +3. Update documentation +4. Update CHANGELOG.md +5. Use English for all development communications: + - Pull Request titles and descriptions + - Issue titles and descriptions + - Commit messages + - Code comments and documentation + +## Troubleshooting + +### Common Issues + +1. Container fails to start or stops immediately +```bash +# Check the container logs +docker compose logs devcontainer +docker compose logs db +``` + +2. Database connection issues +```bash +# Verify the database is running +docker compose ps + +# Reset the database +docker compose exec -w /workspace/spec/dummy devcontainer bundle exec rails db:reset RAILS_ENV=test +``` + +3. Bundle install fails +```bash +# Remove the bundle volume and try again +docker compose down -v +docker compose up -d +docker compose exec devcontainer bundle install +``` + +### Full Environment Reset +If you encounter persistent issues, you can completely reset the development environment: + +```bash +# Remove all containers and volumes +docker compose down -v + +# Rebuild from scratch +docker compose up -d --build + +# Reinstall dependencies +docker compose exec devcontainer bundle install + +# Reset test database +docker compose exec -w /workspace/spec/dummy devcontainer bundle exec rails db:reset RAILS_ENV=test +``` + +## Contact +For issues or questions, please create a GitHub Issue. diff --git a/docs/example.html b/docs/example.html index d7fdf19..5e02d42 100644 --- a/docs/example.html +++ b/docs/example.html @@ -277,7 +277,20 @@

{{i18n[language]["models"]["title"]}}
-
+
+
+ +
+
+
+ {{i18n[language]["controls"]["movement"]}}: + {{i18n[language]["controls"]["space_drag"]}} / {{i18n[language]["controls"]["middle_drag"]}} +
+
+ {{i18n[language]["controls"]["zoom"]}}: + {{i18n[language]["controls"]["mouse_wheel"]}} / {{i18n[language]["controls"]["pinch"]}} +
+
@@ -294,7 +307,6 @@

{{i18n[language]["models"]["title"]}}

- @@ -303,7 +315,7 @@

{{i18n[language]["models"]["title"]}} @@ -349,6 +361,14 @@

{{i18n[language]["models"]["title"]}} erd: 'ERD', code: 'Code', }, + controls: { + movement: 'Movement', + zoom: 'Zoom', + space_drag: 'Space + Mouse Drag', + middle_drag: 'Middle Click + Drag', + mouse_wheel: 'Mouse Wheel', + pinch: 'Pinch In/Out', + } }, ja: { actions: { @@ -383,6 +403,14 @@

{{i18n[language]["models"]["title"]}} erd: 'ER図', code: 'コード', }, + controls: { + movement: '移動方法', + zoom: '拡大/縮小', + space_drag: 'スペースキー + マウスドラッグ', + middle_drag: '中クリック + ドラッグ', + mouse_wheel: 'マウスホイール', + pinch: 'ピンチイン/アウト', + } } } @@ -409,6 +437,155 @@

{{i18n[language]["models"]["title"]}} const posX = Vue.ref(0) const posY = Vue.ref(0) const zoomArea = Vue.ref(null) + // Manage space key press state + const isSpacePressed = Vue.ref(false) + // Manage dragging state + const isDragging = Vue.ref(false) + let startX = 0 + let startY = 0 + // Record distance between two touch points + let lastTouchDistance = 0 + // Record mouse position + let lastMouseX = 0 + let lastMouseY = 0 + + // Calculate distance between two touch points + const getDistance = (touches) => { + return Math.hypot( + touches[0].clientX - touches[1].clientX, + touches[0].clientY - touches[1].clientY + ) + } + + // Calculate center point of two touch positions + const getTouchCenter = (touches) => { + return { + x: (touches[0].clientX + touches[1].clientX) / 2, + y: (touches[0].clientY + touches[1].clientY) / 2 + } + } + + // Handle touch start + const handleTouchStart = (e) => { + if (e.touches.length === 2) { + e.preventDefault() + lastTouchDistance = getDistance(e.touches) + } + } + + // Handle touch move (pinch in/out for zoom) + const handleTouchMove = (e) => { + if (e.touches.length === 2) { + e.preventDefault() + const preview = document.getElementById('preview') + if (!preview.contains(e.target)) { + return + } + + const newDistance = getDistance(e.touches) + const delta = (newDistance - lastTouchDistance) * 0.01 + lastTouchDistance = newDistance + + const center = getTouchCenter(e.touches) + const rect = preview.getBoundingClientRect() + const touchX = center.x - rect.left + const touchY = center.y - rect.top + + const x = touchX / scale.value - posX.value + const y = touchY / scale.value - posY.value + + const newScale = Math.min(Math.max(scale.value + delta, 0.5), 3) + if (newScale === scale.value) return + + posX.value = touchX / newScale - x + posY.value = touchY / newScale - y + scale.value = newScale + } + } + + // Handle touch end + const handleTouchEnd = (e) => { + if (e.touches.length < 2) { + lastTouchDistance = 0 + } + } + + // Handle key down (space key for drag mode toggle) + const handleKeyDown = (e) => { + if (e.code === 'Space' && !isSpacePressed.value) { + if (document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA') { + return + } + isSpacePressed.value = true + e.preventDefault() + } + } + + // Handle key up + const handleKeyUp = (e) => { + if (e.code === 'Space') { + isSpacePressed.value = false + isDragging.value = false + } + } + + // Handle mouse down (start dragging) + const handleMouseDown = (e) => { + if (isSpacePressed.value || e.button === 1) { + isDragging.value = true + lastMouseX = e.clientX + lastMouseY = e.clientY + e.preventDefault() + } + } + + // Handle mouse move (movement while dragging) + const handleMouseMove = (e) => { + if (isDragging.value) { + const dx = (e.clientX - lastMouseX) / scale.value + const dy = (e.clientY - lastMouseY) / scale.value + posX.value += dx + posY.value += dy + lastMouseX = e.clientX + lastMouseY = e.clientY + e.preventDefault() + } + } + + // Handle mouse up (end dragging) + const handleMouseUp = (e) => { + if (e.button === 1) { + e.preventDefault() + } + isDragging.value = false + } + + // Handle mouse wheel (zoom) + const handleWheel = (e) => { + const preview = document.getElementById('preview') + if (!preview.contains(e.target)) { + return + } + + e.preventDefault() + + const rect = preview.getBoundingClientRect() + const mouseX = e.clientX - rect.left + const mouseY = e.clientY - rect.top + + // Calculate relative coordinates based on mouse position + const x = mouseX / scale.value - posX.value + const y = mouseY / scale.value - posY.value + + // Change scale + const delta = e.deltaY < 0 ? 0.1 : -0.1 + const newScale = Math.min(Math.max(scale.value + delta, 0.5), 3) + + // Calculate new position with new scale + posX.value = mouseX / newScale - x + posY.value = mouseY / newScale - y + scale.value = newScale + } const zoomStyle = Vue.computed(() => { return { @@ -660,6 +837,28 @@

{{i18n[language]["models"]["title"]}} setLanguage(window.navigator.language) restoreFromHash() reRender() + + window.addEventListener('keydown', handleKeyDown) + window.addEventListener('keyup', handleKeyUp) + window.addEventListener('mousedown', handleMouseDown) + window.addEventListener('mousemove', handleMouseMove) + window.addEventListener('mouseup', handleMouseUp) + window.addEventListener('wheel', handleWheel, { passive: false }) + window.addEventListener('touchstart', handleTouchStart, { passive: false }) + window.addEventListener('touchmove', handleTouchMove, { passive: false }) + window.addEventListener('touchend', handleTouchEnd) + }) + + Vue.onUnmounted(() => { + window.removeEventListener('keydown', handleKeyDown) + window.removeEventListener('keyup', handleKeyUp) + window.removeEventListener('mousedown', handleMouseDown) + window.removeEventListener('mousemove', handleMouseMove) + window.removeEventListener('mouseup', handleMouseUp) + window.removeEventListener('wheel', handleWheel) + window.removeEventListener('touchstart', handleTouchStart) + window.removeEventListener('touchmove', handleTouchMove) + window.removeEventListener('touchend', handleTouchEnd) }) window.addEventListener('hashchange', () => { @@ -703,7 +902,9 @@

{{i18n[language]["models"]["title"]}} moveUp, moveDown, moveLeft, - moveRight + moveRight, + isSpacePressed, + isDragging } } } diff --git a/docs/screen_shot.png b/docs/screen_shot.png index 432fc81..cd581ce 100644 Binary files a/docs/screen_shot.png and b/docs/screen_shot.png differ diff --git a/lib/rails-mermaid_erd/version.rb b/lib/rails-mermaid_erd/version.rb index 3eee736..df68779 100644 --- a/lib/rails-mermaid_erd/version.rb +++ b/lib/rails-mermaid_erd/version.rb @@ -1,3 +1,3 @@ module RailsMermaidErd - VERSION = "0.5.1" + VERSION = "0.6.0" end diff --git a/lib/templates/index.html.erb b/lib/templates/index.html.erb index 9cd2397..499d887 100644 --- a/lib/templates/index.html.erb +++ b/lib/templates/index.html.erb @@ -230,7 +230,20 @@
-
+
+
+ +
+
+
+ {{i18n[language]["controls"]["movement"]}}: + {{i18n[language]["controls"]["space_drag"]}} / {{i18n[language]["controls"]["middle_drag"]}} +
+
+ {{i18n[language]["controls"]["zoom"]}}: + {{i18n[language]["controls"]["mouse_wheel"]}} / {{i18n[language]["controls"]["pinch"]}} +
+
@@ -247,7 +260,6 @@
- @@ -302,6 +314,14 @@ erd: 'ERD', code: 'Code', }, + controls: { + movement: 'Movement', + zoom: 'Zoom', + space_drag: 'Space + Mouse Drag', + middle_drag: 'Middle Click + Drag', + mouse_wheel: 'Mouse Wheel', + pinch: 'Pinch In/Out', + } }, ja: { actions: { @@ -336,6 +356,14 @@ erd: 'ER図', code: 'コード', }, + controls: { + movement: '移動方法', + zoom: '拡大/縮小', + space_drag: 'スペースキー + マウスドラッグ', + middle_drag: '中クリック + ドラッグ', + mouse_wheel: 'マウスホイール', + pinch: 'ピンチイン/アウト', + } } } @@ -362,6 +390,155 @@ const posX = Vue.ref(0) const posY = Vue.ref(0) const zoomArea = Vue.ref(null) + // Manage space key press state + const isSpacePressed = Vue.ref(false) + // Manage dragging state + const isDragging = Vue.ref(false) + let startX = 0 + let startY = 0 + // Record distance between two touch points + let lastTouchDistance = 0 + // Record mouse position + let lastMouseX = 0 + let lastMouseY = 0 + + // Calculate distance between two touch points + const getDistance = (touches) => { + return Math.hypot( + touches[0].clientX - touches[1].clientX, + touches[0].clientY - touches[1].clientY + ) + } + + // Calculate center point of two touch positions + const getTouchCenter = (touches) => { + return { + x: (touches[0].clientX + touches[1].clientX) / 2, + y: (touches[0].clientY + touches[1].clientY) / 2 + } + } + + // Handle touch start + const handleTouchStart = (e) => { + if (e.touches.length === 2) { + e.preventDefault() + lastTouchDistance = getDistance(e.touches) + } + } + + // Handle touch move (pinch in/out for zoom) + const handleTouchMove = (e) => { + if (e.touches.length === 2) { + e.preventDefault() + const preview = document.getElementById('preview') + if (!preview.contains(e.target)) { + return + } + + const newDistance = getDistance(e.touches) + const delta = (newDistance - lastTouchDistance) * 0.01 + lastTouchDistance = newDistance + + const center = getTouchCenter(e.touches) + const rect = preview.getBoundingClientRect() + const touchX = center.x - rect.left + const touchY = center.y - rect.top + + const x = touchX / scale.value - posX.value + const y = touchY / scale.value - posY.value + + const newScale = Math.min(Math.max(scale.value + delta, 0.5), 3) + if (newScale === scale.value) return + + posX.value = touchX / newScale - x + posY.value = touchY / newScale - y + scale.value = newScale + } + } + + // Handle touch end + const handleTouchEnd = (e) => { + if (e.touches.length < 2) { + lastTouchDistance = 0 + } + } + + // Handle key down (space key for drag mode toggle) + const handleKeyDown = (e) => { + if (e.code === 'Space' && !isSpacePressed.value) { + if (document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA') { + return + } + isSpacePressed.value = true + e.preventDefault() + } + } + + // Handle key up + const handleKeyUp = (e) => { + if (e.code === 'Space') { + isSpacePressed.value = false + isDragging.value = false + } + } + + // Handle mouse down (start dragging) + const handleMouseDown = (e) => { + if (isSpacePressed.value || e.button === 1) { + isDragging.value = true + lastMouseX = e.clientX + lastMouseY = e.clientY + e.preventDefault() + } + } + + // Handle mouse move (movement while dragging) + const handleMouseMove = (e) => { + if (isDragging.value) { + const dx = (e.clientX - lastMouseX) / scale.value + const dy = (e.clientY - lastMouseY) / scale.value + posX.value += dx + posY.value += dy + lastMouseX = e.clientX + lastMouseY = e.clientY + e.preventDefault() + } + } + + // Handle mouse up (end dragging) + const handleMouseUp = (e) => { + if (e.button === 1) { + e.preventDefault() + } + isDragging.value = false + } + + // Handle mouse wheel (zoom) + const handleWheel = (e) => { + const preview = document.getElementById('preview') + if (!preview.contains(e.target)) { + return + } + + e.preventDefault() + + const rect = preview.getBoundingClientRect() + const mouseX = e.clientX - rect.left + const mouseY = e.clientY - rect.top + + // Calculate relative coordinates based on mouse position + const x = mouseX / scale.value - posX.value + const y = mouseY / scale.value - posY.value + + // Change scale + const delta = e.deltaY < 0 ? 0.1 : -0.1 + const newScale = Math.min(Math.max(scale.value + delta, 0.5), 3) + + // Calculate new position with new scale + posX.value = mouseX / newScale - x + posY.value = mouseY / newScale - y + scale.value = newScale + } const zoomStyle = Vue.computed(() => { return { @@ -613,6 +790,28 @@ setLanguage(window.navigator.language) restoreFromHash() reRender() + + window.addEventListener('keydown', handleKeyDown) + window.addEventListener('keyup', handleKeyUp) + window.addEventListener('mousedown', handleMouseDown) + window.addEventListener('mousemove', handleMouseMove) + window.addEventListener('mouseup', handleMouseUp) + window.addEventListener('wheel', handleWheel, { passive: false }) + window.addEventListener('touchstart', handleTouchStart, { passive: false }) + window.addEventListener('touchmove', handleTouchMove, { passive: false }) + window.addEventListener('touchend', handleTouchEnd) + }) + + Vue.onUnmounted(() => { + window.removeEventListener('keydown', handleKeyDown) + window.removeEventListener('keyup', handleKeyUp) + window.removeEventListener('mousedown', handleMouseDown) + window.removeEventListener('mousemove', handleMouseMove) + window.removeEventListener('mouseup', handleMouseUp) + window.removeEventListener('wheel', handleWheel) + window.removeEventListener('touchstart', handleTouchStart) + window.removeEventListener('touchmove', handleTouchMove) + window.removeEventListener('touchend', handleTouchEnd) }) window.addEventListener('hashchange', () => { @@ -656,7 +855,9 @@ moveUp, moveDown, moveLeft, - moveRight + moveRight, + isSpacePressed, + isDragging } } }