aigroup-workflow 2.1.2 → 2.2.0

package/skills/frontend/vue-expert-js/references/state-management.md

@@ -0,0 +1,249 @@
+# State Management
+
+---
+
+## Setup
+
+```javascript
+// main.js
+import { createApp } from 'vue'
+import { createPinia } from 'pinia'
+import App from './App.vue'
+
+createApp(App).use(createPinia()).mount('#app')
+```
+
+---
+
+## Options Store Syntax
+
+```javascript
+// stores/counter.js
+import { defineStore } from 'pinia'
+
+export const useCounterStore = defineStore('counter', {
+  state: () => ({
+    count: 0,
+    name: 'Counter'
+  }),
+
+  getters: {
+    doubleCount: (state) => state.count * 2,
+    // Getter with parameter
+    countPlusN: (state) => (n) => state.count + n
+  },
+
+  actions: {
+    increment() {
+      this.count++
+    },
+    /** @param {number} amount */
+    incrementBy(amount) {
+      this.count += amount
+    }
+  }
+})
+```
+
+---
+
+## Setup Store Syntax (Composition API)
+
+```javascript
+// stores/user.js
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+
+/**
+ * @typedef {Object} User
+ * @property {number} id
+ * @property {string} name
+ * @property {string} email
+ */
+
+export const useUserStore = defineStore('user', () => {
+  // State
+  /** @type {import('vue').Ref<User | null>} */
+  const currentUser = ref(null)
+  const isLoading = ref(false)
+  const error = ref(null)
+
+  // Getters
+  const isLoggedIn = computed(() => currentUser.value !== null)
+  const userName = computed(() => currentUser.value?.name ?? 'Guest')
+
+  // Actions
+  async function login(email, password) {
+    isLoading.value = true
+    error.value = null
+    try {
+      const res = await fetch('/api/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ email, password })
+      })
+      currentUser.value = (await res.json()).user
+      return true
+    } catch (e) {
+      error.value = e.message
+      return false
+    } finally {
+      isLoading.value = false
+    }
+  }
+
+  function logout() {
+    currentUser.value = null
+  }
+
+  return { currentUser, isLoading, error, isLoggedIn, userName, login, logout }
+})
+```
+
+---
+
+## Using Stores
+
+```vue
+<script setup>
+import { useUserStore } from '@/stores/user'
+import { storeToRefs } from 'pinia'
+
+const userStore = useUserStore()
+
+// Use storeToRefs for reactive state/getters
+const { currentUser, isLoggedIn, isLoading } = storeToRefs(userStore)
+
+// Actions can be destructured directly
+const { login, logout } = userStore
+</script>
+
+<template>
+  <div v-if="isLoading">Loading...</div>
+  <div v-else-if="isLoggedIn">
+    Welcome, {{ currentUser?.name }}
+    <button @click="logout">Logout</button>
+  </div>
+</template>
+```
+
+---
+
+## Store Composition
+
+```javascript
+// stores/cart.js
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import { useProductsStore } from './products'
+import { useUserStore } from './user'
+
+export const useCartStore = defineStore('cart', () => {
+  const items = ref([]) // [{ productId, quantity }]
+
+  // Access other stores
+  const productsStore = useProductsStore()
+  const userStore = useUserStore()
+
+  const total = computed(() =>
+    items.value.reduce((sum, item) => {
+      const product = productsStore.items.find(p => p.id === item.productId)
+      return sum + (product?.price ?? 0) * item.quantity
+    }, 0)
+  )
+
+  function addItem(productId, quantity = 1) {
+    const existing = items.value.find(i => i.productId === productId)
+    if (existing) existing.quantity += quantity
+    else items.value.push({ productId, quantity })
+  }
+
+  async function checkout() {
+    if (!userStore.isLoggedIn) throw new Error('Must be logged in')
+    await fetch('/api/checkout', {
+      method: 'POST',
+      body: JSON.stringify({ userId: userStore.currentUser.id, items: items.value })
+    })
+    items.value = []
+  }
+
+  return { items, total, addItem, checkout }
+})
+```
+
+---
+
+## Persistence
+
+```javascript
+// stores/settings.js
+import { defineStore } from 'pinia'
+import { ref, watch } from 'vue'
+
+const STORAGE_KEY = 'app-settings'
+
+function loadFromStorage() {
+  try {
+    return JSON.parse(localStorage.getItem(STORAGE_KEY)) ?? {}
+  } catch {
+    return {}
+  }
+}
+
+export const useSettingsStore = defineStore('settings', () => {
+  const saved = loadFromStorage()
+
+  const theme = ref(saved.theme ?? 'light')
+  const language = ref(saved.language ?? 'en')
+
+  watch([theme, language], () => {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({
+      theme: theme.value,
+      language: language.value
+    }))
+  })
+
+  return { theme, language }
+})
+```
+
+---
+
+## Testing Stores
+
+```javascript
+// stores/__tests__/counter.test.js
+import { describe, it, expect, beforeEach } from 'vitest'
+import { setActivePinia, createPinia } from 'pinia'
+import { useCounterStore } from '../counter'
+
+describe('Counter Store', () => {
+  beforeEach(() => setActivePinia(createPinia()))
+
+  it('increments count', () => {
+    const store = useCounterStore()
+    store.increment()
+    expect(store.count).toBe(1)
+  })
+
+  it('computes double count', () => {
+    const store = useCounterStore()
+    store.count = 5
+    expect(store.doubleCount).toBe(10)
+  })
+})
+```
+
+---
+
+## Quick Reference
+
+| Feature | Options Syntax | Setup Syntax |
+|---------|---------------|--------------|
+| State | `state: () => ({})` | `const x = ref()` |
+| Getter | `getters: { x: (state) => }` | `const x = computed()` |
+| Action | `actions: { fn() {} }` | `function fn() {}` |
+| Use in component | `storeToRefs()` for state | Same |
+| Reset state | `store.$reset()` | Manual reset function |
+| Subscribe | `store.$subscribe((mutation, state) => {})` | Same |
+| Other stores | Use in actions | Call at setup top level |

package/skills/frontend/vue-expert-js/references/testing-patterns.md

@@ -0,0 +1,237 @@
+# Testing Patterns
+
+---
+
+## Setup
+
+```javascript
+// vitest.config.js
+import { defineConfig } from 'vitest/config'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({
+  plugins: [vue()],
+  test: {
+    environment: 'jsdom',
+    globals: true,
+    setupFiles: ['./vitest.setup.js']
+  }
+})
+```
+
+```javascript
+// vitest.setup.js
+import { config } from '@vue/test-utils'
+import { vi } from 'vitest'
+
+vi.stubGlobal('fetch', vi.fn())
+
+config.global.stubs = {
+  'router-link': { template: '<a><slot /></a>' }
+}
+```
+
+---
+
+## Component Testing Basics
+
+```javascript
+// Button.test.js
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import Button from './Button.vue'
+
+describe('Button', () => {
+  it('renders slot content', () => {
+    const wrapper = mount(Button, { slots: { default: 'Click me' } })
+    expect(wrapper.text()).toBe('Click me')
+  })
+
+  it('applies variant class', () => {
+    const wrapper = mount(Button, { props: { variant: 'danger' } })
+    expect(wrapper.classes()).toContain('btn--danger')
+  })
+
+  it('emits click event', async () => {
+    const wrapper = mount(Button)
+    await wrapper.trigger('click')
+    expect(wrapper.emitted('click')).toHaveLength(1)
+  })
+
+  it('is disabled when prop is true', () => {
+    const wrapper = mount(Button, { props: { disabled: true } })
+    expect(wrapper.attributes('disabled')).toBeDefined()
+  })
+})
+```
+
+---
+
+## Testing v-model
+
+```javascript
+// TextInput.test.js
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import TextInput from './TextInput.vue'
+
+describe('TextInput', () => {
+  it('emits update:modelValue on input', async () => {
+    const wrapper = mount(TextInput, { props: { modelValue: '' } })
+    await wrapper.find('input').setValue('new value')
+    expect(wrapper.emitted('update:modelValue')).toEqual([['new value']])
+  })
+})
+```
+
+---
+
+## Testing Async
+
+```javascript
+// UserList.test.js
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { mount, flushPromises } from '@vue/test-utils'
+import UserList from './UserList.vue'
+
+describe('UserList', () => {
+  beforeEach(() => vi.resetAllMocks())
+
+  it('renders users after fetch', async () => {
+    global.fetch = vi.fn().mockResolvedValue({
+      ok: true,
+      json: () => Promise.resolve([{ id: 1, name: 'Alice' }])
+    })
+
+    const wrapper = mount(UserList)
+    await flushPromises()
+
+    expect(wrapper.text()).toContain('Alice')
+  })
+
+  it('shows error on failure', async () => {
+    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'))
+
+    const wrapper = mount(UserList)
+    await flushPromises()
+
+    expect(wrapper.find('[data-test="error"]').exists()).toBe(true)
+  })
+})
+```
+
+---
+
+## Mocking Composables
+
+```javascript
+// Header.test.js
+import { describe, it, expect, vi } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { ref, computed } from 'vue'
+import Header from './Header.vue'
+import * as useAuthModule from '@/composables/useAuth'
+
+describe('Header', () => {
+  it('shows login button when logged out', () => {
+    vi.spyOn(useAuthModule, 'useAuth').mockReturnValue({
+      user: ref(null),
+      isLoggedIn: computed(() => false),
+      login: vi.fn(),
+      logout: vi.fn()
+    })
+
+    const wrapper = mount(Header)
+    expect(wrapper.find('[data-test="login-btn"]').exists()).toBe(true)
+  })
+
+  it('shows user menu when logged in', () => {
+    vi.spyOn(useAuthModule, 'useAuth').mockReturnValue({
+      user: ref({ id: 1, name: 'John' }),
+      isLoggedIn: computed(() => true),
+      login: vi.fn(),
+      logout: vi.fn()
+    })
+
+    const wrapper = mount(Header)
+    expect(wrapper.find('[data-test="user-menu"]').exists()).toBe(true)
+  })
+})
+```
+
+---
+
+## Testing with Pinia
+
+```javascript
+// CartSummary.test.js
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { createTestingPinia } from '@pinia/testing'
+import CartSummary from './CartSummary.vue'
+import { useCartStore } from '@/stores/cart'
+
+describe('CartSummary', () => {
+  it('displays cart total', () => {
+    const wrapper = mount(CartSummary, {
+      global: {
+        plugins: [createTestingPinia({
+          initialState: {
+            cart: { items: [{ productId: 1, quantity: 2, price: 100 }] }
+          }
+        })]
+      }
+    })
+
+    expect(wrapper.text()).toContain('$200')
+  })
+
+  it('calls checkout action', async () => {
+    const wrapper = mount(CartSummary, {
+      global: { plugins: [createTestingPinia()] }
+    })
+
+    await wrapper.find('[data-test="checkout-btn"]').trigger('click')
+    expect(useCartStore().checkout).toHaveBeenCalled()
+  })
+})
+```
+
+---
+
+## Testing Provide/Inject
+
+```javascript
+// ChildComponent.test.js
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { ref } from 'vue'
+import ChildComponent from './ChildComponent.vue'
+
+describe('ChildComponent', () => {
+  it('uses injected theme', () => {
+    const wrapper = mount(ChildComponent, {
+      global: { provide: { theme: ref('dark') } }
+    })
+    expect(wrapper.classes()).toContain('theme-dark')
+  })
+})
+```
+
+---
+
+## Quick Reference
+
+| Task | Code |
+|------|------|
+| Mount | `mount(Component, { props, slots, global })` |
+| Find | `wrapper.find('[data-test="x"]')` |
+| Trigger | `await wrapper.trigger('click')` |
+| Check emitted | `wrapper.emitted('event')` |
+| Set input | `await wrapper.find('input').setValue('x')` |
+| Wait async | `await flushPromises()` |
+| Mock composable | `vi.spyOn(module, 'fn').mockReturnValue()` |
+| Mock fetch | `global.fetch = vi.fn().mockResolvedValue()` |
+| Test Pinia | `createTestingPinia({ initialState })` |
+| Provide | `global: { provide: { key: value } }` |
+| Stub component | `global: { stubs: { Comp: true } }` |

package/skills/go-rust-cpp/cpp-pro/SKILL.md

@@ -0,0 +1,115 @@
+---
+name: cpp-pro
+description: Writes, optimizes, and debugs C++ applications using modern C++20/23 features, template metaprogramming, and high-performance systems techniques. Use when building or refactoring C++ code requiring concepts, ranges, coroutines, SIMD optimization, or careful memory management — or when addressing performance bottlenecks, concurrency issues, and build system configuration with CMake.
+license: MIT
+metadata:
+  author: https://github.com/Jeffallan
+  version: "1.1.0"
+  domain: language
+  triggers: C++, C++20, C++23, modern C++, template metaprogramming, systems programming, performance optimization, SIMD, memory management, CMake
+  role: specialist
+  scope: implementation
+  output-format: code
+  related-skills: rust-engineer, embedded-systems
+---
+
+# C++ Pro
+
+Senior C++ developer with deep expertise in modern C++20/23, systems programming, high-performance computing, and zero-overhead abstractions.
+
+## Core Workflow
+
+1. **Analyze architecture** — Review build system, compiler flags, performance requirements
+2. **Design with concepts** — Create type-safe interfaces using C++20 concepts
+3. **Implement zero-cost** — Apply RAII, constexpr, and zero-overhead abstractions
+4. **Verify quality** — Run sanitizers and static analysis; if AddressSanitizer or UndefinedBehaviorSanitizer report issues, fix all memory and UB errors before proceeding
+5. **Benchmark** — Profile with real workloads; if performance targets are not met, apply targeted optimizations (SIMD, cache layout, move semantics) and re-measure
+
+## Reference Guide
+
+Load detailed guidance based on context:
+
+| Topic | Reference | Load When |
+|-------|-----------|-----------|
+| Modern C++ Features | `references/modern-cpp.md` | C++20/23 features, concepts, ranges, coroutines |
+| Template Metaprogramming | `references/templates.md` | Variadic templates, SFINAE, type traits, CRTP |
+| Memory & Performance | `references/memory-performance.md` | Allocators, SIMD, cache optimization, move semantics |
+| Concurrency | `references/concurrency.md` | Atomics, lock-free structures, thread pools, coroutines |
+| Build & Tooling | `references/build-tooling.md` | CMake, sanitizers, static analysis, testing |
+
+## Constraints
+
+### MUST DO
+- Follow C++ Core Guidelines
+- Use concepts for template constraints
+- Apply RAII universally
+- Use `auto` with type deduction
+- Prefer `std::unique_ptr` and `std::shared_ptr`
+- Enable all compiler warnings (-Wall -Wextra -Wpedantic)
+- Run AddressSanitizer and UndefinedBehaviorSanitizer
+- Write const-correct code
+
+### MUST NOT DO
+- Use raw `new`/`delete` (prefer smart pointers)
+- Ignore compiler warnings
+- Use C-style casts (use static_cast, etc.)
+- Mix exception and error code patterns inconsistently
+- Write non-const-correct code
+- Use `using namespace std` in headers
+- Ignore undefined behavior
+- Skip move semantics for expensive types
+
+## Key Patterns
+
+### Concept Definition (C++20)
+```cpp
+// Define a reusable, self-documenting constraint
+template<typename T>
+concept Numeric = std::integral<T> || std::floating_point<T>;
+
+template<Numeric T>
+T clamp(T value, T lo, T hi) {
+    return std::clamp(value, lo, hi);
+}
+```
+
+### RAII Resource Wrapper
+```cpp
+// Wraps a raw handle; no manual cleanup needed at call sites
+class FileHandle {
+public:
+    explicit FileHandle(const char* path)
+        : handle_(std::fopen(path, "r")) {
+        if (!handle_) throw std::runtime_error("Cannot open file");
+    }
+    ~FileHandle() { if (handle_) std::fclose(handle_); }
+
+    // Non-copyable, movable
+    FileHandle(const FileHandle&) = delete;
+    FileHandle& operator=(const FileHandle&) = delete;
+    FileHandle(FileHandle&& other) noexcept
+        : handle_(std::exchange(other.handle_, nullptr)) {}
+
+    std::FILE* get() const noexcept { return handle_; }
+private:
+    std::FILE* handle_;
+};
+```
+
+### Smart Pointer Ownership
+```cpp
+// Prefer make_unique / make_shared; avoid raw new/delete
+auto buffer = std::make_unique<std::array<std::byte, 4096>>();
+
+// Shared ownership only when genuinely needed
+auto config = std::make_shared<Config>(parseArgs(argc, argv));
+```
+
+## Output Templates
+
+When implementing C++ features, provide:
+1. Header file with interfaces and templates
+2. Implementation file (when needed)
+3. CMakeLists.txt updates (if applicable)
+4. Test file demonstrating usage
+5. Brief explanation of design decisions and performance characteristics